Patch Changes

• 16e3c14: feat: add preview flag to disable dot preview.
• Updated dependencies [16e3c14]
  • [email protected]

Patch Changes

• 16e3c14: feat: add clamp Range and Interval initial values to bounds.
  feat: when title is empty show the drag dots.

@leva-ui/plugin-spring

0.9.8

Patch Changes

• f8f7b57: fix: double render issue when using nested components.
• Updated dependencies [f8f7b57]
  • [email protected]

0.9.6

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

0.9.3

Patch Changes

• 7edbb69: chore: update dependencies.
• Updated dependencies [7edbb69]
  • [email protected]

0.8.1

Patch Changes

• c997410: Plugin: add the Bezier plugin

  import { bezier } from '@leva-ui/plugin-bezier'
  useControls({ curve: bezier([0.25, 0.1, 0.25, 1]) })
  

• Updated dependencies [c997410]

  • [email protected]

0.8.0

Patch Changes

• edc8847: Breaking: change how leva/plugin exports components.

  // before
  import { Row, Label, String } from 'leva/plugin'
  
  // after
  import { Components } from 'leva/plugin'
  const { Row, Label, String } = Components
  

  Feat: add useValue / useValues hooks that let an input query other inputs values.

  Feat: normalize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @data the data available in the store
   */
  const normalize = (input: Input, path: string, data: Data)
  

  Feat: sanitize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @store the store
   */
  const sanitize = (
    value: any,
    settings: Settings,
    prevValue: any,
    path: string,
    store: StoreType
  )
  

  Styles: better feedback when dragging number from inner label.

  Plugin: add the Plot plugin 📈

  import { plot } from '@leva-ui/plugin-plot'
  useControls({ y: plot({ expression: 'cos(x)', graph: true, boundsX: [-10, 10], boundsY: [0, 100] }) })
  

• Updated dependencies [edc8847]

  • [email protected]

0.7.0

Patch Changes

• Updated dependencies [f323cfc]
• Updated dependencies [0b7e968]
  • [email protected]

0.6.0

Patch Changes

• Updated dependencies [ce42683]
  • [email protected]

@leva-ui/plugin-plot

0.9.8

Patch Changes

• f8f7b57: fix: double render issue when using nested components.
• Updated dependencies [f8f7b57]
  • [email protected]

0.0.3

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

0.0.2

Patch Changes

• c997410: Plugin: add the Bezier plugin

  import { bezier } from '@leva-ui/plugin-bezier'
  useControls({ curve: bezier([0.25, 0.1, 0.25, 1]) })
  

• Updated dependencies [c997410]

  • [email protected]

0.0.1

Patch Changes

• edc8847: Breaking: change how leva/plugin exports components.

  // before
  import { Row, Label, String } from 'leva/plugin'
  
  // after
  import { Components } from 'leva/plugin'
  const { Row, Label, String } = Components
  

  Feat: add useValue / useValues hooks that let an input query other inputs values.

  Feat: normalize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @data the data available in the store
   */
  const normalize = (input: Input, path: string, data: Data)
  

  Feat: sanitize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @store the store
   */
  const sanitize = (
    value: any,
    settings: Settings,
    prevValue: any,
    path: string,
    store: StoreType
  )
  

  Styles: better feedback when dragging number from inner label.

  Plugin: add the Plot plugin 📈

  import { plot } from '@leva-ui/plugin-plot'
  useControls({ y: plot({ expression: 'cos(x)', graph: true, boundsX: [-10, 10], boundsY: [0, 100] }) })
  

• Updated dependencies [edc8847]

  • [email protected]

Patch Changes

• f8f7b57: fix: double render issue when using nested components.

@leva-ui/plugin-bezier

0.9.8

Patch Changes

• f8f7b57: fix: double render issue when using nested components.
• Updated dependencies [f8f7b57]
  • [email protected]

0.0.4

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

0.0.3

Patch Changes

• 26ead12: Feat: add cssEasing to returned prop

0.0.2

Patch Changes

• c997410: Plugin: add the Bezier plugin

  import { bezier } from '@leva-ui/plugin-bezier'
  useControls({ curve: bezier([0.25, 0.1, 0.25, 1]) })
  

