@salt-ds/lab 1.0.0-alpha.0

package/dist-cjs/packages/lab/src/query-input/useQueryInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useQueryInput.js","sources":["../src/query-input/useQueryInput.ts"],"sourcesContent":["import { useControlled, useForkRef } from \"@salt-ds/core\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  ForwardedRef,\n  KeyboardEventHandler,\n  Ref,\n  RefObject,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { QueryInputBodyProps } from \"./internal/QueryInputBody\";\nimport { usePopperStatus } from \"./internal/usePopperStatus\";\nimport { ValueSelectorProps } from \"./internal/ValueSelector\";\nimport { QueryInputProps } from \"./QueryInput\";\nimport { QueryInputCategory, QueryInputItem } from \"./queryInputTypes\";\nimport { useWidth } from \"../responsive\";\n\nexport type BooleanOperator = \"or\" | \"and\";\n\nexport interface UseQueryInputResult {\n  queryInputProps: {\n    onFocus: FocusEventHandler<HTMLDivElement>;\n    onBlur: FocusEventHandler<HTMLDivElement>;\n  };\n  queryInputBodyRef: Ref<HTMLDivElement>;\n  queryInputBodyProps: QueryInputBodyProps;\n  valueSelectorProps: ValueSelectorProps;\n}\n\nexport function useQueryInput(\n  props: QueryInputProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n): UseQueryInputResult {\n  const bodyRef = useRef<HTMLDivElement>(null);\n  const popperRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [widthBodyRef, bodyWidth] = useWidth<HTMLDivElement>(true);\n\n  const forkedRef1 = useForkRef<HTMLDivElement>(\n    forwardedRef,\n    bodyRef\n  ) as RefObject<HTMLDivElement>;\n  const queryInputBodyRef = useForkRef<HTMLDivElement>(\n    forkedRef1,\n    widthBodyRef\n  );\n\n  const [selectedItems, setSelectedItems] = useControlled({\n    controlled: props.selectedItems,\n    default: props.defaultSelectedItems || [],\n    name: \"QueryInput\",\n    state: \"selectedItems\",\n  });\n\n  const [booleanOperator, setBooleanOperator] = useControlled({\n    controlled: props.booleanOperator,\n    default: props.defaultBooleanOperator || \"and\",\n    name: \"QueryInput\",\n    state: \"booleanOperator\",\n  });\n\n  const popperStatus = usePopperStatus({\n    initialOpen: false,\n    autoClose: props.autoClose,\n  });\n\n  const [isFocused, setIsFocused] = useState<boolean>(false);\n  const [highlightedIndex, setHighlightedIndex] = useState(0);\n  const [highlightedCategoryIndex, setHighlightedCategoryIndex] = useState(0);\n  const [highlightedValueIndex, setHighlightedValueIndex] = useState(0);\n  const [selectedCategory, setSelectedCategory] =\n    useState<QueryInputCategory | null>(null);\n  const searchListIndexPositions = useRef<Array<QueryInputCategory | string>>(\n    []\n  );\n\n  const onInputFocus: FocusEventHandler<HTMLInputElement> = (event) => {\n    popperStatus.onFocus(event);\n    setIsFocused(true);\n  };\n\n  const onInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n    if (!inputRef.current) {\n      return;\n    }\n    const relatedTarget = event.relatedTarget as Node | null;\n    const isBodyFocused = bodyRef.current === relatedTarget;\n    if (isBodyFocused) {\n      inputRef.current.focus();\n      return;\n    }\n    const isFocusWithinBody =\n      bodyRef.current && bodyRef.current.contains(relatedTarget);\n    if (isFocusWithinBody) {\n      return;\n    }\n    const isFocusWithinPopper =\n      popperRef.current && popperRef.current.contains(relatedTarget);\n    if (isFocusWithinPopper) {\n      inputRef.current.focus();\n      return;\n    }\n    setIsFocused(false);\n    popperStatus.onBlur(event);\n  };\n\n  const onFocus: FocusEventHandler<HTMLDivElement> = (event) => {\n    setIsFocused(true);\n    popperStatus.onFocus(event);\n  };\n\n  const onBlur: FocusEventHandler<HTMLDivElement> = (event) => {\n    let relatedTarget = event.relatedTarget as Node | null;\n    const isBodyFocused = bodyRef.current === relatedTarget;\n    if (isBodyFocused) {\n      return;\n    }\n    const isFocusWithinBody =\n      bodyRef.current && bodyRef.current.contains(relatedTarget);\n    if (isFocusWithinBody) {\n      return;\n    }\n    const isFocusWithinPopper =\n      popperRef.current && popperRef.current.contains(relatedTarget);\n    if (isFocusWithinPopper) {\n      return;\n    }\n    setIsFocused(false);\n    popperStatus.onBlur(event);\n  };\n\n  const onSelectedItemsChange = (newItems: QueryInputItem[] | undefined) => {\n    const newItem =\n      newItems &&\n      newItems.find(\n        (item) => item.category == null && item.value === inputValue\n      );\n    if (newItem) {\n      setInputValue(\"\");\n    }\n    setSelectedItems(newItems || []);\n    if (props.onChange) {\n      props.onChange(newItems || []);\n    }\n    popperStatus.onChange();\n  };\n\n  const onBooleanOperatorChange = (operator: BooleanOperator) => {\n    setBooleanOperator(operator);\n    if (props.onBooleanOperatorChange) {\n      props.onBooleanOperatorChange(operator);\n    }\n  };\n\n  const onSelectedCategoryChange = (category: QueryInputCategory | null) => {\n    if (inputRef.current) {\n      inputRef.current.focus();\n    }\n    setSelectedCategory(category);\n  };\n\n  const [inputValue, setInputValue] = useState<string>(\"\");\n\n  const searchListItems = useMemo(() => {\n    const [searchListItems, indexPositions] = filterCategories(\n      props.categories,\n      inputValue\n    );\n    searchListIndexPositions.current = indexPositions;\n    return searchListItems;\n  }, [props.categories, inputValue]);\n\n  const onInputChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    const newInputValue = event.target.value;\n    setInputValue(newInputValue);\n    // If we have search results, the first index position will be a header\n    setHighlightedIndex(searchListIndexPositions.current.length === 0 ? 0 : 1);\n  };\n\n  const searchListItemCount = useMemo(() => {\n    return searchListItems.reduce(\n      (acc, category) => acc + category.values.length,\n      0\n    );\n  }, [searchListItems]);\n\n  const onInputClear = () => {\n    onSelectedItemsChange([]);\n  };\n\n  const onInputClick = () => {\n    popperStatus.onClick();\n  };\n\n  const newItemFromSelected = (): QueryInputItem | undefined => {\n    const i = highlightedIndex;\n    for (const category of searchListItems) {\n      if (i < category.values.length) {\n        const value = category.values[i];\n        return {\n          category: category.name,\n          value,\n        };\n      }\n    }\n  };\n\n  const { displayedItemCount = 10 } = props;\n\n  const onSearchListKeyDown = (key: string) => {\n    switch (key) {\n      case \"Home\":\n        setHighlightedIndex(0);\n        return;\n      case \"End\":\n        setHighlightedIndex(searchListItemCount);\n        return;\n      case \"ArrowUp\":\n        setHighlightedIndex((i) =>\n          prevSearchItemIndex(i, searchListIndexPositions.current)\n        );\n        return;\n      case \"ArrowDown\":\n        // setHighlightedIndex((i) => Math.min(searchListItemCount, i + 1));\n        setHighlightedIndex((i) =>\n          nextSearchItemIndex(i, searchListIndexPositions.current)\n        );\n        return;\n      case \"PageDown\":\n        setHighlightedIndex((i) =>\n          Math.min(searchListItemCount, i + displayedItemCount)\n        );\n        return;\n      case \"PageUp\":\n        setHighlightedIndex((i) => Math.max(0, i - displayedItemCount));\n        return;\n      case \"Enter\":\n        if (highlightedIndex === searchListItemCount) {\n          const newItems = [\n            ...selectedItems,\n            { category: null, value: inputValue },\n          ];\n          onSelectedItemsChange(newItems);\n        } else {\n          if (highlightedIndex >= 0 && highlightedIndex < searchListItemCount) {\n            const newItem = newItemFromSelected();\n            if (newItem) {\n              const newItems = [...selectedItems, newItem];\n              onSelectedItemsChange(newItems);\n            }\n          }\n          setInputValue(\"\");\n        }\n        return;\n      default:\n        return;\n    }\n  };\n\n  const onCategoryListKeyDown = (key: string) => {\n    switch (key) {\n      case \"Home\":\n        setHighlightedCategoryIndex(0);\n        return;\n      case \"End\":\n        setHighlightedCategoryIndex(props.categories.length - 1);\n        return;\n      case \"ArrowUp\":\n        setHighlightedCategoryIndex((i) => Math.max(0, i - 1));\n        return;\n      case \"ArrowDown\":\n        setHighlightedCategoryIndex((i) =>\n          Math.min(props.categories.length - 1, i + 1)\n        );\n        return;\n      case \"PageUp\":\n        setHighlightedCategoryIndex((i) => Math.max(0, i - displayedItemCount));\n        return;\n      case \"PageDown\":\n        setHighlightedCategoryIndex((i) =>\n          Math.min(props.categories.length - 1, i + displayedItemCount)\n        );\n        return;\n      case \"Enter\":\n        if (\n          highlightedCategoryIndex >= 0 &&\n          highlightedCategoryIndex < props.categories.length\n        ) {\n          const category = props.categories[highlightedCategoryIndex];\n          setSelectedCategory(category);\n        }\n        return;\n      case \"ArrowRight\":\n        if (\n          highlightedCategoryIndex >= 0 &&\n          highlightedCategoryIndex < props.categories.length\n        ) {\n          const category = props.categories[highlightedCategoryIndex];\n          setSelectedCategory(category);\n        }\n        return;\n      default:\n        return;\n    }\n  };\n\n  const onValueListKeyDown = (key: string) => {\n    switch (key) {\n      case \"Home\":\n        setHighlightedValueIndex(0);\n        return;\n      case \"End\":\n        setHighlightedValueIndex(selectedCategory!.values.length);\n        return;\n      case \"ArrowUp\":\n        setHighlightedValueIndex((i) => Math.max(0, i - 1));\n        return;\n      case \"ArrowDown\":\n        setHighlightedValueIndex((i) =>\n          Math.min(selectedCategory!.values.length, i + 1)\n        );\n        return;\n      case \"PageUp\":\n        setHighlightedValueIndex((i) => Math.max(0, i - displayedItemCount));\n        return;\n      case \"PageDown\":\n        setHighlightedValueIndex((i) =>\n          Math.min(selectedCategory!.values.length, i + displayedItemCount)\n        );\n        return;\n      case \"Enter\":\n        if (highlightedValueIndex === 0) {\n          setSelectedCategory(null);\n        } else {\n          const value = selectedCategory!.values[highlightedValueIndex - 1];\n          const newItems = selectedItems.filter(\n            (item) =>\n              !(\n                item.category === selectedCategory!.name && item.value === value\n              )\n          );\n          if (newItems.length === selectedItems.length) {\n            newItems.push({ category: selectedCategory!.name, value });\n          }\n          onSelectedItemsChange(newItems);\n        }\n        return;\n      case \"ArrowLeft\":\n        setSelectedCategory(null);\n        return;\n      default:\n        return;\n    }\n  };\n\n  const onKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n    popperStatus.onKeyDown(event);\n    let key = event.key;\n    if (event.key === \" \" && event.ctrlKey) {\n      key = \"Enter\";\n    }\n    const isSearchListActive = inputValue !== \"\";\n    const isCategoryListActive = !isSearchListActive && !selectedCategory;\n    const isValueListActive = !isSearchListActive && !isCategoryListActive;\n    if (isSearchListActive) {\n      onSearchListKeyDown(key);\n    } else if (isCategoryListActive) {\n      onCategoryListKeyDown(key);\n    } else {\n      onValueListKeyDown(key);\n    }\n    switch (event.key) {\n      case \"ArrowUp\":\n      case \"ArrowDown\":\n      case \"Enter\":\n        event.preventDefault();\n        break;\n      case \"ArrowLeft\":\n        if (isValueListActive) {\n          event.preventDefault();\n        }\n        break;\n      case \"ArrowRight\":\n        if (isCategoryListActive) {\n          event.preventDefault();\n        }\n        break;\n      case \"Escape\":\n        setInputValue(\"\");\n    }\n  };\n\n  const onValueToggle = (category: QueryInputCategory, value: string) => {\n    const newItems = selectedItems.filter(\n      (item) => !(item.category === category.name && item.value === value)\n    );\n    if (newItems.length === selectedItems.length) {\n      newItems.push({ category: category.name, value });\n    }\n    onSelectedItemsChange(newItems);\n  };\n\n  return {\n    queryInputBodyRef,\n    queryInputProps: {\n      onFocus,\n      onBlur,\n    },\n    queryInputBodyProps: {\n      inputRef: inputRef,\n      disabled: props.disabled,\n      selectedItems,\n      onFocus,\n      onBlur,\n      onInputClick,\n      onInputFocus,\n      onInputBlur,\n      onInputClear,\n      inputValue,\n      onInputChange,\n      onSelectedItemsChange,\n      onKeyDown,\n      isFocused,\n      booleanOperator,\n      onBooleanOperatorChange,\n    },\n    valueSelectorProps: {\n      isOpen: popperStatus.isOpen,\n      categories: props.categories,\n      selectedCategory,\n      selectedItems,\n      onValueToggle,\n      onSearchListChange: onSelectedItemsChange,\n      anchorElement: bodyRef.current,\n      width: bodyWidth,\n      onSelectedCategoryChange,\n      popperRef,\n      inputValue,\n      highlightedIndex,\n      visibleCategories: searchListItems,\n      highlightedCategoryIndex,\n      highlightedValueIndex,\n      setHighlightedCategoryIndex,\n      setHighlightedValueIndex,\n      setHighlightedIndex,\n    },\n  };\n}\n\nfunction filterCategories(\n  categories: QueryInputCategory[],\n  inputValue?: string\n): [QueryInputCategory[], Array<QueryInputCategory | string>] {\n  // Note: if there is no input value, this List would not be display\n  if (!inputValue) {\n    return [categories, []];\n  }\n  const query = inputValue.toUpperCase();\n  const visibleCategories: QueryInputCategory[] = [];\n  const indexPositions: Array<QueryInputCategory | string> = [];\n  for (const c of categories) {\n    const values = c.values.filter((v) => v.toUpperCase().includes(query));\n    if (values.length > 0) {\n      const queryInputCategory = {\n        name: c.name,\n        values,\n      };\n      visibleCategories.push(queryInputCategory);\n      indexPositions.push(queryInputCategory, ...values);\n    }\n  }\n  return [visibleCategories, indexPositions];\n}\n\nfunction nextSearchItemIndex(\n  index: number,\n  indexPositions: Array<QueryInputCategory | string>\n) {\n  const nextIndex = index + 1;\n  // Note: allow 1 for the extra ListItem we append to end of List\n  if (nextIndex === indexPositions.length + 1) {\n    return index;\n  } else if (nextIndex === indexPositions.length) {\n    return nextIndex;\n  } else if (typeof indexPositions[nextIndex] === \"string\") {\n    return nextIndex;\n  } else {\n    return nextIndex + 1;\n  }\n}\n\nfunction prevSearchItemIndex(\n  index: number,\n  indexPositions: Array<QueryInputCategory | string>\n) {\n  const nextIndex = index - 1;\n  if (nextIndex === 0) {\n    return index;\n  } else if (typeof indexPositions[nextIndex] === \"string\") {\n    return nextIndex;\n  } else {\n    return nextIndex - 1;\n  }\n}\n"],"names":["useRef","useWidth","useForkRef","useControlled","usePopperStatus","useState","useMemo","searchListItems"],"mappings":"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"}

