@react-md/core 6.0.1 → 6.1.0

package/dist/form/OptGroup.js

@@ -37,7 +37,7 @@ import { useEnsuredId } from "../useEnsuredId.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
  * @since 6.0.0
  */ export const OptGroup = /*#__PURE__*/ forwardRef(function OptGroup(props, ref) {
     const { children, label, labelProps, ...remaining } = props;

package/dist/form/OptGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/OptGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { type ListElement, type ListProps } from \"../list/List.js\";\nimport {\n  ListSubheader,\n  type ListSubheaderProps,\n} from \"../list/ListSubheader.js\";\nimport { MenuItemGroup } from \"../menu/MenuItemGroup.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\n\n/** @since 6.0.0 */\nexport interface OptGroupProps extends Omit<ListProps, \"role\"> {\n  /**\n   * This is really the `children` to display in a `ListSubheader` that\n   * describes the optgroup. It was named `label` to match the native\n   * `<optgroup>` element.\n   *\n   * @see {@link labelProps} for additional styling and options.\n   */\n  label: ReactNode;\n\n  /**\n   * This can be used to apply any additional props to the `ListSubheader` that\n   * describes the group of options.\n   */\n  labelProps?: PropsWithRef<\n    Omit<ListSubheaderProps, \"role\" | \"children\">,\n    HTMLLIElement\n  >;\n\n  /**\n   * This should be any `Option`s to display within the group.\n   */\n  children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * This component is more of a \"convenience component\" to help enforce the\n * correct accessibility when creating an `<optgroup>` with the `Select`\n * component.\n *\n * @example Simple Example\n * ```tsx\n * import { Select } from \"@react-md/core/form/Select\";\n * import { OptGroup } from \"@react-md/core/form/OptGroup\";\n * import { Option } from \"@react-md/core/form/Option\";\n * import FavoriteIcon from \"@react-md/material-icons/FavoriteIcon\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <Select label=\"Choose an animal\">\n *       <OptGroup label=\"Land\" labelProps={{ className: \"custom-class-name\" }}>\n *         <Option value={0}>Cat</Option>\n *         <Option value={1}>Dog</Option>\n *         <Option value={2}>Tiger</Option>\n *       </OptGroup>\n *       <OptGroup label=\"Water\" labelProps={{ rightAddon: <FavoriteIcon /> }}>\n *         <Option value={3}>Dolphin</Option>\n *         <Option value={4}>Flounder</Option>\n *       </OptGroup>\n *     </Select>\n *\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/select | Select Demos}\n * @since 6.0.0\n */\nexport const OptGroup = forwardRef<ListElement, OptGroupProps>(\n  function OptGroup(props, ref) {\n    const { children, label, labelProps, ...remaining } = props;\n    const labelId = useEnsuredId(labelProps?.id, \"optgroup\");\n\n    return (\n      <MenuItemGroup aria-labelledby={labelId} {...remaining} ref={ref}>\n        <ListSubheader {...labelProps} id={labelId}>\n          {label}\n        </ListSubheader>\n        {children}\n      </MenuItemGroup>\n    );\n  }\n);\n"],"names":["forwardRef","ListSubheader","MenuItemGroup","useEnsuredId","OptGroup","props","ref","children","label","labelProps","remaining","labelId","id","aria-labelledby"],"mappings":"AAAA;;AAEA,SAAyBA,UAAU,QAAQ,QAAQ;AAGnD,SACEC,aAAa,QAER,2BAA2B;AAClC,SAASC,aAAa,QAAQ,2BAA2B;AAEzD,SAASC,YAAY,QAAQ,qBAAqB;AA4BlD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCC,GACD,OAAO,MAAMC,yBAAWJ,WACtB,SAASI,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,UAAU,EAAE,GAAGC,WAAW,GAAGL;IACtD,MAAMM,UAAUR,aAAaM,YAAYG,IAAI;IAE7C,qBACE,MAACV;QAAcW,mBAAiBF;QAAU,GAAGD,SAAS;QAAEJ,KAAKA;;0BAC3D,KAACL;gBAAe,GAAGQ,UAAU;gBAAEG,IAAID;0BAChCH;;YAEFD;;;AAGP,GACA"}
+{"version":3,"sources":["../../src/form/OptGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { type ListElement, type ListProps } from \"../list/List.js\";\nimport {\n  ListSubheader,\n  type ListSubheaderProps,\n} from \"../list/ListSubheader.js\";\nimport { MenuItemGroup } from \"../menu/MenuItemGroup.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\n\n/** @since 6.0.0 */\nexport interface OptGroupProps extends Omit<ListProps, \"role\"> {\n  /**\n   * This is really the `children` to display in a `ListSubheader` that\n   * describes the optgroup. It was named `label` to match the native\n   * `<optgroup>` element.\n   *\n   * @see {@link labelProps} for additional styling and options.\n   */\n  label: ReactNode;\n\n  /**\n   * This can be used to apply any additional props to the `ListSubheader` that\n   * describes the group of options.\n   */\n  labelProps?: PropsWithRef<\n    Omit<ListSubheaderProps, \"role\" | \"children\">,\n    HTMLLIElement\n  >;\n\n  /**\n   * This should be any `Option`s to display within the group.\n   */\n  children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * This component is more of a \"convenience component\" to help enforce the\n * correct accessibility when creating an `<optgroup>` with the `Select`\n * component.\n *\n * @example Simple Example\n * ```tsx\n * import { Select } from \"@react-md/core/form/Select\";\n * import { OptGroup } from \"@react-md/core/form/OptGroup\";\n * import { Option } from \"@react-md/core/form/Option\";\n * import FavoriteIcon from \"@react-md/material-icons/FavoriteIcon\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <Select label=\"Choose an animal\">\n *       <OptGroup label=\"Land\" labelProps={{ className: \"custom-class-name\" }}>\n *         <Option value={0}>Cat</Option>\n *         <Option value={1}>Dog</Option>\n *         <Option value={2}>Tiger</Option>\n *       </OptGroup>\n *       <OptGroup label=\"Water\" labelProps={{ rightAddon: <FavoriteIcon /> }}>\n *         <Option value={3}>Dolphin</Option>\n *         <Option value={4}>Flounder</Option>\n *       </OptGroup>\n *     </Select>\n *\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/select | Select Demos}\n * @since 6.0.0\n */\nexport const OptGroup = forwardRef<ListElement, OptGroupProps>(\n  function OptGroup(props, ref) {\n    const { children, label, labelProps, ...remaining } = props;\n    const labelId = useEnsuredId(labelProps?.id, \"optgroup\");\n\n    return (\n      <MenuItemGroup aria-labelledby={labelId} {...remaining} ref={ref}>\n        <ListSubheader {...labelProps} id={labelId}>\n          {label}\n        </ListSubheader>\n        {children}\n      </MenuItemGroup>\n    );\n  }\n);\n"],"names":["forwardRef","ListSubheader","MenuItemGroup","useEnsuredId","OptGroup","props","ref","children","label","labelProps","remaining","labelId","id","aria-labelledby"],"mappings":"AAAA;;AAEA,SAAyBA,UAAU,QAAQ,QAAQ;AAGnD,SACEC,aAAa,QAER,2BAA2B;AAClC,SAASC,aAAa,QAAQ,2BAA2B;AAEzD,SAASC,YAAY,QAAQ,qBAAqB;AA4BlD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCC,GACD,OAAO,MAAMC,yBAAWJ,WACtB,SAASI,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,UAAU,EAAE,GAAGC,WAAW,GAAGL;IACtD,MAAMM,UAAUR,aAAaM,YAAYG,IAAI;IAE7C,qBACE,MAACV;QAAcW,mBAAiBF;QAAU,GAAGD,SAAS;QAAEJ,KAAKA;;0BAC3D,KAACL;gBAAe,GAAGQ,UAAU;gBAAEG,IAAID;0BAChCH;;YAEFD;;;AAGP,GACA"}

package/dist/form/Option.d.ts