• Updated dependencies [c997410]

  • [email protected]

@leva-ui/plugin-plot

0.0.3

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

0.0.2

Patch Changes

• c997410: Plugin: add the Bezier plugin

  import { bezier } from '@leva-ui/plugin-bezier'
  useControls({ curve: bezier([0.25, 0.1, 0.25, 1]) })
  

• Updated dependencies [c997410]

  • [email protected]

0.0.1

Patch Changes

• edc8847: Breaking: change how leva/plugin exports components.

  // before
  import { Row, Label, String } from 'leva/plugin'
  
  // after
  import { Components } from 'leva/plugin'
  const { Row, Label, String } = Components
  

  Feat: add useValue / useValues hooks that let an input query other inputs values.

  Feat: normalize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @data the data available in the store
   */
  const normalize = (input: Input, path: string, data: Data)
  

  Feat: sanitize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @store the store
   */
  const sanitize = (
    value: any,
    settings: Settings,
    prevValue: any,
    path: string,
    store: StoreType
  )
  

  Styles: better feedback when dragging number from inner label.

  Plugin: add the Plot plugin 📈

  import { plot } from '@leva-ui/plugin-plot'
  useControls({ y: plot({ expression: 'cos(x)', graph: true, boundsX: [-10, 10], boundsY: [0, 100] }) })
  

• Updated dependencies [edc8847]

  • [email protected]

@leva-ui/plugin-bezier

0.0.4

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

0.0.3

Patch Changes

• 26ead12: Feat: add cssEasing to returned prop

0.0.2

Patch Changes

• c997410: Plugin: add the Bezier plugin

  import { bezier } from '@leva-ui/plugin-bezier'
  useControls({ curve: bezier([0.25, 0.1, 0.25, 1]) })
  

• Updated dependencies [c997410]

  • [email protected]

@leva-ui/plugin-spring

0.9.6

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

0.9.3

Patch Changes

• 7edbb69: chore: update dependencies.
• Updated dependencies [7edbb69]
  • [email protected]

0.8.1

Patch Changes

• c997410: Plugin: add the Bezier plugin

  import { bezier } from '@leva-ui/plugin-bezier'
  useControls({ curve: bezier([0.25, 0.1, 0.25, 1]) })
  

• Updated dependencies [c997410]

  • [email protected]

0.8.0

Patch Changes

• edc8847: Breaking: change how leva/plugin exports components.

  // before
  import { Row, Label, String } from 'leva/plugin'
  
  // after
  import { Components } from 'leva/plugin'
  const { Row, Label, String } = Components
  

  Feat: add useValue / useValues hooks that let an input query other inputs values.

  Feat: normalize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @data the data available in the store
   */
  const normalize = (input: Input, path: string, data: Data)
  

  Feat: sanitize has additional arguments to its signature:

  /**
   * @path the path of the input
   * @store the store
   */
  const sanitize = (
    value: any,
    settings: Settings,
    prevValue: any,
    path: string,
    store: StoreType
  )
  

  Styles: better feedback when dragging number from inner label.

  Plugin: add the Plot plugin 📈

  import { plot } from '@leva-ui/plugin-plot'
  useControls({ y: plot({ expression: 'cos(x)', graph: true, boundsX: [-10, 10], boundsY: [0, 100] }) })
  

• Updated dependencies [edc8847]

  • [email protected]

0.7.0

Patch Changes

• Updated dependencies [f323cfc]
• Updated dependencies [0b7e968]
  • [email protected]

0.6.0

Patch Changes

• Updated dependencies [ce42683]
  • [email protected]

Patch Changes

• e29e5fd: style: wrap hint text

Patch Changes

• d5383c0: fix: fix bug in which the panel would remove the root node of the app.

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

Patch Changes

• 0511799: styles: remove manual 'leva__' prefix from stitches styles.
• Updated dependencies [0511799]
  • [email protected]

Patch Changes

• 234cfcd: Add onEditStart and onEditEnd callbacks for values.

  useControls({
    value: {
      value: 1,
      onEditStart: (value, path) => {},
      onEditEnd: (value, path) => {},
    },
  })
  

  Add path as a second parameter to onChange callback to mimic onEditXXX signature.