package/dist-cjs/packages/lab/src/radio-button/RadioButton.css.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
+
+var css_248z = "/* Styles applied to root component  */\n.salt-density-medium {\n  --radioButton-label-marginTop: 6px;\n  --radioButton-row-marginRight: 24px;\n}\n\n.salt-density-high {\n  --radioButton-label-marginTop: 3px;\n  --radioButton-row-marginRight: 12px;\n}\n\n.salt-density-low {\n  --radioButton-label-marginTop: 9px;\n  --radioButton-row-marginRight: 36px;\n}\n\n.salt-density-touch {\n  --radioButton-label-marginTop: 12px;\n  --radioButton-row-marginRight: 48px;\n}\n\n.saltRadioButton {\n  cursor: pointer;\n  display: block;\n}\n\n/* Styles applied to root component on hover if `disabled={true}` or FormField disabled */\n.saltRadioButton-disabled,\n.saltFormField-disabled .saltRadioButton {\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n\n.saltRadioButton-disabled {\n  --saltControlLabel-color: var(--salt-text-primary-foreground-disabled);\n\n  pointer-events: visible;\n}\n\n/* Styles applied to container of label and Radio component */\n.saltRadioButton-labelContainer {\n  display: inline-flex;\n  align-items: flex-start;\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: var(--saltRadioButton-label-marginTop, var(--radioButton-label-marginTop));\n  vertical-align: baseline;\n}\n\n.saltRadioButton-labelContainer .saltRadioButton {\n  display: inline-flex;\n  align-content: flex-start;\n  vertical-align: baseline;\n}\n\n.saltFormGroup-row > .saltRadioButton {\n  margin-right: var(--saltFormGroup-row-marginRight, var(--radioButton-row-marginRight));\n}\n";
+styleInject_es(css_248z);
+
+module.exports = css_248z;
+//# sourceMappingURL=RadioButton.css.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButton.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist-cjs/packages/lab/src/radio-button/RadioButton.js

