@react-md/core 1.0.0-next.20 → 1.0.0-next.21

package/dist/icon/_icon.scss

@@ -1,173 +1,183 @@
+////
+/// @group icon
+////
+
 @use "sass:color";
 @use "../theme/theme";
 @use "../transition/transition";
 @use "../utils";
 
-// Set to `true` to disable the font icon styles. You normally want to only have
-// one icon type enabled.
-//
-// @example Font Icons Only
-// ```scss
-// @use "@react-md/core" with (
-//   $disable-svg: true,
-//   $disable-symbol: true
-// );
-// ```
-// @type boolean
+/// Set to `true` to disable the font icon styles. You normally want to only have
+/// one icon type enabled.
+///
+/// @example scss - Font Icons Only<!-- no-compile -->
+///   @use "@react-md/core" with (
+///     $disable-svg: true,
+///     $disable-symbol: true
+///   );
+///
+/// @type Boolean
 $disable-font: false !default;
 
-// Set to `true` to disable the svg icon styles. You normally want to only have
-// one icon type enabled.
-//
-// @example SVG Icons Only
-// ```scss
-// @use "@react-md/core" with (
-//   $disable-font: true,
-//   $disable-symbol: true
-// );
-// ```
-// @type boolean
+/// Set to `true` to disable the svg icon styles. You normally want to only have
+/// one icon type enabled.
+///
+/// @example scss - SVG Icons Only<!-- no-compile -->
+///   @use "@react-md/core" with (
+///     $disable-font: true,
+///     $disable-symbol: true
+///   );
+///
+/// @type Boolean
 $disable-svg: false !default;
 
-// Set to `true` to disable the symbol icon styles. You normally want to only have
-// one icon type enabled.
-//
-// @example Material Symbols Icons Only
-// ```scss
-// @use "@react-md/core" with (
-//   $disable-font: true,
-//   $disable-svg: true
-// );
-// ```
-// @type boolean
+/// Set to `true` to disable the symbol icon styles. You normally want to only have
+/// one icon type enabled.
+///
+/// @example scss - Material Symbols Icons Only<!-- no-compile -->
+///   @use "@react-md/core" with (
+///     $disable-font: true,
+///     $disable-svg: true
+///   );
+///
+/// @type Boolean
 $disable-symbol: false !default;
 
-// Set to `true` to disable the dense icon sizes
-// @type boolean
+/// Set to `true` to disable the dense icon sizes
+/// @type Boolean
 $disable-dense: false !default;
 
-// Set to `true` to disable the styles for aligning icons within inline text
-// blocks (like paragraphs).
-// @type boolean
+/// Set to `true` to disable the styles for aligning icons within inline text
+/// blocks (like paragraphs).
+/// @type Boolean
 $disable-inline: false !default;
 
-// Set to `true` to disable the `.rmd-icon--before` styles with the
-// `TextIconSpacing` component.
-// @type boolean
+/// Set to `true` to disable the `.rmd-icon--before` styles with the
+/// `TextIconSpacing` component.
+/// @type Boolean
 $disable-spacing-before: false !default;
 
-// Set to `true` to disable the `.rmd-icon--after` styles with the
-// `TextIconSpacing` component.
-// @type boolean
+/// Set to `true` to disable the `.rmd-icon--after` styles with the
+/// `TextIconSpacing` component.
+/// @type Boolean
 $disable-spacing-after: false !default;
 
-// Set to `true` to disable the `.rmd-icon--above` styles with the
-// `TextIconSpacing` component.
-// @type boolean
+/// Set to `true` to disable the `.rmd-icon--above` styles with the
+/// `TextIconSpacing` component.
+/// @type Boolean
 $disable-spacing-above: false !default;
 
-// Set to `true` to disable the `.rmd-icon--below` styles with the
-// `TextIconSpacing` component.
-// @type boolean
+/// Set to `true` to disable the `.rmd-icon--below` styles with the
+/// `TextIconSpacing` component.
+/// @type Boolean
 $disable-spacing-below: false !default;
 
-// Set to `true` to disable the icon rotator styles
-// @type boolean
+/// Set to `true` to disable the icon rotator styles
+/// @type Boolean
 $disable-rotator: false !default;
 