@@ -103,7 +103,7 @@ export interface OptionProps extends MenuItemProps, OptionSelectedIconProps {
  * This component is a wrapper around the {@link MenuItem} to implement custom
  * select option behavior.
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
  * @since 6.0.0 removed the `selected` and `focused` props.
  * @since 6.0.0 Added the `value`, `selectedIcon`, `unselectedIcon`,
  * `selectedIconAfter`, `iconSpacingProps`, and `selectedClassName` props.

package/dist/form/Option.js

@@ -31,7 +31,7 @@ const noop = ()=>{
  * This component is a wrapper around the {@link MenuItem} to implement custom
  * select option behavior.
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
  * @since 6.0.0 removed the `selected` and `focused` props.
  * @since 6.0.0 Added the `value`, `selectedIcon`, `unselectedIcon`,
  * `selectedIconAfter`, `iconSpacingProps`, and `selectedClassName` props.

package/dist/form/Option.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Option.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { Fragment, type ReactNode, forwardRef } from \"react\";\n\nimport {\n  TextIconSpacing,\n  type TextIconSpacingProps,\n} from \"../icon/TextIconSpacing.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { icon } from \"../icon/styles.js\";\nimport { ListItemText } from \"../list/ListItemText.js\";\nimport { getListItemHeight } from \"../list/getListItemHeight.js\";\nimport { MenuItem, type MenuItemProps } from \"../menu/MenuItem.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useListboxContext } from \"./ListboxProvider.js\";\nimport { option } from \"./optionStyles.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * This icon is used while the option is unselected so that the selected and\n * unselected options have the same alignment.\n *\n * @since 6.0.0\n * @defaultValue `<span className=\"rmd-icon rmd-icon--svg />`\n */\nexport const DEFAULT_OPTION_UNSELECTED_ICON = (\n  <span className={icon({ type: \"svg\" })} />\n);\n\n/**\n * @since 6.0.0\n */\nexport interface OptionSelectedIconProps {\n  /**\n   * @defaultValue `getIcon(\"selected\")`\n   */\n  selectedIcon?: ReactNode;\n\n  /**\n   * @see {@link DEFAULT_OPTION_UNSELECTED_ICON}\n   * @defaultValue `<span className=\"rmd-icon rmd-icon--svg\" />`\n   */\n  unselectedIcon?: ReactNode;\n\n  /**\n   * Set this to `true` of the {@link selectedIcon}/{@link unselectedIcon}\n   * should appear as the {@link rightAddon} instead of the {@link leftAddon}.\n   *\n   * @defaultValue `false`\n   */\n  selectedIconAfter?: boolean;\n\n  /**\n   * Set this to `true` to remove selected icon behavior from the `Option`.\n   *\n   * @defaultValue `false`\n   */\n  disableSelectedIcon?: boolean;\n}\n\n/**\n * @since 6.0.0 removed the `selected` and `focused` props.\n * @since 6.0.0 Added the `value`, `selectedIcon`, `unselectedIcon`,\n * `selectedIconAfter`, and `iconSpacingProps` props.\n */\nexport interface OptionProps extends MenuItemProps, OptionSelectedIconProps {\n  /**\n   * @defaultValue `\"option\"`\n   */\n  role?: string;\n  value: string | number | object;\n\n  /**\n   * An optional className to apply only while the current option is selected to\n   * override any global default selected styles. It is recommended to update\n   * the `react-md.$form-option-selected-styles` map first to change selected\n   * style globally and then any one-off customizations through this prop.\n   *\n   * @example Global Change\n   * ```scss\n   * @use \"@react-md/core\" with (\n   *   // these are the defaults\n   *   $form-option-selected-styles: (\n   *     --rmd-icon-color: currentcolor,\n   *     background-color: colors.$blue-900,\n   *     color: colors.$white,\n   *   ),\n   *\n   *   // so if you wanted to remove the styles globally\n   *   $form-option-selected-styles: (),\n   * );\n   * ```\n   *\n   * This really results in something like:\n   * ```ts\n   * className=\"rmd-list-item ... rmd-menu-item ... rmd-option rmd-option--selected ${selectedClassName}\"\n   * ```\n   */\n  selectedClassName?: string;\n\n  /**\n   * Since the `selectedIcon`/`unselectedIcon` are rendered as\n   * `leftAddon`/`rightAddon`, the provided `leftAddon`/`rightAddon` will be\n   * wrapped in the {@link TextIconSpacing} component to maintain the correct\n   * spacing. You can use this prop to provide any additional configuration to\n   * the spacing.\n   *\n   * @example\n   * ```tsx\n   * <Option\n   *   leftAddon={<Avatar>A</Avatar>}\n   *   leftAddonType=\"avatar\"\n   *   value={0}\n   *   textIconSpacingProps={{\n   *     beforeClassName: \"my-custom-class-name\",\n   *   }}\n   * >\n   *   Some Content\n   * </Option>\n   * ```\n   */\n  textIconSpacingProps?: Omit<TextIconSpacingProps, \"icon\" | \"children\">;\n}\n\n/**\n * **Client Component**\n *\n * This component is a wrapper around the {@link MenuItem} to implement custom\n * select option behavior.\n *\n * @see {@link https://next.react-md.dev/components/select | Select Demos}\n * @since 6.0.0 removed the `selected` and `focused` props.\n * @since 6.0.0 Added the `value`, `selectedIcon`, `unselectedIcon`,\n * `selectedIconAfter`, `iconSpacingProps`, and `selectedClassName` props.\n */\nexport const Option = forwardRef<HTMLLIElement, OptionProps>(\n  function Option(props, ref) {\n    const {\n      id: propId,\n      role = \"option\",\n      value,\n      children: propChildren,\n      onClick = noop,\n      className,\n      selectedClassName,\n      selectedIcon: propSelectedIcon,\n      unselectedIcon: propUnselectedIcon,\n      selectedIconAfter: propSelectedIconAfter,\n      disableSelectedIcon: propDisableSelectedIcon,\n      textIconSpacingProps,\n      leftAddon: propLeftAddon,\n      leftAddonType,\n      leftAddonClassName,\n      rightAddon: propRightAddon,\n      rightAddonType,\n      rightAddonClassName,\n      secondaryText,\n      height: propHeight,\n      disableTextChildren: propDisableTextChildren,\n      ...remaining\n    } = props;\n\n    const id = useEnsuredId(propId, \"option\");\n    const {\n      selectOption,\n      isOptionSelected,\n      disableSelectedIcon: contextDisableSelectedIcon,\n      selectedIcon: contextSelectedIcon,\n      unselectedIcon: contextUnselectedIcon,\n      selectedIconAfter: contextSelectedIconAfter,\n    } = useListboxContext();\n    const selectedIconAfter = propSelectedIconAfter ?? contextSelectedIconAfter;\n    const disableSelectedIcon =\n      propDisableSelectedIcon ?? contextDisableSelectedIcon;\n    const selected = isOptionSelected(value);\n    const selectedIcon = getIcon(\n      \"selected\",\n      disableSelectedIcon ? null : (propSelectedIcon ?? contextSelectedIcon)\n    );\n    const unselectedIcon = disableSelectedIcon\n      ? null\n      : (propUnselectedIcon ??\n        contextUnselectedIcon ??\n        DEFAULT_OPTION_UNSELECTED_ICON);\n    const icon = selected ? selectedIcon : unselectedIcon;\n\n    let leftAddon = propLeftAddon;\n    let rightAddon = propRightAddon;\n    let children = propChildren;\n    let disableTextChildren = propDisableTextChildren;\n    if (!selectedIconAfter && icon) {\n      leftAddon = icon;\n      if (propLeftAddon) {\n        disableTextChildren = true;\n        const Wrapper = propDisableTextChildren ? Fragment : ListItemText;\n\n        children = (\n          <TextIconSpacing {...textIconSpacingProps} icon={propLeftAddon}>\n            <Wrapper>{children}</Wrapper>\n          </TextIconSpacing>\n        );\n      }\n    } else if (icon) {\n      rightAddon = icon;\n      if (propRightAddon) {\n        disableTextChildren = true;\n        const Wrapper = propDisableTextChildren ? Fragment : ListItemText;\n\n        children = (\n          <TextIconSpacing {...textIconSpacingProps} icon={propRightAddon}>\n            <Wrapper>{children}</Wrapper>\n          </TextIconSpacing>\n        );\n      }\n    }\n\n    const height = getListItemHeight({\n      height: propHeight,\n      leftAddon: leftAddon === icon ? null : leftAddon,\n      leftAddonType,\n      rightAddon: rightAddon === icon ? null : rightAddon,\n      rightAddonType,\n      secondaryText,\n    });\n\n    return (\n      <MenuItem\n        {...remaining}\n        aria-selected={selected || undefined}\n        id={id}\n        ref={ref}\n        role={role}\n        onClick={(event) => {\n          onClick(event);\n          selectOption(value);\n        }}\n        className={option({\n          icon: !!icon,\n          selected,\n          selectedClassName,\n          className,\n        })}\n        secondaryText={secondaryText}\n        height={height}\n        leftAddon={leftAddon}\n        leftAddonType={leftAddonType}\n        leftAddonClassName={cnb(\n          leftAddon === icon && \"rmd-option__icon\",\n          leftAddonClassName\n        )}\n        rightAddon={rightAddon}\n        rightAddonType={rightAddonType}\n        rightAddonClassName={cnb(\n          rightAddon === icon && \"rmd-option__icon\",\n          rightAddonClassName\n        )}\n        disableTextChildren={disableTextChildren}\n      >\n        {children}\n      </MenuItem>\n    );\n  }\n);\n"],"names":["cnb","Fragment","forwardRef","TextIconSpacing","getIcon","icon","ListItemText","getListItemHeight","MenuItem","useEnsuredId","useListboxContext","option","noop","DEFAULT_OPTION_UNSELECTED_ICON","span","className","type","Option","props","ref","id","propId","role","value","children","propChildren","onClick","selectedClassName","selectedIcon","propSelectedIcon","unselectedIcon","propUnselectedIcon","selectedIconAfter","propSelectedIconAfter","disableSelectedIcon","propDisableSelectedIcon","textIconSpacingProps","leftAddon","propLeftAddon","leftAddonType","leftAddonClassName","rightAddon","propRightAddon","rightAddonType","rightAddonClassName","secondaryText","height","propHeight","disableTextChildren","propDisableTextChildren","remaining","selectOption","isOptionSelected","contextDisableSelectedIcon","contextSelectedIcon","contextUnselectedIcon","contextSelectedIconAfter","selected","Wrapper","aria-selected","undefined","event"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,QAAQ,EAAkBC,UAAU,QAAQ,QAAQ;AAE7D,SACEC,eAAe,QAEV,6BAA6B;AACpC,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,IAAI,QAAQ,oBAAoB;AACzC,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,iBAAiB,QAAQ,+BAA+B;AACjE,SAASC,QAAQ,QAA4B,sBAAsB;AACnE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,iBAAiB,QAAQ,uBAAuB;AACzD,SAASC,MAAM,QAAQ,oBAAoB;AAE3C,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;;;;CAMC,GACD,OAAO,MAAMC,+CACX,KAACC;IAAKC,WAAWV,KAAK;QAAEW,MAAM;IAAM;GACpC;AAiGF;;;;;;;;;;CAUC,GACD,OAAO,MAAMC,uBAASf,WACpB,SAASe,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EACJC,IAAIC,MAAM,EACVC,OAAO,QAAQ,EACfC,KAAK,EACLC,UAAUC,YAAY,EACtBC,UAAUd,IAAI,EACdG,SAAS,EACTY,iBAAiB,EACjBC,cAAcC,gBAAgB,EAC9BC,gBAAgBC,kBAAkB,EAClCC,mBAAmBC,qBAAqB,EACxCC,qBAAqBC,uBAAuB,EAC5CC,oBAAoB,EACpBC,WAAWC,aAAa,EACxBC,aAAa,EACbC,kBAAkB,EAClBC,YAAYC,cAAc,EAC1BC,cAAc,EACdC,mBAAmB,EACnBC,aAAa,EACbC,QAAQC,UAAU,EAClBC,qBAAqBC,uBAAuB,EAC5C,GAAGC,WACJ,GAAGhC;IAEJ,MAAME,KAAKX,aAAaY,QAAQ;IAChC,MAAM,EACJ8B,YAAY,EACZC,gBAAgB,EAChBlB,qBAAqBmB,0BAA0B,EAC/CzB,cAAc0B,mBAAmB,EACjCxB,gBAAgByB,qBAAqB,EACrCvB,mBAAmBwB,wBAAwB,EAC5C,GAAG9C;IACJ,MAAMsB,oBAAoBC,yBAAyBuB;IACnD,MAAMtB,sBACJC,2BAA2BkB;IAC7B,MAAMI,WAAWL,iBAAiB7B;IAClC,MAAMK,eAAexB,QACnB,YACA8B,sBAAsB,OAAQL,oBAAoByB;IAEpD,MAAMxB,iBAAiBI,sBACnB,OACCH,sBACDwB,yBACA1C;IACJ,MAAMR,OAAOoD,WAAW7B,eAAeE;IAEvC,IAAIO,YAAYC;IAChB,IAAIG,aAAaC;IACjB,IAAIlB,WAAWC;IACf,IAAIuB,sBAAsBC;IAC1B,IAAI,CAACjB,qBAAqB3B,MAAM;QAC9BgC,YAAYhC;QACZ,IAAIiC,eAAe;YACjBU,sBAAsB;YACtB,MAAMU,UAAUT,0BAA0BhD,WAAWK;YAErDkB,yBACE,KAACrB;gBAAiB,GAAGiC,oBAAoB;gBAAE/B,MAAMiC;0BAC/C,cAAA,KAACoB;8BAASlC;;;QAGhB;IACF,OAAO,IAAInB,MAAM;QACfoC,aAAapC;QACb,IAAIqC,gBAAgB;YAClBM,sBAAsB;YACtB,MAAMU,UAAUT,0BAA0BhD,WAAWK;YAErDkB,yBACE,KAACrB;gBAAiB,GAAGiC,oBAAoB;gBAAE/B,MAAMqC;0BAC/C,cAAA,KAACgB;8BAASlC;;;QAGhB;IACF;IAEA,MAAMsB,SAASvC,kBAAkB;QAC/BuC,QAAQC;QACRV,WAAWA,cAAchC,OAAO,OAAOgC;QACvCE;QACAE,YAAYA,eAAepC,OAAO,OAAOoC;QACzCE;QACAE;IACF;IAEA,qBACE,KAACrC;QACE,GAAG0C,SAAS;QACbS,iBAAeF,YAAYG;QAC3BxC,IAAIA;QACJD,KAAKA;QACLG,MAAMA;QACNI,SAAS,CAACmC;YACRnC,QAAQmC;YACRV,aAAa5B;QACf;QACAR,WAAWJ,OAAO;YAChBN,MAAM,CAAC,CAACA;YACRoD;YACA9B;YACAZ;QACF;QACA8B,eAAeA;QACfC,QAAQA;QACRT,WAAWA;QACXE,eAAeA;QACfC,oBAAoBxC,IAClBqC,cAAchC,QAAQ,oBACtBmC;QAEFC,YAAYA;QACZE,gBAAgBA;QAChBC,qBAAqB5C,IACnByC,eAAepC,QAAQ,oBACvBuC;QAEFI,qBAAqBA;kBAEpBxB;;AAGP,GACA"}
+{"version":3,"sources":["../../src/form/Option.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { Fragment, type ReactNode, forwardRef } from \"react\";\n\nimport {\n  TextIconSpacing,\n  type TextIconSpacingProps,\n} from \"../icon/TextIconSpacing.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { icon } from \"../icon/styles.js\";\nimport { ListItemText } from \"../list/ListItemText.js\";\nimport { getListItemHeight } from \"../list/getListItemHeight.js\";\nimport { MenuItem, type MenuItemProps } from \"../menu/MenuItem.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useListboxContext } from \"./ListboxProvider.js\";\nimport { option } from \"./optionStyles.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * This icon is used while the option is unselected so that the selected and\n * unselected options have the same alignment.\n *\n * @since 6.0.0\n * @defaultValue `<span className=\"rmd-icon rmd-icon--svg />`\n */\nexport const DEFAULT_OPTION_UNSELECTED_ICON = (\n  <span className={icon({ type: \"svg\" })} />\n);\n\n/**\n * @since 6.0.0\n */\nexport interface OptionSelectedIconProps {\n  /**\n   * @defaultValue `getIcon(\"selected\")`\n   */\n  selectedIcon?: ReactNode;\n\n  /**\n   * @see {@link DEFAULT_OPTION_UNSELECTED_ICON}\n   * @defaultValue `<span className=\"rmd-icon rmd-icon--svg\" />`\n   */\n  unselectedIcon?: ReactNode;\n\n  /**\n   * Set this to `true` of the {@link selectedIcon}/{@link unselectedIcon}\n   * should appear as the {@link rightAddon} instead of the {@link leftAddon}.\n   *\n   * @defaultValue `false`\n   */\n  selectedIconAfter?: boolean;\n\n  /**\n   * Set this to `true` to remove selected icon behavior from the `Option`.\n   *\n   * @defaultValue `false`\n   */\n  disableSelectedIcon?: boolean;\n}\n\n/**\n * @since 6.0.0 removed the `selected` and `focused` props.\n * @since 6.0.0 Added the `value`, `selectedIcon`, `unselectedIcon`,\n * `selectedIconAfter`, and `iconSpacingProps` props.\n */\nexport interface OptionProps extends MenuItemProps, OptionSelectedIconProps {\n  /**\n   * @defaultValue `\"option\"`\n   */\n  role?: string;\n  value: string | number | object;\n\n  /**\n   * An optional className to apply only while the current option is selected to\n   * override any global default selected styles. It is recommended to update\n   * the `react-md.$form-option-selected-styles` map first to change selected\n   * style globally and then any one-off customizations through this prop.\n   *\n   * @example Global Change\n   * ```scss\n   * @use \"@react-md/core\" with (\n   *   // these are the defaults\n   *   $form-option-selected-styles: (\n   *     --rmd-icon-color: currentcolor,\n   *     background-color: colors.$blue-900,\n   *     color: colors.$white,\n   *   ),\n   *\n   *   // so if you wanted to remove the styles globally\n   *   $form-option-selected-styles: (),\n   * );\n   * ```\n   *\n   * This really results in something like:\n   * ```ts\n   * className=\"rmd-list-item ... rmd-menu-item ... rmd-option rmd-option--selected ${selectedClassName}\"\n   * ```\n   */\n  selectedClassName?: string;\n\n  /**\n   * Since the `selectedIcon`/`unselectedIcon` are rendered as\n   * `leftAddon`/`rightAddon`, the provided `leftAddon`/`rightAddon` will be\n   * wrapped in the {@link TextIconSpacing} component to maintain the correct\n   * spacing. You can use this prop to provide any additional configuration to\n   * the spacing.\n   *\n   * @example\n   * ```tsx\n   * <Option\n   *   leftAddon={<Avatar>A</Avatar>}\n   *   leftAddonType=\"avatar\"\n   *   value={0}\n   *   textIconSpacingProps={{\n   *     beforeClassName: \"my-custom-class-name\",\n   *   }}\n   * >\n   *   Some Content\n   * </Option>\n   * ```\n   */\n  textIconSpacingProps?: Omit<TextIconSpacingProps, \"icon\" | \"children\">;\n}\n\n/**\n * **Client Component**\n *\n * This component is a wrapper around the {@link MenuItem} to implement custom\n * select option behavior.\n *\n * @see {@link https://react-md.dev/components/select | Select Demos}\n * @since 6.0.0 removed the `selected` and `focused` props.\n * @since 6.0.0 Added the `value`, `selectedIcon`, `unselectedIcon`,\n * `selectedIconAfter`, `iconSpacingProps`, and `selectedClassName` props.\n */\nexport const Option = forwardRef<HTMLLIElement, OptionProps>(\n  function Option(props, ref) {\n    const {\n      id: propId,\n      role = \"option\",\n      value,\n      children: propChildren,\n      onClick = noop,\n      className,\n      selectedClassName,\n      selectedIcon: propSelectedIcon,\n      unselectedIcon: propUnselectedIcon,\n      selectedIconAfter: propSelectedIconAfter,\n      disableSelectedIcon: propDisableSelectedIcon,\n      textIconSpacingProps,\n      leftAddon: propLeftAddon,\n      leftAddonType,\n      leftAddonClassName,\n      rightAddon: propRightAddon,\n      rightAddonType,\n      rightAddonClassName,\n      secondaryText,\n      height: propHeight,\n      disableTextChildren: propDisableTextChildren,\n      ...remaining\n    } = props;\n\n    const id = useEnsuredId(propId, \"option\");\n    const {\n      selectOption,\n      isOptionSelected,\n      disableSelectedIcon: contextDisableSelectedIcon,\n      selectedIcon: contextSelectedIcon,\n      unselectedIcon: contextUnselectedIcon,\n      selectedIconAfter: contextSelectedIconAfter,\n    } = useListboxContext();\n    const selectedIconAfter = propSelectedIconAfter ?? contextSelectedIconAfter;\n    const disableSelectedIcon =\n      propDisableSelectedIcon ?? contextDisableSelectedIcon;\n    const selected = isOptionSelected(value);\n    const selectedIcon = getIcon(\n      \"selected\",\n      disableSelectedIcon ? null : (propSelectedIcon ?? contextSelectedIcon)\n    );\n    const unselectedIcon = disableSelectedIcon\n      ? null\n      : (propUnselectedIcon ??\n        contextUnselectedIcon ??\n        DEFAULT_OPTION_UNSELECTED_ICON);\n    const icon = selected ? selectedIcon : unselectedIcon;\n\n    let leftAddon = propLeftAddon;\n    let rightAddon = propRightAddon;\n    let children = propChildren;\n    let disableTextChildren = propDisableTextChildren;\n    if (!selectedIconAfter && icon) {\n      leftAddon = icon;\n      if (propLeftAddon) {\n        disableTextChildren = true;\n        const Wrapper = propDisableTextChildren ? Fragment : ListItemText;\n\n        children = (\n          <TextIconSpacing {...textIconSpacingProps} icon={propLeftAddon}>\n            <Wrapper>{children}</Wrapper>\n          </TextIconSpacing>\n        );\n      }\n    } else if (icon) {\n      rightAddon = icon;\n      if (propRightAddon) {\n        disableTextChildren = true;\n        const Wrapper = propDisableTextChildren ? Fragment : ListItemText;\n\n        children = (\n          <TextIconSpacing {...textIconSpacingProps} icon={propRightAddon}>\n            <Wrapper>{children}</Wrapper>\n          </TextIconSpacing>\n        );\n      }\n    }\n\n    const height = getListItemHeight({\n      height: propHeight,\n      leftAddon: leftAddon === icon ? null : leftAddon,\n      leftAddonType,\n      rightAddon: rightAddon === icon ? null : rightAddon,\n      rightAddonType,\n      secondaryText,\n    });\n\n    return (\n      <MenuItem\n        {...remaining}\n        aria-selected={selected || undefined}\n        id={id}\n        ref={ref}\n        role={role}\n        onClick={(event) => {\n          onClick(event);\n          selectOption(value);\n        }}\n        className={option({\n          icon: !!icon,\n          selected,\n          selectedClassName,\n          className,\n        })}\n        secondaryText={secondaryText}\n        height={height}\n        leftAddon={leftAddon}\n        leftAddonType={leftAddonType}\n        leftAddonClassName={cnb(\n          leftAddon === icon && \"rmd-option__icon\",\n          leftAddonClassName\n        )}\n        rightAddon={rightAddon}\n        rightAddonType={rightAddonType}\n        rightAddonClassName={cnb(\n          rightAddon === icon && \"rmd-option__icon\",\n          rightAddonClassName\n        )}\n        disableTextChildren={disableTextChildren}\n      >\n        {children}\n      </MenuItem>\n    );\n  }\n);\n"],"names":["cnb","Fragment","forwardRef","TextIconSpacing","getIcon","icon","ListItemText","getListItemHeight","MenuItem","useEnsuredId","useListboxContext","option","noop","DEFAULT_OPTION_UNSELECTED_ICON","span","className","type","Option","props","ref","id","propId","role","value","children","propChildren","onClick","selectedClassName","selectedIcon","propSelectedIcon","unselectedIcon","propUnselectedIcon","selectedIconAfter","propSelectedIconAfter","disableSelectedIcon","propDisableSelectedIcon","textIconSpacingProps","leftAddon","propLeftAddon","leftAddonType","leftAddonClassName","rightAddon","propRightAddon","rightAddonType","rightAddonClassName","secondaryText","height","propHeight","disableTextChildren","propDisableTextChildren","remaining","selectOption","isOptionSelected","contextDisableSelectedIcon","contextSelectedIcon","contextUnselectedIcon","contextSelectedIconAfter","selected","Wrapper","aria-selected","undefined","event"],"mappings":"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"}

package/dist/form/Password.d.ts

@@ -116,6 +116,6 @@ export interface PasswordProps extends Omit<TextFieldProps, "type" | "rightAddon
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/password | Password Demos}
+ * @see {@link https://react-md.dev/components/password | Password Demos}
  */
 export declare const Password: import("react").ForwardRefExoticComponent<PasswordProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/form/Password.js

@@ -19,7 +19,7 @@ import { password, passwordInput, passwordInputToggle } from "./passwordStyles.j
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/password | Password Demos}
+ * @see {@link https://react-md.dev/components/password | Password Demos}
  */ export const Password = /*#__PURE__*/ forwardRef(function Password(props, ref) {
     const { id: propId, name = "password", className, inputClassName, visibilityIcon: propVisibilityIcon, visibilityLabel = "Show password", visibilityProps, ...remaining } = props;
     const { toggled: isPasswordVisible, toggle } = useToggle(false);

package/dist/form/Password.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Password.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useToggle } from \"../useToggle.js\";\nimport { TextField, type TextFieldProps } from \"./TextField.js\";\nimport {\n  password,\n  passwordInput,\n  passwordInputToggle,\n} from \"./passwordStyles.js\";\n\n/**\n * @example Simple Example\n * ```tsx\n * const getVisibilityIcon: GetPasswordVisibilityIcon = (isPasswordVisible) => {\n *   if (isPasswordVisible) {\n *     return <SecurityIcon />;\n *   }\n *\n *   return <RemoveRedEyeIcon />;\n * };\n * ```\n *\n * @param isPasswordVisible - `true` when the password is visible and in plain\n * text\n * @returns a custom icon to use for the password visibility toggle.\n */\nexport type GetPasswordVisibilityIcon = (\n  isPasswordVisible: boolean\n) => ReactNode;\n\n/**\n * @example Simple Example\n * ```tsx\n * const visibilityIcon: ConfigurableVisibilityIcon = {\n *   visible: <SecurityIcon />,\n *   invisible: <RemoveRedEyeIcon />,\n * };\n * ```\n */\nexport interface ConfigurableVisibilityIcon {\n  /**\n   * The icon to display while the password is currently visible as plain text.\n   */\n  visible: ReactNode;\n\n  /**\n   * The icon to display while the password is currently invisible as the\n   * password input.\n   */\n  invisible: ReactNode;\n}\n\n/**\n * @since 6.0.0 Removed the `visibilityStyle`, `visibilityClassName`, and\n * `onVisibilityClick` props in favor of `visibilityProps` object.\n * @since 6.0.0 Removed the `disableVisibility` and `rightChildren` props in\n * favor of just using a `TextField` instead of the `Password` component.\n * @since 6.0.0 Merged the `getVisibilityIcon` prop behavior into the\n * `visibilityIcon` prop.\n */\nexport interface PasswordProps\n  extends Omit<TextFieldProps, \"type\" | \"rightAddon\"> {\n  /**\n   * @defaultValue `\"password\"`\n   * @since 6.0.0 Defaults to `\"password\"`\n   */\n  name?: string;\n\n  /**\n   * @example Configurable Visibility Icon Object\n   * ```tsx\n   * <Password\n   *   {...props}\n   *   visibilityIcon={{\n   *     visible: <SecurityIcon />,\n   *     invisible: <RemoveRedEyeIcon />,\n   *   }}\n   * />\n   * ```\n   *\n   * @example Get Password Visibility Icon Function\n   * ```tsx\n   * <Password\n   *   {...props}\n   *   visibilityIcon={(isPasswordVisible) => {\n   *     if (isPasswordVisible) {\n   *       return <SecurityIcon />;\n   *     }\n   *\n   *     return <RemoveRedEyeIcon />;\n   *   }}\n   * />\n   * ```\n   *\n   * @example Custom Icon\n   * ```tsx\n   * <Password\n   *   {...props}\n   *   visibilityIcon={<SomeCustomComponent />}\n   * />\n   * ```\n   *\n   * @since 6.0.0 Supports dynamically getting the visibility icon with a\n   * callback function.\n   */\n  visibilityIcon?:\n    | ConfigurableVisibilityIcon\n    | GetPasswordVisibilityIcon\n    | ReactNode;\n\n  /**\n   * The `aria-label` to use for the password visibility icon button.\n   *\n   * @defaultValue `\"Show password\"`\n   */\n  visibilityLabel?: string;\n\n  /**\n   * Any props that should be passed to the password visibility icon button. If\n   * `id`, `buttonType`, `aria-label`, `aria-pressed`, or `children` are\n   * provided here, they will override the default implementation.\n   */\n  visibilityProps?: PropsWithRef<ButtonProps, HTMLButtonElement>;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Password } from \"@react-md/core/form/Password\";\n *\n * function Example(): ReactElement {\n *   return  <Password label=\"Password\" required />;\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/password | Password Demos}\n */\nexport const Password = forwardRef<HTMLInputElement, PasswordProps>(\n  function Password(props, ref) {\n    const {\n      id: propId,\n      name = \"password\",\n      className,\n      inputClassName,\n      visibilityIcon: propVisibilityIcon,\n      visibilityLabel = \"Show password\",\n      visibilityProps,\n      ...remaining\n    } = props;\n    const { toggled: isPasswordVisible, toggle } = useToggle(false);\n\n    let currentVisibilityIcon: ReactNode;\n    if (\n      propVisibilityIcon &&\n      typeof propVisibilityIcon === \"object\" &&\n      \"visible\" in propVisibilityIcon\n    ) {\n      currentVisibilityIcon = isPasswordVisible\n        ? propVisibilityIcon.visible\n        : propVisibilityIcon.invisible;\n    } else if (typeof propVisibilityIcon === \"function\") {\n      currentVisibilityIcon = propVisibilityIcon(isPasswordVisible);\n    } else {\n      currentVisibilityIcon = propVisibilityIcon;\n    }\n\n    const id = useEnsuredId(propId, \"password\");\n    const visibilityIcon = getIcon(\"password\", currentVisibilityIcon);\n\n    return (\n      <TextField\n        {...remaining}\n        ref={ref}\n        name={name}\n        type={isPasswordVisible ? \"text\" : \"password\"}\n        className={password({ className })}\n        inputClassName={passwordInput({ className: inputClassName })}\n        rightAddon={\n          <Button\n            id={`${id}-toggle`}\n            buttonType=\"icon\"\n            aria-label={visibilityLabel}\n            aria-pressed={isPasswordVisible}\n            // allow all props except the onClick, className, and aria-pressed to\n            // be overridden. onClick can only stop default behavior with\n            // `event.stopPropagation()`\n            {...visibilityProps}\n            className={passwordInputToggle({\n              className: visibilityProps?.className,\n            })}\n            onClick={(event) => {\n              visibilityProps?.onClick?.(event);\n              if (event.isPropagationStopped()) {\n                return;\n              }\n\n              toggle();\n            }}\n          >\n            {visibilityProps?.children ?? visibilityIcon}\n          </Button>\n        }\n        disableRightAddonStyles\n      />\n    );\n  }\n);\n"],"names":["forwardRef","Button","getIcon","useEnsuredId","useToggle","TextField","password","passwordInput","passwordInputToggle","Password","props","ref","id","propId","name","className","inputClassName","visibilityIcon","propVisibilityIcon","visibilityLabel","visibilityProps","remaining","toggled","isPasswordVisible","toggle","currentVisibilityIcon","visible","invisible","type","rightAddon","buttonType","aria-label","aria-pressed","onClick","event","isPropagationStopped","children","disableRightAddonStyles"],"mappings":"AAAA;;AAEA,SAAyBA,UAAU,QAAQ,QAAQ;AAEnD,SAASC,MAAM,QAA0B,sBAAsB;AAC/D,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,SAAS,QAA6B,iBAAiB;AAChE,SACEC,QAAQ,EACRC,aAAa,EACbC,mBAAmB,QACd,sBAAsB;AAqH7B;;;;;;;;;;;;;CAaC,GACD,OAAO,MAAMC,yBAAWT,WACtB,SAASS,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,IAAIC,MAAM,EACVC,OAAO,UAAU,EACjBC,SAAS,EACTC,cAAc,EACdC,gBAAgBC,kBAAkB,EAClCC,kBAAkB,eAAe,EACjCC,eAAe,EACf,GAAGC,WACJ,GAAGX;IACJ,MAAM,EAAEY,SAASC,iBAAiB,EAAEC,MAAM,EAAE,GAAGpB,UAAU;IAEzD,IAAIqB;IACJ,IACEP,sBACA,OAAOA,uBAAuB,YAC9B,aAAaA,oBACb;QACAO,wBAAwBF,oBACpBL,mBAAmBQ,OAAO,GAC1BR,mBAAmBS,SAAS;IAClC,OAAO,IAAI,OAAOT,uBAAuB,YAAY;QACnDO,wBAAwBP,mBAAmBK;IAC7C,OAAO;QACLE,wBAAwBP;IAC1B;IAEA,MAAMN,KAAKT,aAAaU,QAAQ;IAChC,MAAMI,iBAAiBf,QAAQ,YAAYuB;IAE3C,qBACE,KAACpB;QACE,GAAGgB,SAAS;QACbV,KAAKA;QACLG,MAAMA;QACNc,MAAML,oBAAoB,SAAS;QACnCR,WAAWT,SAAS;YAAES;QAAU;QAChCC,gBAAgBT,cAAc;YAAEQ,WAAWC;QAAe;QAC1Da,0BACE,KAAC5B;YACCW,IAAI,GAAGA,GAAG,OAAO,CAAC;YAClBkB,YAAW;YACXC,cAAYZ;YACZa,gBAAcT;YAIb,GAAGH,eAAe;YACnBL,WAAWP,oBAAoB;gBAC7BO,WAAWK,iBAAiBL;YAC9B;YACAkB,SAAS,CAACC;gBACRd,iBAAiBa,UAAUC;gBAC3B,IAAIA,MAAMC,oBAAoB,IAAI;oBAChC;gBACF;gBAEAX;YACF;sBAECJ,iBAAiBgB,YAAYnB;;QAGlCoB,uBAAuB;;AAG7B,GACA"}
+{"version":3,"sources":["../../src/form/Password.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useToggle } from \"../useToggle.js\";\nimport { TextField, type TextFieldProps } from \"./TextField.js\";\nimport {\n  password,\n  passwordInput,\n  passwordInputToggle,\n} from \"./passwordStyles.js\";\n\n/**\n * @example Simple Example\n * ```tsx\n * const getVisibilityIcon: GetPasswordVisibilityIcon = (isPasswordVisible) => {\n *   if (isPasswordVisible) {\n *     return <SecurityIcon />;\n *   }\n *\n *   return <RemoveRedEyeIcon />;\n * };\n * ```\n *\n * @param isPasswordVisible - `true` when the password is visible and in plain\n * text\n * @returns a custom icon to use for the password visibility toggle.\n */\nexport type GetPasswordVisibilityIcon = (\n  isPasswordVisible: boolean\n) => ReactNode;\n\n/**\n * @example Simple Example\n * ```tsx\n * const visibilityIcon: ConfigurableVisibilityIcon = {\n *   visible: <SecurityIcon />,\n *   invisible: <RemoveRedEyeIcon />,\n * };\n * ```\n */\nexport interface ConfigurableVisibilityIcon {\n  /**\n   * The icon to display while the password is currently visible as plain text.\n   */\n  visible: ReactNode;\n\n  /**\n   * The icon to display while the password is currently invisible as the\n   * password input.\n   */\n  invisible: ReactNode;\n}\n\n/**\n * @since 6.0.0 Removed the `visibilityStyle`, `visibilityClassName`, and\n * `onVisibilityClick` props in favor of `visibilityProps` object.\n * @since 6.0.0 Removed the `disableVisibility` and `rightChildren` props in\n * favor of just using a `TextField` instead of the `Password` component.\n * @since 6.0.0 Merged the `getVisibilityIcon` prop behavior into the\n * `visibilityIcon` prop.\n */\nexport interface PasswordProps\n  extends Omit<TextFieldProps, \"type\" | \"rightAddon\"> {\n  /**\n   * @defaultValue `\"password\"`\n   * @since 6.0.0 Defaults to `\"password\"`\n   */\n  name?: string;\n\n  /**\n   * @example Configurable Visibility Icon Object\n   * ```tsx\n   * <Password\n   *   {...props}\n   *   visibilityIcon={{\n   *     visible: <SecurityIcon />,\n   *     invisible: <RemoveRedEyeIcon />,\n   *   }}\n   * />\n   * ```\n   *\n   * @example Get Password Visibility Icon Function\n   * ```tsx\n   * <Password\n   *   {...props}\n   *   visibilityIcon={(isPasswordVisible) => {\n   *     if (isPasswordVisible) {\n   *       return <SecurityIcon />;\n   *     }\n   *\n   *     return <RemoveRedEyeIcon />;\n   *   }}\n   * />\n   * ```\n   *\n   * @example Custom Icon\n   * ```tsx\n   * <Password\n   *   {...props}\n   *   visibilityIcon={<SomeCustomComponent />}\n   * />\n   * ```\n   *\n   * @since 6.0.0 Supports dynamically getting the visibility icon with a\n   * callback function.\n   */\n  visibilityIcon?:\n    | ConfigurableVisibilityIcon\n    | GetPasswordVisibilityIcon\n    | ReactNode;\n\n  /**\n   * The `aria-label` to use for the password visibility icon button.\n   *\n   * @defaultValue `\"Show password\"`\n   */\n  visibilityLabel?: string;\n\n  /**\n   * Any props that should be passed to the password visibility icon button. If\n   * `id`, `buttonType`, `aria-label`, `aria-pressed`, or `children` are\n   * provided here, they will override the default implementation.\n   */\n  visibilityProps?: PropsWithRef<ButtonProps, HTMLButtonElement>;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Password } from \"@react-md/core/form/Password\";\n *\n * function Example(): ReactElement {\n *   return  <Password label=\"Password\" required />;\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/password | Password Demos}\n */\nexport const Password = forwardRef<HTMLInputElement, PasswordProps>(\n  function Password(props, ref) {\n    const {\n      id: propId,\n      name = \"password\",\n      className,\n      inputClassName,\n      visibilityIcon: propVisibilityIcon,\n      visibilityLabel = \"Show password\",\n      visibilityProps,\n      ...remaining\n    } = props;\n    const { toggled: isPasswordVisible, toggle } = useToggle(false);\n\n    let currentVisibilityIcon: ReactNode;\n    if (\n      propVisibilityIcon &&\n      typeof propVisibilityIcon === \"object\" &&\n      \"visible\" in propVisibilityIcon\n    ) {\n      currentVisibilityIcon = isPasswordVisible\n        ? propVisibilityIcon.visible\n        : propVisibilityIcon.invisible;\n    } else if (typeof propVisibilityIcon === \"function\") {\n      currentVisibilityIcon = propVisibilityIcon(isPasswordVisible);\n    } else {\n      currentVisibilityIcon = propVisibilityIcon;\n    }\n\n    const id = useEnsuredId(propId, \"password\");\n    const visibilityIcon = getIcon(\"password\", currentVisibilityIcon);\n\n    return (\n      <TextField\n        {...remaining}\n        ref={ref}\n        name={name}\n        type={isPasswordVisible ? \"text\" : \"password\"}\n        className={password({ className })}\n        inputClassName={passwordInput({ className: inputClassName })}\n        rightAddon={\n          <Button\n            id={`${id}-toggle`}\n            buttonType=\"icon\"\n            aria-label={visibilityLabel}\n            aria-pressed={isPasswordVisible}\n            // allow all props except the onClick, className, and aria-pressed to\n            // be overridden. onClick can only stop default behavior with\n            // `event.stopPropagation()`\n            {...visibilityProps}\n            className={passwordInputToggle({\n              className: visibilityProps?.className,\n            })}\n            onClick={(event) => {\n              visibilityProps?.onClick?.(event);\n              if (event.isPropagationStopped()) {\n                return;\n              }\n\n              toggle();\n            }}\n          >\n            {visibilityProps?.children ?? visibilityIcon}\n          </Button>\n        }\n        disableRightAddonStyles\n      />\n    );\n  }\n);\n"],"names":["forwardRef","Button","getIcon","useEnsuredId","useToggle","TextField","password","passwordInput","passwordInputToggle","Password","props","ref","id","propId","name","className","inputClassName","visibilityIcon","propVisibilityIcon","visibilityLabel","visibilityProps","remaining","toggled","isPasswordVisible","toggle","currentVisibilityIcon","visible","invisible","type","rightAddon","buttonType","aria-label","aria-pressed","onClick","event","isPropagationStopped","children","disableRightAddonStyles"],"mappings":"AAAA;;AAEA,SAAyBA,UAAU,QAAQ,QAAQ;AAEnD,SAASC,MAAM,QAA0B,sBAAsB;AAC/D,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,SAAS,QAA6B,iBAAiB;AAChE,SACEC,QAAQ,EACRC,aAAa,EACbC,mBAAmB,QACd,sBAAsB;AAqH7B;;;;;;;;;;;;;CAaC,GACD,OAAO,MAAMC,yBAAWT,WACtB,SAASS,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,IAAIC,MAAM,EACVC,OAAO,UAAU,EACjBC,SAAS,EACTC,cAAc,EACdC,gBAAgBC,kBAAkB,EAClCC,kBAAkB,eAAe,EACjCC,eAAe,EACf,GAAGC,WACJ,GAAGX;IACJ,MAAM,EAAEY,SAASC,iBAAiB,EAAEC,MAAM,EAAE,GAAGpB,UAAU;IAEzD,IAAIqB;IACJ,IACEP,sBACA,OAAOA,uBAAuB,YAC9B,aAAaA,oBACb;QACAO,wBAAwBF,oBACpBL,mBAAmBQ,OAAO,GAC1BR,mBAAmBS,SAAS;IAClC,OAAO,IAAI,OAAOT,uBAAuB,YAAY;QACnDO,wBAAwBP,mBAAmBK;IAC7C,OAAO;QACLE,wBAAwBP;IAC1B;IAEA,MAAMN,KAAKT,aAAaU,QAAQ;IAChC,MAAMI,iBAAiBf,QAAQ,YAAYuB;IAE3C,qBACE,KAACpB;QACE,GAAGgB,SAAS;QACbV,KAAKA;QACLG,MAAMA;QACNc,MAAML,oBAAoB,SAAS;QACnCR,WAAWT,SAAS;YAAES;QAAU;QAChCC,gBAAgBT,cAAc;YAAEQ,WAAWC;QAAe;QAC1Da,0BACE,KAAC5B;YACCW,IAAI,GAAGA,GAAG,OAAO,CAAC;YAClBkB,YAAW;YACXC,cAAYZ;YACZa,gBAAcT;YAIb,GAAGH,eAAe;YACnBL,WAAWP,oBAAoB;gBAC7BO,WAAWK,iBAAiBL;YAC9B;YACAkB,SAAS,CAACC;gBACRd,iBAAiBa,UAAUC;gBAC3B,IAAIA,MAAMC,oBAAoB,IAAI;oBAChC;gBACF;gBAEAX;YACF;sBAECJ,iBAAiBgB,YAAYnB;;QAGlCoB,uBAAuB;;AAG7B,GACA"}

package/dist/form/Radio.d.ts

@@ -18,6 +18,6 @@ import { type RadioProps } from "./InputToggle.js";
  * );
  * ```
  *
- * @see {@link https://next.react-md.dev/components/radio | Radio Demos}
+ * @see {@link https://react-md.dev/components/radio | Radio Demos}
  */
 export declare const Radio: import("react").ForwardRefExoticComponent<RadioProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/form/Radio.js

@@ -21,7 +21,7 @@ import { InputToggle } from "./InputToggle.js";
  * );
  * ```
  *