@@ -0,0 +1,66 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var cx = require('classnames');
+var React = require('react');
+var core = require('@salt-ds/core');
+var ControlLabel = require('../control-label/ControlLabel.js');
+var RadioButtonBase = require('./RadioButtonBase.js');
+require('./RadioButton.css.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+const withBaseName = core.makePrefixer("saltRadioButton");
+const RadioButton = React.forwardRef(
+  function RadioButton2(props, ref) {
+    const {
+      checked,
+      className,
+      icon,
+      disabled,
+      label,
+      LabelProps,
+      value,
+      onChange,
+      ...rest
+    } = props;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: cx__default["default"](
+        withBaseName(),
+        {
+          [withBaseName("disabled")]: disabled
+        },
+        className
+      ),
+      ...rest,
+      children: /* @__PURE__ */ jsxRuntime.jsx(ControlLabel.ControlLabel, {
+        ...LabelProps,
+        className: cx__default["default"](
+          withBaseName("labelContainer"),
+          {
+            [withBaseName("disabled")]: disabled
+          },
+          className
+        ),
+        disabled,
+        label,
+        labelPlacement: "right",
+        ref,
+        children: /* @__PURE__ */ jsxRuntime.jsx(RadioButtonBase.RadioButtonBase, {
+          checked,
+          disabled,
+          value,
+          onChange,
+          icon
+        })
+      })
+    });
+  }
+);
+
+exports.RadioButton = RadioButton;
+//# sourceMappingURL=RadioButton.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.js","sources":["../src/radio-button/RadioButton.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport {\n  ChangeEventHandler,\n  forwardRef,\n  HTMLAttributes,\n  ComponentType,\n} from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { ControlLabel, ControlLabelProps } from \"../control-label\";\nimport { RadioButtonBase as Radio } from \"./RadioButtonBase\";\nimport { RadioButtonIconProps } from \"./RadioButtonIcon\";\n\nimport \"./RadioButton.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButton\");\n\nexport interface RadioButtonProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  checked?: boolean;\n  className?: string;\n  disabled?: boolean;\n  /**\n   * Custom icon component\n   */\n  icon?: ComponentType<RadioButtonIconProps>;\n  /**\n   * The label to be shown next to the radio\n   */\n  label?: ControlLabelProps[\"label\"];\n  LabelProps?: Partial<ControlLabelProps>;\n  name?: string;\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  value?: string;\n}\n\nexport const RadioButton = forwardRef<HTMLLabelElement, RadioButtonProps>(\n  function RadioButton(props, ref) {\n    const {\n      checked,\n      className,\n      icon,\n      disabled,\n      label,\n      LabelProps,\n      value,\n      onChange,\n      ...rest\n    } = props;\n\n    return (\n      <div\n        className={classnames(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n          },\n          className\n        )}\n        {...rest}\n      >\n        <ControlLabel\n          {...LabelProps}\n          className={classnames(\n            withBaseName(\"labelContainer\"),\n            {\n              [withBaseName(\"disabled\")]: disabled,\n            },\n            className\n          )}\n          disabled={disabled}\n          label={label}\n          labelPlacement=\"right\"\n          ref={ref}\n        >\n          <Radio\n            checked={checked}\n            disabled={disabled}\n            value={value}\n            onChange={onChange}\n            icon={icon}\n          />\n        </ControlLabel>\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","RadioButton","jsx","classnames","ControlLabel","Radio"],"mappings":";;;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,kBAAa,iBAAiB,CAAA,CAAA;AAqB5C,MAAM,WAAc,GAAAC,gBAAA;AAAA,EACzB,SAASC,YAAY,CAAA,KAAA,EAAO,GAAK,EAAA;AAC/B,IAAM,MAAA;AAAA,MACJ,OAAA;AAAA,MACA,SAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,UAAA;AAAA,MACA,KAAA;AAAA,MACA,QAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAAC,sBAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,SAC9B;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAAD,cAAA,CAAAE,yBAAA,EAAA;AAAA,QACE,GAAG,UAAA;AAAA,QACJ,SAAW,EAAAD,sBAAA;AAAA,UACT,aAAa,gBAAgB,CAAA;AAAA,UAC7B;AAAA,YACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,WAC9B;AAAA,UACA,SAAA;AAAA,SACF;AAAA,QACA,QAAA;AAAA,QACA,KAAA;AAAA,QACA,cAAe,EAAA,OAAA;AAAA,QACf,GAAA;AAAA,QAEA,QAAC,kBAAAD,cAAA,CAAAG,+BAAA,EAAA;AAAA,UACC,OAAA;AAAA,UACA,QAAA;AAAA,UACA,KAAA;AAAA,UACA,QAAA;AAAA,UACA,IAAA;AAAA,SACF,CAAA;AAAA,OACF,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/packages/lab/src/radio-button/RadioButtonBase.css.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
+
+var css_248z = "/* Styles applied to root component */\n.saltRadioButtonBase {\n  color: var(--salt-text-secondary-foreground);\n  padding: 1px 0;\n  flex: 0 0 auto;\n  overflow: visible;\n  text-align: center;\n  border-radius: 50%;\n  border: 0;\n  margin: 0;\n  display: inline-flex;\n  outline: 0;\n  position: relative;\n  align-items: center;\n  user-select: none;\n  vertical-align: middle;\n  justify-content: center;\n  text-decoration: none;\n  background-color: transparent;\n  -webkit-appearance: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n/* Styles applied to container of Radio input and icon */\n.saltRadioButtonBase-radioContainer {\n  width: 100%;\n  display: flex;\n  align-items: inherit;\n  justify-content: inherit;\n}\n\n/* Styles applied to input component */\n.saltRadioButtonBase-input {\n  cursor: inherit;\n  position: absolute;\n  opacity: 0;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  margin: 0;\n  padding: 0;\n  z-index: var(--salt-zIndex-default);\n}\n\n/* Styles applied to root component when state `focusVisible={true}` */\n.saltRadioButtonBase-focusVisible,\n.saltRadioButtonBase:focus {\n  outline: var(--salt-focused-outline);\n  outline-offset: var(--salt-focused-outlineOffset);\n}\n";
+styleInject_es(css_248z);
+
+module.exports = css_248z;
+//# sourceMappingURL=RadioButtonBase.css.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButtonBase.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonBase.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist-cjs/packages/lab/src/radio-button/RadioButtonBase.js