-// The default icon color when using the global light theme
-// @type Color
+/// The default icon color when using the global light theme
+/// @type Color
 $light-theme-color: color.adjust(#000, $lightness: 46%) !default;
 
-// The default icon color when using the global dark theme
-// @type Color
+/// The default icon color when using the global dark theme
+/// @type Color
 $dark-theme-color: color.adjust(#fff, $lightness: -30%) !default;
 
-// The default icon color
-// @type Color
+/// The default icon color
+/// @type Color
 $color: theme.get-default-color($light-theme-color, $dark-theme-color) !default;
 
-// The default icon size
-// @type number
+/// The default icon size
+/// @type Number
 $size: 1.5rem !default;
 
-// The default icon dense size
-// @type number
+/// The default icon dense size
+/// @type Number
 $dense-size: 1.25rem !default;
 
-// This is the default material symbol fill value. It should be one of:
-// - `0`
-// - `1`
-//
-// @type number
+/// This is the default material symbol fill value. It should be one of:
+/// - `0`
+/// - `1`
+///
+/// @type Number
 $symbol-fill: 0 !default;
 
-// This is the default material symbol weight value. It should be one of:
-// - `100`
-// - `200`
-// - `300`
-// - `400`
-// - `500`
-// - `600`
-// - `700`
-//
-// @type number
+/// This is the default material symbol weight value. It should be one of:
+/// - `100`
+/// - `200`
+/// - `300`
+/// - `400`
+/// - `500`
+/// - `600`
+/// - `700`
+///
+/// @type Number
 $symbol-weight: 400 !default;
 
-// This is the default material symbol grade value. It should be one of:
-// - `-25`
-// - `0`
-// - `200`
-//
-// @type number
+/// This is the default material symbol grade value. It should be one of:
+/// - `-25`
+/// - `0`
+/// - `200`
+///
+/// @type Number
 $symbol-grade: 0 !default;
 
-// This is the default material symbol fill value. It should be one of:
-// - `20`
-// - `24`
-// - `40`
-// - `48`
-//
-// @type number
+/// This is the default material symbol fill value. It should be one of:
+/// - `20`
+/// - `24`
+/// - `40`
+/// - `48`
+///
+/// @type Number
 $symbol-optical-size: 48 !default;
 
+/// @access private
+/// @type Number
 $_validated-fill: utils.validate((0, 1), $symbol-fill, "$symbol-fill");
+/// @access private
+/// @type Number
 $_validated_weight: utils.validate(
   (100 200 300 400 500 600 700),
   $symbol-weight,
   "$symbol-weight"
 );
+/// @access private
+/// @type Number
 $_validated_grade: utils.validate((-25 0 200), $symbol-grade, "$symbol-grade");
+/// @access private
+/// @type Number
 $_validated_optical-size: utils.validate(
   (20 24 40 48),
   $symbol-optical-size,
   "$symbol-optical-size"
 );
 
-// The default spacing for the `TextIconSpacing` component or anytime icons
-// should be separated from other content.
-//
-// @type number
+/// The default spacing for the `TextIconSpacing` component or anytime icons
+/// should be separated from other content.
+///
+/// @type Number
 $spacing: 0.5rem !default;
 
-// The default `IconRotator` starting position
-// @type string
+/// The default `IconRotator` starting position
+/// @type String
 $rotate-from: 0deg !default;
 
-// The default `IconRotator` ending position
-// @type string
+/// The default `IconRotator` ending position
+/// @type String
 $rotate-to: 180deg !default;
 
-// The default `IconRotator` transition duration
-// @type number
+/// The default `IconRotator` transition duration
+/// @type Number
 $rotate-duration: transition.$linear-duration !default;
 
-// The available configurable css variables and mostly used internally for the
-// `get-var`, `set-var`, and `use-var` utils.
-// @type List
+/// The available configurable css variables and mostly used internally for the
+/// `get-var`, `set-var`, and `use-var` utils.
+/// @type List
 $variables: (
   color,
   size,
+  dense-size,
   spacing,
   rotate-from,
   rotate-to,
@@ -177,12 +187,14 @@ $variables: (
   symbol-optical-size
 );
 
-// shouldn't really use react-md without icons though...
+/// shouldn't really use react-md without icons though...
+/// @access private
+/// @type Boolean
 $_disable-icons: $disable-font and $disable-svg and $disable-symbol;
 
-// @param {string} name - The supported variable name
-// @param {any} fallback - An optional fallback value
-// @returns {string} a `var()` statement
+/// @param {String} name - The supported variable name
+/// @param {any} fallback [null] - An optional fallback value
+/// @returns {String} a `var()` statement
 @function get-var($name, $fallback: null) {
   $var: utils.get-var-name($variables, $name, "icon");
   @if $fallback {
@@ -192,49 +204,45 @@ $_disable-icons: $disable-font and $disable-svg and $disable-symbol;
   @return var(#{$var});
 }
 
-// @param {string} name - The supported variable name
-// @param {any} value - The value to set the variable to. Supports `null` which
-// will just be a no-op.
+/// @param {String} name - The supported variable name
+/// @param {any} value - The value to set the variable to. Supports `null` which
+/// will just be a no-op.
 @mixin set-var($name, $value) {
   @if $value {
     #{utils.get-var-name($variables, $name, "icon")}: #{$value};
   }
 }
 
-// @param {string} property - The css property to apply the variable to
-// @param {string} name - The supported variable name
-// @param {any} fallback - An optional fallback value if the variable has not
-// been set
+/// @param {String} property - The css property to apply the variable to
+/// @param {String} name [$property] - The supported variable name
+/// @param {any} fallback [null] - An optional fallback value if the variable has not
+/// been set
 @mixin use-var($property, $name: $property, $fallback: null) {
   #{$property}: get-var($name, $fallback);
 }
 
-// Applies the light the variables based on feature flags
+/// Applies the light the variables based on feature flags
 @mixin use-light-theme {
   @if not $_disable-icons {
     @include set-var(color, $light-theme-color);
   }
 }
 
-// Applies the dark the variables based on feature flags
+/// Applies the dark the variables based on feature flags
 @mixin use-dark-theme {
   @if not $_disable-icons {
     @include set-var(color, $dark-theme-color);
   }
 }
 
-// Applies the dense height variables
-@mixin dense {
-  @if $dense-size {
-    @include set-var(size, $dense-size);
-  }
-}
-
-// Conditionally applies the css variables based on feature flags
+/// Conditionally applies the css variables based on feature flags
 @mixin variables {
   @if not $_disable-icons {
     @include set-var(color, $color);
     @include set-var(size, $size);
+    @if not $disable-dense {
+      @include set-var(dense-size, $dense-size);
+    }
     @include set-var(spacing, $spacing);
   }
 
@@ -251,10 +259,10 @@ $_disable-icons: $disable-font and $disable-svg and $disable-symbol;
   }
 }
 
-// Generates all the styles based on feature flags.
-//
-// @param {boolean} disable-layer - Set this to `true` to disable the
-// layer behavior
+/// Generates all the styles based on feature flags.
+///
+/// @param {Boolean} disable-layer [false] - Set this to `true` to disable the
+/// layer behavior
 @mixin styles($disable-layer: false) {
   @if not $_disable-icons {
     @include utils.optional-layer(icon, $disable-layer) {
@@ -339,7 +347,7 @@ $_disable-icons: $disable-font and $disable-svg and $disable-symbol;
 
         @if not $disable-dense {
           &--dense {
-            @include set-var(size, $dense-size);
+            @include set-var(size, get-var(dense-size));
           }
         }
       }

package/dist/icon/config.d.ts

@@ -149,7 +149,7 @@ export type ConfigurableIconName = keyof ConfigurableIcons;
  *
  * @example Mutating this object
  * ```tsx
- * import { ICON_CONFIG } from "@react-md/core";
+ * import { ICON_CONFIG } from "@react-md/core/icon/config";
  * import ArrowDropDownIcon from "@react-md/material-icons/ArrowDropDownIcon";
  * import ArrowUpwardIcon from "@react-md/material-icons/ArrowUpwardIcon";
  * import CancelIcon from "@react-md/material-icons/CancelIcon";
@@ -199,7 +199,7 @@ export declare const ICON_CONFIG: ConfiguredIcons;
  * @example Using SVG Material Icons
  * ```tsx
  * "use client";
- * import { configureIcons } from "@react-md/core";
+ * import { configureIcons } from "@react-md/core/icon/config";
  * import ArrowDropDownIcon from "@react-md/material-icons/ArrowDropDownIcon";
  * import ArrowUpwardIcon from "@react-md/material-icons/ArrowUpwardIcon";
  * import CancelIcon from "@react-md/material-icons/CancelIcon";

package/dist/icon/config.js

@@ -10,7 +10,7 @@ import { FontIcon } from "./FontIcon.js";
  *
  * @example Mutating this object
  * ```tsx
- * import { ICON_CONFIG } from "@react-md/core";
+ * import { ICON_CONFIG } from "@react-md/core/icon/config";
  * import ArrowDropDownIcon from "@react-md/material-icons/ArrowDropDownIcon";
  * import ArrowUpwardIcon from "@react-md/material-icons/ArrowUpwardIcon";
  * import CancelIcon from "@react-md/material-icons/CancelIcon";
@@ -117,7 +117,7 @@ import { FontIcon } from "./FontIcon.js";
  * @example Using SVG Material Icons
  * ```tsx
  * "use client";
- * import { configureIcons } from "@react-md/core";
+ * import { configureIcons } from "@react-md/core/icon/config";
  * import ArrowDropDownIcon from "@react-md/material-icons/ArrowDropDownIcon";
  * import ArrowUpwardIcon from "@react-md/material-icons/ArrowUpwardIcon";
  * import CancelIcon from "@react-md/material-icons/CancelIcon";

package/dist/icon/config.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/icon/config.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\n\nimport { FontIcon } from \"./FontIcon.js\";\n\n/**\n * @since 5.0.0 The `download` icon has been renamed to `upload`.\n */\nexport interface ConfigurableIcons {\n  /**\n   * The icon for navigating backwards or closing an item to the left.\n   *\n   * @defaultValue `<FontIcon>keyboard_arrow_left</FontIcon>`\n   */\n  back?: ReactNode;\n\n  /**\n   * The icon to use when clearing content from a text field.\n   *\n   * @defaultValue `<FontIcon>clear</FontIcon>`\n   * @since 6.0.0\n   */\n  clear?: ReactNode;\n\n  /**\n   * @defaultValue `<FontIcon>close</FontIcon>`\n   *\n   * @since 6.0.0\n   */\n  close?: ReactNode;\n\n  /**\n   * The icon to use for unchecked checkboxes.\n   *\n   * @defaultValue `<FontIcon>check_box_outline_blank</FontIcon>`\n   * @since 6.0.0 This icon now represents the unchecked state for\n   * checkboxes.\n   */\n  checkbox?: ReactNode;\n\n  /**\n   * The icon to use for checked checkboxes.\n   *\n   * @defaultValue `<FontIcon>check_box</FontIcon>`\n   * @since 6.0.0\n   */\n  checkboxChecked?: ReactNode;\n\n  /**\n   * The icon to use for indeterminate checkboxes.\n   *\n   * @defaultValue `<FontIcon>indeterminate_check_box</FontIcon>`\n   * @since 6.0.0\n   */\n  checkboxIndeterminate?: ReactNode;\n\n  /**\n   * The icon to use for dropdown menus or content that expands vertically in a\n   * new material instead of inline like the `expander` icon.\n   *\n   * @defaultValue `<FontIcon>arrow_drop_down</FontIcon>`\n   */\n  dropdown?: ReactNode;\n\n  /**\n   * The icon to use when there are form errors.\n   *\n   * @since 2.5.0\n   * @defaultValue `<FontIcon>error_outline</FontIcon>`\n   */\n  error?: ReactNode;\n\n  /**\n   * The icon to use for expanding content vertically.\n   *\n   * @defaultValue `<FontIcon>keyboard_arrow_down</FontIcon>`\n   */\n  expander?: ReactNode;\n\n  /**\n   * The icon for navigating forwards or closing an item to the right. This is\n   * also used internally for nested dropdown menus.\n   *\n   * @defaultValue `<FontIcon>keyboard_arrow_right</FontIcon>`\n   */\n  forward?: ReactNode;\n\n  /**\n   * The general to use for displaying a main navigation menu (usually a\n   * hamburger menu).\n   *\n   * @defaultValue `<FontIcon>menu</FontIcon>`\n   */\n  menu?: ReactNode;\n\n  /**\n   * The icon for displaying notifications. This is used internally in the\n   * `BadgedButton` in the `@react-md/badge` package.\n   *\n   * @defaultValue `<FontIcon>notifications</FontIcon>`\n   */\n  notification?: ReactNode;\n\n  /**\n   * The icon for temporarily displaying a password's field value as plain text.\n   *\n   * @defaultValue `<FontIcon>remove_red_eye</FontIcon>`\n   */\n  password?: ReactNode;\n\n  /**\n   * The icon to use for unchecked radio buttons.\n   *\n   * @defaultValue `<FontIcon>radio_button_unchecked</FontIcon>`\n   * @since 6.0.0 This icon now represents the unchecked state for\n   * radios.\n   */\n  radio?: ReactNode;\n\n  /**\n   * The icon to use for checked radio buttons.\n   *\n   * @defaultValue `<FontIcon>radio_button_checked</FontIcon>`\n   */\n  radioChecked?: ReactNode;\n\n  /**\n   * The icon to use when removing elements.\n   *\n   * @defaultValue `<FontIcon>cancel</FontIcon>`\n   */\n  remove?: ReactNode;\n\n  /**\n   * The icon to use for showing that something has been selected that is not a\n   * radio or checkbox. This is used internally for the `Chip` in the\n   * `@react-md/core` package.\n   *\n   * @defaultValue `<FontIcon>check</FontIcon>`\n   */\n  selected?: ReactNode;\n\n  /**\n   * The icon to represent sorting content.\n   *\n   * @defaultValue `<FontIcon>arrow_upward</FontIcon>`\n   */\n  sort?: ReactNode;\n\n  /**\n   * The icon to use for the `FileInput` component (normally file\n   * uploads).\n   *\n   * @since 5.0.0\n   * @defaultValue `<FontIcon>file_upload</FontIcon>`\n   */\n  upload?: ReactNode;\n}\n\nexport type ConfiguredIcons = Required<ConfigurableIcons>;\n\n/**\n * @since 6.0.0\n */\nexport type ConfigurableIconName = keyof ConfigurableIcons;\n\n/**\n * This is a **mutable** object of icons that `react-md` will use for rendering\n * icons within components. The defaults will use the font versions of material\n * icons.\n *\n * @see {@link configureIcons} for a quick way of overriding the configuration\n * or the example below.\n *\n * @example Mutating this object\n * ```tsx\n * import { ICON_CONFIG } from \"@react-md/core\";\n * import ArrowDropDownIcon from \"@react-md/material-icons/ArrowDropDownIcon\";\n * import ArrowUpwardIcon from \"@react-md/material-icons/ArrowUpwardIcon\";\n * import CancelIcon from \"@react-md/material-icons/CancelIcon\";\n * import CheckBoxIcon from \"@react-md/material-icons/CheckBoxIcon\";\n * import CheckBoxOutlineBlankIcon from \"@react-md/material-icons/CheckBoxOutlineBlankIcon\";\n * import CheckIcon from \"@react-md/material-icons/CheckIcon\";\n * import CloseIcon from \"@react-md/material-icons/CloseIcon\";\n * import ErrorOutlineIcon from \"@react-md/material-icons/ErrorOutlineIcon\";\n * import FileUploadIcon from \"@react-md/material-icons/FileUploadIcon\";\n * import IndeterminateCheckBoxIcon from \"@react-md/material-icons/IndeterminateCheckBoxIcon\";\n * import KeyboardArrowDownIcon from \"@react-md/material-icons/KeyboardArrowDownIcon\";\n * import KeyboardArrowLeftIcon from \"@react-md/material-icons/KeyboardArrowLeftIcon\";\n * import KeyboardArrowRightIcon from \"@react-md/material-icons/KeyboardArrowRightIcon\";\n * import MenuIcon from \"@react-md/material-icons/MenuIcon\";\n * import NotificationsIcon from \"@react-md/material-icons/NotificationsIcon\";\n * import RadioButtonCheckedIcon from \"@react-md/material-icons/RadioButtonCheckedIcon\";\n * import RadioButtonUncheckedIcon from \"@react-md/material-icons/RadioButtonUncheckedIcon\";\n * import RemoveRedEyeIcon from \"@react-md/material-icons/RemoveRedEyeIcon\";\n *\n * ICON_CONFIG.back = <KeyboardArrowLeftIcon />;\n * ICON_CONFIG.close = <CloseIcon />;\n * ICON_CONFIG.checkbox = <CheckBoxOutlineBlankIcon />;\n * ICON_CONFIG.checkboxChecked = <CheckBoxIcon />;\n * ICON_CONFIG.checkboxIndeterminate = <IndeterminateCheckBoxIcon />;\n * ICON_CONFIG.dropdown = <ArrowDropDownIcon />;\n * ICON_CONFIG.error = <ErrorOutlineIcon />;\n * ICON_CONFIG.expander = <KeyboardArrowDownIcon />;\n * ICON_CONFIG.forward = <KeyboardArrowRightIcon />;\n * ICON_CONFIG.menu = <MenuIcon />;\n * ICON_CONFIG.notification = <NotificationsIcon />;\n * ICON_CONFIG.password = <RemoveRedEyeIcon />;\n * ICON_CONFIG.radio = <RadioButtonUncheckedIcon />;\n * ICON_CONFIG.radioChecked = <RadioButtonCheckedIcon />;\n * ICON_CONFIG.remove = <CancelIcon />;\n * ICON_CONFIG.selected = <CheckIcon />;\n * ICON_CONFIG.sort = <ArrowUpwardIcon />;\n * ICON_CONFIG.upload = <FileUploadIcon />;\n * ```\n *\n *\n * @since 6.0.0\n */\nexport const ICON_CONFIG: ConfiguredIcons = {\n  back: <FontIcon>keyboard_arrow_left</FontIcon>,\n  clear: <FontIcon>clear</FontIcon>,\n  close: <FontIcon>close</FontIcon>,\n  checkbox: <FontIcon>check_box_outline_blank</FontIcon>,\n  checkboxChecked: <FontIcon>check_box</FontIcon>,\n  checkboxIndeterminate: <FontIcon>indeterminate_check_box</FontIcon>,\n  dropdown: <FontIcon>arrow_drop_down</FontIcon>,\n  error: <FontIcon>error_outline</FontIcon>,\n  expander: <FontIcon>keyboard_arrow_down</FontIcon>,\n  forward: <FontIcon>keyboard_arrow_right</FontIcon>,\n  menu: <FontIcon>menu</FontIcon>,\n  notification: <FontIcon>notifications</FontIcon>,\n  password: <FontIcon>remove_red_eye</FontIcon>,\n  radio: <FontIcon>radio_button_unchecked</FontIcon>,\n  radioChecked: <FontIcon>radio_button_checked</FontIcon>,\n  remove: <FontIcon>cancel</FontIcon>,\n  selected: <FontIcon>check</FontIcon>,\n  sort: <FontIcon>arrow_upward</FontIcon>,\n  upload: <FontIcon>file_upload</FontIcon>,\n};\n\n/**\n * A convenience helper to reconfigure icons within `react-md`.\n *\n * @example Using SVG Material Icons\n * ```tsx\n * \"use client\";\n * import { configureIcons } from \"@react-md/core\";\n * import ArrowDropDownIcon from \"@react-md/material-icons/ArrowDropDownIcon\";\n * import ArrowUpwardIcon from \"@react-md/material-icons/ArrowUpwardIcon\";\n * import CancelIcon from \"@react-md/material-icons/CancelIcon\";\n * import CheckBoxIcon from \"@react-md/material-icons/CheckBoxIcon\";\n * import CheckBoxOutlineBlankIcon from \"@react-md/material-icons/CheckBoxOutlineBlankIcon\";\n * import CheckIcon from \"@react-md/material-icons/CheckIcon\";\n * import CloseIcon from \"@react-md/material-icons/CloseIcon\";\n * import ErrorOutlineIcon from \"@react-md/material-icons/ErrorOutlineIcon\";\n * import FileUploadIcon from \"@react-md/material-icons/FileUploadIcon\";\n * import IndeterminateCheckBoxIcon from \"@react-md/material-icons/IndeterminateCheckBoxIcon\";\n * import KeyboardArrowDownIcon from \"@react-md/material-icons/KeyboardArrowDownIcon\";\n * import KeyboardArrowLeftIcon from \"@react-md/material-icons/KeyboardArrowLeftIcon\";\n * import KeyboardArrowRightIcon from \"@react-md/material-icons/KeyboardArrowRightIcon\";\n * import MenuIcon from \"@react-md/material-icons/MenuIcon\";\n * import NotificationsIcon from \"@react-md/material-icons/NotificationsIcon\";\n * import RadioButtonCheckedIcon from \"@react-md/material-icons/RadioButtonCheckedIcon\";\n * import RadioButtonUncheckedIcon from \"@react-md/material-icons/RadioButtonUncheckedIcon\";\n * import RemoveRedEyeIcon from \"@react-md/material-icons/RemoveRedEyeIcon\";\n *\n * configureIcons({\n *   back: <KeyboardArrowLeftIcon />,\n *   close: <CloseIcon />,\n *   checkbox: <CheckBoxOutlineBlankIcon />,\n *   checkboxChecked: <CheckBoxIcon />,\n *   checkboxIndeterminate: <IndeterminateCheckBoxIcon />,\n *   dropdown: <ArrowDropDownIcon />,\n *   error: <ErrorOutlineIcon />,\n *   expander: <KeyboardArrowDownIcon />,\n *   forward: <KeyboardArrowRightIcon />,\n *   menu: <MenuIcon />,\n *   notification: <NotificationsIcon />,\n *   password: <RemoveRedEyeIcon />,\n *   radio: <RadioButtonUncheckedIcon />,\n *   radioChecked: <RadioButtonCheckedIcon />,\n *   remove: <CancelIcon />,\n *   selected: <CheckIcon />,\n *   sort: <ArrowUpwardIcon />,\n *   upload: <FileUploadIcon />,\n * });\n * ```\n *\n * @since 6.0.0\n */\nexport function configureIcons(overrides: ConfiguredIcons): void {\n  Object.entries(overrides).forEach(([name, value]) => {\n    if (process.env.NODE_ENV !== \"production\" && !(name in ICON_CONFIG)) {\n      throw new Error(`${name} is an invalid react-md icon name.`);\n    }\n\n    ICON_CONFIG[name as keyof ConfiguredIcons] = value;\n  });\n}\n\n/**\n * This is mostly an internal helper to get a specific icon by name and allowing\n * a custom prop to override this behavior. The main benefit of this function is\n * that icons can be removed if the override is set to `null`.\n *\n * @since 6.0.0\n */\nexport function getIcon(\n  name: ConfigurableIconName,\n  override?: ReactNode\n): ReactNode {\n  if (typeof override !== \"undefined\") {\n    return override;\n  }\n\n  return ICON_CONFIG[name];\n}\n"],"names":["FontIcon","ICON_CONFIG","back","clear","close","checkbox","checkboxChecked","checkboxIndeterminate","dropdown","error","expander","forward","menu","notification","password","radio","radioChecked","remove","selected","sort","upload","configureIcons","overrides","Object","entries","forEach","name","value","process","env","NODE_ENV","Error","getIcon","override"],"mappings":";AAEA,SAASA,QAAQ,QAAQ,gBAAgB;AAmKzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDC,GACD,OAAO,MAAMC,cAA+B;IAC1CC,oBAAM,KAACF;kBAAS;;IAChBG,qBAAO,KAACH;kBAAS;;IACjBI,qBAAO,KAACJ;kBAAS;;IACjBK,wBAAU,KAACL;kBAAS;;IACpBM,+BAAiB,KAACN;kBAAS;;IAC3BO,qCAAuB,KAACP;kBAAS;;IACjCQ,wBAAU,KAACR;kBAAS;;IACpBS,qBAAO,KAACT;kBAAS;;IACjBU,wBAAU,KAACV;kBAAS;;IACpBW,uBAAS,KAACX;kBAAS;;IACnBY,oBAAM,KAACZ;kBAAS;;IAChBa,4BAAc,KAACb;kBAAS;;IACxBc,wBAAU,KAACd;kBAAS;;IACpBe,qBAAO,KAACf;kBAAS;;IACjBgB,4BAAc,KAAChB;kBAAS;;IACxBiB,sBAAQ,KAACjB;kBAAS;;IAClBkB,wBAAU,KAAClB;kBAAS;;IACpBmB,oBAAM,KAACnB;kBAAS;;IAChBoB,sBAAQ,KAACpB;kBAAS;;AACpB,EAAE;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiDC,GACD,OAAO,SAASqB,eAAeC,SAA0B;IACvDC,OAAOC,OAAO,CAACF,WAAWG,OAAO,CAAC,CAAC,CAACC,MAAMC,MAAM;QAC9C,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBAAgB,CAAEJ,CAAAA,QAAQzB,WAAU,GAAI;YACnE,MAAM,IAAI8B,MAAM,GAAGL,KAAK,kCAAkC,CAAC;QAC7D;QAEAzB,WAAW,CAACyB,KAA8B,GAAGC;IAC/C;AACF;AAEA;;;;;;CAMC,GACD,OAAO,SAASK,QACdN,IAA0B,EAC1BO,QAAoB;IAEpB,IAAI,OAAOA,aAAa,aAAa;QACnC,OAAOA;IACT;IAEA,OAAOhC,WAAW,CAACyB,KAAK;AAC1B"}
+{"version":3,"sources":["../../src/icon/config.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\n\nimport { FontIcon } from \"./FontIcon.js\";\n\n/**\n * @since 5.0.0 The `download` icon has been renamed to `upload`.\n */\nexport interface ConfigurableIcons {\n  /**\n   * The icon for navigating backwards or closing an item to the left.\n   *\n   * @defaultValue `<FontIcon>keyboard_arrow_left</FontIcon>`\n   */\n  back?: ReactNode;\n\n  /**\n   * The icon to use when clearing content from a text field.\n   *\n   * @defaultValue `<FontIcon>clear</FontIcon>`\n   * @since 6.0.0\n   */\n  clear?: ReactNode;\n\n  /**\n   * @defaultValue `<FontIcon>close</FontIcon>`\n   *\n   * @since 6.0.0\n   */\n  close?: ReactNode;\n\n  /**\n   * The icon to use for unchecked checkboxes.\n   *\n   * @defaultValue `<FontIcon>check_box_outline_blank</FontIcon>`\n   * @since 6.0.0 This icon now represents the unchecked state for\n   * checkboxes.\n   */\n  checkbox?: ReactNode;\n\n  /**\n   * The icon to use for checked checkboxes.\n   *\n   * @defaultValue `<FontIcon>check_box</FontIcon>`\n   * @since 6.0.0\n   */\n  checkboxChecked?: ReactNode;\n\n  /**\n   * The icon to use for indeterminate checkboxes.\n   *\n   * @defaultValue `<FontIcon>indeterminate_check_box</FontIcon>`\n   * @since 6.0.0\n   */\n  checkboxIndeterminate?: ReactNode;\n\n  /**\n   * The icon to use for dropdown menus or content that expands vertically in a\n   * new material instead of inline like the `expander` icon.\n   *\n   * @defaultValue `<FontIcon>arrow_drop_down</FontIcon>`\n   */\n  dropdown?: ReactNode;\n\n  /**\n   * The icon to use when there are form errors.\n   *\n   * @since 2.5.0\n   * @defaultValue `<FontIcon>error_outline</FontIcon>`\n   */\n  error?: ReactNode;\n\n  /**\n   * The icon to use for expanding content vertically.\n   *\n   * @defaultValue `<FontIcon>keyboard_arrow_down</FontIcon>`\n   */\n  expander?: ReactNode;\n\n  /**\n   * The icon for navigating forwards or closing an item to the right. This is\n   * also used internally for nested dropdown menus.\n   *\n   * @defaultValue `<FontIcon>keyboard_arrow_right</FontIcon>`\n   */\n  forward?: ReactNode;\n\n  /**\n   * The general to use for displaying a main navigation menu (usually a\n   * hamburger menu).\n   *\n   * @defaultValue `<FontIcon>menu</FontIcon>`\n   */\n  menu?: ReactNode;\n\n  /**\n   * The icon for displaying notifications. This is used internally in the\n   * `BadgedButton` in the `@react-md/badge` package.\n   *\n   * @defaultValue `<FontIcon>notifications</FontIcon>`\n   */\n  notification?: ReactNode;\n\n  /**\n   * The icon for temporarily displaying a password's field value as plain text.\n   *\n   * @defaultValue `<FontIcon>remove_red_eye</FontIcon>`\n   */\n  password?: ReactNode;\n\n  /**\n   * The icon to use for unchecked radio buttons.\n   *\n   * @defaultValue `<FontIcon>radio_button_unchecked</FontIcon>`\n   * @since 6.0.0 This icon now represents the unchecked state for\n   * radios.\n   */\n  radio?: ReactNode;\n\n  /**\n   * The icon to use for checked radio buttons.\n   *\n   * @defaultValue `<FontIcon>radio_button_checked</FontIcon>`\n   */\n  radioChecked?: ReactNode;\n\n  /**\n   * The icon to use when removing elements.\n   *\n   * @defaultValue `<FontIcon>cancel</FontIcon>`\n   */\n  remove?: ReactNode;\n\n  /**\n   * The icon to use for showing that something has been selected that is not a\n   * radio or checkbox. This is used internally for the `Chip` in the\n   * `@react-md/core` package.\n   *\n   * @defaultValue `<FontIcon>check</FontIcon>`\n   */\n  selected?: ReactNode;\n\n  /**\n   * The icon to represent sorting content.\n   *\n   * @defaultValue `<FontIcon>arrow_upward</FontIcon>`\n   */\n  sort?: ReactNode;\n\n  /**\n   * The icon to use for the `FileInput` component (normally file\n   * uploads).\n   *\n   * @since 5.0.0\n   * @defaultValue `<FontIcon>file_upload</FontIcon>`\n   */\n  upload?: ReactNode;\n}\n\nexport type ConfiguredIcons = Required<ConfigurableIcons>;\n\n/**\n * @since 6.0.0\n */\nexport type ConfigurableIconName = keyof ConfigurableIcons;\n\n/**\n * This is a **mutable** object of icons that `react-md` will use for rendering\n * icons within components. The defaults will use the font versions of material\n * icons.\n *\n * @see {@link configureIcons} for a quick way of overriding the configuration\n * or the example below.\n *\n * @example Mutating this object\n * ```tsx\n * import { ICON_CONFIG } from \"@react-md/core/icon/config\";\n * import ArrowDropDownIcon from \"@react-md/material-icons/ArrowDropDownIcon\";\n * import ArrowUpwardIcon from \"@react-md/material-icons/ArrowUpwardIcon\";\n * import CancelIcon from \"@react-md/material-icons/CancelIcon\";\n * import CheckBoxIcon from \"@react-md/material-icons/CheckBoxIcon\";\n * import CheckBoxOutlineBlankIcon from \"@react-md/material-icons/CheckBoxOutlineBlankIcon\";\n * import CheckIcon from \"@react-md/material-icons/CheckIcon\";\n * import CloseIcon from \"@react-md/material-icons/CloseIcon\";\n * import ErrorOutlineIcon from \"@react-md/material-icons/ErrorOutlineIcon\";\n * import FileUploadIcon from \"@react-md/material-icons/FileUploadIcon\";\n * import IndeterminateCheckBoxIcon from \"@react-md/material-icons/IndeterminateCheckBoxIcon\";\n * import KeyboardArrowDownIcon from \"@react-md/material-icons/KeyboardArrowDownIcon\";\n * import KeyboardArrowLeftIcon from \"@react-md/material-icons/KeyboardArrowLeftIcon\";\n * import KeyboardArrowRightIcon from \"@react-md/material-icons/KeyboardArrowRightIcon\";\n * import MenuIcon from \"@react-md/material-icons/MenuIcon\";\n * import NotificationsIcon from \"@react-md/material-icons/NotificationsIcon\";\n * import RadioButtonCheckedIcon from \"@react-md/material-icons/RadioButtonCheckedIcon\";\n * import RadioButtonUncheckedIcon from \"@react-md/material-icons/RadioButtonUncheckedIcon\";\n * import RemoveRedEyeIcon from \"@react-md/material-icons/RemoveRedEyeIcon\";\n *\n * ICON_CONFIG.back = <KeyboardArrowLeftIcon />;\n * ICON_CONFIG.close = <CloseIcon />;\n * ICON_CONFIG.checkbox = <CheckBoxOutlineBlankIcon />;\n * ICON_CONFIG.checkboxChecked = <CheckBoxIcon />;\n * ICON_CONFIG.checkboxIndeterminate = <IndeterminateCheckBoxIcon />;\n * ICON_CONFIG.dropdown = <ArrowDropDownIcon />;\n * ICON_CONFIG.error = <ErrorOutlineIcon />;\n * ICON_CONFIG.expander = <KeyboardArrowDownIcon />;\n * ICON_CONFIG.forward = <KeyboardArrowRightIcon />;\n * ICON_CONFIG.menu = <MenuIcon />;\n * ICON_CONFIG.notification = <NotificationsIcon />;\n * ICON_CONFIG.password = <RemoveRedEyeIcon />;\n * ICON_CONFIG.radio = <RadioButtonUncheckedIcon />;\n * ICON_CONFIG.radioChecked = <RadioButtonCheckedIcon />;\n * ICON_CONFIG.remove = <CancelIcon />;\n * ICON_CONFIG.selected = <CheckIcon />;\n * ICON_CONFIG.sort = <ArrowUpwardIcon />;\n * ICON_CONFIG.upload = <FileUploadIcon />;\n * ```\n *\n *\n * @since 6.0.0\n */\nexport const ICON_CONFIG: ConfiguredIcons = {\n  back: <FontIcon>keyboard_arrow_left</FontIcon>,\n  clear: <FontIcon>clear</FontIcon>,\n  close: <FontIcon>close</FontIcon>,\n  checkbox: <FontIcon>check_box_outline_blank</FontIcon>,\n  checkboxChecked: <FontIcon>check_box</FontIcon>,\n  checkboxIndeterminate: <FontIcon>indeterminate_check_box</FontIcon>,\n  dropdown: <FontIcon>arrow_drop_down</FontIcon>,\n  error: <FontIcon>error_outline</FontIcon>,\n  expander: <FontIcon>keyboard_arrow_down</FontIcon>,\n  forward: <FontIcon>keyboard_arrow_right</FontIcon>,\n  menu: <FontIcon>menu</FontIcon>,\n  notification: <FontIcon>notifications</FontIcon>,\n  password: <FontIcon>remove_red_eye</FontIcon>,\n  radio: <FontIcon>radio_button_unchecked</FontIcon>,\n  radioChecked: <FontIcon>radio_button_checked</FontIcon>,\n  remove: <FontIcon>cancel</FontIcon>,\n  selected: <FontIcon>check</FontIcon>,\n  sort: <FontIcon>arrow_upward</FontIcon>,\n  upload: <FontIcon>file_upload</FontIcon>,\n};\n\n/**\n * A convenience helper to reconfigure icons within `react-md`.\n *\n * @example Using SVG Material Icons\n * ```tsx\n * \"use client\";\n * import { configureIcons } from \"@react-md/core/icon/config\";\n * import ArrowDropDownIcon from \"@react-md/material-icons/ArrowDropDownIcon\";\n * import ArrowUpwardIcon from \"@react-md/material-icons/ArrowUpwardIcon\";\n * import CancelIcon from \"@react-md/material-icons/CancelIcon\";\n * import CheckBoxIcon from \"@react-md/material-icons/CheckBoxIcon\";\n * import CheckBoxOutlineBlankIcon from \"@react-md/material-icons/CheckBoxOutlineBlankIcon\";\n * import CheckIcon from \"@react-md/material-icons/CheckIcon\";\n * import CloseIcon from \"@react-md/material-icons/CloseIcon\";\n * import ErrorOutlineIcon from \"@react-md/material-icons/ErrorOutlineIcon\";\n * import FileUploadIcon from \"@react-md/material-icons/FileUploadIcon\";\n * import IndeterminateCheckBoxIcon from \"@react-md/material-icons/IndeterminateCheckBoxIcon\";\n * import KeyboardArrowDownIcon from \"@react-md/material-icons/KeyboardArrowDownIcon\";\n * import KeyboardArrowLeftIcon from \"@react-md/material-icons/KeyboardArrowLeftIcon\";\n * import KeyboardArrowRightIcon from \"@react-md/material-icons/KeyboardArrowRightIcon\";\n * import MenuIcon from \"@react-md/material-icons/MenuIcon\";\n * import NotificationsIcon from \"@react-md/material-icons/NotificationsIcon\";\n * import RadioButtonCheckedIcon from \"@react-md/material-icons/RadioButtonCheckedIcon\";\n * import RadioButtonUncheckedIcon from \"@react-md/material-icons/RadioButtonUncheckedIcon\";\n * import RemoveRedEyeIcon from \"@react-md/material-icons/RemoveRedEyeIcon\";\n *\n * configureIcons({\n *   back: <KeyboardArrowLeftIcon />,\n *   close: <CloseIcon />,\n *   checkbox: <CheckBoxOutlineBlankIcon />,\n *   checkboxChecked: <CheckBoxIcon />,\n *   checkboxIndeterminate: <IndeterminateCheckBoxIcon />,\n *   dropdown: <ArrowDropDownIcon />,\n *   error: <ErrorOutlineIcon />,\n *   expander: <KeyboardArrowDownIcon />,\n *   forward: <KeyboardArrowRightIcon />,\n *   menu: <MenuIcon />,\n *   notification: <NotificationsIcon />,\n *   password: <RemoveRedEyeIcon />,\n *   radio: <RadioButtonUncheckedIcon />,\n *   radioChecked: <RadioButtonCheckedIcon />,\n *   remove: <CancelIcon />,\n *   selected: <CheckIcon />,\n *   sort: <ArrowUpwardIcon />,\n *   upload: <FileUploadIcon />,\n * });\n * ```\n *\n * @since 6.0.0\n */\nexport function configureIcons(overrides: ConfiguredIcons): void {\n  Object.entries(overrides).forEach(([name, value]) => {\n    if (process.env.NODE_ENV !== \"production\" && !(name in ICON_CONFIG)) {\n      throw new Error(`${name} is an invalid react-md icon name.`);\n    }\n\n    ICON_CONFIG[name as keyof ConfiguredIcons] = value;\n  });\n}\n\n/**\n * This is mostly an internal helper to get a specific icon by name and allowing\n * a custom prop to override this behavior. The main benefit of this function is\n * that icons can be removed if the override is set to `null`.\n *\n * @since 6.0.0\n */\nexport function getIcon(\n  name: ConfigurableIconName,\n  override?: ReactNode\n): ReactNode {\n  if (typeof override !== \"undefined\") {\n    return override;\n  }\n\n  return ICON_CONFIG[name];\n}\n"],"names":["FontIcon","ICON_CONFIG","back","clear","close","checkbox","checkboxChecked","checkboxIndeterminate","dropdown","error","expander","forward","menu","notification","password","radio","radioChecked","remove","selected","sort","upload","configureIcons","overrides","Object","entries","forEach","name","value","process","env","NODE_ENV","Error","getIcon","override"],"mappings":";AAEA,SAASA,QAAQ,QAAQ,gBAAgB;AAmKzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDC,GACD,OAAO,MAAMC,cAA+B;IAC1CC,oBAAM,KAACF;kBAAS;;IAChBG,qBAAO,KAACH;kBAAS;;IACjBI,qBAAO,KAACJ;kBAAS;;IACjBK,wBAAU,KAACL;kBAAS;;IACpBM,+BAAiB,KAACN;kBAAS;;IAC3BO,qCAAuB,KAACP;kBAAS;;IACjCQ,wBAAU,KAACR;kBAAS;;IACpBS,qBAAO,KAACT;kBAAS;;IACjBU,wBAAU,KAACV;kBAAS;;IACpBW,uBAAS,KAACX;kBAAS;;IACnBY,oBAAM,KAACZ;kBAAS;;IAChBa,4BAAc,KAACb;kBAAS;;IACxBc,wBAAU,KAACd;kBAAS;;IACpBe,qBAAO,KAACf;kBAAS;;IACjBgB,4BAAc,KAAChB;kBAAS;;IACxBiB,sBAAQ,KAACjB;kBAAS;;IAClBkB,wBAAU,KAAClB;kBAAS;;IACpBmB,oBAAM,KAACnB;kBAAS;;IAChBoB,sBAAQ,KAACpB;kBAAS;;AACpB,EAAE;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiDC,GACD,OAAO,SAASqB,eAAeC,SAA0B;IACvDC,OAAOC,OAAO,CAACF,WAAWG,OAAO,CAAC,CAAC,CAACC,MAAMC,MAAM;QAC9C,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBAAgB,CAAEJ,CAAAA,QAAQzB,WAAU,GAAI;YACnE,MAAM,IAAI8B,MAAM,GAAGL,KAAK,kCAAkC,CAAC;QAC7D;QAEAzB,WAAW,CAACyB,KAA8B,GAAGC;IAC/C;AACF;AAEA;;;;;;CAMC,GACD,OAAO,SAASK,QACdN,IAA0B,EAC1BO,QAAoB;IAEpB,IAAI,OAAOA,aAAa,aAAa;QACnC,OAAOA;IACT;IAEA,OAAOhC,WAAW,CAACyB,KAAK;AAC1B"}