- * @see {@link https://next.react-md.dev/components/radio | Radio Demos}
+ * @see {@link https://react-md.dev/components/radio | Radio Demos}
  */ export const Radio = /*#__PURE__*/ forwardRef(function Radio(props, ref) {
     return /*#__PURE__*/ _jsx(InputToggle, {
         ...props,

package/dist/form/Radio.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Radio.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { InputToggle, type RadioProps } from \"./InputToggle.js\";\n\n/**\n * **Client Component**\n *\n * You'll generally want to use the `useRadioGroup` hook along with this\n * component.\n *\n * @example Simple Example\n * ```tsx\n * const { value, getRadioProps } = useRadioGroup({ name: \"group\" });\n *\n * return (\n *   <>\n *     <Radio {...getRadioProps(\"a\")} label=\"First\" />\n *     <Radio {...getRadioProps(\"b\")} label=\"Second\" />\n *     <Radio {...getRadioProps(\"c\")} label=\"Third\" />\n *   </>\n * );\n * ```\n *\n * @see {@link https://next.react-md.dev/components/radio | Radio Demos}\n */\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n  function Radio(props, ref) {\n    return <InputToggle {...props} ref={ref} type=\"radio\" />;\n  }\n);\n"],"names":["forwardRef","InputToggle","Radio","props","ref","type"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,WAAW,QAAyB,mBAAmB;AAEhE;;;;;;;;;;;;;;;;;;;;CAoBC,GACD,OAAO,MAAMC,sBAAQF,WACnB,SAASE,MAAMC,KAAK,EAAEC,GAAG;IACvB,qBAAO,KAACH;QAAa,GAAGE,KAAK;QAAEC,KAAKA;QAAKC,MAAK;;AAChD,GACA"}
+{"version":3,"sources":["../../src/form/Radio.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { InputToggle, type RadioProps } from \"./InputToggle.js\";\n\n/**\n * **Client Component**\n *\n * You'll generally want to use the `useRadioGroup` hook along with this\n * component.\n *\n * @example Simple Example\n * ```tsx\n * const { value, getRadioProps } = useRadioGroup({ name: \"group\" });\n *\n * return (\n *   <>\n *     <Radio {...getRadioProps(\"a\")} label=\"First\" />\n *     <Radio {...getRadioProps(\"b\")} label=\"Second\" />\n *     <Radio {...getRadioProps(\"c\")} label=\"Third\" />\n *   </>\n * );\n * ```\n *\n * @see {@link https://react-md.dev/components/radio | Radio Demos}\n */\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n  function Radio(props, ref) {\n    return <InputToggle {...props} ref={ref} type=\"radio\" />;\n  }\n);\n"],"names":["forwardRef","InputToggle","Radio","props","ref","type"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,WAAW,QAAyB,mBAAmB;AAEhE;;;;;;;;;;;;;;;;;;;;CAoBC,GACD,OAAO,MAAMC,sBAAQF,WACnB,SAASE,MAAMC,KAAK,EAAEC,GAAG;IACvB,qBAAO,KAACH;QAAa,GAAGE,KAAK;QAAEC,KAAKA;QAAKC,MAAK;;AAChD,GACA"}

package/dist/form/Select.d.ts

@@ -180,7 +180,7 @@ export interface SelectProps<Value extends string> extends Omit<TextFieldContain
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
  * @since 6.0.0 Rewritten with a new API.
  */
 export declare function Select<Value extends string>(props: RequireAtLeastOne<SelectProps<Value>, "label" | keyof LabelA11y>): ReactElement;

package/dist/form/Select.js

@@ -50,7 +50,7 @@ const noop = ()=>{
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
  * @since 6.0.0 Rewritten with a new API.
  */ export function Select(props) {
     const { id, form, autoCompleteValue, autoComplete = autoCompleteValue, name = autoCompleteValue, className, onClick, onFocus, onKeyDown, inputRef: propInputRef, inputProps, containerRef, placeholder, menuProps = {}, label, labelProps = {}, selectedOptionProps, icon: propIcon, value, defaultValue, theme: propTheme, onChange = noop, rightAddon: propRightAddon, active = false, required, selectedIconAfter = false, disableOptionAddon = false, disableSelectedIcon = false, children, ...remaining } = props;

package/dist/form/Select.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Select.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport {\n  type ChangeEvent,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { type BoxProps } from \"../box/Box.js\";\nimport { IconRotator } from \"../icon/IconRotator.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { type MenuProps } from \"../menu/Menu.js\";\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n  type LabelA11y,\n  type PropsWithRef,\n  type RequireAtLeastOne,\n} from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { Listbox } from \"./Listbox.js\";\nimport { SelectedOption } from \"./SelectedOption.js\";\nimport {\n  TextFieldContainer,\n  type TextFieldContainerProps,\n} from \"./TextFieldContainer.js\";\nimport { getFormConfig } from \"./formConfig.js\";\nimport { label as labelStyles } from \"./labelStyles.js\";\nimport { select } from \"./selectStyles.js\";\nimport { extractOptionsFromChildren } from \"./selectUtils.js\";\nimport { textField } from \"./textFieldStyles.js\";\nimport { type UserAgentAutocompleteProps } from \"./types.js\";\nimport { useFormReset } from \"./useFormReset.js\";\nimport { useSelectCombobox } from \"./useSelectCombobox.js\";\nimport { triggerManualChangeEvent } from \"./utils.js\";\n\nconst EMPTY_STRING = \"\" as const;\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * This is a convenience type for casting the `event.currentTarget.value` of a\n * `Select`'s change event to be union of available values.\n *\n * Note: The change event does not provide any sort of validation on the value\n * so automation tools like Cypress, Playwright, or Selenium might set an\n * invalid value. This also does not work for numbers, so you will need to\n * implement that yourself.\n *\n * @example Simple Usage\n * ```tsx\n * import { Select, type SelectChangeEvent } from \"@react-md/core/form/Select\";\n * import { Option } from \"@react-md/core/form/Option\";\n * import type { ReactElement } from \"react\";\n *\n * type Value = \"\" | \"a\" | \"b\" | \"c\" | \"d\";\n *\n * function Example(): ReactElement {\n *   const [value, setValue] = useState<Value>(\"\");\n *\n *   const handleChange = (event: SelectChangeEvent<Value>): void => {\n *     // No type error!\n *     // `event.currentTarget.value`'s type is `Value` instead of a generic `string`\n *     setValue(event.currentTarget.value);\n *   };\n *\n *   return (\n *     <Select\n *       label=\"Label\"\n *       value={value}\n *       onChange={handleChange}\n *     >\n *       <Option value=\"a\">First</Option>\n *       <Option value=\"b\">Second</Option>\n *       <Option value=\"c\">Third</Option>\n *       <Option value=\"d\">Fourth</Option>\n *     </Select>\n *   );\n * }\n * ```\n * @since 6.0.0\n */\nexport type SelectChangeEvent<Value extends string> =\n  ChangeEvent<HTMLInputElement> & { currentTarget: { value: Value } };\n\n/**\n * @since 6.0.0 Rewritten with a new API.\n */\nexport interface SelectProps<Value extends string>\n  extends Omit<TextFieldContainerProps, \"label\">,\n    Pick<InputHTMLAttributes<HTMLInputElement>, \"form\" | \"required\">,\n    UserAgentAutocompleteProps {\n  /**\n   * @defaultValue `\"select-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * Optional placeholder text or element to render while no options have been\n   * selected.\n   */\n  placeholder?: ReactNode;\n\n  /**\n   * Set this to a custom dropdown icon or `null` to not render a dropdown icon.\n   *\n   * @defaultValue `getIcon(\"dropdown\")`\n   */\n  icon?: ReactNode;\n\n  /**\n   * Set this value to fully control the value of the select component. The\n   * {@link onChange} handler **must** also be provided if this prop exists.\n   */\n  value?: Value;\n\n  /**\n   * An optional default value when the value of the select component is\n   * uncontrolled.\n   *\n   * @defaultValue `\"\"`\n   */\n  defaultValue?: Value;\n\n  /** @see {@link SelectChangeEvent} */\n  onChange?: (event: SelectChangeEvent<Value>) => void;\n\n  /**\n   * An optional floating label to display like other form fields.\n   */\n  label?: ReactNode;\n\n  /**\n   * Optional props to pass to the `<span>` that surrounds the {@link label}\n   */\n  labelProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n  /**\n   * An optional ref to pass to the hidden `<input type=\"text\" />` element that\n   * stores the current value. This is really only useful if you'd like to keep\n   * this component uncontrolled and access the value through\n   * `inputRef.current.value`.\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  inputProps?: InputHTMLAttributes<HTMLInputElement>;\n\n  /**\n   * A ref for the container `<div>` element.\n   */\n  containerRef?: Ref<HTMLDivElement>;\n\n  /**\n   * Any additional props to provide to the `Menu` component that renders all\n   * the `Option`s.\n   *\n   * The menu will always have these default values unless explicity\n   * overwritten by this prop:\n   *\n   * - `aria-labelledby={label ? labelId : id}` -- this will be undefined if\n   *   `aria-label` is provided\n   * - `anchor={BELOW_CENTER_ANCHOR}`\n   * - `width=\"min\"`\n   */\n  menuProps?: PropsWithRef<\n    Omit<MenuProps, \"visible\" | \"onRequestClose\" | \"fixedTo\">,\n    HTMLDivElement\n  >;\n\n  /**\n   * Any additional props to pass to the div that contains the current visible\n   * option.\n   */\n  selectedOptionProps?: BoxProps;\n\n  /**\n   * Set this to `true` if all the `Option` components should display the\n   * selected icon after the children instead of before.\n   *\n   * @see {@link disableSelectedIcon} to remove the selected icon instead.\n   *\n   * @defaultValue `false`\n   */\n  selectedIconAfter?: boolean;\n\n  /**\n   * Set this to `true` to prevent the current option from rendering the\n   * `leftAddon` in the `TextFieldContainer`.\n   *\n   * @defaultValue `false`\n   */\n  disableOptionAddon?: boolean;\n\n  /**\n   * Set this to `true` to update all the `Option` components to no longer\n   * render an icon while selected.\n   *\n   * @defaultValue `false`\n   */\n  disableSelectedIcon?: boolean;\n\n  /**\n   * This should be the available `Option`s for the select to choose from. It\n   * can also contain `OptGroup` or any other elements but only clicking on an\n   * `Option` component will update the value.\n   */\n  children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Option } from \"@react-md/core/form/Option\";\n * import { Select } from \"@react-md/core/form/Select\";\n * import { useState, type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const [value, setValue] = useState(\"\");\n *\n *   return (\n *     <Select\n *       label=\"Select\"\n *       value={value}\n *       onChange={(event) => setValue(event.currentTarget.value)}\n *       placeholder=\"Select a value\"\n *     >\n *       <Option value=\"a\">Option 1</Option>\n *       <Option value=\"b\">Option 2</Option>\n *       <Option value=\"c\">Option 3</Option>\n *       <Option value=\"d\">Option 4</Option>\n *     </Select>\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/select | Select Demos}\n * @since 6.0.0 Rewritten with a new API.\n */\nexport function Select<Value extends string>(\n  props: RequireAtLeastOne<SelectProps<Value>, \"label\" | keyof LabelA11y>\n): ReactElement {\n  const {\n    id,\n    form,\n    autoCompleteValue,\n    autoComplete = autoCompleteValue,\n    name = autoCompleteValue,\n    className,\n    onClick,\n    onFocus,\n    onKeyDown,\n    inputRef: propInputRef,\n    inputProps,\n    containerRef,\n    placeholder,\n    menuProps = {},\n    label,\n    labelProps = {},\n    selectedOptionProps,\n    icon: propIcon,\n    value,\n    defaultValue,\n    theme: propTheme,\n    onChange = noop,\n    rightAddon: propRightAddon,\n    active = false,\n    required,\n    selectedIconAfter = false,\n    disableOptionAddon = false,\n    disableSelectedIcon = false,\n    children,\n    ...remaining\n  } = props;\n  const { dense, error, disabled } = props;\n\n  const comboboxId = useEnsuredId(id, \"select\");\n  const inputId = useEnsuredId(inputProps?.id, \"select-value\");\n  const selectLabelId = useEnsuredId(labelProps.id, \"select-label\");\n  const labelId = label ? selectLabelId : undefined;\n\n  const [localValue, setLocalValue] = useState(() => {\n    if (typeof defaultValue !== \"undefined\") {\n      return defaultValue;\n    }\n\n    return typeof value !== \"undefined\" ? value : EMPTY_STRING;\n  });\n  const currentValue = typeof value === \"undefined\" ? localValue : value;\n  const initialValue = useRef(currentValue);\n  const { options, currentOption } = extractOptionsFromChildren(\n    children,\n    currentValue\n  );\n\n  const { visible, comboboxProps, movementContext, getMenuProps } =\n    useSelectCombobox({\n      form,\n      value: currentValue,\n      values: options,\n      onClick,\n      onFocus,\n      onKeyDown,\n      disabled,\n      popupId: menuProps.id,\n      popupRef: menuProps.ref,\n      comboboxId,\n      comboboxRef: containerRef,\n    });\n\n  const [inputRef, inputRefCallback] = useEnsuredRef(propInputRef);\n  useFormReset({\n    form,\n    elementRef: inputRef,\n    defaultValue: initialValue.current,\n  });\n\n  const icon = getIcon(\"dropdown\", propIcon);\n  const theme = getFormConfig(\"theme\", propTheme);\n  let rightAddon = propRightAddon;\n  if (typeof rightAddon === \"undefined\" && icon) {\n    rightAddon = <IconRotator rotated={visible}>{icon}</IconRotator>;\n  }\n\n  const { ref: listboxRef, ...listboxProps } = getMenuProps(menuProps);\n  let listboxLabelledBy = menuProps[\"aria-labelledby\"];\n  const listboxLabel = menuProps[\"aria-label\"];\n  if (!listboxLabel && !listboxLabelledBy) {\n    listboxLabelledBy = labelId || comboboxId;\n  }\n\n  return (\n    <KeyboardMovementProvider value={movementContext}>\n      <TextFieldContainer\n        aria-labelledby={labelId}\n        {...remaining}\n        {...comboboxProps}\n        label={!!label}\n        theme={theme}\n        active={active || visible}\n        className={cnb(\"rmd-select-container\", className)}\n        rightAddon={rightAddon}\n      >\n        <SelectedOption\n          option={currentOption}\n          placeholder={placeholder}\n          disableAddon={disableOptionAddon}\n          {...selectedOptionProps}\n        />\n        <input\n          aria-hidden\n          id={inputId}\n          ref={inputRefCallback}\n          type=\"text\"\n          autoComplete={autoComplete}\n          name={name}\n          tabIndex={-1}\n          disabled={disabled}\n          required={required}\n          placeholder=\" \"\n          {...inputProps}\n          value={value}\n          defaultValue={defaultValue}\n          className={cnb(select({ theme }), textField())}\n          onChange={(event) => {\n            onChange(event as SelectChangeEvent<Value>);\n            if (typeof value !== \"undefined\") {\n              return;\n            }\n\n            const nextValue = event.currentTarget.value;\n            const nextOption = options.find((option) => option === nextValue);\n\n            setLocalValue(nextOption ?? initialValue.current);\n          }}\n        />\n        {label && (\n          <span\n            {...labelProps}\n            id={labelId}\n            className={labelStyles({\n              dense,\n              error,\n              disabled,\n              active: active || visible,\n              floating: true,\n              floatingActive: !!placeholder || !!currentOption,\n              className: labelProps.className,\n            })}\n          >\n            {label}\n          </span>\n        )}\n      </TextFieldContainer>\n      <Listbox\n        {...listboxProps}\n        aria-label={listboxLabel}\n        aria-labelledby={listboxLabelledBy as string}\n        nodeRef={listboxRef}\n        value={currentValue}\n        setValue={useCallback(\n          (option: \"\" | Value) => {\n            triggerManualChangeEvent(inputRef.current, option);\n          },\n          [inputRef]\n        )}\n        selectedIconAfter={selectedIconAfter}\n        disableSelectedIcon={disableSelectedIcon}\n      >\n        {children}\n      </Listbox>\n    </KeyboardMovementProvider>\n  );\n}\n"],"names":["cnb","useCallback","useRef","useState","IconRotator","getIcon","KeyboardMovementProvider","useEnsuredId","useEnsuredRef","Listbox","SelectedOption","TextFieldContainer","getFormConfig","label","labelStyles","select","extractOptionsFromChildren","textField","useFormReset","useSelectCombobox","triggerManualChangeEvent","EMPTY_STRING","noop","Select","props","id","form","autoCompleteValue","autoComplete","name","className","onClick","onFocus","onKeyDown","inputRef","propInputRef","inputProps","containerRef","placeholder","menuProps","labelProps","selectedOptionProps","icon","propIcon","value","defaultValue","theme","propTheme","onChange","rightAddon","propRightAddon","active","required","selectedIconAfter","disableOptionAddon","disableSelectedIcon","children","remaining","dense","error","disabled","comboboxId","inputId","selectLabelId","labelId","undefined","localValue","setLocalValue","currentValue","initialValue","options","currentOption","visible","comboboxProps","movementContext","getMenuProps","values","popupId","popupRef","ref","comboboxRef","inputRefCallback","elementRef","current","rotated","listboxRef","listboxProps","listboxLabelledBy","listboxLabel","aria-labelledby","option","disableAddon","input","aria-hidden","type","tabIndex","event","nextValue","currentTarget","nextOption","find","span","floating","floatingActive","aria-label","nodeRef","setValue"],"mappings":"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"}
+{"version":3,"sources":["../../src/form/Select.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport {\n  type ChangeEvent,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { type BoxProps } from \"../box/Box.js\";\nimport { IconRotator } from \"../icon/IconRotator.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { type MenuProps } from \"../menu/Menu.js\";\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n  type LabelA11y,\n  type PropsWithRef,\n  type RequireAtLeastOne,\n} from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { Listbox } from \"./Listbox.js\";\nimport { SelectedOption } from \"./SelectedOption.js\";\nimport {\n  TextFieldContainer,\n  type TextFieldContainerProps,\n} from \"./TextFieldContainer.js\";\nimport { getFormConfig } from \"./formConfig.js\";\nimport { label as labelStyles } from \"./labelStyles.js\";\nimport { select } from \"./selectStyles.js\";\nimport { extractOptionsFromChildren } from \"./selectUtils.js\";\nimport { textField } from \"./textFieldStyles.js\";\nimport { type UserAgentAutocompleteProps } from \"./types.js\";\nimport { useFormReset } from \"./useFormReset.js\";\nimport { useSelectCombobox } from \"./useSelectCombobox.js\";\nimport { triggerManualChangeEvent } from \"./utils.js\";\n\nconst EMPTY_STRING = \"\" as const;\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * This is a convenience type for casting the `event.currentTarget.value` of a\n * `Select`'s change event to be union of available values.\n *\n * Note: The change event does not provide any sort of validation on the value\n * so automation tools like Cypress, Playwright, or Selenium might set an\n * invalid value. This also does not work for numbers, so you will need to\n * implement that yourself.\n *\n * @example Simple Usage\n * ```tsx\n * import { Select, type SelectChangeEvent } from \"@react-md/core/form/Select\";\n * import { Option } from \"@react-md/core/form/Option\";\n * import type { ReactElement } from \"react\";\n *\n * type Value = \"\" | \"a\" | \"b\" | \"c\" | \"d\";\n *\n * function Example(): ReactElement {\n *   const [value, setValue] = useState<Value>(\"\");\n *\n *   const handleChange = (event: SelectChangeEvent<Value>): void => {\n *     // No type error!\n *     // `event.currentTarget.value`'s type is `Value` instead of a generic `string`\n *     setValue(event.currentTarget.value);\n *   };\n *\n *   return (\n *     <Select\n *       label=\"Label\"\n *       value={value}\n *       onChange={handleChange}\n *     >\n *       <Option value=\"a\">First</Option>\n *       <Option value=\"b\">Second</Option>\n *       <Option value=\"c\">Third</Option>\n *       <Option value=\"d\">Fourth</Option>\n *     </Select>\n *   );\n * }\n * ```\n * @since 6.0.0\n */\nexport type SelectChangeEvent<Value extends string> =\n  ChangeEvent<HTMLInputElement> & { currentTarget: { value: Value } };\n\n/**\n * @since 6.0.0 Rewritten with a new API.\n */\nexport interface SelectProps<Value extends string>\n  extends Omit<TextFieldContainerProps, \"label\">,\n    Pick<InputHTMLAttributes<HTMLInputElement>, \"form\" | \"required\">,\n    UserAgentAutocompleteProps {\n  /**\n   * @defaultValue `\"select-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * Optional placeholder text or element to render while no options have been\n   * selected.\n   */\n  placeholder?: ReactNode;\n\n  /**\n   * Set this to a custom dropdown icon or `null` to not render a dropdown icon.\n   *\n   * @defaultValue `getIcon(\"dropdown\")`\n   */\n  icon?: ReactNode;\n\n  /**\n   * Set this value to fully control the value of the select component. The\n   * {@link onChange} handler **must** also be provided if this prop exists.\n   */\n  value?: Value;\n\n  /**\n   * An optional default value when the value of the select component is\n   * uncontrolled.\n   *\n   * @defaultValue `\"\"`\n   */\n  defaultValue?: Value;\n\n  /** @see {@link SelectChangeEvent} */\n  onChange?: (event: SelectChangeEvent<Value>) => void;\n\n  /**\n   * An optional floating label to display like other form fields.\n   */\n  label?: ReactNode;\n\n  /**\n   * Optional props to pass to the `<span>` that surrounds the {@link label}\n   */\n  labelProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n  /**\n   * An optional ref to pass to the hidden `<input type=\"text\" />` element that\n   * stores the current value. This is really only useful if you'd like to keep\n   * this component uncontrolled and access the value through\n   * `inputRef.current.value`.\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  inputProps?: InputHTMLAttributes<HTMLInputElement>;\n\n  /**\n   * A ref for the container `<div>` element.\n   */\n  containerRef?: Ref<HTMLDivElement>;\n\n  /**\n   * Any additional props to provide to the `Menu` component that renders all\n   * the `Option`s.\n   *\n   * The menu will always have these default values unless explicity\n   * overwritten by this prop:\n   *\n   * - `aria-labelledby={label ? labelId : id}` -- this will be undefined if\n   *   `aria-label` is provided\n   * - `anchor={BELOW_CENTER_ANCHOR}`\n   * - `width=\"min\"`\n   */\n  menuProps?: PropsWithRef<\n    Omit<MenuProps, \"visible\" | \"onRequestClose\" | \"fixedTo\">,\n    HTMLDivElement\n  >;\n\n  /**\n   * Any additional props to pass to the div that contains the current visible\n   * option.\n   */\n  selectedOptionProps?: BoxProps;\n\n  /**\n   * Set this to `true` if all the `Option` components should display the\n   * selected icon after the children instead of before.\n   *\n   * @see {@link disableSelectedIcon} to remove the selected icon instead.\n   *\n   * @defaultValue `false`\n   */\n  selectedIconAfter?: boolean;\n\n  /**\n   * Set this to `true` to prevent the current option from rendering the\n   * `leftAddon` in the `TextFieldContainer`.\n   *\n   * @defaultValue `false`\n   */\n  disableOptionAddon?: boolean;\n\n  /**\n   * Set this to `true` to update all the `Option` components to no longer\n   * render an icon while selected.\n   *\n   * @defaultValue `false`\n   */\n  disableSelectedIcon?: boolean;\n\n  /**\n   * This should be the available `Option`s for the select to choose from. It\n   * can also contain `OptGroup` or any other elements but only clicking on an\n   * `Option` component will update the value.\n   */\n  children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Option } from \"@react-md/core/form/Option\";\n * import { Select } from \"@react-md/core/form/Select\";\n * import { useState, type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const [value, setValue] = useState(\"\");\n *\n *   return (\n *     <Select\n *       label=\"Select\"\n *       value={value}\n *       onChange={(event) => setValue(event.currentTarget.value)}\n *       placeholder=\"Select a value\"\n *     >\n *       <Option value=\"a\">Option 1</Option>\n *       <Option value=\"b\">Option 2</Option>\n *       <Option value=\"c\">Option 3</Option>\n *       <Option value=\"d\">Option 4</Option>\n *     </Select>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/select | Select Demos}\n * @since 6.0.0 Rewritten with a new API.\n */\nexport function Select<Value extends string>(\n  props: RequireAtLeastOne<SelectProps<Value>, \"label\" | keyof LabelA11y>\n): ReactElement {\n  const {\n    id,\n    form,\n    autoCompleteValue,\n    autoComplete = autoCompleteValue,\n    name = autoCompleteValue,\n    className,\n    onClick,\n    onFocus,\n    onKeyDown,\n    inputRef: propInputRef,\n    inputProps,\n    containerRef,\n    placeholder,\n    menuProps = {},\n    label,\n    labelProps = {},\n    selectedOptionProps,\n    icon: propIcon,\n    value,\n    defaultValue,\n    theme: propTheme,\n    onChange = noop,\n    rightAddon: propRightAddon,\n    active = false,\n    required,\n    selectedIconAfter = false,\n    disableOptionAddon = false,\n    disableSelectedIcon = false,\n    children,\n    ...remaining\n  } = props;\n  const { dense, error, disabled } = props;\n\n  const comboboxId = useEnsuredId(id, \"select\");\n  const inputId = useEnsuredId(inputProps?.id, \"select-value\");\n  const selectLabelId = useEnsuredId(labelProps.id, \"select-label\");\n  const labelId = label ? selectLabelId : undefined;\n\n  const [localValue, setLocalValue] = useState(() => {\n    if (typeof defaultValue !== \"undefined\") {\n      return defaultValue;\n    }\n\n    return typeof value !== \"undefined\" ? value : EMPTY_STRING;\n  });\n  const currentValue = typeof value === \"undefined\" ? localValue : value;\n  const initialValue = useRef(currentValue);\n  const { options, currentOption } = extractOptionsFromChildren(\n    children,\n    currentValue\n  );\n\n  const { visible, comboboxProps, movementContext, getMenuProps } =\n    useSelectCombobox({\n      form,\n      value: currentValue,\n      values: options,\n      onClick,\n      onFocus,\n      onKeyDown,\n      disabled,\n      popupId: menuProps.id,\n      popupRef: menuProps.ref,\n      comboboxId,\n      comboboxRef: containerRef,\n    });\n\n  const [inputRef, inputRefCallback] = useEnsuredRef(propInputRef);\n  useFormReset({\n    form,\n    elementRef: inputRef,\n    defaultValue: initialValue.current,\n  });\n\n  const icon = getIcon(\"dropdown\", propIcon);\n  const theme = getFormConfig(\"theme\", propTheme);\n  let rightAddon = propRightAddon;\n  if (typeof rightAddon === \"undefined\" && icon) {\n    rightAddon = <IconRotator rotated={visible}>{icon}</IconRotator>;\n  }\n\n  const { ref: listboxRef, ...listboxProps } = getMenuProps(menuProps);\n  let listboxLabelledBy = menuProps[\"aria-labelledby\"];\n  const listboxLabel = menuProps[\"aria-label\"];\n  if (!listboxLabel && !listboxLabelledBy) {\n    listboxLabelledBy = labelId || comboboxId;\n  }\n\n  return (\n    <KeyboardMovementProvider value={movementContext}>\n      <TextFieldContainer\n        aria-labelledby={labelId}\n        {...remaining}\n        {...comboboxProps}\n        label={!!label}\n        theme={theme}\n        active={active || visible}\n        className={cnb(\"rmd-select-container\", className)}\n        rightAddon={rightAddon}\n      >\n        <SelectedOption\n          option={currentOption}\n          placeholder={placeholder}\n          disableAddon={disableOptionAddon}\n          {...selectedOptionProps}\n        />\n        <input\n          aria-hidden\n          id={inputId}\n          ref={inputRefCallback}\n          type=\"text\"\n          autoComplete={autoComplete}\n          name={name}\n          tabIndex={-1}\n          disabled={disabled}\n          required={required}\n          placeholder=\" \"\n          {...inputProps}\n          value={value}\n          defaultValue={defaultValue}\n          className={cnb(select({ theme }), textField())}\n          onChange={(event) => {\n            onChange(event as SelectChangeEvent<Value>);\n            if (typeof value !== \"undefined\") {\n              return;\n            }\n\n            const nextValue = event.currentTarget.value;\n            const nextOption = options.find((option) => option === nextValue);\n\n            setLocalValue(nextOption ?? initialValue.current);\n          }}\n        />\n        {label && (\n          <span\n            {...labelProps}\n            id={labelId}\n            className={labelStyles({\n              dense,\n              error,\n              disabled,\n              active: active || visible,\n              floating: true,\n              floatingActive: !!placeholder || !!currentOption,\n              className: labelProps.className,\n            })}\n          >\n            {label}\n          </span>\n        )}\n      </TextFieldContainer>\n      <Listbox\n        {...listboxProps}\n        aria-label={listboxLabel}\n        aria-labelledby={listboxLabelledBy as string}\n        nodeRef={listboxRef}\n        value={currentValue}\n        setValue={useCallback(\n          (option: \"\" | Value) => {\n            triggerManualChangeEvent(inputRef.current, option);\n          },\n          [inputRef]\n        )}\n        selectedIconAfter={selectedIconAfter}\n        disableSelectedIcon={disableSelectedIcon}\n      >\n        {children}\n      </Listbox>\n    </KeyboardMovementProvider>\n  );\n}\n"],"names":["cnb","useCallback","useRef","useState","IconRotator","getIcon","KeyboardMovementProvider","useEnsuredId","useEnsuredRef","Listbox","SelectedOption","TextFieldContainer","getFormConfig","label","labelStyles","select","extractOptionsFromChildren","textField","useFormReset","useSelectCombobox","triggerManualChangeEvent","EMPTY_STRING","noop","Select","props","id","form","autoCompleteValue","autoComplete","name","className","onClick","onFocus","onKeyDown","inputRef","propInputRef","inputProps","containerRef","placeholder","menuProps","labelProps","selectedOptionProps","icon","propIcon","value","defaultValue","theme","propTheme","onChange","rightAddon","propRightAddon","active","required","selectedIconAfter","disableOptionAddon","disableSelectedIcon","children","remaining","dense","error","disabled","comboboxId","inputId","selectLabelId","labelId","undefined","localValue","setLocalValue","currentValue","initialValue","options","currentOption","visible","comboboxProps","movementContext","getMenuProps","values","popupId","popupRef","ref","comboboxRef","inputRefCallback","elementRef","current","rotated","listboxRef","listboxProps","listboxLabelledBy","listboxLabel","aria-labelledby","option","disableAddon","input","aria-hidden","type","tabIndex","event","nextValue","currentTarget","nextOption","find","span","floating","floatingActive","aria-label","nodeRef","setValue"],"mappings":"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"}

package/dist/form/Slider.d.ts

@@ -284,7 +284,7 @@ export interface RangeSliderProps extends BaseSliderProps, RangeSliderState {
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/slider | Slider Demos}
+ * @see {@link https://react-md.dev/components/slider | Slider Demos}
  * @since 2.5.0
  * @since 6.0.0 The `Slider` and `RangeSlider` have been combined into the
  * single `Slider` component and removed the `label` support.

package/dist/form/Slider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Slider.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n  useRef,\n} from \"react\";\n\nimport { type TooltipProps } from \"../tooltip/Tooltip.js\";\nimport {\n  type LabelRequiredForA11y,\n  type PropsWithRef,\n  type UseStateSetter,\n} from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { identity } from \"../utils/identity.js\";\nimport { type SliderAddonProps, SliderContainer } from \"./SliderContainer.js\";\nimport {\n  type ConfigurableSliderThumbProps,\n  SliderThumb,\n  type SliderThumbPresentation,\n  type SliderThumbProps,\n} from \"./SliderThumb.js\";\nimport { SliderTrack } from \"./SliderTrack.js\";\nimport {\n  type SliderMarksOptions,\n  SliderValueMarks,\n} from \"./SliderValueMarks.js\";\nimport { getJumpValue, getSliderInputName } from \"./sliderUtils.js\";\nimport { type RangeSliderState } from \"./useRangeSlider.js\";\nimport { type SliderState, type SliderValueOptions } from \"./useSlider.js\";\nimport { useSliderDraggable } from \"./useSliderDraggable.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-slider-color\"?: string;\n    \"--rmd-slider-active-color\"?: string;\n    \"--rmd-slider-inactive-color\"?: string;\n    \"--rmd-slider-size\"?: string | number;\n    \"--rmd-slider-active-size\"?: string | number;\n    \"--rmd-slider-inactive-size\"?: string | number;\n    \"--rmd-slider-vertical-size\"?: string | number;\n    \"--rmd-slider-offset-1\"?: string;\n    \"--rmd-slider-offset-2\"?: string;\n    \"--rmd-slider-tooltip-scale\"?: string | number;\n    \"--rmd-slider-tooltip-translate\"?: string | number;\n    \"--rmd-slider-mark-offset\"?: string;\n  }\n}\n\nconst emptyString = (): string => \"\";\nconst noop = (): undefined => {\n  // do nothing\n};\n\n/**\n * @since 2.5.0\n */\nexport interface BaseSliderProps\n  extends HTMLAttributes<HTMLDivElement>,\n    SliderThumbPresentation,\n    SliderValueOptions,\n    SliderAddonProps,\n    SliderMarksOptions {\n  /**\n   * This can be used to apply a ref to the container element since this\n   * component does not use `forwardRef`.\n   */\n  containerRef?: Ref<HTMLDivElement>;\n\n  /**\n   * The amount to jump the slider's value when the `PageUp` or `PageDown`\n   * key is pressed.\n   *\n   * The default value is 1/10th of the range.\n   *\n   * @defaultValue `(numberOfSteps / 10) * step`\n   */\n  jump?: number;\n\n  /** @defaultValue `false` */\n  disabled?: boolean;\n\n  /** @defaultValue `false` */\n  vertical?: boolean;\n\n  /**\n   * This can be used to apply custom styles or a `ref` to the track element if\n   * needed.\n   */\n  trackProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n  /**\n   * This can be used to configure any additional tooltip props like the\n   * CSS transition `classNames`, styles, etc.\n   *\n   * This will only be used when {@link discrete} is `true`.\n   *\n   * Note: The `position` will always be `\"above\"` for horizontal sliders and\n   * `\"left\"` for vertical sliders.\n   */\n  tooltipProps?: Omit<Partial<TooltipProps>, \"position\">;\n}\n\n/**\n * @since 2.5.0\n * @since 6.0.0 Only requires `value` and `setValue` props instead of all the\n * slider controls.\n * @since 6.0.0 The `thumbLabel` and `thumbLabelledBy` props were removed. Use\n * the `aria-label` or `aria-labelledby` props instead.\n * @since 6.0.0 The `baseId` prop was removed in favor of `id` or `*Props.id`\n */\nexport interface SliderProps extends BaseSliderProps, SliderState {\n  /**\n   * Convenience pass-through prop to {@link ConfigurableSliderThumbProps.name} which\n   * will be applied to the hidden `<input type=\"range\" />`\n   */\n  name?: string;\n\n  /**\n   * Any additional props that should be provided to the thumb element. This can\n   * be useful for applying additional styling.\n   */\n  thumbProps?: ConfigurableSliderThumbProps;\n\n  /**\n   * This can be used to update the discrete slider's tooltip props.\n   *\n   * @example Custom Styles\n   * ```tsx\n   * <Slider\n   *   {...slider}\n   *   discrete\n   *   getTooltipProps={(value) => ({\n   *     className: cssUtils({\n   *       backgroundColor: value < 30 ? \"warning\" : undefined,\n   *     }),\n   *   })}\n   * />\n   * ```\n   */\n  getTooltipProps?: (value: number) => Partial<TooltipProps> | undefined;\n\n  /**\n   * This can be used to update the discrete slider's value tooltip.\n   *\n   * @example More Value Information\n   * ```tsx\n   * <Slider\n   *   {...slider}\n   *   discrete\n   *   getTooltipChildren={(value) => (\n   *     <TextIconSpacing icon={<FavoriteIcon />}>\n   *       {value}\n   *     </TextIconSpacing>\n   *   )}\n   * />\n   * ```\n   *\n   * This will only be used when {@link discrete} is `true`.\n   *\n   * @defaultValue `(value) => value`\n   */\n  getTooltipChildren?: (value: number) => ReactNode;\n}\n\n/**\n * @since 2.5.0\n * @since 6.0.0 Only requires `rangeValue` and `setRangeValue` props instead of\n * all the slider controls.\n * @since 6.0.0 The `thumb1Label`, `thumb1LabelledBy`, `thumb1Props`,\n * `thumb2Label`, `thumb2LabelledBy` and `thumb2Props` were renamed to\n * `minThumbLabel`, `minThumbLabelledBy`, `minThumbProps`, `maxThumbLabel`,\n * `maxThumbLabelledBy`, and `maxThumbProps` respectively.\n */\nexport interface RangeSliderProps extends BaseSliderProps, RangeSliderState {\n  /**\n   * Convenience pass-through prop for {@link\n   * ConfigurableSliderThumbProps.name} for both the {@link minThumbProps} and\n   * {@link maxThumbProps}.\n   */\n  name?: string;\n\n  /**\n   * Any additional props that should be provided to the min value thumb\n   * element. This can be useful for applying additional styling.\n   */\n  minThumbProps?: ConfigurableSliderThumbProps;\n\n  /**\n   * Any additional props that should be provided to the max value thumb\n   * element. This can be useful for applying additional styling.\n   */\n  maxThumbProps?: ConfigurableSliderThumbProps;\n\n  /**\n   * The `aria-label` to apply to the min value.\n   *\n   * Note: Either this prop or the {@link minThumbLabelledBy} are required for\n   * accessibility.\n   *\n   * @defaultValue `\"Min\"`\n   */\n  minThumbLabel?: string;\n\n  /**\n   * Set this to an element's id that labels the min value.\n   *\n   * Note: Either this prop or the {@link minThumbLabel} are required for\n   * accessibility.\n   */\n  minThumbLabelledBy?: string;\n\n  /**\n   * The `aria-label` to apply to the max value.\n   *\n   * Note: Either this prop or the {@link maxThumbLabelledBy} are required for\n   * accessibility.\n   *\n   * @defaultValue `\"Max\"`\n   */\n  maxThumbLabel?: string;\n\n  /**\n   * Set this to an element's id that labels the max value.\n   *\n   * Note: Either this prop or the {@link maxThumbLabel} are required for\n   * accessibility.\n   */\n  maxThumbLabelledBy?: string;\n\n  /**\n   * This can be used to update the discrete slider's tooltip props.\n   *\n   * @example Custom Styles\n   * ```tsx\n   * <Slider\n   *   {...slider}\n   *   discrete\n   *   getTooltipProps={(value, isFirstThumb) => ({\n   *     className: cssUtils({\n   *       backgroundColor: value < 30 && isFirstThumb ? \"warning\" : undefined,\n   *     }),\n   *   })}\n   * />\n   * ```\n   */\n  getTooltipProps?: (\n    value: number,\n    isFirstThumb: boolean\n  ) => Partial<TooltipProps>;\n\n  /**\n   * This can be used to update the discrete slider's value tooltip.\n   *\n   * @example More Value Information\n   * ```tsx\n   * <Slider\n   *   {...rangeSlider}\n   *   discrete\n   *   getTooltipChildren={(value, isFirstThumb) => (\n   *     <TextIconSpacing\n   *       icon={isFirstThumb ? <FavoriteIcon /> : <CloseIcon /}\n   *       iconAfter={!isFirstValue}\n   *     >\n   *       {value}\n   *     </TextIconSpacing>\n   *   )}\n   * />\n   * ```\n   *\n   * This will only be used when {@link discrete} is `true`.\n   *\n   * @defaultValue `(value) => value`\n   */\n  getTooltipChildren?: (value: number, isFirstThumb: boolean) => ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Slider } from \"@react-md/core/form/Slider\";\n * import { useSlider } from \"@react-md/core/form/useSlider\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const slider = useSlider({\n *     // these are the defaults and can be changed\n *     min: 0,\n *     max: 100,\n *     step: 1,\n *     defaultValue: 50,\n *   });\n *\n *   // if you need access to the current value or manually change the value\n *   // yourself.\n *   const { value, setValue } = slider;\n *\n *   return (\n *     <Form>\n *       <Slider {...slider} aria-label=\"Volume\" />\n *     </Form>\n *   );\n * }\n * ```\n *\n * @example Range Slider Example\n * ```tsx\n * import { Fieldset } from \"@react-md/core/form/Fieldset\";\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Legend } from \"@react-md/core/form/Legend\";\n * import { Slider } from \"@react-md/core/form/Slider\";\n * import { useRangeSlider } from \"@react-md/core/form/useRangeSlider\";\n * import type { ReactElement } from \"react\";\n * import { useId } from \"react\";\n *\n * function Example(): ReactElement {\n *   const slider = useRangeSlider({\n *     // these are the defaults and can be changed\n *     min: 0,\n *     max: 100,\n *     step: 1,\n *     defaultValue: [0, 100],\n *   });\n *\n *   // if you need access to the current value or manually change the value\n *   // yourself.\n *   const { rangeValue, setRangeValue } = slider;\n *   const [minPrice, maxPrice] = rangeValue;\n *\n *   return (\n *     <Form>\n *       <Fieldset>\n *         <Legend>Price Range</Legend>\n *         <Slider {...slider} />\n *       </Fieldset>\n *     </Form>\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/slider | Slider Demos}\n * @since 2.5.0\n * @since 6.0.0 The `Slider` and `RangeSlider` have been combined into the\n * single `Slider` component and removed the `label` support.\n * @since 6.0.0 Each thumb includes an invisible `<input type=\"range\">` instead\n * of an `<input type=\"hidden\">`.\n */\nexport function Slider(props: LabelRequiredForA11y<SliderProps>): ReactElement;\nexport function Slider(props: RangeSliderProps): ReactElement;\nexport function Slider(\n  props: LabelRequiredForA11y<SliderProps> | RangeSliderProps\n): ReactElement {\n  const {\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    id: propId,\n    name,\n    min = 0,\n    max = 100,\n    step = 1,\n    jump: propJump,\n    vertical = false,\n    discrete = false,\n    disabled = false,\n    getValueText = emptyString,\n    children,\n    marks = false,\n    value,\n    setValue,\n    rangeValue,\n    setRangeValue,\n    trackProps,\n    thumbProps,\n    minThumbProps,\n    minThumbLabel,\n    minThumbLabelledBy,\n    maxThumbProps,\n    maxThumbLabel,\n    maxThumbLabelledBy,\n    tooltipProps,\n    containerRef,\n    getMarkProps = noop,\n    getMarkLabelProps = noop,\n    tooltipVisibility = \"auto\",\n    getTooltipProps = noop,\n    getTooltipChildren = identity,\n    disableSmoothDragging = !!marks,\n    ...remaining\n  } = props as SliderProps & RangeSliderProps;\n\n  const jump = getJumpValue({ min, max, step, jump: propJump });\n  const isRangeSlider = typeof value !== \"number\";\n\n  const thumb1Id = useEnsuredId(propId, \"slider\");\n  const thumb2Id = `${thumb1Id}-2`;\n  const thumb1Ref = useRef<HTMLSpanElement>(null);\n  const thumb2Ref = useRef<HTMLSpanElement>(null);\n  const { thumb1Name, thumb2Name } = getSliderInputName(name, isRangeSlider);\n\n  let thumb1Max = max;\n  let thumb2Min = min;\n  let thumb1Label: string | undefined;\n  let thumb1LabelledBy: string | undefined;\n  let thumb2Label: string | undefined;\n  let thumb2LabelledBy: string | undefined;\n  let thumb1Value: number;\n  let thumb2Value: number;\n  let setThumb1Value: UseStateSetter<number>;\n  let setThumb2Value: UseStateSetter<number>;\n  if (!isRangeSlider) {\n    thumb1Value = value;\n    setThumb1Value = setValue;\n    thumb2Value = max;\n    setThumb2Value = noop;\n    thumb1Label = ariaLabel;\n    thumb1LabelledBy = ariaLabelledBy;\n  } else {\n    thumb1LabelledBy = minThumbLabelledBy;\n    thumb1Label = minThumbLabel || (minThumbLabelledBy ? undefined : \"Min\");\n    thumb2LabelledBy = maxThumbLabelledBy;\n    thumb2Label = maxThumbLabel || (maxThumbLabelledBy ? undefined : \"Max\");\n\n    [thumb1Value, thumb2Value] = rangeValue;\n\n    thumb1Max = thumb2Value - step;\n    thumb2Min = thumb1Value + step;\n\n    setThumb1Value = (valueOrSetter) => {\n      setRangeValue((prevRangeValue) => {\n        const value =\n          typeof valueOrSetter === \"number\"\n            ? valueOrSetter\n            : valueOrSetter(prevRangeValue[0]);\n\n        return [value, prevRangeValue[1]];\n      });\n    };\n    setThumb2Value = (valueOrSetter) => {\n      setRangeValue((prevRangeValue) => {\n        const value =\n          typeof valueOrSetter === \"number\"\n            ? valueOrSetter\n            : valueOrSetter(prevRangeValue[1]);\n\n        return [prevRangeValue[0], value];\n      });\n    };\n  }\n\n  const {\n    onKeyDown: thumb1OnKeyDown,\n    onMouseUp: thumb1OnMouseUp,\n    onMouseDown: thumb1OnMouseDown,\n    onMouseMove: thumb1OnMouseMove,\n    onTouchStart: thumb1OnTouchStart,\n    onTouchMove: thumb1OnTouchMove,\n    dragPercentage: thumb1DragPercentage,\n    draggableRef: thumb1DraggableRef,\n    dragging: thumb1Dragging,\n  } = useSliderDraggable({\n    jump,\n    ref: thumb1Ref,\n    min,\n    max: thumb1Max,\n    rangeMax: max,\n    step,\n    value: thumb1Value,\n    setValue: setThumb1Value,\n    disabled,\n    vertical,\n  });\n\n  const {\n    onKeyDown: thumb2OnKeyDown,\n    onMouseUp: thumb2OnMouseUp,\n    onMouseDown: thumb2OnMouseDown,\n    onMouseMove: thumb2OnMouseMove,\n    onTouchStart: thumb2OnTouchStart,\n    onTouchMove: thumb2OnTouchMove,\n    dragPercentage: thumb2DragPercentage,\n    draggableRef: thumb2DraggableRef,\n    dragging: thumb2Dragging,\n  } = useSliderDraggable({\n    jump,\n    ref: thumb2Ref,\n    min: thumb2Min,\n    max,\n    rangeMin: min,\n    step,\n    value: thumb2Value,\n    setValue: setThumb2Value,\n    vertical,\n    disabled,\n  });\n\n  const dragging = thumb1Dragging || thumb2Dragging;\n  const sharedThumbProps = {\n    step,\n    animate: !dragging,\n    discrete,\n    disabled,\n    vertical,\n    getValueText,\n    tooltipProps,\n    getTooltipProps,\n    getTooltipChildren,\n    tooltipVisibility,\n    disableSmoothDragging,\n  } as const satisfies Partial<SliderThumbProps>;\n\n  return (\n    <SliderContainer {...remaining} ref={containerRef} vertical={vertical}>\n      <SliderTrack\n        {...trackProps}\n        min={min}\n        max={max}\n        thumb1Ref={thumb1Ref}\n        thumb1Value={thumb1Value}\n        thumb1Dragging={!disableSmoothDragging && thumb1Dragging}\n        thumb1DragPercentage={thumb1DragPercentage}\n        thumb1OnMouseUp={thumb1OnMouseUp}\n        thumb1OnMouseDown={thumb1OnMouseDown}\n        thumb1OnMouseMove={thumb1OnMouseMove}\n        thumb1OnTouchStart={thumb1OnTouchStart}\n        thumb1OnTouchMove={thumb1OnTouchMove}\n        thumb2Ref={thumb2Ref}\n        thumb2Value={thumb2Value}\n        thumb2Dragging={!disableSmoothDragging && thumb2Dragging}\n        thumb2DragPercentage={thumb2DragPercentage}\n        thumb2OnMouseUp={thumb2OnMouseUp}\n        thumb2OnMouseDown={thumb2OnMouseDown}\n        thumb2OnMouseMove={thumb2OnMouseMove}\n        thumb2OnTouchStart={thumb2OnTouchStart}\n        thumb2OnTouchMove={thumb2OnTouchMove}\n        animate={!disableSmoothDragging && !dragging}\n        disabled={disabled}\n        vertical={vertical}\n        isRangeSlider={isRangeSlider}\n      >\n        <SliderThumb\n          aria-label={thumb1Label as string}\n          aria-labelledby={thumb1LabelledBy}\n          id={thumb1Id}\n          name={thumb1Name}\n          {...thumbProps}\n          {...minThumbProps}\n          {...sharedThumbProps}\n          ref={thumb1DraggableRef}\n          min={min}\n          max={thumb1Max}\n          value={thumb1Value}\n          index={1}\n          active={thumb1Dragging}\n          onChange={(event) => {\n            setThumb1Value(event.currentTarget.valueAsNumber);\n          }}\n          onKeyDown={thumb1OnKeyDown}\n        />\n        {isRangeSlider && (\n          <SliderThumb\n            aria-label={thumb2Label as string}\n            aria-labelledby={thumb2LabelledBy}\n            id={thumb2Id}\n            name={thumb2Name}\n            {...maxThumbProps}\n            {...sharedThumbProps}\n            ref={thumb2DraggableRef}\n            min={thumb2Min}\n            max={max}\n            value={thumb2Value}\n            index={2}\n            active={thumb2Dragging}\n            onChange={(event) => {\n              setThumb2Value(event.currentTarget.valueAsNumber);\n            }}\n            onKeyDown={thumb2OnKeyDown}\n          />\n        )}\n        {marks && (\n          <SliderValueMarks\n            min={min}\n            max={max}\n            step={step}\n            marks={marks}\n            vertical={vertical}\n            thumb1Value={thumb1Value}\n            thumb2Value={thumb2Value}\n            isRangeSlider={isRangeSlider}\n            getMarkProps={getMarkProps}\n            getMarkLabelProps={getMarkLabelProps}\n          />\n        )}\n        {children}\n      </SliderTrack>\n    </SliderContainer>\n  );\n}\n"],"names":["useRef","useEnsuredId","identity","SliderContainer","SliderThumb","SliderTrack","SliderValueMarks","getJumpValue","getSliderInputName","useSliderDraggable","emptyString","noop","Slider","props","ariaLabel","ariaLabelledBy","id","propId","name","min","max","step","jump","propJump","vertical","discrete","disabled","getValueText","children","marks","value","setValue","rangeValue","setRangeValue","trackProps","thumbProps","minThumbProps","minThumbLabel","minThumbLabelledBy","maxThumbProps","maxThumbLabel","maxThumbLabelledBy","tooltipProps","containerRef","getMarkProps","getMarkLabelProps","tooltipVisibility","getTooltipProps","getTooltipChildren","disableSmoothDragging","remaining","isRangeSlider","thumb1Id","thumb2Id","thumb1Ref","thumb2Ref","thumb1Name","thumb2Name","thumb1Max","thumb2Min","thumb1Label","thumb1LabelledBy","thumb2Label","thumb2LabelledBy","thumb1Value","thumb2Value","setThumb1Value","setThumb2Value","undefined","valueOrSetter","prevRangeValue","onKeyDown","thumb1OnKeyDown","onMouseUp","thumb1OnMouseUp","onMouseDown","thumb1OnMouseDown","onMouseMove","thumb1OnMouseMove","onTouchStart","thumb1OnTouchStart","onTouchMove","thumb1OnTouchMove","dragPercentage","thumb1DragPercentage","draggableRef","thumb1DraggableRef","dragging","thumb1Dragging","ref","rangeMax","thumb2OnKeyDown","thumb2OnMouseUp","thumb2OnMouseDown","thumb2OnMouseMove","thumb2OnTouchStart","thumb2OnTouchMove","thumb2DragPercentage","thumb2DraggableRef","thumb2Dragging","rangeMin","sharedThumbProps","animate","aria-label","aria-labelledby","index","active","onChange","event","currentTarget","valueAsNumber"],"mappings":"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"}
+{"version":3,"sources":["../../src/form/Slider.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n  useRef,\n} from \"react\";\n\nimport { type TooltipProps } from \"../tooltip/Tooltip.js\";\nimport {\n  type LabelRequiredForA11y,\n  type PropsWithRef,\n  type UseStateSetter,\n} from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { identity } from \"../utils/identity.js\";\nimport { type SliderAddonProps, SliderContainer } from \"./SliderContainer.js\";\nimport {\n  type ConfigurableSliderThumbProps,\n  SliderThumb,\n  type SliderThumbPresentation,\n  type SliderThumbProps,\n} from \"./SliderThumb.js\";\nimport { SliderTrack } from \"./SliderTrack.js\";\nimport {\n  type SliderMarksOptions,\n  SliderValueMarks,\n} from \"./SliderValueMarks.js\";\nimport { getJumpValue, getSliderInputName } from \"./sliderUtils.js\";\nimport { type RangeSliderState } from \"./useRangeSlider.js\";\nimport { type SliderState, type SliderValueOptions } from \"./useSlider.js\";\nimport { useSliderDraggable } from \"./useSliderDraggable.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-slider-color\"?: string;\n    \"--rmd-slider-active-color\"?: string;\n    \"--rmd-slider-inactive-color\"?: string;\n    \"--rmd-slider-size\"?: string | number;\n    \"--rmd-slider-active-size\"?: string | number;\n    \"--rmd-slider-inactive-size\"?: string | number;\n    \"--rmd-slider-vertical-size\"?: string | number;\n    \"--rmd-slider-offset-1\"?: string;\n    \"--rmd-slider-offset-2\"?: string;\n    \"--rmd-slider-tooltip-scale\"?: string | number;\n    \"--rmd-slider-tooltip-translate\"?: string | number;\n    \"--rmd-slider-mark-offset\"?: string;\n  }\n}\n\nconst emptyString = (): string => \"\";\nconst noop = (): undefined => {\n  // do nothing\n};\n\n/**\n * @since 2.5.0\n */\nexport interface BaseSliderProps\n  extends HTMLAttributes<HTMLDivElement>,\n    SliderThumbPresentation,\n    SliderValueOptions,\n    SliderAddonProps,\n    SliderMarksOptions {\n  /**\n   * This can be used to apply a ref to the container element since this\n   * component does not use `forwardRef`.\n   */\n  containerRef?: Ref<HTMLDivElement>;\n\n  /**\n   * The amount to jump the slider's value when the `PageUp` or `PageDown`\n   * key is pressed.\n   *\n   * The default value is 1/10th of the range.\n   *\n   * @defaultValue `(numberOfSteps / 10) * step`\n   */\n  jump?: number;\n\n  /** @defaultValue `false` */\n  disabled?: boolean;\n\n  /** @defaultValue `false` */\n  vertical?: boolean;\n\n  /**\n   * This can be used to apply custom styles or a `ref` to the track element if\n   * needed.\n   */\n  trackProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n  /**\n   * This can be used to configure any additional tooltip props like the\n   * CSS transition `classNames`, styles, etc.\n   *\n   * This will only be used when {@link discrete} is `true`.\n   *\n   * Note: The `position` will always be `\"above\"` for horizontal sliders and\n   * `\"left\"` for vertical sliders.\n   */\n  tooltipProps?: Omit<Partial<TooltipProps>, \"position\">;\n}\n\n/**\n * @since 2.5.0\n * @since 6.0.0 Only requires `value` and `setValue` props instead of all the\n * slider controls.\n * @since 6.0.0 The `thumbLabel` and `thumbLabelledBy` props were removed. Use\n * the `aria-label` or `aria-labelledby` props instead.\n * @since 6.0.0 The `baseId` prop was removed in favor of `id` or `*Props.id`\n */\nexport interface SliderProps extends BaseSliderProps, SliderState {\n  /**\n   * Convenience pass-through prop to {@link ConfigurableSliderThumbProps.name} which\n   * will be applied to the hidden `<input type=\"range\" />`\n   */\n  name?: string;\n\n  /**\n   * Any additional props that should be provided to the thumb element. This can\n   * be useful for applying additional styling.\n   */\n  thumbProps?: ConfigurableSliderThumbProps;\n\n  /**\n   * This can be used to update the discrete slider's tooltip props.\n   *\n   * @example Custom Styles\n   * ```tsx\n   * <Slider\n   *   {...slider}\n   *   discrete\n   *   getTooltipProps={(value) => ({\n   *     className: cssUtils({\n   *       backgroundColor: value < 30 ? \"warning\" : undefined,\n   *     }),\n   *   })}\n   * />\n   * ```\n   */\n  getTooltipProps?: (value: number) => Partial<TooltipProps> | undefined;\n\n  /**\n   * This can be used to update the discrete slider's value tooltip.\n   *\n   * @example More Value Information\n   * ```tsx\n   * <Slider\n   *   {...slider}\n   *   discrete\n   *   getTooltipChildren={(value) => (\n   *     <TextIconSpacing icon={<FavoriteIcon />}>\n   *       {value}\n   *     </TextIconSpacing>\n   *   )}\n   * />\n   * ```\n   *\n   * This will only be used when {@link discrete} is `true`.\n   *\n   * @defaultValue `(value) => value`\n   */\n  getTooltipChildren?: (value: number) => ReactNode;\n}\n\n/**\n * @since 2.5.0\n * @since 6.0.0 Only requires `rangeValue` and `setRangeValue` props instead of\n * all the slider controls.\n * @since 6.0.0 The `thumb1Label`, `thumb1LabelledBy`, `thumb1Props`,\n * `thumb2Label`, `thumb2LabelledBy` and `thumb2Props` were renamed to\n * `minThumbLabel`, `minThumbLabelledBy`, `minThumbProps`, `maxThumbLabel`,\n * `maxThumbLabelledBy`, and `maxThumbProps` respectively.\n */\nexport interface RangeSliderProps extends BaseSliderProps, RangeSliderState {\n  /**\n   * Convenience pass-through prop for {@link\n   * ConfigurableSliderThumbProps.name} for both the {@link minThumbProps} and\n   * {@link maxThumbProps}.\n   */\n  name?: string;\n\n  /**\n   * Any additional props that should be provided to the min value thumb\n   * element. This can be useful for applying additional styling.\n   */\n  minThumbProps?: ConfigurableSliderThumbProps;\n\n  /**\n   * Any additional props that should be provided to the max value thumb\n   * element. This can be useful for applying additional styling.\n   */\n  maxThumbProps?: ConfigurableSliderThumbProps;\n\n  /**\n   * The `aria-label` to apply to the min value.\n   *\n   * Note: Either this prop or the {@link minThumbLabelledBy} are required for\n   * accessibility.\n   *\n   * @defaultValue `\"Min\"`\n   */\n  minThumbLabel?: string;\n\n  /**\n   * Set this to an element's id that labels the min value.\n   *\n   * Note: Either this prop or the {@link minThumbLabel} are required for\n   * accessibility.\n   */\n  minThumbLabelledBy?: string;\n\n  /**\n   * The `aria-label` to apply to the max value.\n   *\n   * Note: Either this prop or the {@link maxThumbLabelledBy} are required for\n   * accessibility.\n   *\n   * @defaultValue `\"Max\"`\n   */\n  maxThumbLabel?: string;\n\n  /**\n   * Set this to an element's id that labels the max value.\n   *\n   * Note: Either this prop or the {@link maxThumbLabel} are required for\n   * accessibility.\n   */\n  maxThumbLabelledBy?: string;\n\n  /**\n   * This can be used to update the discrete slider's tooltip props.\n   *\n   * @example Custom Styles\n   * ```tsx\n   * <Slider\n   *   {...slider}\n   *   discrete\n   *   getTooltipProps={(value, isFirstThumb) => ({\n   *     className: cssUtils({\n   *       backgroundColor: value < 30 && isFirstThumb ? \"warning\" : undefined,\n   *     }),\n   *   })}\n   * />\n   * ```\n   */\n  getTooltipProps?: (\n    value: number,\n    isFirstThumb: boolean\n  ) => Partial<TooltipProps>;\n\n  /**\n   * This can be used to update the discrete slider's value tooltip.\n   *\n   * @example More Value Information\n   * ```tsx\n   * <Slider\n   *   {...rangeSlider}\n   *   discrete\n   *   getTooltipChildren={(value, isFirstThumb) => (\n   *     <TextIconSpacing\n   *       icon={isFirstThumb ? <FavoriteIcon /> : <CloseIcon /}\n   *       iconAfter={!isFirstValue}\n   *     >\n   *       {value}\n   *     </TextIconSpacing>\n   *   )}\n   * />\n   * ```\n   *\n   * This will only be used when {@link discrete} is `true`.\n   *\n   * @defaultValue `(value) => value`\n   */\n  getTooltipChildren?: (value: number, isFirstThumb: boolean) => ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Slider } from \"@react-md/core/form/Slider\";\n * import { useSlider } from \"@react-md/core/form/useSlider\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const slider = useSlider({\n *     // these are the defaults and can be changed\n *     min: 0,\n *     max: 100,\n *     step: 1,\n *     defaultValue: 50,\n *   });\n *\n *   // if you need access to the current value or manually change the value\n *   // yourself.\n *   const { value, setValue } = slider;\n *\n *   return (\n *     <Form>\n *       <Slider {...slider} aria-label=\"Volume\" />\n *     </Form>\n *   );\n * }\n * ```\n *\n * @example Range Slider Example\n * ```tsx\n * import { Fieldset } from \"@react-md/core/form/Fieldset\";\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Legend } from \"@react-md/core/form/Legend\";\n * import { Slider } from \"@react-md/core/form/Slider\";\n * import { useRangeSlider } from \"@react-md/core/form/useRangeSlider\";\n * import type { ReactElement } from \"react\";\n * import { useId } from \"react\";\n *\n * function Example(): ReactElement {\n *   const slider = useRangeSlider({\n *     // these are the defaults and can be changed\n *     min: 0,\n *     max: 100,\n *     step: 1,\n *     defaultValue: [0, 100],\n *   });\n *\n *   // if you need access to the current value or manually change the value\n *   // yourself.\n *   const { rangeValue, setRangeValue } = slider;\n *   const [minPrice, maxPrice] = rangeValue;\n *\n *   return (\n *     <Form>\n *       <Fieldset>\n *         <Legend>Price Range</Legend>\n *         <Slider {...slider} />\n *       </Fieldset>\n *     </Form>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/slider | Slider Demos}\n * @since 2.5.0\n * @since 6.0.0 The `Slider` and `RangeSlider` have been combined into the\n * single `Slider` component and removed the `label` support.\n * @since 6.0.0 Each thumb includes an invisible `<input type=\"range\">` instead\n * of an `<input type=\"hidden\">`.\n */\nexport function Slider(props: LabelRequiredForA11y<SliderProps>): ReactElement;\nexport function Slider(props: RangeSliderProps): ReactElement;\nexport function Slider(\n  props: LabelRequiredForA11y<SliderProps> | RangeSliderProps\n): ReactElement {\n  const {\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    id: propId,\n    name,\n    min = 0,\n    max = 100,\n    step = 1,\n    jump: propJump,\n    vertical = false,\n    discrete = false,\n    disabled = false,\n    getValueText = emptyString,\n    children,\n    marks = false,\n    value,\n    setValue,\n    rangeValue,\n    setRangeValue,\n    trackProps,\n    thumbProps,\n    minThumbProps,\n    minThumbLabel,\n    minThumbLabelledBy,\n    maxThumbProps,\n    maxThumbLabel,\n    maxThumbLabelledBy,\n    tooltipProps,\n    containerRef,\n    getMarkProps = noop,\n    getMarkLabelProps = noop,\n    tooltipVisibility = \"auto\",\n    getTooltipProps = noop,\n    getTooltipChildren = identity,\n    disableSmoothDragging = !!marks,\n    ...remaining\n  } = props as SliderProps & RangeSliderProps;\n\n  const jump = getJumpValue({ min, max, step, jump: propJump });\n  const isRangeSlider = typeof value !== \"number\";\n\n  const thumb1Id = useEnsuredId(propId, \"slider\");\n  const thumb2Id = `${thumb1Id}-2`;\n  const thumb1Ref = useRef<HTMLSpanElement>(null);\n  const thumb2Ref = useRef<HTMLSpanElement>(null);\n  const { thumb1Name, thumb2Name } = getSliderInputName(name, isRangeSlider);\n\n  let thumb1Max = max;\n  let thumb2Min = min;\n  let thumb1Label: string | undefined;\n  let thumb1LabelledBy: string | undefined;\n  let thumb2Label: string | undefined;\n  let thumb2LabelledBy: string | undefined;\n  let thumb1Value: number;\n  let thumb2Value: number;\n  let setThumb1Value: UseStateSetter<number>;\n  let setThumb2Value: UseStateSetter<number>;\n  if (!isRangeSlider) {\n    thumb1Value = value;\n    setThumb1Value = setValue;\n    thumb2Value = max;\n    setThumb2Value = noop;\n    thumb1Label = ariaLabel;\n    thumb1LabelledBy = ariaLabelledBy;\n  } else {\n    thumb1LabelledBy = minThumbLabelledBy;\n    thumb1Label = minThumbLabel || (minThumbLabelledBy ? undefined : \"Min\");\n    thumb2LabelledBy = maxThumbLabelledBy;\n    thumb2Label = maxThumbLabel || (maxThumbLabelledBy ? undefined : \"Max\");\n\n    [thumb1Value, thumb2Value] = rangeValue;\n\n    thumb1Max = thumb2Value - step;\n    thumb2Min = thumb1Value + step;\n\n    setThumb1Value = (valueOrSetter) => {\n      setRangeValue((prevRangeValue) => {\n        const value =\n          typeof valueOrSetter === \"number\"\n            ? valueOrSetter\n            : valueOrSetter(prevRangeValue[0]);\n\n        return [value, prevRangeValue[1]];\n      });\n    };\n    setThumb2Value = (valueOrSetter) => {\n      setRangeValue((prevRangeValue) => {\n        const value =\n          typeof valueOrSetter === \"number\"\n            ? valueOrSetter\n            : valueOrSetter(prevRangeValue[1]);\n\n        return [prevRangeValue[0], value];\n      });\n    };\n  }\n\n  const {\n    onKeyDown: thumb1OnKeyDown,\n    onMouseUp: thumb1OnMouseUp,\n    onMouseDown: thumb1OnMouseDown,\n    onMouseMove: thumb1OnMouseMove,\n    onTouchStart: thumb1OnTouchStart,\n    onTouchMove: thumb1OnTouchMove,\n    dragPercentage: thumb1DragPercentage,\n    draggableRef: thumb1DraggableRef,\n    dragging: thumb1Dragging,\n  } = useSliderDraggable({\n    jump,\n    ref: thumb1Ref,\n    min,\n    max: thumb1Max,\n    rangeMax: max,\n    step,\n    value: thumb1Value,\n    setValue: setThumb1Value,\n    disabled,\n    vertical,\n  });\n\n  const {\n    onKeyDown: thumb2OnKeyDown,\n    onMouseUp: thumb2OnMouseUp,\n    onMouseDown: thumb2OnMouseDown,\n    onMouseMove: thumb2OnMouseMove,\n    onTouchStart: thumb2OnTouchStart,\n    onTouchMove: thumb2OnTouchMove,\n    dragPercentage: thumb2DragPercentage,\n    draggableRef: thumb2DraggableRef,\n    dragging: thumb2Dragging,\n  } = useSliderDraggable({\n    jump,\n    ref: thumb2Ref,\n    min: thumb2Min,\n    max,\n    rangeMin: min,\n    step,\n    value: thumb2Value,\n    setValue: setThumb2Value,\n    vertical,\n    disabled,\n  });\n\n  const dragging = thumb1Dragging || thumb2Dragging;\n  const sharedThumbProps = {\n    step,\n    animate: !dragging,\n    discrete,\n    disabled,\n    vertical,\n    getValueText,\n    tooltipProps,\n    getTooltipProps,\n    getTooltipChildren,\n    tooltipVisibility,\n    disableSmoothDragging,\n  } as const satisfies Partial<SliderThumbProps>;\n\n  return (\n    <SliderContainer {...remaining} ref={containerRef} vertical={vertical}>\n      <SliderTrack\n        {...trackProps}\n        min={min}\n        max={max}\n        thumb1Ref={thumb1Ref}\n        thumb1Value={thumb1Value}\n        thumb1Dragging={!disableSmoothDragging && thumb1Dragging}\n        thumb1DragPercentage={thumb1DragPercentage}\n        thumb1OnMouseUp={thumb1OnMouseUp}\n        thumb1OnMouseDown={thumb1OnMouseDown}\n        thumb1OnMouseMove={thumb1OnMouseMove}\n        thumb1OnTouchStart={thumb1OnTouchStart}\n        thumb1OnTouchMove={thumb1OnTouchMove}\n        thumb2Ref={thumb2Ref}\n        thumb2Value={thumb2Value}\n        thumb2Dragging={!disableSmoothDragging && thumb2Dragging}\n        thumb2DragPercentage={thumb2DragPercentage}\n        thumb2OnMouseUp={thumb2OnMouseUp}\n        thumb2OnMouseDown={thumb2OnMouseDown}\n        thumb2OnMouseMove={thumb2OnMouseMove}\n        thumb2OnTouchStart={thumb2OnTouchStart}\n        thumb2OnTouchMove={thumb2OnTouchMove}\n        animate={!disableSmoothDragging && !dragging}\n        disabled={disabled}\n        vertical={vertical}\n        isRangeSlider={isRangeSlider}\n      >\n        <SliderThumb\n          aria-label={thumb1Label as string}\n          aria-labelledby={thumb1LabelledBy}\n          id={thumb1Id}\n          name={thumb1Name}\n          {...thumbProps}\n          {...minThumbProps}\n          {...sharedThumbProps}\n          ref={thumb1DraggableRef}\n          min={min}\n          max={thumb1Max}\n          value={thumb1Value}\n          index={1}\n          active={thumb1Dragging}\n          onChange={(event) => {\n            setThumb1Value(event.currentTarget.valueAsNumber);\n          }}\n          onKeyDown={thumb1OnKeyDown}\n        />\n        {isRangeSlider && (\n          <SliderThumb\n            aria-label={thumb2Label as string}\n            aria-labelledby={thumb2LabelledBy}\n            id={thumb2Id}\n            name={thumb2Name}\n            {...maxThumbProps}\n            {...sharedThumbProps}\n            ref={thumb2DraggableRef}\n            min={thumb2Min}\n            max={max}\n            value={thumb2Value}\n            index={2}\n            active={thumb2Dragging}\n            onChange={(event) => {\n              setThumb2Value(event.currentTarget.valueAsNumber);\n            }}\n            onKeyDown={thumb2OnKeyDown}\n          />\n        )}\n        {marks && (\n          <SliderValueMarks\n            min={min}\n            max={max}\n            step={step}\n            marks={marks}\n            vertical={vertical}\n            thumb1Value={thumb1Value}\n            thumb2Value={thumb2Value}\n            isRangeSlider={isRangeSlider}\n            getMarkProps={getMarkProps}\n            getMarkLabelProps={getMarkLabelProps}\n          />\n        )}\n        {children}\n      </SliderTrack>\n    </SliderContainer>\n  );\n}\n"],"names":["useRef","useEnsuredId","identity","SliderContainer","SliderThumb","SliderTrack","SliderValueMarks","getJumpValue","getSliderInputName","useSliderDraggable","emptyString","noop","Slider","props","ariaLabel","ariaLabelledBy","id","propId","name","min","max","step","jump","propJump","vertical","discrete","disabled","getValueText","children","marks","value","setValue","rangeValue","setRangeValue","trackProps","thumbProps","minThumbProps","minThumbLabel","minThumbLabelledBy","maxThumbProps","maxThumbLabel","maxThumbLabelledBy","tooltipProps","containerRef","getMarkProps","getMarkLabelProps","tooltipVisibility","getTooltipProps","getTooltipChildren","disableSmoothDragging","remaining","isRangeSlider","thumb1Id","thumb2Id","thumb1Ref","thumb2Ref","thumb1Name","thumb2Name","thumb1Max","thumb2Min","thumb1Label","thumb1LabelledBy","thumb2Label","thumb2LabelledBy","thumb1Value","thumb2Value","setThumb1Value","setThumb2Value","undefined","valueOrSetter","prevRangeValue","onKeyDown","thumb1OnKeyDown","onMouseUp","thumb1OnMouseUp","onMouseDown","thumb1OnMouseDown","onMouseMove","thumb1OnMouseMove","onTouchStart","thumb1OnTouchStart","onTouchMove","thumb1OnTouchMove","dragPercentage","thumb1DragPercentage","draggableRef","thumb1DraggableRef","dragging","thumb1Dragging","ref","rangeMax","thumb2OnKeyDown","thumb2OnMouseUp","thumb2OnMouseDown","thumb2OnMouseMove","thumb2OnTouchStart","thumb2OnTouchMove","thumb2DragPercentage","thumb2DraggableRef","thumb2Dragging","rangeMin","sharedThumbProps","animate","aria-label","aria-labelledby","index","active","onChange","event","currentTarget","valueAsNumber"],"mappings":"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"}

package/dist/form/Switch.d.ts

@@ -46,7 +46,7 @@ export interface SwitchProps extends InputHTMLAttributes<HTMLInputElement>, Inpu
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/switch | Switch Demos}
+ * @see {@link https://react-md.dev/components/switch | Switch Demos}
  * @since 6.0.0 Added support for `FormMessage` behavior.
  */
 export declare const Switch: import("react").ForwardRefExoticComponent<SwitchProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/form/Switch.js

@@ -30,7 +30,7 @@ import { switchStyles } from "./switchStyles.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/switch | Switch Demos}
+ * @see {@link https://react-md.dev/components/switch | Switch Demos}
  * @since 6.0.0 Added support for `FormMessage` behavior.
  */ export const Switch = /*#__PURE__*/ forwardRef(function Switch(props, ref) {
     const { id: propId, label, labelProps, style, className, containerProps, ballProps, ballStyle, ballClassName, ballAddon, trackProps, trackStyle, trackClassName, messageProps, messageContainerProps, disableLabelGap = false, error = false, active = false, stacked = false, iconAfter = false, disabled = false, readOnly = false, ...remaining } = props;

package/dist/form/Switch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Switch.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport {\n  type CSSProperties,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type ReactNode,\n  forwardRef,\n} from \"react\";\n\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageContainer } from \"./FormMessageContainer.js\";\nimport { type InputToggleLabelProps } from \"./InputToggle.js\";\nimport { Label } from \"./Label.js\";\nimport { SwitchTrack } from \"./SwitchTrack.js\";\nimport { switchStyles } from \"./switchStyles.js\";\nimport {\n  type FormComponentStates,\n  type FormMessageContainerExtension,\n} from \"./types.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-switch-track-background-color\"?: string;\n    \"--rmd-switch-ball-background-color\"?: string;\n  }\n}\n\n/**\n * @since 6.0.0 Added `containerProps` and support for the\n * `FormMessage` behavior.\n */\nexport interface SwitchProps\n  extends InputHTMLAttributes<HTMLInputElement>,\n    InputToggleLabelProps,\n    FormMessageContainerExtension,\n    FormComponentStates {\n  containerProps?: PropsWithRef<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;\n  trackProps?: PropsWithRef<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;\n  trackStyle?: CSSProperties;\n  trackClassName?: string;\n  ballAddon?: ReactNode;\n  ballProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n  ballStyle?: CSSProperties;\n  ballClassName?: string;\n}\n\n/**\n * @example Simple Example\n * ```tsx\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Switch } from \"@react-md/core/form/Switch\";\n * import type { ReactElement } from \"react\";\n * import { useState } from \"react\";\n *\n * function Example(): ReactElement {\n *   const [checked, setChecked] = useState(false);\n *\n *   return (\n *     <Form>\n *       <Switch\n *         label=\"Label\"\n *         name=\"enabled\"\n *         checked={checked}\n *         onChange={(event) => setChecked(event.currentTarget.checked)}\n *       />\n *     </Form>\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/switch | Switch Demos}\n * @since 6.0.0 Added support for `FormMessage` behavior.\n */\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n  function Switch(props, ref) {\n    const {\n      id: propId,\n      label,\n      labelProps,\n      style,\n      className,\n      containerProps,\n      ballProps,\n      ballStyle,\n      ballClassName,\n      ballAddon,\n      trackProps,\n      trackStyle,\n      trackClassName,\n      messageProps,\n      messageContainerProps,\n      disableLabelGap = false,\n      error = false,\n      active = false,\n      stacked = false,\n      iconAfter = false,\n      disabled = false,\n      readOnly = false,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"switch\");\n\n    return (\n      <FormMessageContainer\n        {...messageContainerProps}\n        messageProps={messageProps}\n      >\n        <Label\n          style={style}\n          {...labelProps}\n          className={cnb(className, labelProps?.className)}\n          gap={!disableLabelGap}\n          stacked={stacked}\n          reversed={!iconAfter}\n          active={active}\n          error={error}\n          disabled={disabled}\n        >\n          {label}\n          <div\n            {...containerProps}\n            className={switchStyles({\n              clickable: !disabled && !readOnly,\n              className: containerProps?.className,\n              currentColor: active || error,\n            })}\n          >\n            <SwitchTrack\n              style={trackStyle}\n              {...trackProps}\n              className={cnb(trackClassName, trackProps?.className)}\n              disabled={disabled}\n              ballAddon={ballAddon}\n              ballProps={ballProps}\n              ballStyle={ballStyle}\n              ballClassName={ballClassName}\n            >\n              <input\n                {...remaining}\n                id={id}\n                ref={ref}\n                role=\"switch\"\n                type=\"checkbox\"\n                className={cnb(\n                  \"rmd-switch__input rmd-hidden-input\",\n                  disabled && \"rmd-hidden-input--disabled\"\n                )}\n                disabled={disabled}\n              />\n            </SwitchTrack>\n          </div>\n        </Label>\n      </FormMessageContainer>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","useEnsuredId","FormMessageContainer","Label","SwitchTrack","switchStyles","Switch","props","ref","id","propId","label","labelProps","style","className","containerProps","ballProps","ballStyle","ballClassName","ballAddon","trackProps","trackStyle","trackClassName","messageProps","messageContainerProps","disableLabelGap","error","active","stacked","iconAfter","disabled","readOnly","remaining","gap","reversed","div","clickable","currentColor","input","role","type"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAKEC,UAAU,QACL,QAAQ;AAGf,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,4BAA4B;AAEjE,SAASC,KAAK,QAAQ,aAAa;AACnC,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,YAAY,QAAQ,oBAAoB;AAgCjD;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BC,GACD,OAAO,MAAMC,uBAASN,WACpB,SAASM,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EACJC,IAAIC,MAAM,EACVC,KAAK,EACLC,UAAU,EACVC,KAAK,EACLC,SAAS,EACTC,cAAc,EACdC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,cAAc,EACdC,YAAY,EACZC,qBAAqB,EACrBC,kBAAkB,KAAK,EACvBC,QAAQ,KAAK,EACbC,SAAS,KAAK,EACdC,UAAU,KAAK,EACfC,YAAY,KAAK,EACjBC,WAAW,KAAK,EAChBC,WAAW,KAAK,EAChB,GAAGC,WACJ,GAAGzB;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAEhC,qBACE,KAACR;QACE,GAAGsB,qBAAqB;QACzBD,cAAcA;kBAEd,cAAA,MAACpB;YACCU,OAAOA;YACN,GAAGD,UAAU;YACdE,WAAWf,IAAIe,WAAWF,YAAYE;YACtCmB,KAAK,CAACR;YACNG,SAASA;YACTM,UAAU,CAACL;YACXF,QAAQA;YACRD,OAAOA;YACPI,UAAUA;;gBAETnB;8BACD,KAACwB;oBACE,GAAGpB,cAAc;oBAClBD,WAAWT,aAAa;wBACtB+B,WAAW,CAACN,YAAY,CAACC;wBACzBjB,WAAWC,gBAAgBD;wBAC3BuB,cAAcV,UAAUD;oBAC1B;8BAEA,cAAA,KAACtB;wBACCS,OAAOQ;wBACN,GAAGD,UAAU;wBACdN,WAAWf,IAAIuB,gBAAgBF,YAAYN;wBAC3CgB,UAAUA;wBACVX,WAAWA;wBACXH,WAAWA;wBACXC,WAAWA;wBACXC,eAAeA;kCAEf,cAAA,KAACoB;4BACE,GAAGN,SAAS;4BACbvB,IAAIA;4BACJD,KAAKA;4BACL+B,MAAK;4BACLC,MAAK;4BACL1B,WAAWf,IACT,sCACA+B,YAAY;4BAEdA,UAAUA;;;;;;;AAOxB,GACA"}
+{"version":3,"sources":["../../src/form/Switch.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport {\n  type CSSProperties,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type ReactNode,\n  forwardRef,\n} from \"react\";\n\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageContainer } from \"./FormMessageContainer.js\";\nimport { type InputToggleLabelProps } from \"./InputToggle.js\";\nimport { Label } from \"./Label.js\";\nimport { SwitchTrack } from \"./SwitchTrack.js\";\nimport { switchStyles } from \"./switchStyles.js\";\nimport {\n  type FormComponentStates,\n  type FormMessageContainerExtension,\n} from \"./types.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-switch-track-background-color\"?: string;\n    \"--rmd-switch-ball-background-color\"?: string;\n  }\n}\n\n/**\n * @since 6.0.0 Added `containerProps` and support for the\n * `FormMessage` behavior.\n */\nexport interface SwitchProps\n  extends InputHTMLAttributes<HTMLInputElement>,\n    InputToggleLabelProps,\n    FormMessageContainerExtension,\n    FormComponentStates {\n  containerProps?: PropsWithRef<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;\n  trackProps?: PropsWithRef<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;\n  trackStyle?: CSSProperties;\n  trackClassName?: string;\n  ballAddon?: ReactNode;\n  ballProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n  ballStyle?: CSSProperties;\n  ballClassName?: string;\n}\n\n/**\n * @example Simple Example\n * ```tsx\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Switch } from \"@react-md/core/form/Switch\";\n * import type { ReactElement } from \"react\";\n * import { useState } from \"react\";\n *\n * function Example(): ReactElement {\n *   const [checked, setChecked] = useState(false);\n *\n *   return (\n *     <Form>\n *       <Switch\n *         label=\"Label\"\n *         name=\"enabled\"\n *         checked={checked}\n *         onChange={(event) => setChecked(event.currentTarget.checked)}\n *       />\n *     </Form>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/switch | Switch Demos}\n * @since 6.0.0 Added support for `FormMessage` behavior.\n */\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n  function Switch(props, ref) {\n    const {\n      id: propId,\n      label,\n      labelProps,\n      style,\n      className,\n      containerProps,\n      ballProps,\n      ballStyle,\n      ballClassName,\n      ballAddon,\n      trackProps,\n      trackStyle,\n      trackClassName,\n      messageProps,\n      messageContainerProps,\n      disableLabelGap = false,\n      error = false,\n      active = false,\n      stacked = false,\n      iconAfter = false,\n      disabled = false,\n      readOnly = false,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"switch\");\n\n    return (\n      <FormMessageContainer\n        {...messageContainerProps}\n        messageProps={messageProps}\n      >\n        <Label\n          style={style}\n          {...labelProps}\n          className={cnb(className, labelProps?.className)}\n          gap={!disableLabelGap}\n          stacked={stacked}\n          reversed={!iconAfter}\n          active={active}\n          error={error}\n          disabled={disabled}\n        >\n          {label}\n          <div\n            {...containerProps}\n            className={switchStyles({\n              clickable: !disabled && !readOnly,\n              className: containerProps?.className,\n              currentColor: active || error,\n            })}\n          >\n            <SwitchTrack\n              style={trackStyle}\n              {...trackProps}\n              className={cnb(trackClassName, trackProps?.className)}\n              disabled={disabled}\n              ballAddon={ballAddon}\n              ballProps={ballProps}\n              ballStyle={ballStyle}\n              ballClassName={ballClassName}\n            >\n              <input\n                {...remaining}\n                id={id}\n                ref={ref}\n                role=\"switch\"\n                type=\"checkbox\"\n                className={cnb(\n                  \"rmd-switch__input rmd-hidden-input\",\n                  disabled && \"rmd-hidden-input--disabled\"\n                )}\n                disabled={disabled}\n              />\n            </SwitchTrack>\n          </div>\n        </Label>\n      </FormMessageContainer>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","useEnsuredId","FormMessageContainer","Label","SwitchTrack","switchStyles","Switch","props","ref","id","propId","label","labelProps","style","className","containerProps","ballProps","ballStyle","ballClassName","ballAddon","trackProps","trackStyle","trackClassName","messageProps","messageContainerProps","disableLabelGap","error","active","stacked","iconAfter","disabled","readOnly","remaining","gap","reversed","div","clickable","currentColor","input","role","type"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAKEC,UAAU,QACL,QAAQ;AAGf,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,4BAA4B;AAEjE,SAASC,KAAK,QAAQ,aAAa;AACnC,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,YAAY,QAAQ,oBAAoB;AAgCjD;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BC,GACD,OAAO,MAAMC,uBAASN,WACpB,SAASM,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EACJC,IAAIC,MAAM,EACVC,KAAK,EACLC,UAAU,EACVC,KAAK,EACLC,SAAS,EACTC,cAAc,EACdC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,cAAc,EACdC,YAAY,EACZC,qBAAqB,EACrBC,kBAAkB,KAAK,EACvBC,QAAQ,KAAK,EACbC,SAAS,KAAK,EACdC,UAAU,KAAK,EACfC,YAAY,KAAK,EACjBC,WAAW,KAAK,EAChBC,WAAW,KAAK,EAChB,GAAGC,WACJ,GAAGzB;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAEhC,qBACE,KAACR;QACE,GAAGsB,qBAAqB;QACzBD,cAAcA;kBAEd,cAAA,MAACpB;YACCU,OAAOA;YACN,GAAGD,UAAU;YACdE,WAAWf,IAAIe,WAAWF,YAAYE;YACtCmB,KAAK,CAACR;YACNG,SAASA;YACTM,UAAU,CAACL;YACXF,QAAQA;YACRD,OAAOA;YACPI,UAAUA;;gBAETnB;8BACD,KAACwB;oBACE,GAAGpB,cAAc;oBAClBD,WAAWT,aAAa;wBACtB+B,WAAW,CAACN,YAAY,CAACC;wBACzBjB,WAAWC,gBAAgBD;wBAC3BuB,cAAcV,UAAUD;oBAC1B;8BAEA,cAAA,KAACtB;wBACCS,OAAOQ;wBACN,GAAGD,UAAU;wBACdN,WAAWf,IAAIuB,gBAAgBF,YAAYN;wBAC3CgB,UAAUA;wBACVX,WAAWA;wBACXH,WAAWA;wBACXC,WAAWA;wBACXC,eAAeA;kCAEf,cAAA,KAACoB;4BACE,GAAGN,SAAS;4BACbvB,IAAIA;4BACJD,KAAKA;4BACL+B,MAAK;4BACLC,MAAK;4BACL1B,WAAWf,IACT,sCACA+B,YAAY;4BAEdA,UAAUA;;;;;;;AAOxB,GACA"}

package/dist/form/TextArea.d.ts

@@ -87,6 +87,6 @@ export interface TextAreaProps extends FormFieldOptions, TextareaHTMLAttributes<
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/text-field#simple-textarea | TextArea Demos}
+ * @see {@link https://react-md.dev/components/text-field#simple-textarea | TextArea Demos}
  */
 export declare const TextArea: import("react").ForwardRefExoticComponent<TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/form/TextArea.js

@@ -28,7 +28,7 @@ import { useResizingTextArea } from "./useResizingTextArea.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/text-field#simple-textarea | TextArea Demos}
+ * @see {@link https://react-md.dev/components/text-field#simple-textarea | TextArea Demos}
  */ export const TextArea = /*#__PURE__*/ forwardRef(function TextArea(props, ref) {
     const { id: propId, style, className, label, labelProps, labelStyle, labelClassName, areaStyle, areaClassName, resizeContainerProps, resize = "auto", dense, error, active, inline: propInline, leftAddon, rightAddon, disableLeftAddonStyles, disableRightAddonStyles, theme: propTheme, underlineDirection: propUnderlineDirection, messageProps, messageContainerProps, containerProps, rows = 2, maxRows = -1, onChange: propOnChange, disableTransition: propDisableTransition, ...remaining } = props;
     const { disabled = false, readOnly = false, value, defaultValue } = props;
@@ -109,7 +109,7 @@ import { useResizingTextArea } from "./useResizingTextArea.js";
                 "--rmd-text-area-height": height
             },
             className: textAreaContainer({
-                animate: !disableTransition && resize == "auto",
+                animate: !disableTransition && resize === "auto",
                 disabled,
                 height: !!height,
                 underlineLabelled: !!label && (theme === "underline" || theme === "filled"),