@@ -0,0 +1,146 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var cx = require('classnames');
+var React = require('react');
+require('../form-field-context/FormFieldContext.js');
+var useFormFieldProps = require('../form-field-context/useFormFieldProps.js');
+var core = require('@salt-ds/core');
+var useRadioGroup = require('./internal/useRadioGroup.js');
+var RadioButtonIcon = require('./RadioButtonIcon.js');
+require('./RadioButtonBase.css.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+const withBaseName = core.makePrefixer("saltRadioButtonBase");
+const RadioButtonBase = React.forwardRef(function RadioBase(props, ref) {
+  var _a;
+  const {
+    checked: checkedProp,
+    defaultChecked,
+    name: nameProp,
+    className,
+    disabled: disabledProp,
+    icon: iconProp,
+    value,
+    onFocus,
+    onBlur,
+    onChange,
+    id,
+    tabIndex,
+    ...rest
+  } = props;
+  useFormFieldProps.useFormFieldProps();
+  const radioGroup = useRadioGroup.useRadioGroup();
+  let radioGroupChecked = checkedProp;
+  let name = nameProp;
+  if (radioGroup) {
+    if (typeof radioGroupChecked === "undefined") {
+      radioGroupChecked = radioGroup.value === props.value;
+    }
+    if (typeof name === "undefined") {
+      name = radioGroup.name;
+    }
+  }
+  const [checked, setCheckedState] = core.useControlled({
+    controlled: radioGroupChecked,
+    default: Boolean(defaultChecked),
+    name: "RadioBase",
+    state: "checked"
+  });
+  const formFieldProps = useFormFieldProps.useFormFieldProps();
+  let disabled = disabledProp;
+  if (formFieldProps) {
+    if (typeof disabled === "undefined") {
+      disabled = (_a = formFieldProps.a11yProps) == null ? void 0 : _a.disabled;
+    }
+  }
+  const [focusVisible, setFocusVisible] = React.useState(false);
+  if (disabled && focusVisible) {
+    setFocusVisible(false);
+  }
+  const {
+    isFocusVisibleRef,
+    onFocus: handleFocusVisible,
+    onBlur: handleBlurVisible,
+    ref: focusVisibleRef
+  } = core.useIsFocusVisible();
+  const handleRef = core.useForkRef(
+    ref,
+    focusVisibleRef
+  );
+  const handleFocus = (event) => {
+    if (formFieldProps && formFieldProps.onFocus) {
+      formFieldProps.onFocus(event);
+    }
+    handleFocusVisible(event);
+    if (isFocusVisibleRef.current) {
+      setFocusVisible(true);
+    }
+    if (onFocus) {
+      onFocus(event);
+    }
+  };
+  const handleBlur = (event) => {
+    if (formFieldProps && formFieldProps.onBlur) {
+      formFieldProps.onBlur(event);
+    }
+    handleBlurVisible();
+    setFocusVisible(false);
+    if (onBlur) {
+      onBlur(event);
+    }
+  };
+  const handleInputChange = (event) => {
+    const newChecked = event.target.checked;
+    setCheckedState(newChecked);
+    if (onChange) {
+      onChange(event);
+    }
+    if (radioGroup && radioGroup.onChange) {
+      radioGroup.onChange(event);
+    }
+  };
+  const RadioIcon = iconProp || RadioButtonIcon.RadioButtonIcon;
+  return /* @__PURE__ */ jsxRuntime.jsx("span", {
+    className: cx__default["default"](
+      withBaseName(),
+      {
+        [withBaseName("disabled")]: disabled,
+        [withBaseName("focusVisible")]: focusVisible
+      },
+      className
+    ),
+    ref: handleRef,
+    onBlur: handleBlur,
+    onFocus: handleFocus,
+    ...rest,
+    children: /* @__PURE__ */ jsxRuntime.jsxs("span", {
+      className: withBaseName("radioContainer"),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("input", {
+          className: withBaseName("input"),
+          checked: radioGroupChecked,
+          defaultChecked,
+          disabled,
+          id,
+          name,
+          onChange: handleInputChange,
+          type: "radio",
+          value,
+          tabIndex
+        }),
+        /* @__PURE__ */ jsxRuntime.jsx(RadioIcon, {
+          checked
+        })
+      ]
+    })
+  });
+});
+
+exports.RadioButtonBase = RadioButtonBase;
+//# sourceMappingURL=RadioButtonBase.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButtonBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonBase.js","sources":["../src/radio-button/RadioButtonBase.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport {\n  ChangeEventHandler,\n  ComponentType,\n  FocusEventHandler,\n  forwardRef,\n  Ref,\n  useState,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport {\n  makePrefixer,\n  useControlled,\n  useForkRef,\n  useIsFocusVisible,\n} from \"@salt-ds/core\";\nimport { useRadioGroup } from \"./internal/useRadioGroup\";\nimport {\n  RadioButtonIcon as DefaultRadioIcon,\n  RadioButtonIconProps,\n} from \"./RadioButtonIcon\";\n\nimport \"./RadioButtonBase.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonBase\");\n\nexport interface RadioButtonBaseProps {\n  checked?: boolean;\n  className?: string;\n  disabled?: boolean;\n  /**\n   * custom icon component\n   */\n  icon?: ComponentType<RadioButtonIconProps>;\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  name?: string;\n  defaultChecked?: boolean;\n  onFocus?: FocusEventHandler<HTMLSpanElement>;\n  onBlur?: FocusEventHandler<HTMLSpanElement>;\n  required?: boolean;\n  id?: string;\n  tabIndex?: number;\n  value?: string;\n}\n\nexport const RadioButtonBase = forwardRef<\n  HTMLSpanElement,\n  RadioButtonBaseProps\n>(function RadioBase(props, ref) {\n  const {\n    checked: checkedProp,\n    defaultChecked,\n    name: nameProp,\n    className,\n    disabled: disabledProp,\n    icon: iconProp,\n    value,\n    onFocus,\n    onBlur,\n    onChange,\n    id,\n    tabIndex,\n    ...rest\n  } = props;\n\n  useFormFieldProps();\n\n  const radioGroup = useRadioGroup();\n\n  let radioGroupChecked = checkedProp;\n  let name = nameProp;\n  if (radioGroup) {\n    if (typeof radioGroupChecked === \"undefined\") {\n      radioGroupChecked = radioGroup.value === props.value;\n    }\n    if (typeof name === \"undefined\") {\n      name = radioGroup.name;\n    }\n  }\n\n  const [checked, setCheckedState] = useControlled({\n    controlled: radioGroupChecked,\n    default: Boolean(defaultChecked),\n    name: \"RadioBase\",\n    state: \"checked\",\n  });\n\n  const formFieldProps = useFormFieldProps();\n\n  let disabled = disabledProp;\n  if (formFieldProps) {\n    if (typeof disabled === \"undefined\") {\n      disabled = formFieldProps.a11yProps?.disabled;\n    }\n  }\n\n  const [focusVisible, setFocusVisible] = useState(false);\n  if (disabled && focusVisible) {\n    setFocusVisible(false);\n  }\n\n  const {\n    isFocusVisibleRef,\n    onFocus: handleFocusVisible,\n    onBlur: handleBlurVisible,\n    ref: focusVisibleRef,\n  } = useIsFocusVisible();\n\n  const handleRef = useForkRef<HTMLSpanElement>(\n    ref,\n    focusVisibleRef as Ref<HTMLSpanElement>\n  );\n\n  const handleFocus: FocusEventHandler<HTMLElement> = (event) => {\n    if (formFieldProps && formFieldProps.onFocus) {\n      formFieldProps.onFocus(event);\n    }\n    handleFocusVisible(event);\n    if (isFocusVisibleRef.current) {\n      setFocusVisible(true);\n    }\n    if (onFocus) {\n      onFocus(event);\n    }\n  };\n\n  const handleBlur: FocusEventHandler<HTMLElement> = (event) => {\n    if (formFieldProps && formFieldProps.onBlur) {\n      formFieldProps.onBlur(event);\n    }\n    handleBlurVisible();\n    setFocusVisible(false);\n    if (onBlur) {\n      onBlur(event);\n    }\n  };\n\n  const handleInputChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    const newChecked = event.target.checked;\n    setCheckedState(newChecked);\n    if (onChange) {\n      onChange(event);\n    }\n    if (radioGroup && radioGroup.onChange) {\n      radioGroup.onChange(event);\n    }\n  };\n\n  const RadioIcon = iconProp || DefaultRadioIcon;\n\n  return (\n    <span\n      className={classnames(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"focusVisible\")]: focusVisible,\n        },\n        className\n      )}\n      ref={handleRef}\n      onBlur={handleBlur}\n      onFocus={handleFocus}\n      {...rest}\n    >\n      <span className={withBaseName(\"radioContainer\")}>\n        <input\n          className={withBaseName(\"input\")}\n          checked={radioGroupChecked}\n          defaultChecked={defaultChecked}\n          disabled={disabled}\n          id={id}\n          name={name}\n          onChange={handleInputChange}\n          type=\"radio\"\n          value={value}\n          tabIndex={tabIndex}\n        />\n        <RadioIcon checked={checked} />\n      </span>\n    </span>\n  );\n});\n"],"names":["makePrefixer","forwardRef","useFormFieldProps","useRadioGroup","useControlled","useState","useIsFocusVisible","useForkRef","DefaultRadioIcon","jsx","classnames","jsxs"],"mappings":"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"}

