@salt-ds/core 1.19.0 → 1.21.0

package/dist-es/file-drop-zone/FileDropZoneTrigger.js

@@ -6,7 +6,83 @@ import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
 import 'clsx';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
 import { Button } from '../button/Button.js';
+import '../card/Card.js';
+import '../card/InteractableCard.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/styles';
+import '@salt-ds/window';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextNotation.js';
+import '../text/TextAction.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import './FileDropZone.js';
+import './FileDropZoneIcon.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import '../form-field/FormField.js';
+import '../form-field-context/FormFieldContext.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import '@floating-ui/react';
 
 const FileDropZoneTrigger = forwardRef(function FileDropZoneTrigger2({ accept, children, disabled, multiple = false, onChange, ...rest }, ref) {
   const buttonRef = useRef(null);

package/dist-es/file-drop-zone/FileDropZoneTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileDropZoneTrigger.js","sources":["../src/file-drop-zone/FileDropZoneTrigger.tsx"],"sourcesContent":["import {\n  FocusEvent,\n  forwardRef,\n  HTMLAttributes,\n  SyntheticEvent,\n  useRef,\n} from \"react\";\nimport { useForkRef } from \"../utils\";\nimport { Button } from \"../button\";\n\nexport interface FileDropZoneTriggerProps\n  extends Omit<HTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n  /**\n   * `accept` attribute for HTML <input>.\n   *\n   * A comma separated list of file types the user can pick from the file input dialog box.\n   */\n  accept?: string;\n  /**\n   * Disable all trigger elements.\n   */\n  disabled?: boolean;\n  /**\n   * Allows multiple files to be uploaded.\n   */\n  multiple?: boolean;\n  /**\n   * Callback for input change event\n   */\n  onChange?: (event: SyntheticEvent<HTMLInputElement>, files: File[]) => void;\n}\n\nexport const FileDropZoneTrigger = forwardRef<\n  HTMLButtonElement,\n  FileDropZoneTriggerProps\n>(function FileDropZoneTrigger(\n  { accept, children, disabled, multiple = false, onChange, ...rest },\n  ref\n) {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const triggerRef = useForkRef(ref, buttonRef);\n\n  // As an ADA requirement when dialog is closed and the focus is returned to the input, we need to\n  // move focus back on the button element so that all labels can be announced correctly\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    event.stopPropagation();\n    buttonRef.current?.focus();\n  };\n\n  const handleClick = (event: SyntheticEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n    fileInputRef.current?.click();\n  };\n\n  const handleChange = (event: SyntheticEvent<HTMLInputElement>) => {\n    const files = Array.from((event.target as HTMLInputElement).files ?? []);\n    onChange?.(event, files);\n  };\n  return (\n    <>\n      <Button\n        onClick={handleClick}\n        disabled={disabled}\n        ref={triggerRef}\n        {...rest}\n      >\n        {children ?? \"Browse files\"}\n      </Button>\n      <input\n        accept={accept}\n        className=\"input-hidden\"\n        disabled={disabled}\n        multiple={multiple}\n        onChange={handleChange}\n        onFocus={handleFocus}\n        ref={fileInputRef}\n        type=\"file\"\n      />\n    </>\n  );\n});\n"],"names":["FileDropZoneTrigger"],"mappings":";;;;;;;;;;AAgCO,MAAM,mBAAsB,GAAA,UAAA,CAGjC,SAASA,oBAAAA,CACT,EAAE,MAAA,EAAQ,QAAU,EAAA,QAAA,EAAU,QAAW,GAAA,KAAA,EAAO,QAAa,EAAA,GAAA,IAAA,IAC7D,GACA,EAAA;AACA,EAAM,MAAA,SAAA,GAAY,OAA0B,IAAI,CAAA,CAAA;AAChD,EAAM,MAAA,YAAA,GAAe,OAAyB,IAAI,CAAA,CAAA;AAClD,EAAM,MAAA,UAAA,GAAa,UAAW,CAAA,GAAA,EAAK,SAAS,CAAA,CAAA;AAI5C,EAAM,MAAA,WAAA,GAAc,CAAC,KAAwC,KAAA;AA7C/D,IAAA,IAAA,EAAA,CAAA;AA8CI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAA6C,KAAA;AAlDpE,IAAA,IAAA,EAAA,CAAA;AAmDI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,YAAA,CAAa,YAAb,IAAsB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACxB,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,KAA4C,KAAA;AAvDpE,IAAA,IAAA,EAAA,CAAA;AAwDI,IAAM,MAAA,KAAA,GAAQ,MAAM,IAAM,CAAA,CAAA,EAAA,GAAA,KAAA,CAAM,OAA4B,KAAlC,KAAA,IAAA,GAAA,EAAA,GAA2C,EAAE,CAAA,CAAA;AACvE,IAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAW,KAAO,EAAA,KAAA,CAAA,CAAA;AAAA,GACpB,CAAA;AACA,EACE,uBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,QACC,OAAS,EAAA,WAAA;AAAA,QACT,QAAA;AAAA,QACA,GAAK,EAAA,UAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH,QAAY,EAAA,QAAA,IAAA,IAAA,GAAA,QAAA,GAAA,cAAA;AAAA,OACf,CAAA;AAAA,sBACC,GAAA,CAAA,OAAA,EAAA;AAAA,QACC,MAAA;AAAA,QACA,SAAU,EAAA,cAAA;AAAA,QACV,QAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAU,EAAA,YAAA;AAAA,QACV,OAAS,EAAA,WAAA;AAAA,QACT,GAAK,EAAA,YAAA;AAAA,QACL,IAAK,EAAA,MAAA;AAAA,OACP,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"FileDropZoneTrigger.js","sources":["../src/file-drop-zone/FileDropZoneTrigger.tsx"],"sourcesContent":["import {\n  FocusEvent,\n  forwardRef,\n  HTMLAttributes,\n  SyntheticEvent,\n  useRef,\n} from \"react\";\nimport { useForkRef } from \"../utils\";\nimport { Button } from \"../button\";\n\nexport interface FileDropZoneTriggerProps\n  extends Omit<HTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n  /**\n   * `accept` attribute for HTML <input>.\n   *\n   * A comma separated list of file types the user can pick from the file input dialog box.\n   */\n  accept?: string;\n  /**\n   * Disable all trigger elements.\n   */\n  disabled?: boolean;\n  /**\n   * Allows multiple files to be uploaded.\n   */\n  multiple?: boolean;\n  /**\n   * Callback for input change event\n   */\n  onChange?: (event: SyntheticEvent<HTMLInputElement>, files: File[]) => void;\n}\n\nexport const FileDropZoneTrigger = forwardRef<\n  HTMLButtonElement,\n  FileDropZoneTriggerProps\n>(function FileDropZoneTrigger(\n  { accept, children, disabled, multiple = false, onChange, ...rest },\n  ref\n) {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const triggerRef = useForkRef(ref, buttonRef);\n\n  // As an ADA requirement when dialog is closed and the focus is returned to the input, we need to\n  // move focus back on the button element so that all labels can be announced correctly\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    event.stopPropagation();\n    buttonRef.current?.focus();\n  };\n\n  const handleClick = (event: SyntheticEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n    fileInputRef.current?.click();\n  };\n\n  const handleChange = (event: SyntheticEvent<HTMLInputElement>) => {\n    const files = Array.from((event.target as HTMLInputElement).files ?? []);\n    onChange?.(event, files);\n  };\n  return (\n    <>\n      <Button\n        onClick={handleClick}\n        disabled={disabled}\n        ref={triggerRef}\n        {...rest}\n      >\n        {children ?? \"Browse files\"}\n      </Button>\n      <input\n        accept={accept}\n        className=\"input-hidden\"\n        disabled={disabled}\n        multiple={multiple}\n        onChange={handleChange}\n        onFocus={handleFocus}\n        ref={fileInputRef}\n        type=\"file\"\n      />\n    </>\n  );\n});\n"],"names":["FileDropZoneTrigger"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCO,MAAM,mBAAsB,GAAA,UAAA,CAGjC,SAASA,oBAAAA,CACT,EAAE,MAAA,EAAQ,QAAU,EAAA,QAAA,EAAU,QAAW,GAAA,KAAA,EAAO,QAAa,EAAA,GAAA,IAAA,IAC7D,GACA,EAAA;AACA,EAAM,MAAA,SAAA,GAAY,OAA0B,IAAI,CAAA,CAAA;AAChD,EAAM,MAAA,YAAA,GAAe,OAAyB,IAAI,CAAA,CAAA;AAClD,EAAM,MAAA,UAAA,GAAa,UAAW,CAAA,GAAA,EAAK,SAAS,CAAA,CAAA;AAI5C,EAAM,MAAA,WAAA,GAAc,CAAC,KAAwC,KAAA;AA7C/D,IAAA,IAAA,EAAA,CAAA;AA8CI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAA6C,KAAA;AAlDpE,IAAA,IAAA,EAAA,CAAA;AAmDI,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,IAAA,CAAA,EAAA,GAAA,YAAA,CAAa,YAAb,IAAsB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,EAAA,CAAA;AAAA,GACxB,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,KAA4C,KAAA;AAvDpE,IAAA,IAAA,EAAA,CAAA;AAwDI,IAAM,MAAA,KAAA,GAAQ,MAAM,IAAM,CAAA,CAAA,EAAA,GAAA,KAAA,CAAM,OAA4B,KAAlC,KAAA,IAAA,GAAA,EAAA,GAA2C,EAAE,CAAA,CAAA;AACvE,IAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAW,KAAO,EAAA,KAAA,CAAA,CAAA;AAAA,GACpB,CAAA;AACA,EACE,uBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,QACC,OAAS,EAAA,WAAA;AAAA,QACT,QAAA;AAAA,QACA,GAAK,EAAA,UAAA;AAAA,QACJ,GAAG,IAAA;AAAA,QAEH,QAAY,EAAA,QAAA,IAAA,IAAA,GAAA,QAAA,GAAA,cAAA;AAAA,OACf,CAAA;AAAA,sBACC,GAAA,CAAA,OAAA,EAAA;AAAA,QACC,MAAA;AAAA,QACA,SAAU,EAAA,cAAA;AAAA,QACV,QAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAU,EAAA,YAAA;AAAA,QACV,OAAS,EAAA,WAAA;AAAA,QACT,GAAK,EAAA,YAAA;AAAA,QACL,IAAK,EAAA,MAAA;AAAA,OACP,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/flex-item/FlexItem.js

@@ -5,9 +5,86 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import { useResponsiveProp } from '../utils/useResponsiveProp.js';
 import { clsx } from 'clsx';
-import css_248z from './FlexItem.css.js';
-import { useWindow } from '@salt-ds/window';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../card/InteractableCard.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import '../salt-provider/SaltProvider.js';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextNotation.js';
+import '../text/TextAction.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import '../form-field/FormField.js';
+import '../form-field-context/FormFieldContext.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import '@floating-ui/react';
+import '../viewport/ViewportProvider.js';
+import css_248z from './FlexItem.css.js';
 
 const withBaseName = makePrefixer("saltFlexItem");
 const FLEX_ITEM_ALIGNMENTS = [

package/dist-es/flex-item/FlexItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlexItem.js","sources":["../src/flex-item/FlexItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement, CSSProperties } from \"react\";\nimport {\n  makePrefixer,\n  ResponsiveProp,\n  useResponsiveProp,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport flexItemCss from \"./FlexItem.css\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexItem\");\nexport const FLEX_ITEM_ALIGNMENTS = [\n  \"start\",\n  \"end\",\n  \"center\",\n  \"stretch\",\n] as const;\n\nexport type flexItemAlignment = (typeof FLEX_ITEM_ALIGNMENTS)[number];\n\nexport type FlexItemProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n       */\n      align?: flexItemAlignment;\n      /**\n       * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n       */\n      shrink?: ResponsiveProp<number>;\n      /**\n       * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n       */\n      grow?: ResponsiveProp<number>;\n      /**\n       * Sets the initial main size of a flex item, default is \"auto\".\n       */\n      basis?: ResponsiveProp<CSSProperties[\"flexBasis\"]>;\n    }\n  >;\n\ntype FlexItemComponent = <T extends ElementType = \"div\">(\n  props: FlexItemProps<T>\n) => ReactElement | null;\n\nexport const FlexItem: FlexItemComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      as,\n      align,\n      children,\n      className,\n      shrink,\n      grow,\n      basis,\n      style,\n      ...rest\n    }: FlexItemProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-flex-item\",\n      css: flexItemCss,\n      window: targetWindow,\n    });\n\n    const Component = as || \"div\";\n    const flexItemShrink = useResponsiveProp(shrink, 1);\n    const flexItemGrow = useResponsiveProp(grow, 0);\n    const flexItemBasis = useResponsiveProp(basis, \"auto\");\n\n    const itemStyle = {\n      \"--saltFlexItem-alignment\": align,\n      \"--saltFlexItem-shrink\": flexItemShrink,\n      \"--saltFlexItem-grow\": flexItemGrow,\n      \"--saltFlexItem-basis\": flexItemBasis,\n      ...style,\n    };\n    return (\n      <Component\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        style={itemStyle}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["flexItemCss"],"mappings":";;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AACzC,MAAM,oBAAuB,GAAA;AAAA,EAClC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA+BO,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,cAAA,GAAiB,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAClD,IAAM,MAAA,YAAA,GAAe,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAC9C,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,KAAA,EAAO,MAAM,CAAA,CAAA;AAErD,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,0BAA4B,EAAA,KAAA;AAAA,MAC5B,uBAAyB,EAAA,cAAA;AAAA,MACzB,qBAAuB,EAAA,YAAA;AAAA,MACvB,sBAAwB,EAAA,aAAA;AAAA,MACxB,GAAG,KAAA;AAAA,KACL,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"FlexItem.js","sources":["../src/flex-item/FlexItem.tsx"],"sourcesContent":["import { forwardRef, ElementType, ReactElement, CSSProperties } from \"react\";\nimport {\n  makePrefixer,\n  ResponsiveProp,\n  useResponsiveProp,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport flexItemCss from \"./FlexItem.css\";\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexItem\");\nexport const FLEX_ITEM_ALIGNMENTS = [\n  \"start\",\n  \"end\",\n  \"center\",\n  \"stretch\",\n] as const;\n\nexport type flexItemAlignment = (typeof FLEX_ITEM_ALIGNMENTS)[number];\n\nexport type FlexItemProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n       */\n      align?: flexItemAlignment;\n      /**\n       * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n       */\n      shrink?: ResponsiveProp<number>;\n      /**\n       * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n       */\n      grow?: ResponsiveProp<number>;\n      /**\n       * Sets the initial main size of a flex item, default is \"auto\".\n       */\n      basis?: ResponsiveProp<CSSProperties[\"flexBasis\"]>;\n    }\n  >;\n\ntype FlexItemComponent = <T extends ElementType = \"div\">(\n  props: FlexItemProps<T>\n) => ReactElement | null;\n\nexport const FlexItem: FlexItemComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      as,\n      align,\n      children,\n      className,\n      shrink,\n      grow,\n      basis,\n      style,\n      ...rest\n    }: FlexItemProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-flex-item\",\n      css: flexItemCss,\n      window: targetWindow,\n    });\n\n    const Component = as || \"div\";\n    const flexItemShrink = useResponsiveProp(shrink, 1);\n    const flexItemGrow = useResponsiveProp(grow, 0);\n    const flexItemBasis = useResponsiveProp(basis, \"auto\");\n\n    const itemStyle = {\n      \"--saltFlexItem-alignment\": align,\n      \"--saltFlexItem-shrink\": flexItemShrink,\n      \"--saltFlexItem-grow\": flexItemGrow,\n      \"--saltFlexItem-basis\": flexItemBasis,\n      ...style,\n    };\n    return (\n      <Component\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        style={itemStyle}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["flexItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,cAAc,CAAA,CAAA;AACzC,MAAM,oBAAuB,GAAA;AAAA,EAClC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AACF,EAAA;AA+BO,MAAM,QAA8B,GAAA,UAAA;AAAA,EACzC,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,cAAA,GAAiB,iBAAkB,CAAA,MAAA,EAAQ,CAAC,CAAA,CAAA;AAClD,IAAM,MAAA,YAAA,GAAe,iBAAkB,CAAA,IAAA,EAAM,CAAC,CAAA,CAAA;AAC9C,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,KAAA,EAAO,MAAM,CAAA,CAAA;AAErD,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,0BAA4B,EAAA,KAAA;AAAA,MAC5B,uBAAyB,EAAA,cAAA;AAAA,MACzB,qBAAuB,EAAA,YAAA;AAAA,MACvB,sBAAwB,EAAA,aAAA;AAAA,MACxB,GAAG,KAAA;AAAA,KACL,CAAA;AACA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/flex-layout/FlexLayout.js

@@ -5,9 +5,86 @@ import { makePrefixer } from '../utils/makePrefixer.js';
 import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import { useResponsiveProp } from '../utils/useResponsiveProp.js';
-import css_248z from './FlexLayout.css.js';
-import { useWindow } from '@salt-ds/window';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../card/InteractableCard.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import '../salt-provider/SaltProvider.js';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextNotation.js';
+import '../text/TextAction.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flow-layout/FlowLayout.js';
+import '../form-field/FormField.js';
+import '../form-field-context/FormFieldContext.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import '@floating-ui/react';
+import '../viewport/ViewportProvider.js';
+import css_248z from './FlexLayout.css.js';
 
 const withBaseName = makePrefixer("saltFlexLayout");
 const FLEX_ALIGNMENT_BASE = ["start", "end", "center"];

package/dist-es/flex-layout/FlexLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlexLayout.js","sources":["../src/flex-layout/FlexLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n  makePrefixer,\n  ResponsiveProp,\n  useResponsiveProp,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\n\nimport flexLayoutCss from \"./FlexLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexLayout\");\n\nexport type LayoutSeparator = \"start\" | \"center\" | \"end\";\nexport type LayoutDirection = \"row\" | \"column\";\n\nexport const FLEX_ALIGNMENT_BASE = [\"start\", \"end\", \"center\"] as const;\nexport const FLEX_CONTENT_ALIGNMENT_BASE = [\n  ...FLEX_ALIGNMENT_BASE,\n  \"space-between\",\n  \"space-around\",\n  \"space-evenly\",\n] as const;\n\nexport type FlexAlignment = (typeof FLEX_ALIGNMENT_BASE)[number];\nexport type FlexContentAlignment = (typeof FLEX_CONTENT_ALIGNMENT_BASE)[number];\n\nexport type FlexLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n       */\n      align?: FlexAlignment | \"stretch\" | \"baseline\";\n      /**\n       * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n       */\n      direction?: ResponsiveProp<LayoutDirection>;\n      /**\n       * Controls the space between items, default is 3.\n       */\n      gap?: ResponsiveProp<number>;\n      /**\n       * Defines the alignment along the main axis, default is \"start\".\n       */\n      justify?: FlexContentAlignment;\n      /**\n       * **Deprecated:** For separators see `StackLayout` component instead.\n       *\n       * Adds a separator between elements if wrap is not active, default is false.\n       */\n      separators?: LayoutSeparator | true;\n      /**\n       * Allow the items to wrap as needed, default is false.\n       */\n      wrap?: ResponsiveProp<boolean>;\n    }\n  >;\n\ntype FlexLayoutComponent = <T extends ElementType = \"div\">(\n  props: FlexLayoutProps<T>\n) => ReactElement | null;\n\nexport const FlexLayout: FlexLayoutComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      as,\n      align,\n      children,\n      className,\n      direction,\n      gap,\n      justify,\n      separators,\n      style,\n      wrap,\n      ...rest\n    }: FlexLayoutProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-flex-layout\",\n      css: flexLayoutCss,\n      window: targetWindow,\n    });\n\n    const Component = as || \"div\";\n    const separatorAlignment = separators === true ? \"center\" : separators;\n    const addPrefix = (style: string) => {\n      return style === \"start\" || style === \"end\" ? `flex-${style}` : style;\n    };\n\n    const flexGap = useResponsiveProp(gap, 3);\n    const flexDirection = useResponsiveProp(direction, \"row\");\n    const flexWrap = useResponsiveProp(wrap, false);\n    const flexLayoutStyles = {\n      ...style,\n      \"--flexLayout-align\": align && addPrefix(align),\n      \"--flexLayout-direction\": flexDirection,\n      \"--flexLayout-gap-multiplier\": flexGap,\n      \"--flexLayout-justify\": justify && addPrefix(justify),\n      \"--flexLayout-wrap\": flexWrap ? \"wrap\" : \"nowrap\",\n    };\n\n    return (\n      <Component\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"separator\")]: separatorAlignment && !wrap,\n            [withBaseName(\n              `separator-${flexDirection || \"row\"}-${\n                separatorAlignment || \"center\"\n              }`\n            )]: separatorAlignment && !wrap,\n            [withBaseName(`separator-${flexDirection || \"row\"}`)]:\n              separatorAlignment && !wrap,\n          },\n          className\n        )}\n        ref={ref}\n        style={flexLayoutStyles}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["flexLayoutCss","style"],"mappings":";;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAK3C,MAAM,mBAAsB,GAAA,CAAC,OAAS,EAAA,KAAA,EAAO,QAAQ,EAAA;AACrD,MAAM,2BAA8B,GAAA;AAAA,EACzC,GAAG,mBAAA;AAAA,EACH,eAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AACF,EAAA;AA0CO,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,SAAA,GAAY,CAACC,MAAkB,KAAA;AACnC,MAAA,OAAOA,MAAU,KAAA,OAAA,IAAWA,MAAU,KAAA,KAAA,GAAQ,QAAQA,MAAUA,CAAAA,CAAAA,GAAAA,MAAAA,CAAAA;AAAA,KAClE,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,KAAK,CAAA,CAAA;AACxD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,KAAK,CAAA,CAAA;AAC9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,oBAAA,EAAsB,KAAS,IAAA,SAAA,CAAU,KAAK,CAAA;AAAA,MAC9C,wBAA0B,EAAA,aAAA;AAAA,MAC1B,6BAA+B,EAAA,OAAA;AAAA,MAC/B,sBAAA,EAAwB,OAAW,IAAA,SAAA,CAAU,OAAO,CAAA;AAAA,MACpD,mBAAA,EAAqB,WAAW,MAAS,GAAA,QAAA;AAAA,KAC3C,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,sBAAsB,CAAC,IAAA;AAAA,UACpD,CAAC,YAAA;AAAA,YACC,CAAA,UAAA,EAAa,aAAiB,IAAA,KAAA,CAAA,CAAA,EAC5B,kBAAsB,IAAA,QAAA,CAAA,CAAA;AAAA,WAE1B,GAAI,sBAAsB,CAAC,IAAA;AAAA,UAC3B,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,iBAAiB,KAAO,CAAA,CAAA,CAAA,GACjD,sBAAsB,CAAC,IAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,KAAO,EAAA,gBAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"FlexLayout.js","sources":["../src/flex-layout/FlexLayout.tsx"],"sourcesContent":["import { ElementType, forwardRef, ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport {\n  makePrefixer,\n  ResponsiveProp,\n  useResponsiveProp,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\n\nimport flexLayoutCss from \"./FlexLayout.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nconst withBaseName = makePrefixer(\"saltFlexLayout\");\n\nexport type LayoutSeparator = \"start\" | \"center\" | \"end\";\nexport type LayoutDirection = \"row\" | \"column\";\n\nexport const FLEX_ALIGNMENT_BASE = [\"start\", \"end\", \"center\"] as const;\nexport const FLEX_CONTENT_ALIGNMENT_BASE = [\n  ...FLEX_ALIGNMENT_BASE,\n  \"space-between\",\n  \"space-around\",\n  \"space-evenly\",\n] as const;\n\nexport type FlexAlignment = (typeof FLEX_ALIGNMENT_BASE)[number];\nexport type FlexContentAlignment = (typeof FLEX_CONTENT_ALIGNMENT_BASE)[number];\n\nexport type FlexLayoutProps<T extends ElementType> =\n  PolymorphicComponentPropWithRef<\n    T,\n    {\n      /**\n       * Defines the default behavior for how flex items are laid out along the cross axis on the current line, default is \"stretch\".\n       */\n      align?: FlexAlignment | \"stretch\" | \"baseline\";\n      /**\n       * Establishes the main-axis, defining the direction children are placed. Default is \"row\".\n       */\n      direction?: ResponsiveProp<LayoutDirection>;\n      /**\n       * Controls the space between items, default is 3.\n       */\n      gap?: ResponsiveProp<number>;\n      /**\n       * Defines the alignment along the main axis, default is \"start\".\n       */\n      justify?: FlexContentAlignment;\n      /**\n       * **Deprecated:** For separators see `StackLayout` component instead.\n       *\n       * Adds a separator between elements if wrap is not active, default is false.\n       */\n      separators?: LayoutSeparator | true;\n      /**\n       * Allow the items to wrap as needed, default is false.\n       */\n      wrap?: ResponsiveProp<boolean>;\n    }\n  >;\n\ntype FlexLayoutComponent = <T extends ElementType = \"div\">(\n  props: FlexLayoutProps<T>\n) => ReactElement | null;\n\nexport const FlexLayout: FlexLayoutComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      as,\n      align,\n      children,\n      className,\n      direction,\n      gap,\n      justify,\n      separators,\n      style,\n      wrap,\n      ...rest\n    }: FlexLayoutProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-flex-layout\",\n      css: flexLayoutCss,\n      window: targetWindow,\n    });\n\n    const Component = as || \"div\";\n    const separatorAlignment = separators === true ? \"center\" : separators;\n    const addPrefix = (style: string) => {\n      return style === \"start\" || style === \"end\" ? `flex-${style}` : style;\n    };\n\n    const flexGap = useResponsiveProp(gap, 3);\n    const flexDirection = useResponsiveProp(direction, \"row\");\n    const flexWrap = useResponsiveProp(wrap, false);\n    const flexLayoutStyles = {\n      ...style,\n      \"--flexLayout-align\": align && addPrefix(align),\n      \"--flexLayout-direction\": flexDirection,\n      \"--flexLayout-gap-multiplier\": flexGap,\n      \"--flexLayout-justify\": justify && addPrefix(justify),\n      \"--flexLayout-wrap\": flexWrap ? \"wrap\" : \"nowrap\",\n    };\n\n    return (\n      <Component\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"separator\")]: separatorAlignment && !wrap,\n            [withBaseName(\n              `separator-${flexDirection || \"row\"}-${\n                separatorAlignment || \"center\"\n              }`\n            )]: separatorAlignment && !wrap,\n            [withBaseName(`separator-${flexDirection || \"row\"}`)]:\n              separatorAlignment && !wrap,\n          },\n          className\n        )}\n        ref={ref}\n        style={flexLayoutStyles}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["flexLayoutCss","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAK3C,MAAM,mBAAsB,GAAA,CAAC,OAAS,EAAA,KAAA,EAAO,QAAQ,EAAA;AACrD,MAAM,2BAA8B,GAAA;AAAA,EACzC,GAAG,mBAAA;AAAA,EACH,eAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AACF,EAAA;AA0CO,MAAM,UAAkC,GAAA,UAAA;AAAA,EAC7C,CACE;AAAA,IACE,EAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,KAAA,CAAA;AACxB,IAAM,MAAA,kBAAA,GAAqB,UAAe,KAAA,IAAA,GAAO,QAAW,GAAA,UAAA,CAAA;AAC5D,IAAM,MAAA,SAAA,GAAY,CAACC,MAAkB,KAAA;AACnC,MAAA,OAAOA,MAAU,KAAA,OAAA,IAAWA,MAAU,KAAA,KAAA,GAAQ,QAAQA,MAAUA,CAAAA,CAAAA,GAAAA,MAAAA,CAAAA;AAAA,KAClE,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,iBAAkB,CAAA,GAAA,EAAK,CAAC,CAAA,CAAA;AACxC,IAAM,MAAA,aAAA,GAAgB,iBAAkB,CAAA,SAAA,EAAW,KAAK,CAAA,CAAA;AACxD,IAAM,MAAA,QAAA,GAAW,iBAAkB,CAAA,IAAA,EAAM,KAAK,CAAA,CAAA;AAC9C,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,KAAA;AAAA,MACH,oBAAA,EAAsB,KAAS,IAAA,SAAA,CAAU,KAAK,CAAA;AAAA,MAC9C,wBAA0B,EAAA,aAAA;AAAA,MAC1B,6BAA+B,EAAA,OAAA;AAAA,MAC/B,sBAAA,EAAwB,OAAW,IAAA,SAAA,CAAU,OAAO,CAAA;AAAA,MACpD,mBAAA,EAAqB,WAAW,MAAS,GAAA,QAAA;AAAA,KAC3C,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAA,GAAI,sBAAsB,CAAC,IAAA;AAAA,UACpD,CAAC,YAAA;AAAA,YACC,CAAA,UAAA,EAAa,aAAiB,IAAA,KAAA,CAAA,CAAA,EAC5B,kBAAsB,IAAA,QAAA,CAAA,CAAA;AAAA,WAE1B,GAAI,sBAAsB,CAAC,IAAA;AAAA,UAC3B,CAAC,YAAa,CAAA,CAAA,UAAA,EAAa,iBAAiB,KAAO,CAAA,CAAA,CAAA,GACjD,sBAAsB,CAAC,IAAA;AAAA,SAC3B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACA,KAAO,EAAA,gBAAA;AAAA,MACN,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/form-field/FormField.js

@@ -10,6 +10,80 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import { useId } from '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../card/InteractableCard.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../status-indicator/StatusIndicator.js';
+import '../text/Text.js';
+import '../text/Display.js';
+import '../text/Headings.js';
+import '../text/Label.js';
+import '../text/TextNotation.js';
+import '../text/TextAction.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import '@floating-ui/react';
 import css_248z from './FormField.css.js';
 
 const withBaseName = makePrefixer("saltFormField");

package/dist-es/form-field/FormField.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ForwardedRef, forwardRef, HTMLAttributes } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { A11yValueProps, FormFieldContext } from \"../form-field-context\";\nimport { makePrefixer, useId, capitalize } from \"../utils\";\n\nimport formFieldCss from \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\" | \"right\";\n\nexport interface FormFieldProps\n  extends HTMLAttributes<HTMLDivElement>,\n    A11yValueProps {\n  /**\n   * Disabled prop\n   */\n  disabled?: boolean;\n  /**\n   * Location of the label, values: 'top' (default) or 'left'\n   */\n  labelPlacement?: FormFieldLabelPlacement;\n  /**\n   * Readonly prop\n   */\n  readOnly?: boolean;\n  /**\n   * Optional id prop\n   *\n   * Used as suffix of FormFieldLabel id: `label-{id}`\n   * Used as suffix of FormFieldHelperText id: `helperText-{id}`\n   */\n  id?: string;\n  /**\n   * Displays necessity on label\n   */\n  necessity?: \"required\" | \"optional\" | \"asterisk\";\n  /**\n   * Validation status\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport const FormField = forwardRef(\n  (\n    {\n      children,\n      className,\n      disabled = false,\n      id: idProp,\n      labelPlacement = \"top\",\n      necessity,\n      onBlur,\n      onFocus,\n      readOnly = false,\n      validationStatus,\n      ...restProps\n    }: FormFieldProps,\n    ref: ForwardedRef<HTMLDivElement>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-field\",\n      css: formFieldCss,\n      window: targetWindow,\n    });\n\n    const formId = useId(idProp);\n\n    const labelId = formId ? `label-${formId}` : undefined;\n    const helperTextId = formId ? `helperText-${formId}` : undefined;\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(`label${capitalize(labelPlacement)}`)]:\n              labelPlacement,\n          },\n          className\n        )}\n        {...restProps}\n      >\n        <FormFieldContext.Provider\n          value={{\n            a11yProps: {\n              \"aria-labelledby\": labelId,\n              \"aria-describedby\": helperTextId,\n            },\n            disabled,\n            necessity,\n            readOnly,\n            validationStatus,\n          }}\n        >\n          {children}\n        </FormFieldContext.Provider>\n      </div>\n    );\n  }\n);\n"],"names":["formFieldCss"],"mappings":";;;;;;;;;;;;;;AA2CA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,EAAI,EAAA,MAAA;AAAA,IACJ,cAAiB,GAAA,KAAA;AAAA,IACjB,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,gBAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,MAAM,MAAM,CAAA,CAAA;AAE3B,IAAM,MAAA,OAAA,GAAU,MAAS,GAAA,CAAA,MAAA,EAAS,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAC7C,IAAM,MAAA,YAAA,GAAe,MAAS,GAAA,CAAA,WAAA,EAAc,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEvD,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,CAAA,KAAA,EAAQ,UAAW,CAAA,cAAc,GAAG,CAChD,GAAA,cAAA;AAAA,SACJ;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA,CAAC,iBAAiB,QAAjB,EAAA;AAAA,QACC,KAAO,EAAA;AAAA,UACL,SAAW,EAAA;AAAA,YACT,iBAAmB,EAAA,OAAA;AAAA,YACnB,kBAAoB,EAAA,YAAA;AAAA,WACtB;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,QAAA;AAAA,UACA,gBAAA;AAAA,SACF;AAAA,QAEC,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ForwardedRef, forwardRef, HTMLAttributes } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { A11yValueProps, FormFieldContext } from \"../form-field-context\";\nimport { makePrefixer, useId, capitalize } from \"../utils\";\n\nimport formFieldCss from \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\" | \"right\";\n\nexport interface FormFieldProps\n  extends HTMLAttributes<HTMLDivElement>,\n    A11yValueProps {\n  /**\n   * Disabled prop\n   */\n  disabled?: boolean;\n  /**\n   * Location of the label, values: 'top' (default) or 'left'\n   */\n  labelPlacement?: FormFieldLabelPlacement;\n  /**\n   * Readonly prop\n   */\n  readOnly?: boolean;\n  /**\n   * Optional id prop\n   *\n   * Used as suffix of FormFieldLabel id: `label-{id}`\n   * Used as suffix of FormFieldHelperText id: `helperText-{id}`\n   */\n  id?: string;\n  /**\n   * Displays necessity on label\n   */\n  necessity?: \"required\" | \"optional\" | \"asterisk\";\n  /**\n   * Validation status\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n}\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport const FormField = forwardRef(\n  (\n    {\n      children,\n      className,\n      disabled = false,\n      id: idProp,\n      labelPlacement = \"top\",\n      necessity,\n      onBlur,\n      onFocus,\n      readOnly = false,\n      validationStatus,\n      ...restProps\n    }: FormFieldProps,\n    ref: ForwardedRef<HTMLDivElement>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-field\",\n      css: formFieldCss,\n      window: targetWindow,\n    });\n\n    const formId = useId(idProp);\n\n    const labelId = formId ? `label-${formId}` : undefined;\n    const helperTextId = formId ? `helperText-${formId}` : undefined;\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(`label${capitalize(labelPlacement)}`)]:\n              labelPlacement,\n          },\n          className\n        )}\n        {...restProps}\n      >\n        <FormFieldContext.Provider\n          value={{\n            a11yProps: {\n              \"aria-labelledby\": labelId,\n              \"aria-describedby\": helperTextId,\n            },\n            disabled,\n            necessity,\n            readOnly,\n            validationStatus,\n          }}\n        >\n          {children}\n        </FormFieldContext.Provider>\n      </div>\n    );\n  }\n);\n"],"names":["formFieldCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,CACE;AAAA,IACE,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,EAAI,EAAA,MAAA;AAAA,IACJ,cAAiB,GAAA,KAAA;AAAA,IACjB,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,gBAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AACH,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,MAAM,MAAM,CAAA,CAAA;AAE3B,IAAM,MAAA,OAAA,GAAU,MAAS,GAAA,CAAA,MAAA,EAAS,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAC7C,IAAM,MAAA,YAAA,GAAe,MAAS,GAAA,CAAA,WAAA,EAAc,MAAW,CAAA,CAAA,GAAA,KAAA,CAAA,CAAA;AAEvD,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,CAAA,KAAA,EAAQ,UAAW,CAAA,cAAc,GAAG,CAChD,GAAA,cAAA;AAAA,SACJ;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA,CAAC,iBAAiB,QAAjB,EAAA;AAAA,QACC,KAAO,EAAA;AAAA,UACL,SAAW,EAAA;AAAA,YACT,iBAAmB,EAAA,OAAA;AAAA,YACnB,kBAAoB,EAAA,YAAA;AAAA,WACtB;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,QAAA;AAAA,UACA,gBAAA;AAAA,SACF;AAAA,QAEC,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/form-field/FormFieldHelperText.js

@@ -13,11 +13,79 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../card/InteractableCard.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import './FormField.js';
 import '../form-field-context/FormFieldContext.js';
 import { useFormFieldProps } from '../form-field-context/useFormFieldProps.js';
-import { useWindow } from '@salt-ds/window';
-import { useComponentCssInjection } from '@salt-ds/styles';
 import css_248z from './FormFieldHelperText.css.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import '@floating-ui/react';
 
 const withBaseName = makePrefixer("saltFormFieldHelperText");
 const FormFieldHelperText = ({

package/dist-es/form-field/FormFieldHelperText.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormFieldHelperText.js","sources":["../src/form-field/FormFieldHelperText.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { Text, TextProps } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport formFieldHelperTextCss from \"./FormFieldHelperText.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldHelperText\");\n\nexport const FormFieldHelperText = ({\n  className,\n  children,\n  ...restProps\n}: Omit<TextProps<\"label\">, \"variant\" | \"styleAs\">) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-field-helper-text\",\n    css: formFieldHelperTextCss,\n    window: targetWindow,\n  });\n\n  const { a11yProps, disabled, readOnly, validationStatus } =\n    useFormFieldProps();\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        { [withBaseName(\"withValidation\")]: validationStatus },\n        className\n      )}\n    >\n      {!disabled && !readOnly && validationStatus && (\n        <StatusIndicator status={validationStatus} />\n      )}\n      <Text\n        disabled={disabled}\n        id={a11yProps?.[\"aria-describedby\"]}\n        variant=\"secondary\"\n        styleAs=\"label\"\n        {...restProps}\n      >\n        {children}\n      </Text>\n    </div>\n  );\n};\n"],"names":["formFieldHelperTextCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,yBAAyB,CAAA,CAAA;AAEpD,MAAM,sBAAsB,CAAC;AAAA,EAClC,SAAA;AAAA,EACA,QAAA;AAAA,EACG,GAAA,SAAA;AACL,CAAuD,KAAA;AACrD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,6BAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,QAAU,EAAA,gBAAA,KACrC,iBAAkB,EAAA,CAAA;AAEpB,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAa,CAAA,gBAAgB,IAAI,gBAAiB,EAAA;AAAA,MACrD,SAAA;AAAA,KACF;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,CAAC,QAAY,IAAA,CAAC,QAAY,IAAA,gBAAA,oBACxB,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,sBAE5C,GAAA,CAAA,IAAA,EAAA;AAAA,QACC,QAAA;AAAA,QACA,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,kBAAA,CAAA;AAAA,QAChB,OAAQ,EAAA,WAAA;AAAA,QACR,OAAQ,EAAA,OAAA;AAAA,QACP,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"FormFieldHelperText.js","sources":["../src/form-field/FormFieldHelperText.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { StatusIndicator } from \"../status-indicator\";\nimport { Text, TextProps } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport formFieldHelperTextCss from \"./FormFieldHelperText.css\";\n\nconst withBaseName = makePrefixer(\"saltFormFieldHelperText\");\n\nexport const FormFieldHelperText = ({\n  className,\n  children,\n  ...restProps\n}: Omit<TextProps<\"label\">, \"variant\" | \"styleAs\">) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-field-helper-text\",\n    css: formFieldHelperTextCss,\n    window: targetWindow,\n  });\n\n  const { a11yProps, disabled, readOnly, validationStatus } =\n    useFormFieldProps();\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        { [withBaseName(\"withValidation\")]: validationStatus },\n        className\n      )}\n    >\n      {!disabled && !readOnly && validationStatus && (\n        <StatusIndicator status={validationStatus} />\n      )}\n      <Text\n        disabled={disabled}\n        id={a11yProps?.[\"aria-describedby\"]}\n        variant=\"secondary\"\n        styleAs=\"label\"\n        {...restProps}\n      >\n        {children}\n      </Text>\n    </div>\n  );\n};\n"],"names":["formFieldHelperTextCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAe,aAAa,yBAAyB,CAAA,CAAA;AAEpD,MAAM,sBAAsB,CAAC;AAAA,EAClC,SAAA;AAAA,EACA,QAAA;AAAA,EACG,GAAA,SAAA;AACL,CAAuD,KAAA;AACrD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,6BAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,SAAW,EAAA,QAAA,EAAU,QAAU,EAAA,gBAAA,KACrC,iBAAkB,EAAA,CAAA;AAEpB,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAa,CAAA,gBAAgB,IAAI,gBAAiB,EAAA;AAAA,MACrD,SAAA;AAAA,KACF;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,CAAC,QAAY,IAAA,CAAC,QAAY,IAAA,gBAAA,oBACxB,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAQ,EAAA,gBAAA;AAAA,OAAkB,CAAA;AAAA,sBAE5C,GAAA,CAAA,IAAA,EAAA;AAAA,QACC,QAAA;AAAA,QACA,IAAI,SAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,kBAAA,CAAA;AAAA,QAChB,OAAQ,EAAA,WAAA;AAAA,QACR,OAAQ,EAAA,OAAA;AAAA,QACP,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-es/form-field/FormFieldLabel.js

@@ -17,7 +17,76 @@ import '../utils/useFloatingUI/useFloatingUI.js';
 import '../utils/useId.js';
 import '../salt-provider/SaltProvider.js';
 import '../viewport/ViewportProvider.js';
+import '../accordion/AccordionGroup.js';
+import '../accordion/AccordionPanel.js';
+import '../accordion/Accordion.js';
+import '../accordion/AccordionHeader.js';
+import '../aria-announcer/AriaAnnouncerContext.js';
+import '../avatar/Avatar.js';
+import '../badge/Badge.js';
+import '../banner/Banner.js';
+import '../banner/BannerActions.js';
+import '../banner/BannerContent.js';
+import '../border-item/BorderItem.js';
+import '../border-layout/BorderLayout.js';
+import '../button/Button.js';
+import '../card/Card.js';
+import '../card/InteractableCard.js';
+import '../checkbox/Checkbox.js';
+import '../checkbox/CheckboxGroup.js';
+import '@salt-ds/icons';
+import '../combo-box/ComboBox.js';
+import '../dialog/Dialog.js';
+import '../status-indicator/StatusIndicator.js';
+import '../dialog/DialogContext.js';
+import '../dialog/DialogActions.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogCloseButton.js';
+import '../drawer/Drawer.js';
+import '../drawer/DrawerCloseButton.js';
+import '../dropdown/Dropdown.js';
+import '../file-drop-zone/FileDropZone.js';
+import '../file-drop-zone/FileDropZoneIcon.js';
+import '../file-drop-zone/FileDropZoneTrigger.js';
+import '../flex-item/FlexItem.js';
+import '../flex-layout/FlexLayout.js';
+import '../flow-layout/FlowLayout.js';
+import './FormField.js';
 import css_248z from './FormFieldLabel.css.js';
+import '../grid-item/GridItem.js';
+import '../grid-layout/GridLayout.js';
+import '../input/Input.js';
+import '../link/Link.js';
+import '../link-card/LinkCard.js';
+import '../list-control/ListControlContext.js';
+import '../multiline-input/MultilineInput.js';
+import '../navigation-item/NavigationItem.js';
+import '../option/Option.js';
+import '../option/OptionGroup.js';
+import '../pagination/Pagination.js';
+import '../pagination/Paginator.js';
+import '../pagination/CompactInput.js';
+import '../pagination/CompactPaginator.js';
+import '../pagination/GoToInput.js';
+import '../panel/Panel.js';
+import '../pill/Pill.js';
+import '../progress/CircularProgress/CircularProgress.js';
+import '../progress/LinearProgress/LinearProgress.js';
+import '../radio-button/RadioButton.js';
+import '../radio-button/RadioButtonGroup.js';
+import '../scrim/Scrim.js';
+import '../spinner/Spinner.js';
+import '../stack-layout/StackLayout.js';
+import '../status-adornment/StatusAdornment.js';
+import '../toast/Toast.js';
+import '../toast/ToastContent.js';
+import '../split-layout/SplitLayout.js';
+import '../switch/Switch.js';
+import '../toggle-button/ToggleButton.js';
+import '../toggle-button-group/ToggleButtonGroup.js';
+import '../toggle-button-group/ToggleButtonGroupContext.js';
+import '../tooltip/Tooltip.js';
+import '@floating-ui/react';
 
 const withBaseName = makePrefixer("saltFormFieldLabel");
 const FormFieldLabel = ({