• a2db0e6: Improve buttonGroup API.

  The label is now completely hidden when specifying key that only includes spaces. Previously the label was still rendered, but without text, this caused ugly spacing when using the oneLineLabels option on the Leva component.

  const [values, set] = useControls(() => ({
    Size: 1,
    ' ': buttonGroup({
      '0.25x': () => set({ Size: 0.25 }),
      '0.5x': () => set({ Size: 0.5 }),
      '1x': () => set({ Size: 1 }),
      '2x': () => set({ Size: 2 }),
      '3x': () => set({ Size: 3 }),
    }),
  }))
  

  It is now possible to set the label via the buttonGroup arguments by using the alternative API:

  const [values, set] = useControls(() => ({
    Width: 1,
    WidthPresets: buttonGroup({
      label: null,
      opts: {
        '0.25x': () => set({ Size: 0.25 }),
        '0.5x': () => set({ Size: 0.5 }),
        '1x': () => set({ Size: 1 }),
        '2x': () => set({ Size: 2 }),
        '3x': () => set({ Size: 3 }),
      },
    }),
    Height: 1,
    HeightPresets: buttonGroup({
      label: null,
      opts: {
        '0.25x': () => set({ Size: 0.25 }),
        '0.5x': () => set({ Size: 0.5 }),
        '1x': () => set({ Size: 1 }),
        '2x': () => set({ Size: 2 }),
        '3x': () => set({ Size: 3 }),
      },
    }),
  }))
  

  This also allows passing any JSX element as the label beside strings.

  It also helps avoiding a bunch of `` labels (where each new one contains one more space).

• d0b45de: Add context argument to onChange handler.

  The context.initial boolean parameter can be used to identify whether onChange is invoked initially.

  useControls({
    value: {
      value: 1,
      onChange: (value, { initial }) => {
        syncValue(value)
        if (!initial) {
          saveValueOnRemote(value)
        }
      },
    },
  })
  

  The context.fromPanel boolean parameter can be used to identify whether the onChange invocation is caused by the Leva component or via the set function return from the useControl hook.

  const [, set] = useControls(() => ({
    value: {
      value: 1,
      onChange: (value, { initial, fromPanel }) => {
        syncValue(value)
        if (!initial && !fromPanel) {
          // we don't wanna trigger a remote save in case the value has not been updated from the panel
          saveValueOnRemote(value)
        }
      },
    },
  }))
  

  The context.get parameter can be used for retrieving the up to date state of the store. This is handy if you need to do some invocations based on all the store values.

  const [, set] = useControls(() => ({
    value1: 1,
    value2: 2,
    value3: {
      value: 1,
      onChange: (value3, { get }) => {
        const { value1, value2 } = get()
        // calculate something based on value1 and value2
      },
    },
  }))
  

Patch Changes

• 50e8096: fix: sanitize step should behave better.
  improvement: expand panel when filter changes.

• 09a1a38: Allow specifying the explicit input type via the type option. This is handy when you want to prevent your string value being casted to a color or number.

  import { LevaInputs, useControls } from 'leva'
  
  useControls({
    color: {
      type: LevaInputs.STRING,
      value: '#f00',
    },
    number: {
      type: LevaInputs.STRING,
      value: '1',
    },
  })
  

Patch Changes

• 7edbb69: chore: update dependencies.
• Updated dependencies [7edbb69]
  • [email protected]

Patch Changes

• 7edbb69: chore: update dependencies.

Patch Changes

• 34281d7: Add new value option transient. This allows opting out of the transient mode when having a onChange handler invoked.

  const data = useControls({
    color: {
      value: '#7c3d3d',
      onChange: value => {
        console.log(value)
      },
      transient: false,
    },
  })
  
  console.log(data) // { color: '#7c3d3d' }
  

  const data = useControls({
    color: {
      value: '#7c3d3d',
      onChange: value => {
        console.log(value)
      },
      transient: true,
    },
  })
  
  console.log(data) // {}
  

  This is handy if you want to use the onChange handler for triggering a save on a remote server, while still triggering a re-render with the value.

Patch Changes

• 09ac7b1: chore: remove clipboard-polyfill dependency.