package/dist-cjs/packages/lab/src/radio-button/RadioButtonGroup.css.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
+
+var css_248z = "/* Styles applied to root component (RadioButton) */\n.salt-density-high {\n  --radioButton-group-vertical-label-marginBottom: 4px;\n  --radioButton-group-legend-minHeight: 14px;\n  --radioButton-group-legend-paddingRight: 16px;\n  --radioButton-group-horizontal-legend-marginTop: 2px;\n  --radioButton-group-horizontal-legend-marginRight: 12px;\n  --radioButton-group-horizontal-legend-paddingRight: 4px;\n  --radioButton-group-horizontal-legend-marginBottom: 0px;\n  --radioButton-group-vertical-formLabel-paddingRight: 4px;\n  --radioButton-group-vertical-formLabel-marginBottom: 4px;\n  --radioButton-group-vertical-formLabel-transform: translate(0px, 3px);\n  --radioButton-group-formLabel-transform: translate(0px, 3px);\n}\n\n.salt-density-medium {\n  --radioButton-group-vertical-label-marginBottom: 6px;\n  --radioButton-group-legend-minHeight: 14px;\n  --radioButton-group-legend-paddingRight: 16px;\n  --radioButton-group-horizontal-legend-marginTop: 1px;\n  --radioButton-group-horizontal-legend-marginRight: 24px;\n  --radioButton-group-horizontal-legend-paddingRight: 8px;\n  --radioButton-group-horizontal-legend-marginBottom: 0px;\n  --radioButton-group-vertical-formLabel-paddingRight: 8px;\n  --radioButton-group-vertical-formLabel-marginBottom: 6px;\n  --radioButton-group-vertical-formLabel-transform: translate(0px, 5px);\n  --radioButton-group-formLabel-transform: translate(0px, 5px);\n}\n\n.salt-density-low {\n  --radioButton-group-vertical-label-marginBottom: 9px;\n  --radioButton-group-legend-minHeight: 14px;\n  --radioButton-group-legend-paddingRight: 16px;\n  --radioButton-group-horizontal-legend-marginTop: 4px;\n  --radioButton-group-horizontal-legend-marginRight: 36px;\n  --radioButton-group-horizontal-legend-paddingRight: 12px;\n  --radioButton-group-horizontal-legend-marginBottom: 0px;\n  --radioButton-group-vertical-formLabel-paddingRight: 12px;\n  --radioButton-group-vertical-formLabel-marginBottom: 9px;\n  --radioButton-group-vertical-formLabel-transform: translate(0px, 7px);\n  --radioButton-group-formLabel-transform: translate(0px, 7px);\n}\n\n.salt-density-touch {\n  --radioButton-group-vertical-label-marginBottom: 12px;\n  --radioButton-group-legend-minHeight: 16px;\n  --radioButton-group-legend-paddingRight: 16px;\n  --radioButton-group-horizontal-legend-marginTop: 4px;\n  --radioButton-group-horizontal-legend-marginRight: 48px;\n  --radioButton-group-horizontal-legend-paddingRight: 16px;\n  --radioButton-group-horizontal-legend-marginBottom: 0px;\n  --radioButton-group-vertical-formLabel-paddingRight: 16px;\n  --radioButton-group-vertical-formLabel-marginBottom: 12px;\n  --radioButton-group-vertical-formLabel-transform: translate(0px, 11px);\n  --radioButton-group-formLabel-transform: translate(0px, 11px);\n}\n\n/* Styles applied to root element */\n.saltRadioButtonGroup {\n  border: 0;\n  margin: 0;\n  padding: 0;\n  display: inline-flex;\n  flex-direction: column;\n  vertical-align: top;\n}\n\n/* Styles applied when `row=false OR undefined` */\n.saltRadioButtonGroup-vertical .saltRadioButtonGroup-legend.saltFormLabel {\n  margin-bottom: var(--saltRadioButton-group-vertical-label-marginBottom, var(--radioButton-group-vertical-label-marginBottom));\n  margin-top: var(--saltRadioButton-group-vertical-label-marginTop, 0px);\n\n  --saltFormField-label-paddingRight: var(--radioButton-group-vertical-formLabel-paddingRight);\n  --saltFormField-label-marginBottom: var(--radioButton-group-vertical-formLabel-marginBottom);\n  --saltFormField-label-transform: var(--radioButton-group-vertical-formLabel-transform);\n}\n\n/* Styles applied to the FormField FormLabel component */\n.saltRadioButtonGroup-legend.saltFormLabel {\n  --saltFormField-label-transform: var(--radioButton-group-formLabel-transform);\n}\n\n/* Styles applied to the Form Field FormLabel component if `row={true}` */\n.saltRadioButtonGroup-horizontal .saltRadioButtonGroup-legend.saltFormLabel {\n  --formField-label-width: auto;\n  float: left;\n}\n\n/* Styles applied to the Form Field FormLabel component */\n.saltRadioButtonGroup-legend.saltFormLabel {\n  padding-left: var(--saltRadioButton-group-formLabel-paddingLeft, 0px);\n}\n\n/* Styles applied  to legend if `row={true}` */\n.saltRadioButtonGroup-horizontal .saltRadioButtonGroup-legend {\n  margin-bottom: var(--saltRadioButton-group-horizontal-legend-marginBottom, var(--radioButton-group-horizontal-legend-marginBottom));\n  margin-right: var(--saltRadioButton-group-horizontal-legend-marginRight, var(--radioButton-group-horizontal-legend-marginRight));\n  margin-top: var(--saltRadioButton-group-horizontal-legend-marginTop, var(--radioButton-group-horizontal-legend-marginTop));\n  padding-right: var(--saltRadioButton-group-horizontal-legend-paddingRight, var(--radioButton-group-horizontal-legend-paddingRight));\n}\n\n/* Styles applied to legend */\n.saltRadioButtonGroup-legend {\n  margin-bottom: var(--saltRadioButton-group-legend-marginBottom, 4px);\n  min-height: var(--saltRadioButton-group-legend-minHeight, var(--radioButton-group-legend-minHeight));\n  padding-right: var(--saltRadioButton-group-legend-paddingRight, var(--radioButton-group-legend-paddingRight));\n  transition: none;\n  width: auto;\n}\n\n/* fieldset specific styles */\nfieldset.saltRadioButtonGroup.saltRadioButtonGroup-vertical {\n  line-height: 1;\n}\n\nfieldset.saltRadioButtonGroup.saltRadioButtonGroup-horizontal {\n  display: block;\n  padding-left: 0px;\n  min-inline-size: max-content;\n}\n";
+styleInject_es(css_248z);
+
+module.exports = css_248z;
+//# sourceMappingURL=RadioButtonGroup.css.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButtonGroup.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonGroup.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist-cjs/packages/lab/src/radio-button/RadioButtonGroup.js

@@ -0,0 +1,107 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var cx = require('classnames');
+var React = require('react');
+var core = require('@salt-ds/core');
+require('../form-field-context/FormFieldContext.js');
+var useFormFieldProps = require('../form-field-context/useFormFieldProps.js');
+var FormGroup = require('../form-group/FormGroup.js');
+require('../form-field/FormField.js');
+var FormLabel = require('../form-field/FormLabel.js');
+var RadioGroupContext = require('./internal/RadioGroupContext.js');
+var RadioButton = require('./RadioButton.js');
+require('./RadioButtonGroup.css.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+const withBaseName = core.makePrefixer("saltRadioButtonGroup");
+const RadioButtonGroup = React.forwardRef(function RadioButtonGroup2(props, ref) {
+  const {
+    children,
+    className,
+    defaultValue,
+    legend,
+    icon,
+    radios,
+    onChange,
+    value: valueProp,
+    row,
+    name: nameProp,
+    ...rest
+  } = props;
+  const { inFormField, a11yProps } = useFormFieldProps.useFormFieldProps({
+    focusVisible: false
+  });
+  const [stateValue, setStateValue] = React.useState(props.defaultValue);
+  const getValue = () => isControlled() ? props.value : stateValue;
+  const isControlled = () => props.value !== void 0;
+  const handleChange = (event) => {
+    if (!isControlled()) {
+      setStateValue(event.target.value);
+    }
+    if (props.onChange) {
+      props.onChange(event);
+    }
+  };
+  const rootRef = React.useRef(null);
+  React.useImperativeHandle(
+    void 0,
+    () => ({
+      focus: () => {
+        const current = rootRef.current;
+        if (current) {
+          let input = current.querySelector(
+            "input:not(:disabled):checked"
+          );
+          if (!input) {
+            input = current.querySelector("input:not(:disabled)");
+          }
+          if (input) {
+            input.focus();
+          }
+        }
+      }
+    }),
+    []
+  );
+  const name = core.useId(nameProp);
+  return /* @__PURE__ */ jsxRuntime.jsxs("fieldset", {
+    className: cx__default["default"](
+      withBaseName(),
+      row ? withBaseName("horizontal") : withBaseName("vertical"),
+      className
+    ),
+    "data-testid": "radio-button-group",
+    ref,
+    role: "radiogroup",
+    ...a11yProps,
+    children: [
+      !inFormField && /* @__PURE__ */ jsxRuntime.jsx(FormLabel.FormLabel, {
+        className: cx__default["default"](withBaseName("legend")),
+        label: legend
+      }),
+      /* @__PURE__ */ jsxRuntime.jsx(RadioGroupContext.RadioGroupContext.Provider, {
+        value: { name, onChange: handleChange, value: getValue() },
+        children: /* @__PURE__ */ jsxRuntime.jsx(FormGroup.FormGroup, {
+          role: "radiogroup",
+          ...rest,
+          row,
+          children: radios && radios.map((radio) => /* @__PURE__ */ jsxRuntime.jsx(RadioButton.RadioButton, {
+            disabled: radio.disabled,
+            icon,
+            label: radio.label,
+            value: radio.value
+          }, radio.label)) || children
+        })
+      })
+    ]
+  });
+});
+
+exports.RadioButtonGroup = RadioButtonGroup;
+//# sourceMappingURL=RadioButtonGroup.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonGroup.js","sources":["../src/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport {\n  ChangeEventHandler,\n  ComponentType,\n  forwardRef,\n  HTMLAttributes,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from \"react\";\nimport { makePrefixer, useId } from \"@salt-ds/core\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { FormGroup } from \"../form-group\";\nimport { FormLabel } from \"../form-field\";\nimport { RadioGroupContext } from \"./internal/RadioGroupContext\";\nimport { RadioButton } from \"./RadioButton\";\nimport { RadioButtonIconProps } from \"./RadioButtonIcon\";\n\nimport \"./RadioButtonGroup.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonGroup\");\n\nexport interface RadioButtonGroupProps extends HTMLAttributes<HTMLDivElement> {\n  className?: string;\n  defaultValue?: string;\n  icon?: ComponentType<RadioButtonIconProps>;\n  legend?: string;\n  name?: string;\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  radios?: {\n    disabled?: boolean;\n    label?: string;\n    value?: string;\n  }[];\n  row?: boolean;\n  value?: string;\n}\n\nexport const RadioButtonGroup = forwardRef<\n  HTMLFieldSetElement,\n  RadioButtonGroupProps\n>(function RadioButtonGroup(props, ref) {\n  const {\n    children,\n    className,\n    defaultValue,\n    legend,\n    icon,\n    radios,\n    onChange,\n    value: valueProp,\n    row,\n    name: nameProp,\n    ...rest\n  } = props;\n\n  const { inFormField, a11yProps } = useFormFieldProps({\n    focusVisible: false,\n  });\n\n  const [stateValue, setStateValue] = useState(props.defaultValue);\n\n  const getValue = () => (isControlled() ? props.value : stateValue);\n\n  const isControlled = () => props.value !== undefined;\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    if (!isControlled()) {\n      setStateValue(event.target.value);\n    }\n    if (props.onChange) {\n      props.onChange(event);\n    }\n  };\n\n  const rootRef = useRef<HTMLFieldSetElement>(null);\n\n  useImperativeHandle(\n    undefined,\n    () => ({\n      focus: () => {\n        const current = rootRef.current;\n        if (current) {\n          let input: HTMLInputElement | null = current.querySelector(\n            \"input:not(:disabled):checked\"\n          );\n          if (!input) {\n            input = current.querySelector(\"input:not(:disabled)\");\n          }\n          if (input) {\n            input.focus();\n          }\n        }\n      },\n    }),\n    []\n  );\n\n  const name = useId(nameProp);\n\n  return (\n    <fieldset\n      className={classnames(\n        withBaseName(),\n        row ? withBaseName(\"horizontal\") : withBaseName(\"vertical\"),\n        className\n      )}\n      data-testid=\"radio-button-group\"\n      ref={ref}\n      role=\"radiogroup\"\n      {...a11yProps}\n    >\n      {!inFormField && (\n        <FormLabel\n          className={classnames(withBaseName(\"legend\"))}\n          label={legend}\n        />\n      )}\n\n      <RadioGroupContext.Provider\n        value={{ name, onChange: handleChange, value: getValue() }}\n      >\n        <FormGroup role=\"radiogroup\" {...rest} row={row}>\n          {(radios &&\n            radios.map((radio) => (\n              <RadioButton\n                disabled={radio.disabled}\n                icon={icon}\n                key={radio.label}\n                label={radio.label}\n                value={radio.value}\n              />\n            ))) ||\n            children}\n        </FormGroup>\n      </RadioGroupContext.Provider>\n    </fieldset>\n  );\n});\n"],"names":["makePrefixer","forwardRef","RadioButtonGroup","useFormFieldProps","useState","useRef","useImperativeHandle","useId","jsxs","classnames","jsx","FormLabel","RadioGroupContext","FormGroup","RadioButton"],"mappings":"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"}

package/dist-cjs/packages/lab/src/radio-button/RadioButtonIcon.css.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
+
+var css_248z = ".salt-density-high {\n  --radioButton-icon-size: 12px;\n}\n\n.salt-density-medium {\n  --radioButton-icon-size: 14px;\n}\n\n.salt-density-low {\n  --radioButton-icon-size: 16px;\n}\n\n.salt-density-touch {\n  --radioButton-icon-size: 18px;\n}\n\n/* Styles applied to root component */\n.saltRadioButtonIcon {\n  --radioButton-icon-fill: transparent;\n  --radioButton-icon-fill-checked: var(--salt-selectable-borderColor-selected);\n  --radioButton-icon-fill-checked-disabled: var(--salt-selectable-borderColor-selectedDisabled);\n\n  --radioButton-icon-strokeColor: var(--salt-selectable-borderColor);\n  --radioButton-icon-strokeColor-disabled: var(--salt-selectable-borderColor-disabled);\n  --radioButton-icon-strokeColor-hover: var(--salt-selectable-borderColor-hover);\n  --radioButton-icon-strokeColor-checked: var(--salt-selectable-borderColor-selected);\n  --radioButton-icon-strokeColor-checked-disabled: var(--salt-selectable-borderColor-selectedDisabled);\n\n  --radioButton-icon-strokeWidth: var(--salt-size-border);\n  --radioButton-icon-strokeWidth-hover: var(--salt-size-border);\n  --radioButton-icon-strokeWidth-checked: var(--salt-size-border);\n\n  width: var(--saltRadioButton-icon-svg-size, var(--radioButton-icon-size));\n  height: var(--saltRadioButton-icon-svg-size, var(--radioButton-icon-size));\n}\n\n/* Styles applied to RadioButtonIcon border */\n.saltRadioButtonIcon-border {\n  fill: var(--saltRadioButton-icon-fill, var(--radioButton-icon-fill));\n  stroke: var(--saltRadioButton-icon-strokeColor, var(--radioButton-icon-strokeColor));\n  stroke-width: var(--saltRadioButton-icon-strokeWidth, var(--radioButton-icon-strokeWidth));\n}\n\n/* Styles applied to RadioButtonIcon border if `checked={true}` */\n.saltRadioButtonIcon-checked .saltRadioButtonIcon-border {\n  fill: var(--saltRadioButton-icon-fill-checked, var(--radioButton-icon-fill-checked));\n  stroke: var(--saltRadioButton-icon-strokeColor-checked, var(--radioButton-icon-strokeColor-checked));\n  stroke-width: var(--saltRadioButton-icon-strokeWidth-checked, var(--radioButton-icon-strokeWidth-checked));\n}\n\n/* Styles applied to RadioButtonIcon border on hover */\n.saltRadioButton:hover .saltRadioButtonIcon-border {\n  fill: var(--saltRadioButton-icon-fill-hover, var(--radioButton-icon-fill));\n  stroke: var(--saltRadioButton-icon-strokeColor-hover, var(--radioButton-icon-strokeColor-hover));\n}\n\n/* Styles applied to RadioButtonIcon border on hover if `checked={true}` */\n.saltRadioButton:hover .saltRadioButtonIcon-checked .saltRadioButtonIcon-border {\n  fill: var(--saltRadioButton-icon-fill-checked-hover, var(--radioButton-icon-fill-checked));\n  stroke: var(--saltRadioButton-icon-strokeColor-checked-hover, var(--radioButton-icon-strokeColor-checked));\n}\n\n/* Styles applied to RadioButtonIcon border if `disabled={true}` or in a disabled FormField */\n.saltRadioButton-disabled .saltRadioButtonIcon-border,\n.saltFormField-disabled .saltRadioButton .saltRadioButtonIcon-border,\n.saltRadioButton-disabled:hover .saltRadioButtonIcon-border,\n.saltFormField-disabled .saltRadioButton:hover .saltRadioButtonIcon-border {\n  fill: var(--saltRadioButton-icon-fill-disabled, var(--radioButton-icon-fill));\n  stroke: var(--saltRadioButton-icon-strokeColor-disabled, var(--radioButton-icon-strokeColor-disabled));\n}\n\n/* Styles applied to RadioButtonIcon border if `checked={true}` when `disabled={true}` or in a disabled FormField  */\n.saltFormField-disabled .saltRadioButton .saltRadioButtonIcon-checked .saltRadioButtonIcon-border,\n.saltFormField-disabled .saltRadioButton:hover .saltRadioButtonIcon-checked .saltRadioButtonIcon-border,\n.saltRadioButton-disabled .saltRadioButtonIcon-checked .saltRadioButtonIcon-border,\n.saltRadioButton-disabled:hover .saltRadioButtonIcon-checked .saltRadioButtonIcon-border {\n  fill: var(--saltRadioButton-icon-fill-checked-disabled, var(--radioButton-icon-fill-checked-disabled));\n  stroke: var(--saltRadioButton-icon-strokeColor-checked-disabled, transparent);\n}\n\n/* Styles applied to inner circle when `checked={true}` */\n.saltRadioButtonIcon-inner-checked {\n  fill: var(--saltRadioButton-icon-inner-fill, var(--salt-selectable-primary-foreground-selected));\n}\n";
+styleInject_es(css_248z);
+
+module.exports = css_248z;
+//# sourceMappingURL=RadioButtonIcon.css.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButtonIcon.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonIcon.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist-cjs/packages/lab/src/radio-button/RadioButtonIcon.js

@@ -0,0 +1,43 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var cx = require('classnames');
+require('./RadioButtonIcon.css.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+const withBaseName = core.makePrefixer("saltRadioButtonIcon");
+const RadioButtonIcon = ({ checked }) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", {
+    className: cx__default["default"](withBaseName(), {
+      [withBaseName("checked")]: checked
+    }),
+    height: "14",
+    viewBox: "0 0 14 14",
+    width: "14",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("circle", {
+        className: withBaseName("border"),
+        cx: "7",
+        cy: "7",
+        r: "6.5"
+      }),
+      checked && /* @__PURE__ */ jsxRuntime.jsx("circle", {
+        className: withBaseName("inner-checked"),
+        cx: "7",
+        cy: "7",
+        r: "3"
+      })
+    ]
+  });
+};
+const makeRadioIcon = (iconChecked, iconUnchecked) => (props) => props.checked ? iconChecked : iconUnchecked;
+
+exports.RadioButtonIcon = RadioButtonIcon;
+exports.makeRadioIcon = makeRadioIcon;
+//# sourceMappingURL=RadioButtonIcon.js.map

package/dist-cjs/packages/lab/src/radio-button/RadioButtonIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonIcon.js","sources":["../src/radio-button/RadioButtonIcon.tsx"],"sourcesContent":["import { ComponentType, ReactElement } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport classnames from \"classnames\";\nimport \"./RadioButtonIcon.css\";\n\nconst withBaseName = makePrefixer(\"saltRadioButtonIcon\");\n\nexport interface RadioButtonIconProps {\n  checked?: boolean;\n}\n\n/**\n * Default radio icon\n */\nexport const RadioButtonIcon = ({ checked }: RadioButtonIconProps) => {\n  return (\n    <svg\n      className={classnames(withBaseName(), {\n        [withBaseName(\"checked\")]: checked,\n      })}\n      height=\"14\"\n      viewBox=\"0 0 14 14\"\n      width=\"14\"\n    >\n      <circle className={withBaseName(\"border\")} cx=\"7\" cy=\"7\" r=\"6.5\" />\n      {checked && (\n        <circle className={withBaseName(\"inner-checked\")} cx=\"7\" cy=\"7\" r=\"3\" />\n      )}\n    </svg>\n  );\n};\n\n/**\n * Creates a component that can be given to Radio or RadioButton as the 'icon'\n */\nexport const makeRadioIcon =\n  (\n    iconChecked: ReactElement | null,\n    iconUnchecked: ReactElement | null\n  ): ComponentType<RadioButtonIconProps> =>\n  (props: RadioButtonIconProps) =>\n    props.checked ? iconChecked : iconUnchecked;\n"],"names":["makePrefixer","jsxs","classnames","jsx"],"mappings":";;;;;;;;;;;;;AAKA,MAAM,YAAA,GAAeA,kBAAa,qBAAqB,CAAA,CAAA;AAShD,MAAM,eAAkB,GAAA,CAAC,EAAE,OAAA,EAAoC,KAAA;AACpE,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAWC,sBAAW,CAAA,YAAA,EAAgB,EAAA;AAAA,MACpC,CAAC,YAAa,CAAA,SAAS,CAAI,GAAA,OAAA;AAAA,KAC5B,CAAA;AAAA,IACD,MAAO,EAAA,IAAA;AAAA,IACP,OAAQ,EAAA,WAAA;AAAA,IACR,KAAM,EAAA,IAAA;AAAA,IAEN,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAA,QAAA,EAAA;AAAA,QAAO,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,QAAG,EAAG,EAAA,GAAA;AAAA,QAAI,EAAG,EAAA,GAAA;AAAA,QAAI,CAAE,EAAA,KAAA;AAAA,OAAM,CAAA;AAAA,MAChE,2BACEA,cAAA,CAAA,QAAA,EAAA;AAAA,QAAO,SAAA,EAAW,aAAa,eAAe,CAAA;AAAA,QAAG,EAAG,EAAA,GAAA;AAAA,QAAI,EAAG,EAAA,GAAA;AAAA,QAAI,CAAE,EAAA,GAAA;AAAA,OAAI,CAAA;AAAA,KAAA;AAAA,GAE1E,CAAA,CAAA;AAEJ,EAAA;AAKa,MAAA,aAAA,GACX,CACE,WACA,EAAA,aAAA,KAEF,CAAC,KACC,KAAA,KAAA,CAAM,UAAU,WAAc,GAAA;;;;;"}

package/dist-cjs/packages/lab/src/radio-button/internal/RadioGroupContext.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var core = require('@salt-ds/core');
+
+const RadioGroupContext = core.createContext(
+  "RadioGroupContext",
+  {}
+);
+
+exports.RadioGroupContext = RadioGroupContext;
+//# sourceMappingURL=RadioGroupContext.js.map

package/dist-cjs/packages/lab/src/radio-button/internal/RadioGroupContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroupContext.js","sources":["../src/radio-button/internal/RadioGroupContext.tsx"],"sourcesContent":["import { ChangeEventHandler } from \"react\";\nimport { createContext } from \"@salt-ds/core\";\n\nexport interface RadioGroupContextValue {\n  name?: string;\n  value?: string;\n  onChange?: ChangeEventHandler<HTMLElement>;\n}\n\nexport const RadioGroupContext = createContext(\n  \"RadioGroupContext\",\n  {} as RadioGroupContextValue\n);\n"],"names":["createContext"],"mappings":";;;;;;AASO,MAAM,iBAAoB,GAAAA,kBAAA;AAAA,EAC/B,mBAAA;AAAA,EACA,EAAC;AACH;;;;"}

package/dist-cjs/packages/lab/src/radio-button/internal/useRadioGroup.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var RadioGroupContext = require('./RadioGroupContext.js');
+
+function useRadioGroup() {
+  return React.useContext(RadioGroupContext.RadioGroupContext);
+}
+
+exports.useRadioGroup = useRadioGroup;
+//# sourceMappingURL=useRadioGroup.js.map

package/dist-cjs/packages/lab/src/radio-button/internal/useRadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRadioGroup.js","sources":["../src/radio-button/internal/useRadioGroup.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { RadioGroupContext } from \"./RadioGroupContext\";\n\nexport function useRadioGroup() {\n  return useContext(RadioGroupContext);\n}\n"],"names":["useContext","RadioGroupContext"],"mappings":";;;;;;;AAGO,SAAS,aAAgB,GAAA;AAC9B,EAAA,OAAOA,iBAAWC,mCAAiB,CAAA,CAAA;AACrC;;;;"}