@salt-ds/core 1.28.0 → 1.29.0

package/dist-es/multiline-input/MultilineInput.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Style applied to the root element */\n.saltMultilineInput {\n  --multilineInput-borderColor: var(--salt-editable-borderColor);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle);\n  --multilineInput-outlineColor: var(--salt-focused-outlineColor);\n  --multilineInput-border: none;\n  --multilineInput-activationIndicator-borderWidth: var(--salt-size-border);\n\n  align-items: center;\n  background: var(--multilineInput-background);\n  border: var(--multilineInput-border);\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  height: auto;\n  line-height: var(--salt-text-lineHeight);\n  min-height: var(--salt-size-base);\n  min-width: 4em;\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Style applied on hover */\n.saltMultilineInput:hover {\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-hover);\n  --multilineInput-borderColor: var(--salt-editable-borderColor-hover);\n\n  background: var(--multilineInput-background-hover);\n  cursor: var(--salt-editable-cursor-hover);\n}\n\n/* Style applied when active */\n.saltMultilineInput:active {\n  --multilineInput-borderColor: var(--salt-editable-borderColor-active);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-active);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-editable-borderWidth-active);\n\n  background: var(--multilineInput-background-active);\n  cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltMultilineInput-primary {\n  --multilineInput-background: var(--salt-editable-primary-background);\n  --multilineInput-background-active: var(--salt-editable-primary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-primary-background-hover);\n  --multilineInput-background-disabled: var(--salt-editable-primary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-primary-background-readonly);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltMultilineInput-secondary {\n  --multilineInput-background: var(--salt-editable-secondary-background);\n  --multilineInput-background-active: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-secondary-background-readonly);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltMultilineInput-error,\n.saltMultilineInput-error:hover {\n  --multilineInput-background: var(--salt-status-error-background);\n  --multilineInput-background-active: var(--salt-status-error-background);\n  --multilineInput-background-hover: var(--salt-status-error-background);\n  --multilineInput-borderColor: var(--salt-status-error-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltMultilineInput-warning,\n.saltMultilineInput-warning:hover {\n  --multilineInput-background: var(--salt-status-warning-background);\n  --multilineInput-background-active: var(--salt-status-warning-background);\n  --multilineInput-background-hover: var(--salt-status-warning-background);\n  --multilineInput-borderColor: var(--salt-status-warning-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltMultilineInput-success,\n.saltMultilineInput-success:hover {\n  --multilineInput-background: var(--salt-status-success-background);\n  --multilineInput-background-active: var(--salt-status-success-background);\n  --multilineInput-background-hover: var(--salt-status-success-background);\n  --multilineInput-borderColor: var(--salt-status-success-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-success-borderColor);\n}\n\n.saltMultilineInput.saltMultilineInput-withAdornmentRow {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n/* Style applied to inner textarea element */\n.saltMultilineInput-textarea {\n  background: none;\n  border: none;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: inherit;\n  flex-grow: 1;\n  font: inherit;\n  letter-spacing: 0;\n  line-height: var(--salt-text-lineHeight);\n  margin: var(--salt-spacing-75) 0;\n  min-width: 0;\n  min-height: 0;\n  resize: vertical;\n  padding: 0;\n}\n\n/* Style applied to placeholder */\n.saltMultilineInput-textarea::placeholder {\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Reset in the  class */\n.saltMultilineInput-textarea:focus {\n  outline: none;\n}\n\n/* Style applied to selected input */\n.saltMultilineInput-textarea::selection {\n  background: var(--salt-content-foreground-highlight);\n}\n\n/* Styling when focused */\n.saltMultilineInput-focused {\n  --multilineInput-borderColor: var(--multilineInput-outlineColor);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-editable-borderWidth-active);\n\n  outline: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--multilineInput-outlineColor);\n}\n\n/* Style applied if `readOnly={true}` */\n.saltMultilineInput-readOnly,\n.saltMultilineInput-readOnly:active,\n.saltMultilineInput-readOnly:hover {\n  --multilineInput-borderColor: var(--salt-editable-borderColor-readonly);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-readonly);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-size-border);\n\n  background: var(--multilineInput-background-readonly);\n  cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Style applied to selected text if `disabled={true}` */\n.saltMultilineInput-disabled .saltMultilineInput-textarea::selection {\n  background: none;\n}\n\n/* Style applied when `disabled={true}` */\n.saltMultilineInput-disabled,\n.saltMultilineInput-disabled:hover,\n.saltMultilineInput-disabled:active {\n  --multilineInput-borderColor: var(--salt-editable-borderColor-disabled);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-disabled);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-size-border);\n\n  background: var(--multilineInput-background-disabled);\n  cursor: var(--salt-editable-cursor-disabled);\n  color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Style for activation indicator */\n.saltMultilineInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--multilineInput-activationIndicator-borderWidth) var(--multilineInput-borderStyle) var(--multilineInput-borderColor);\n}\n\n/* Style applied if `bordered={true}` */\n.saltMultilineInput.saltMultilineInput-bordered {\n  --multilineInput-border: var(--salt-size-border) var(--salt-container-borderStyle) var(--multilineInput-borderColor);\n  --multilineInput-activationIndicator-borderWidth: 0;\n}\n\n/* Style applied if active or focused when `bordered={true}` */\n.saltMultilineInput-bordered:active,\n.saltMultilineInput-bordered.saltMultilineInput-focused {\n  --multilineInput-activationIndicator-borderWidth: var(--salt-editable-borderWidth-active);\n}\n\n/* Styling when focused if `disabled={true}` or `readOnly={true}` when `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput-readOnly:hover,\n.saltMultilineInput-bordered.saltMultilineInput-disabled:hover {\n  --multilineInput-activationIndicator-borderWidth: 0;\n}\n\n/* Style applied to adornment containers */\n.saltMultilineInput-endAdornmentContainer,\n.saltMultilineInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to start adornment container */\n.saltMultilineInput-startAdornmentContainer {\n  align-self: self-start;\n  padding-right: var(--salt-spacing-100);\n}\n\n/* Style applied to suffix adornment container */\n.saltMultilineInput-suffixAdornments {\n  align-self: self-end;\n}\n\n/* Style applied to suffix adornment container when end adornments are provided */\n.saltMultilineInput-withAdornmentRow .saltMultilineInput-suffixAdornments {\n  display: inline-flex;\n  flex-basis: 100%;\n  justify-content: flex-end;\n}\n\n/* Style applied to end adornment container */\n.saltMultilineInput-endAdornmentContainer {\n  padding-left: var(--salt-spacing-100);\n}\n\n/* Style applied to status adornment container */\n.saltMultilineInput-statusAdornmentContainer {\n  align-self: self-end;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n}\n\n/* Style applied to button start adornment if first child */\n.saltMultilineInput-startAdornmentContainer .saltButton:first-child {\n  margin-left: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-readOnly .saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: 0;\n}\n\n/* Styles for button adornment */\n.saltMultilineInput-startAdornmentContainer > .saltButton,\n.saltMultilineInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: calc(var(--salt-spacing-50) - var(--salt-size-border));\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n}\n";
+var css_248z = "/* Style applied to the root element */\n.saltMultilineInput {\n  --multilineInput-borderColor: var(--salt-editable-borderColor);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle);\n  --multilineInput-outlineColor: var(--salt-focused-outlineColor);\n  --multilineInput-border: none;\n  --multilineInput-activationIndicator-borderWidth: var(--salt-size-border);\n\n  align-items: center;\n  background: var(--multilineInput-background);\n  border: var(--multilineInput-border);\n  border-radius: var(--salt-palette-corner-weak, 0);\n  color: var(--salt-content-primary-foreground);\n  display: inline-flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  height: auto;\n  line-height: var(--salt-text-lineHeight);\n  min-height: var(--salt-size-base);\n  min-width: 4em;\n  padding-left: var(--salt-spacing-100);\n  padding-right: var(--salt-spacing-100);\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n  overflow: hidden;\n}\n\n/* Style applied on hover */\n.saltMultilineInput:hover {\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-hover);\n  --multilineInput-borderColor: var(--salt-editable-borderColor-hover);\n\n  background: var(--multilineInput-background-hover);\n  cursor: var(--salt-editable-cursor-hover);\n}\n\n/* Style applied when active */\n.saltMultilineInput:active {\n  --multilineInput-borderColor: var(--salt-editable-borderColor-active);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-active);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-editable-borderWidth-active);\n\n  background: var(--multilineInput-background-active);\n  cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltMultilineInput-primary {\n  --multilineInput-background: var(--salt-editable-primary-background);\n  --multilineInput-background-active: var(--salt-editable-primary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-primary-background-hover);\n  --multilineInput-background-disabled: var(--salt-editable-primary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-primary-background-readonly);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltMultilineInput-secondary {\n  --multilineInput-background: var(--salt-editable-secondary-background);\n  --multilineInput-background-active: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-hover: var(--salt-editable-secondary-background-active);\n  --multilineInput-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --multilineInput-background-readonly: var(--salt-editable-secondary-background-readonly);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltMultilineInput-error,\n.saltMultilineInput-error:hover {\n  --multilineInput-background: var(--salt-status-error-background);\n  --multilineInput-background-active: var(--salt-status-error-background);\n  --multilineInput-background-hover: var(--salt-status-error-background);\n  --multilineInput-borderColor: var(--salt-status-error-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-error-borderColor);\n  --multilineInput-background-readonly: var(--salt-status-error-background);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltMultilineInput-warning,\n.saltMultilineInput-warning:hover {\n  --multilineInput-background: var(--salt-status-warning-background);\n  --multilineInput-background-active: var(--salt-status-warning-background);\n  --multilineInput-background-hover: var(--salt-status-warning-background);\n  --multilineInput-borderColor: var(--salt-status-warning-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-warning-borderColor);\n  --multilineInput-background-readonly: var(--salt-status-warning-background);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltMultilineInput-success,\n.saltMultilineInput-success:hover {\n  --multilineInput-background: var(--salt-status-success-background);\n  --multilineInput-background-active: var(--salt-status-success-background);\n  --multilineInput-background-hover: var(--salt-status-success-background);\n  --multilineInput-borderColor: var(--salt-status-success-borderColor);\n  --multilineInput-outlineColor: var(--salt-status-success-borderColor);\n  --multilineInput-background-readonly: var(--salt-status-success-background);\n}\n\n.saltMultilineInput.saltMultilineInput-withAdornmentRow {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n/* Style applied to inner textarea element */\n.saltMultilineInput-textarea {\n  background: none;\n  border: none;\n  box-sizing: border-box;\n  color: inherit;\n  cursor: inherit;\n  flex-grow: 1;\n  font: inherit;\n  letter-spacing: 0;\n  line-height: var(--salt-text-lineHeight);\n  margin: var(--salt-spacing-75) 0;\n  min-width: 0;\n  min-height: 0;\n  resize: vertical;\n  padding: 0;\n}\n\n/* Style applied to placeholder */\n.saltMultilineInput-textarea::placeholder {\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Reset in the  class */\n.saltMultilineInput-textarea:focus {\n  outline: none;\n}\n\n/* Style applied to selected input */\n.saltMultilineInput-textarea::selection {\n  background: var(--salt-content-foreground-highlight);\n}\n\n/* Styling when focused */\n.saltMultilineInput-focused {\n  --multilineInput-borderColor: var(--multilineInput-outlineColor);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-editable-borderWidth-active);\n\n  outline: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--multilineInput-outlineColor);\n}\n\n/* Style applied if `readOnly={true}` */\n.saltMultilineInput-readOnly,\n.saltMultilineInput-readOnly:active,\n.saltMultilineInput-readOnly:hover {\n  --multilineInput-borderColor: var(--salt-editable-borderColor-readonly);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-readonly);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-size-border);\n\n  background: var(--multilineInput-background-readonly);\n  cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Style applied to selected text if `disabled={true}` */\n.saltMultilineInput-disabled .saltMultilineInput-textarea::selection {\n  background: none;\n}\n\n/* Style applied when `disabled={true}` */\n.saltMultilineInput-disabled,\n.saltMultilineInput-disabled:hover,\n.saltMultilineInput-disabled:active {\n  --multilineInput-borderColor: var(--salt-editable-borderColor-disabled);\n  --multilineInput-borderStyle: var(--salt-editable-borderStyle-disabled);\n  --multilineInput-activationIndicator-borderWidth: var(--salt-size-border);\n\n  background: var(--multilineInput-background-disabled);\n  cursor: var(--salt-editable-cursor-disabled);\n  color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Style for activation indicator */\n.saltMultilineInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--multilineInput-activationIndicator-borderWidth) var(--multilineInput-borderStyle) var(--multilineInput-borderColor);\n}\n\n/* Style applied if `bordered={true}` */\n.saltMultilineInput.saltMultilineInput-bordered {\n  --multilineInput-border: var(--salt-size-border) var(--salt-container-borderStyle) var(--multilineInput-borderColor);\n  --multilineInput-activationIndicator-borderWidth: 0;\n}\n\n/* Style applied if focused or active when `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput-focused,\n.saltMultilineInput-bordered:active {\n  --multilineInput-activationIndicator-borderWidth: var(--salt-editable-borderWidth-active);\n}\n\n/* Styling when focused if `disabled={true}` or `readOnly={true}` when `bordered={true}` */\n.saltMultilineInput-bordered.saltMultilineInput-readOnly,\n.saltMultilineInput-bordered.saltMultilineInput-disabled:hover {\n  --multilineInput-activationIndicator-borderWidth: 0;\n}\n\n/* Style applied to adornment containers */\n.saltMultilineInput-endAdornmentContainer,\n.saltMultilineInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to start adornment container */\n.saltMultilineInput-startAdornmentContainer {\n  align-self: self-start;\n  padding-right: var(--salt-spacing-100);\n}\n\n/* Style applied to suffix adornment container */\n.saltMultilineInput-suffixAdornments {\n  align-self: self-end;\n}\n\n/* Style applied to suffix adornment container when end adornments are provided */\n.saltMultilineInput-withAdornmentRow .saltMultilineInput-suffixAdornments {\n  display: inline-flex;\n  flex-basis: 100%;\n  justify-content: flex-end;\n}\n\n/* Style applied to end adornment container */\n.saltMultilineInput-endAdornmentContainer {\n  padding-left: var(--salt-spacing-100);\n}\n\n/* Style applied to status adornment container */\n.saltMultilineInput-statusAdornmentContainer {\n  align-self: self-end;\n  display: inline-flex;\n  min-height: var(--salt-size-base);\n}\n\n/* Style applied to button start adornment if first child */\n.saltMultilineInput-startAdornmentContainer .saltButton:first-child {\n  margin-left: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n/* Style applied to button end adornment if last child */\n.saltMultilineInput-readOnly .saltMultilineInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: 0;\n}\n\n/* Styles for button adornment */\n.saltMultilineInput-startAdornmentContainer > .saltButton,\n.saltMultilineInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: calc(var(--salt-spacing-50) - var(--salt-size-border));\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n  --saltButton-borderRadius: var(--salt-palette-corner-weaker);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=MultilineInput.css.js.map

package/dist-es/multiline-input/MultilineInput.js

@@ -255,7 +255,7 @@ const MultilineInput = forwardRef(
         /* @__PURE__ */ jsxs("div", {
           className: withBaseName("suffixAdornments"),
           children: [
-            !isDisabled && !isReadOnly && validationStatus && /* @__PURE__ */ jsx("div", {
+            !isDisabled && validationStatus && /* @__PURE__ */ jsx("div", {
               className: withBaseName("statusAdornmentContainer"),
               children: /* @__PURE__ */ jsx(StatusAdornment, {
                 status: validationStatus

package/dist-es/multiline-input/MultilineInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultilineInput.js","sources":["../src/multiline-input/MultilineInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  FocusEvent,\n  forwardRef,\n  ReactNode,\n  Ref,\n  TextareaHTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport multilineInputCss from \"./MultilineInput.css\";\n\nconst withBaseName = makePrefixer(\"saltMultilineInput\");\n\nexport interface MultilineInputProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n    Pick<\n      ComponentPropsWithoutRef<\"textarea\">,\n      \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n    > {\n  /**\n   * Styling variant with full border. Defaults to false\n   */\n  bordered?: boolean;\n  /**\n   * End adornment component\n   */\n  endAdornment?: ReactNode;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The default minimum number of rows. Defaults to 3\n   */\n  rows?: number;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n   */\n  textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n  /**\n   * Optional ref for the textarea component\n   */\n  textAreaRef?: Ref<HTMLTextAreaElement>;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nexport const MultilineInput = forwardRef<HTMLDivElement, MultilineInputProps>(\n  function MultilineInput(\n    {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      bordered = false,\n      className: classNameProp,\n      disabled,\n      endAdornment,\n      id,\n      placeholder,\n      readOnly,\n      role,\n      rows = 3,\n      startAdornment,\n      style,\n      textAreaProps = {},\n      textAreaRef,\n      value: valueProp,\n      defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n      validationStatus: validationStatusProp,\n      variant = \"primary\",\n      ...other\n    },\n    ref\n  ) {\n    const inputRef = useRef<HTMLTextAreaElement>(null);\n    const handleRef = useForkRef(inputRef, textAreaRef);\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-multiline-input\",\n      css: multilineInputCss,\n      window: targetWindow,\n    });\n\n    const restA11yProps = {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n    };\n\n    const [focused, setFocused] = useState(false);\n\n    const {\n      \"aria-describedby\": textAreaDescribedBy,\n      \"aria-labelledby\": textAreaLabelledBy,\n      onBlur,\n      onChange,\n      onFocus,\n      required: textAreaRequired,\n      ...restTextAreaProps\n    } = textAreaProps;\n\n    const {\n      a11yProps: {\n        \"aria-describedby\": formFieldDescribedBy,\n        \"aria-labelledby\": formFieldLabelledBy,\n      } = {},\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      necessity: formFieldRequired,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const isDisabled = disabled || formFieldDisabled;\n    const isReadOnly = readOnly || formFieldReadOnly;\n    const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n    const isRequired = formFieldRequired\n      ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n      : textAreaRequired;\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValueProp,\n      name: \"MultilineInput\",\n      state: \"value\",\n    });\n\n    const previousHeight = useRef<string | undefined>(undefined);\n    const input = inputRef.current;\n\n    const changeHeight = useCallback(() => {\n      if (!input) return;\n      const hasBeenManuallyResized =\n        previousHeight.current !== undefined &&\n        input.style.height !== previousHeight.current;\n      if (!hasBeenManuallyResized) {\n        const previousOverflow = input.style.overflow;\n        input.style.overflow = \"hidden\";\n        input.style.height = \"auto\";\n        input.scrollHeight; // Needed to work around Firefox bug. https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n        const newHeight = `${\n          input.scrollHeight + (input.offsetHeight - input.clientHeight)\n        }px`;\n        input.style.height = newHeight;\n        previousHeight.current = newHeight;\n        input.style.overflow = previousOverflow;\n      }\n    }, [input]);\n\n    const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {\n      const value = event.target.value;\n      setValue(value);\n      onChange?.(event);\n      changeHeight();\n    };\n\n    useLayoutEffect(() => {\n      changeHeight();\n    }, [value, changeHeight]);\n\n    const handleBlur = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onBlur?.(event);\n      setFocused(false);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onFocus?.(event);\n      setFocused(true);\n    };\n\n    const multilineInputStyles = {\n      \"--saltMultilineInput-rows\": rows,\n      ...style,\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"withAdornmentRow\")]: endAdornment,\n            [withBaseName(\"bordered\")]: bordered,\n            [withBaseName(\"focused\")]: !isDisabled && focused,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"readOnly\")]: isReadOnly,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          classNameProp\n        )}\n        ref={ref}\n        style={multilineInputStyles}\n        {...other}\n      >\n        {startAdornment && (\n          <div className={withBaseName(\"startAdornmentContainer\")}>\n            {startAdornment}\n          </div>\n        )}\n        <textarea\n          aria-describedby={clsx(formFieldDescribedBy, textAreaDescribedBy)}\n          aria-labelledby={clsx(formFieldLabelledBy, textAreaLabelledBy)}\n          className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n          disabled={isDisabled}\n          id={id}\n          readOnly={isReadOnly}\n          ref={handleRef}\n          required={isRequired}\n          role={role}\n          rows={rows}\n          tabIndex={isDisabled ? -1 : 0}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onFocus={!isDisabled ? handleFocus : undefined}\n          placeholder={placeholder}\n          value={value}\n          {...restA11yProps}\n          {...restTextAreaProps}\n        />\n        <div className={withBaseName(\"suffixAdornments\")}>\n          {!isDisabled && !isReadOnly && validationStatus && (\n            <div className={withBaseName(\"statusAdornmentContainer\")}>\n              <StatusAdornment status={validationStatus} />\n            </div>\n          )}\n          {endAdornment && (\n            <div className={withBaseName(\"endAdornmentContainer\")}>\n              {endAdornment}\n            </div>\n          )}\n        </div>\n        <div className={withBaseName(\"activationIndicator\")} />\n      </div>\n    );\n  }\n);\n"],"names":["MultilineInput","multilineInputCss","value"],"mappings":"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"}
+{"version":3,"file":"MultilineInput.js","sources":["../src/multiline-input/MultilineInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  FocusEvent,\n  forwardRef,\n  ReactNode,\n  Ref,\n  TextareaHTMLAttributes,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { StatusAdornment } from \"../status-adornment\";\nimport { makePrefixer, useControlled, useForkRef } from \"../utils\";\n\nimport multilineInputCss from \"./MultilineInput.css\";\n\nconst withBaseName = makePrefixer(\"saltMultilineInput\");\n\nexport interface MultilineInputProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n    Pick<\n      ComponentPropsWithoutRef<\"textarea\">,\n      \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n    > {\n  /**\n   * Styling variant with full border. Defaults to false\n   */\n  bordered?: boolean;\n  /**\n   * End adornment component\n   */\n  endAdornment?: ReactNode;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * The default minimum number of rows. Defaults to 3\n   */\n  rows?: number;\n  /**\n   * Start adornment component\n   */\n  startAdornment?: ReactNode;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n   */\n  textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n  /**\n   * Optional ref for the textarea component\n   */\n  textAreaRef?: Ref<HTMLTextAreaElement>;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nexport const MultilineInput = forwardRef<HTMLDivElement, MultilineInputProps>(\n  function MultilineInput(\n    {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      bordered = false,\n      className: classNameProp,\n      disabled,\n      endAdornment,\n      id,\n      placeholder,\n      readOnly,\n      role,\n      rows = 3,\n      startAdornment,\n      style,\n      textAreaProps = {},\n      textAreaRef,\n      value: valueProp,\n      defaultValue: defaultValueProp = valueProp === undefined ? \"\" : undefined,\n      validationStatus: validationStatusProp,\n      variant = \"primary\",\n      ...other\n    },\n    ref\n  ) {\n    const inputRef = useRef<HTMLTextAreaElement>(null);\n    const handleRef = useForkRef(inputRef, textAreaRef);\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-multiline-input\",\n      css: multilineInputCss,\n      window: targetWindow,\n    });\n\n    const restA11yProps = {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n    };\n\n    const [focused, setFocused] = useState(false);\n\n    const {\n      \"aria-describedby\": textAreaDescribedBy,\n      \"aria-labelledby\": textAreaLabelledBy,\n      onBlur,\n      onChange,\n      onFocus,\n      required: textAreaRequired,\n      ...restTextAreaProps\n    } = textAreaProps;\n\n    const {\n      a11yProps: {\n        \"aria-describedby\": formFieldDescribedBy,\n        \"aria-labelledby\": formFieldLabelledBy,\n      } = {},\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      necessity: formFieldRequired,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const isDisabled = disabled || formFieldDisabled;\n    const isReadOnly = readOnly || formFieldReadOnly;\n    const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n    const isRequired = formFieldRequired\n      ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n      : textAreaRequired;\n\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValueProp,\n      name: \"MultilineInput\",\n      state: \"value\",\n    });\n\n    const previousHeight = useRef<string | undefined>(undefined);\n    const input = inputRef.current;\n\n    const changeHeight = useCallback(() => {\n      if (!input) return;\n      const hasBeenManuallyResized =\n        previousHeight.current !== undefined &&\n        input.style.height !== previousHeight.current;\n      if (!hasBeenManuallyResized) {\n        const previousOverflow = input.style.overflow;\n        input.style.overflow = \"hidden\";\n        input.style.height = \"auto\";\n        input.scrollHeight; // Needed to work around Firefox bug. https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n        const newHeight = `${\n          input.scrollHeight + (input.offsetHeight - input.clientHeight)\n        }px`;\n        input.style.height = newHeight;\n        previousHeight.current = newHeight;\n        input.style.overflow = previousOverflow;\n      }\n    }, [input]);\n\n    const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {\n      const value = event.target.value;\n      setValue(value);\n      onChange?.(event);\n      changeHeight();\n    };\n\n    useLayoutEffect(() => {\n      changeHeight();\n    }, [value, changeHeight]);\n\n    const handleBlur = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onBlur?.(event);\n      setFocused(false);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLTextAreaElement>) => {\n      onFocus?.(event);\n      setFocused(true);\n    };\n\n    const multilineInputStyles = {\n      \"--saltMultilineInput-rows\": rows,\n      ...style,\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"withAdornmentRow\")]: endAdornment,\n            [withBaseName(\"bordered\")]: bordered,\n            [withBaseName(\"focused\")]: !isDisabled && focused,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"readOnly\")]: isReadOnly,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          classNameProp\n        )}\n        ref={ref}\n        style={multilineInputStyles}\n        {...other}\n      >\n        {startAdornment && (\n          <div className={withBaseName(\"startAdornmentContainer\")}>\n            {startAdornment}\n          </div>\n        )}\n        <textarea\n          aria-describedby={clsx(formFieldDescribedBy, textAreaDescribedBy)}\n          aria-labelledby={clsx(formFieldLabelledBy, textAreaLabelledBy)}\n          className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n          disabled={isDisabled}\n          id={id}\n          readOnly={isReadOnly}\n          ref={handleRef}\n          required={isRequired}\n          role={role}\n          rows={rows}\n          tabIndex={isDisabled ? -1 : 0}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onFocus={!isDisabled ? handleFocus : undefined}\n          placeholder={placeholder}\n          value={value}\n          {...restA11yProps}\n          {...restTextAreaProps}\n        />\n        <div className={withBaseName(\"suffixAdornments\")}>\n          {!isDisabled && validationStatus && (\n            <div className={withBaseName(\"statusAdornmentContainer\")}>\n              <StatusAdornment status={validationStatus} />\n            </div>\n          )}\n          {endAdornment && (\n            <div className={withBaseName(\"endAdornmentContainer\")}>\n              {endAdornment}\n            </div>\n          )}\n        </div>\n        <div className={withBaseName(\"activationIndicator\")} />\n      </div>\n    );\n  }\n);\n"],"names":["MultilineInput","multilineInputCss","value"],"mappings":"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"}

package/dist-es/segmented-button-group/SegmentedButtonGroup.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltSegmentedButtonGroup {\n  display: flex;\n  flex-direction: row;\n  background: var(--button-background);\n  gap: var(--salt-size-border);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:last-of-type)::after {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--button-background);\n  /* Accomodate button border */\n  right: calc(var(--salt-size-border) * -2);\n  top: calc(var(--salt-size-border) * -1);\n  bottom: calc(var(--salt-size-border) * -1);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:first-of-type)::before {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--salt-separable-primary-borderColor);\n  /* Accomodate button border */\n  left: calc(var(--salt-size-border) * -2);\n  top: calc(var(--salt-size-border) * -1);\n  bottom: calc(var(--salt-size-border) * -1);\n}\n";
+var css_248z = ".saltSegmentedButtonGroup {\n  display: flex;\n  flex-direction: row;\n  background: var(--button-background);\n  gap: var(--salt-size-border);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:last-of-type)::after {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--button-background);\n  /* Accomodate button border */\n  right: calc(var(--salt-size-border) * -2);\n  top: calc(var(--salt-size-border) * -1);\n  bottom: calc(var(--salt-size-border) * -1);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:first-of-type)::before {\n  content: \"\";\n  width: var(--salt-size-border);\n  position: absolute;\n  background: var(--salt-separable-primary-borderColor);\n  /* Accomodate button border */\n  left: calc(var(--salt-size-border) * -2);\n  top: calc(var(--salt-size-border) * -1);\n  bottom: calc(var(--salt-size-border) * -1);\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:first-of-type) {\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n\n.saltSegmentedButtonGroup > .saltButton:not(:last-of-type) {\n  border-bottom-right-radius: 0;\n  border-top-right-radius: 0;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=SegmentedButtonGroup.css.js.map

package/dist-es/switch/Switch.js

@@ -202,7 +202,7 @@ const Switch = forwardRef(function Switch2(props, ref) {
           })
         })
       }),
-      /* @__PURE__ */ jsx("span", {
+      label && /* @__PURE__ */ jsx("span", {
         className: withBaseName("label"),
         children: label
       })

package/dist-es/switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  ComponentPropsWithoutRef,\n  FocusEventHandler,\n  forwardRef,\n  ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useDensity } from \"../salt-provider\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport switchCss from \"./Switch.css\";\nimport {\n  IconProps,\n  SuccessSmallSolidIcon,\n  SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface SwitchProps\n  extends Omit<\n    ComponentPropsWithoutRef<\"label\">,\n    \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n  > {\n  /**\n   * If `true`, the checkbox will be checked.\n   */\n  checked?: boolean;\n  /**\n   * Whether the checkbox component is checked by default\n   * This will be disregarded if checked is already set.\n   */\n  defaultChecked?: boolean;\n  /**\n   * If `true`, the checkbox will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Properties applied to the input element.\n   */\n  inputProps?: Partial<ComponentPropsWithoutRef<\"input\">>;\n  /**\n   * The label to be shown next to the checkbox.\n   */\n  label?: ReactNode;\n  /**\n   * The name applied to the input.\n   */\n  name?: string;\n  /**\n   * Callback when checkbox loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checked state is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checkbox gains focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * The value of the checkbox.\n   */\n  value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nfunction CheckedIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallSolidIcon {...props} />\n  ) : (\n    <SuccessSolidIcon {...props} />\n  );\n}\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(function Switch(\n  props,\n  ref\n) {\n  const {\n    checked: checkedProp,\n    className,\n    defaultChecked,\n    disabled: disabledProp,\n    inputProps = {},\n    label,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    value,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-switch\",\n    css: switchCss,\n    window: targetWindow,\n  });\n\n  const {\n    \"aria-describedby\": inputDescribedBy,\n    \"aria-labelledby\": inputLabelledBy,\n    className: inputClassName,\n    onChange: inputOnChange,\n    ...restInputProps\n  } = inputProps;\n\n  const [checked, setChecked] = useControlled({\n    controlled: checkedProp,\n    default: Boolean(defaultChecked),\n    name: \"Switch\",\n    state: \"checked\",\n  });\n\n  const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n    useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    // Workaround for https://github.com/facebook/react/issues/9023\n    if (event.nativeEvent.defaultPrevented) {\n      return;\n    }\n\n    const value = event.target.checked;\n    setChecked(value);\n    onChange?.(event);\n    inputOnChange?.(event);\n  };\n\n  return (\n    <label\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"checked\")]: checked,\n        },\n        className\n      )}\n      ref={ref}\n      {...rest}\n    >\n      <input\n        aria-describedby={clsx(\n          formFieldA11yProps?.[\"aria-describedby\"],\n          inputDescribedBy\n        )}\n        aria-labelledby={clsx(\n          formFieldA11yProps?.[\"aria-labelledby\"],\n          inputLabelledBy\n        )}\n        name={name}\n        value={value}\n        checked={checked}\n        className={clsx(withBaseName(\"input\"), inputClassName)}\n        defaultChecked={defaultChecked}\n        disabled={disabled}\n        onBlur={onBlur}\n        onChange={handleChange}\n        onFocus={onFocus}\n        type=\"checkbox\"\n        role=\"switch\"\n        {...restInputProps}\n      />\n      <span className={withBaseName(\"track\")}>\n        <span className={withBaseName(\"thumb\")}>\n          {checked && (\n            <CheckedIcon aria-hidden className={withBaseName(\"icon\")} />\n          )}\n        </span>\n      </span>\n      <span className={withBaseName(\"label\")}>{label}</span>\n    </label>\n  );\n});\n"],"names":["Switch","switchCss","value"],"mappings":"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"}
+{"version":3,"file":"Switch.js","sources":["../src/switch/Switch.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  ComponentPropsWithoutRef,\n  FocusEventHandler,\n  forwardRef,\n  ReactNode,\n} from \"react\";\nimport { useFormFieldProps } from \"../form-field-context\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { useDensity } from \"../salt-provider\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport switchCss from \"./Switch.css\";\nimport {\n  IconProps,\n  SuccessSmallSolidIcon,\n  SuccessSolidIcon,\n} from \"@salt-ds/icons\";\n\nexport interface SwitchProps\n  extends Omit<\n    ComponentPropsWithoutRef<\"label\">,\n    \"children\" | \"onFocus\" | \"onBlur\" | \"onChange\"\n  > {\n  /**\n   * If `true`, the checkbox will be checked.\n   */\n  checked?: boolean;\n  /**\n   * Whether the checkbox component is checked by default\n   * This will be disregarded if checked is already set.\n   */\n  defaultChecked?: boolean;\n  /**\n   * If `true`, the checkbox will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Properties applied to the input element.\n   */\n  inputProps?: Partial<ComponentPropsWithoutRef<\"input\">>;\n  /**\n   * The label to be shown next to the checkbox.\n   */\n  label?: ReactNode;\n  /**\n   * The name applied to the input.\n   */\n  name?: string;\n  /**\n   * Callback when checkbox loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checked state is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Callback when checkbox gains focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement>;\n  /**\n   * The value of the checkbox.\n   */\n  value?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltSwitch\");\n\nfunction CheckedIcon(props: IconProps) {\n  const density = useDensity();\n  return density === \"high\" ? (\n    <SuccessSmallSolidIcon {...props} />\n  ) : (\n    <SuccessSolidIcon {...props} />\n  );\n}\n\nexport const Switch = forwardRef<HTMLLabelElement, SwitchProps>(function Switch(\n  props,\n  ref\n) {\n  const {\n    checked: checkedProp,\n    className,\n    defaultChecked,\n    disabled: disabledProp,\n    inputProps = {},\n    label,\n    name,\n    onBlur,\n    onChange,\n    onFocus,\n    value,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-switch\",\n    css: switchCss,\n    window: targetWindow,\n  });\n\n  const {\n    \"aria-describedby\": inputDescribedBy,\n    \"aria-labelledby\": inputLabelledBy,\n    className: inputClassName,\n    onChange: inputOnChange,\n    ...restInputProps\n  } = inputProps;\n\n  const [checked, setChecked] = useControlled({\n    controlled: checkedProp,\n    default: Boolean(defaultChecked),\n    name: \"Switch\",\n    state: \"checked\",\n  });\n\n  const { a11yProps: formFieldA11yProps, disabled: formFieldDisabled } =\n    useFormFieldProps();\n\n  const disabled = formFieldDisabled || disabledProp;\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    // Workaround for https://github.com/facebook/react/issues/9023\n    if (event.nativeEvent.defaultPrevented) {\n      return;\n    }\n\n    const value = event.target.checked;\n    setChecked(value);\n    onChange?.(event);\n    inputOnChange?.(event);\n  };\n\n  return (\n    <label\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"checked\")]: checked,\n        },\n        className\n      )}\n      ref={ref}\n      {...rest}\n    >\n      <input\n        aria-describedby={clsx(\n          formFieldA11yProps?.[\"aria-describedby\"],\n          inputDescribedBy\n        )}\n        aria-labelledby={clsx(\n          formFieldA11yProps?.[\"aria-labelledby\"],\n          inputLabelledBy\n        )}\n        name={name}\n        value={value}\n        checked={checked}\n        className={clsx(withBaseName(\"input\"), inputClassName)}\n        defaultChecked={defaultChecked}\n        disabled={disabled}\n        onBlur={onBlur}\n        onChange={handleChange}\n        onFocus={onFocus}\n        type=\"checkbox\"\n        role=\"switch\"\n        {...restInputProps}\n      />\n      <span className={withBaseName(\"track\")}>\n        <span className={withBaseName(\"thumb\")}>\n          {checked && (\n            <CheckedIcon aria-hidden className={withBaseName(\"icon\")} />\n          )}\n        </span>\n      </span>\n      {label && <span className={withBaseName(\"label\")}>{label}</span>}\n    </label>\n  );\n});\n"],"names":["Switch","switchCss","value"],"mappings":"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"}

package/dist-es/text/Code.js

@@ -3,7 +3,7 @@ import { forwardRef } from 'react';
 import { Text } from './Text.js';
 
 const Code = forwardRef(
-  function TextAction({ children, className, ...rest }, ref) {
+  function TextAction({ children, ...rest }, ref) {
     return /* @__PURE__ */ jsx(Text, {
       as: "code",
       ref,

package/dist-es/text/Code.js.map

@@ -1 +1 @@
-{"version":3,"file":"Code.js","sources":["../src/text/Code.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const Code = forwardRef<HTMLSpanElement, Omit<TextProps<\"code\">, \"as\">>(\n  function TextAction({ children, className, ...rest }, ref) {\n    return (\n      <Text as=\"code\" ref={ref} {...rest}>\n        {children}\n      </Text>\n    );\n  }\n);\n"],"names":[],"mappings":";;;;AAGO,MAAM,IAAO,GAAA,UAAA;AAAA,EAClB,SAAS,UAAW,CAAA,EAAE,UAAU,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AACzD,IAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,MAAK,EAAG,EAAA,MAAA;AAAA,MAAO,GAAA;AAAA,MAAW,GAAG,IAAA;AAAA,MAC3B,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"Code.js","sources":["../src/text/Code.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const Code = forwardRef<HTMLSpanElement, Omit<TextProps<\"code\">, \"as\">>(\n  function TextAction({ children, ...rest }, ref) {\n    return (\n      <Text as=\"code\" ref={ref} {...rest}>\n        {children}\n      </Text>\n    );\n  }\n);\n"],"names":[],"mappings":";;;;AAGO,MAAM,IAAO,GAAA,UAAA;AAAA,EAClB,SAAS,UAAW,CAAA,EAAE,QAAa,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AAC9C,IAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,MAAK,EAAG,EAAA,MAAA;AAAA,MAAO,GAAA;AAAA,MAAW,GAAG,IAAA;AAAA,MAC3B,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/text/Display.js

@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Text } from './Text.js';
 
-const Display1 = forwardRef(function Display12({ children, className, styleAs = "display1", ...rest }, ref) {
+const Display1 = forwardRef(function Display12({ children, styleAs = "display1", ...rest }, ref) {
   return /* @__PURE__ */ jsx(Text, {
     as: "span",
     styleAs,
@@ -11,7 +11,7 @@ const Display1 = forwardRef(function Display12({ children, className, styleAs =
     children
   });
 });
-const Display2 = forwardRef(function Display22({ children, className, styleAs = "display2", ...rest }, ref) {
+const Display2 = forwardRef(function Display22({ children, styleAs = "display2", ...rest }, ref) {
   return /* @__PURE__ */ jsx(Text, {
     as: "span",
     styleAs,
@@ -20,7 +20,16 @@ const Display2 = forwardRef(function Display22({ children, className, styleAs =
     children
   });
 });
-const Display3 = forwardRef(function Display32({ children, className, styleAs = "display3", ...rest }, ref) {
+const Display3 = forwardRef(function Display32({ children, styleAs = "display3", ...rest }, ref) {
+  return /* @__PURE__ */ jsx(Text, {
+    as: "span",
+    styleAs,
+    ref,
+    ...rest,
+    children
+  });
+});
+const Display4 = forwardRef(function Display42({ children, styleAs = "display4", ...rest }, ref) {
   return /* @__PURE__ */ jsx(Text, {
     as: "span",
     styleAs,
@@ -30,5 +39,5 @@ const Display3 = forwardRef(function Display32({ children, className, styleAs =
   });
 });
 
-export { Display1, Display2, Display3 };
+export { Display1, Display2, Display3, Display4 };
 //# sourceMappingURL=Display.js.map

package/dist-es/text/Display.js.map

@@ -1 +1 @@
-{"version":3,"file":"Display.js","sources":["../src/text/Display.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const Display1 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Display1(\n  { children, className, styleAs = \"display1\", ...rest },\n  ref\n) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Display2 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Display2(\n  { children, className, styleAs = \"display2\", ...rest },\n  ref\n) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Display3 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Display3(\n  { children, className, styleAs = \"display3\", ...rest },\n  ref\n) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["Display1","Display2","Display3"],"mappings":";;;;AAGa,MAAA,QAAA,GAAW,UAGtB,CAAA,SAASA,SACT,CAAA,EAAE,QAAU,EAAA,SAAA,EAAW,OAAU,GAAA,UAAA,EAAA,GAAe,IAAK,EAAA,EACrD,GACA,EAAA;AACA,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAA;AAAA,IAAkB,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC,EAAA;AAEY,MAAA,QAAA,GAAW,UAGtB,CAAA,SAASC,SACT,CAAA,EAAE,QAAU,EAAA,SAAA,EAAW,OAAU,GAAA,UAAA,EAAA,GAAe,IAAK,EAAA,EACrD,GACA,EAAA;AACA,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAA;AAAA,IAAkB,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC,EAAA;AAEY,MAAA,QAAA,GAAW,UAGtB,CAAA,SAASC,SACT,CAAA,EAAE,QAAU,EAAA,SAAA,EAAW,OAAU,GAAA,UAAA,EAAA,GAAe,IAAK,EAAA,EACrD,GACA,EAAA;AACA,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAA;AAAA,IAAkB,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Display.js","sources":["../src/text/Display.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const Display1 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Display1({ children, styleAs = \"display1\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Display2 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Display2({ children, styleAs = \"display2\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Display3 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Display3({ children, styleAs = \"display3\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n\nexport const Display4 = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function Display4({ children, styleAs = \"display4\", ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs={styleAs} ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["Display1","Display2","Display3","Display4"],"mappings":";;;;AAGa,MAAA,QAAA,GAAW,UAGtB,CAAA,SAASA,SAAS,CAAA,EAAE,UAAU,OAAU,GAAA,UAAA,EAAA,GAAe,IAAK,EAAA,EAAG,GAAK,EAAA;AACpE,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAA;AAAA,IAAkB,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC,EAAA;AAEY,MAAA,QAAA,GAAW,UAGtB,CAAA,SAASC,SAAS,CAAA,EAAE,UAAU,OAAU,GAAA,UAAA,EAAA,GAAe,IAAK,EAAA,EAAG,GAAK,EAAA;AACpE,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAA;AAAA,IAAkB,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC,EAAA;AAEY,MAAA,QAAA,GAAW,UAGtB,CAAA,SAASC,SAAS,CAAA,EAAE,UAAU,OAAU,GAAA,UAAA,EAAA,GAAe,IAAK,EAAA,EAAG,GAAK,EAAA;AACpE,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAA;AAAA,IAAkB,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC,EAAA;AAEY,MAAA,QAAA,GAAW,UAGtB,CAAA,SAASC,SAAS,CAAA,EAAE,UAAU,OAAU,GAAA,UAAA,EAAA,GAAe,IAAK,EAAA,EAAG,GAAK,EAAA;AACpE,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAA;AAAA,IAAkB,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC7C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/text/Text.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltText {\n  --text-color: currentColor;\n}\n\n/* Main css class. Style for body text */\n.saltText {\n  color: var(--saltText-color, var(--text-color));\n  font-family: var(--saltText-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltText-fontSize, var(--salt-text-fontSize));\n  line-height: var(--saltText-lineHeight, var(--salt-text-lineHeight));\n  font-weight: var(--saltText-fontWeight, var(--salt-text-fontWeight));\n}\n\n.saltText::selection {\n  background: var(--saltText-highlight, var(--salt-content-foreground-highlight));\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: var(--text-max-rows, 0);\n  overflow: hidden;\n  word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n  --text-color: var(--salt-content-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n  --text-color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n  --text-color: var(--salt-content-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n  --text-color: var(--salt-content-secondary-foreground-disabled);\n}\n\n/* Info color */\n.saltText-info {\n  --text-color: var(--salt-status-info-foreground-informative);\n}\n\n/* Error color */\n.saltText-error {\n  --text-color: var(--salt-status-error-foreground-informative);\n}\n\n/* Warning color */\n.saltText-warning {\n  --text-color: var(--salt-status-warning-foreground-informative);\n}\n\n/* Success color */\n.saltText-success {\n  --text-color: var(--salt-status-success-foreground-informative);\n}\n\n/* Body emphasis strong */\n.saltText strong {\n  font-weight: var(--salt-text-fontWeight-strong);\n}\n\n/* Body emphasis small */\n.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Notation */\n.saltText-notation.saltText {\n  font-family: var(--salt-text-notation-fontFamily);\n  font-size: var(--salt-text-notation-fontSize);\n  line-height: var(--salt-text-notation-lineHeight);\n  font-weight: var(--salt-text-fontWeight);\n}\n\n/* Notation emphasis strong */\n.saltText-notation.saltText strong {\n  font-weight: var(--salt-text-notation-fontWeight-strong);\n}\n\n/* Notation emphasis small */\n.saltText-notation.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-notation-fontWeight-small);\n}\n\n/* Action */\n.saltText-action.saltText {\n  letter-spacing: var(--salt-text-action-letterSpacing);\n  text-transform: var(--salt-text-action-textTransform);\n  text-align: var(--salt-text-action-textAlign);\n  font-weight: var(--salt-text-action-fontWeight);\n}\n\n/* Code */\ncode.saltText,\n.saltText-code.saltText {\n  font-family: var(--salt-text-code-fontFamily);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n  font-family: var(--salt-text-display1-fontFamily);\n  font-size: var(--salt-text-display1-fontSize);\n  font-weight: var(--salt-text-display1-fontWeight);\n  line-height: var(--salt-text-display1-lineHeight);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n  font-family: var(--salt-text-display2-fontFamily);\n  font-size: var(--salt-text-display2-fontSize);\n  font-weight: var(--salt-text-display2-fontWeight);\n  line-height: var(--salt-text-display2-lineHeight);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n  font-family: var(--salt-text-display3-fontFamily);\n  font-size: var(--salt-text-display3-fontSize);\n  font-weight: var(--salt-text-display3-fontWeight);\n  line-height: var(--salt-text-display3-lineHeight);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n  font-family: var(--salt-text-h1-fontFamily);\n  font-size: var(--salt-text-h1-fontSize);\n  font-weight: var(--salt-text-h1-fontWeight);\n  line-height: var(--salt-text-h1-lineHeight);\n}\n\n/* H1 emphasis strong */\nh1.saltText strong,\n.saltText-h1.saltText strong {\n  font-weight: var(--salt-text-h1-fontWeight-strong);\n}\n\n/* H1 emphasis small */\nh1.saltText small,\n.saltText-h1.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h1-fontWeight-small);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n  font-family: var(--salt-text-h2-fontFamily);\n  font-size: var(--salt-text-h2-fontSize);\n  font-weight: var(--salt-text-h2-fontWeight);\n  line-height: var(--salt-text-h2-lineHeight);\n}\n\n/* H2 emphasis strong */\nh2.saltText strong,\n.saltText-h2.saltText strong {\n  font-weight: var(--salt-text-h2-fontWeight-strong);\n}\n\n/* H2 emphasis small */\nh2.saltText small,\n.saltText-h2.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h2-fontWeight-small);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n  font-family: var(--salt-text-h3-fontFamily);\n  font-size: var(--salt-text-h3-fontSize);\n  font-weight: var(--salt-text-h3-fontWeight);\n  line-height: var(--salt-text-h3-lineHeight);\n}\n\n/* H3 emphasis strong */\nh3.saltText strong,\n.saltText-h3.saltText strong {\n  font-weight: var(--salt-text-h3-fontWeight-strong);\n}\n\n/* H3 emphasis small */\nh3.saltText small,\n.saltText-h3.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h3-fontWeight-small);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n  font-family: var(--salt-text-h4-fontFamily);\n  font-size: var(--salt-text-h4-fontSize);\n  font-weight: var(--salt-text-h4-fontWeight);\n  line-height: var(--salt-text-h4-lineHeight);\n}\n\n/* H4 emphasis strong */\nh4.saltText strong,\n.saltText-h4.saltText strong {\n  font-weight: var(--salt-text-h4-fontWeight-strong);\n}\n\n/* H4 emphasis small */\nh4.saltText small,\n.saltText-h4.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h4-fontWeight-small);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n  font-family: var(--salt-text-label-fontFamily);\n  font-size: var(--salt-text-label-fontSize);\n  line-height: var(--salt-text-label-lineHeight);\n  font-weight: var(--salt-text-fontWeight);\n}\n\n/* Label emphasis strong */\nlabel.saltText strong,\n.saltText-label.saltText strong {\n  font-weight: var(--salt-text-label-fontWeight-strong);\n}\n\n/* Label emphasis small */\nlabel.saltText small,\n.saltText-label.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-fontWeight-small);\n}\n";
+var css_248z = ".saltText {\n  --text-color: currentColor;\n}\n\n/* Main css class. Style for body text */\n.saltText {\n  color: var(--saltText-color, var(--text-color));\n  font-family: var(--saltText-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltText-fontSize, var(--salt-text-fontSize));\n  line-height: var(--saltText-lineHeight, var(--salt-text-lineHeight));\n  font-weight: var(--saltText-fontWeight, var(--salt-text-fontWeight));\n}\n\n.saltText::selection {\n  background: var(--saltText-highlight, var(--salt-content-foreground-highlight));\n}\n\n/* Allows truncation */\n.saltText-lineClamp {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: var(--text-max-rows, 0);\n  overflow: hidden;\n  word-break: break-word;\n}\n\n/* Primary variant */\n.saltText-primary {\n  --text-color: var(--salt-content-primary-foreground);\n}\n\n/* Disabled primary variant */\n.saltText-primary.saltText-disabled {\n  --text-color: var(--salt-content-primary-foreground-disabled);\n}\n\n/* Secondary variant */\n.saltText-secondary {\n  --text-color: var(--salt-content-secondary-foreground);\n}\n\n/* Disabled secondary variant */\n.saltText-secondary.saltText-disabled {\n  --text-color: var(--salt-content-secondary-foreground-disabled);\n}\n\n/* Info color */\n.saltText-info {\n  --text-color: var(--salt-status-info-foreground-informative);\n}\n\n/* Error color */\n.saltText-error {\n  --text-color: var(--salt-status-error-foreground-informative);\n}\n\n/* Warning color */\n.saltText-warning {\n  --text-color: var(--salt-status-warning-foreground-informative);\n}\n\n/* Success color */\n.saltText-success {\n  --text-color: var(--salt-status-success-foreground-informative);\n}\n\n/* Body emphasis strong */\n.saltText strong {\n  font-weight: var(--salt-text-fontWeight-strong);\n}\n\n/* Body emphasis small */\n.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Notation */\n.saltText-notation.saltText {\n  font-family: var(--salt-text-notation-fontFamily);\n  font-size: var(--salt-text-notation-fontSize);\n  line-height: var(--salt-text-notation-lineHeight);\n  font-weight: var(--salt-text-fontWeight);\n}\n\n/* Notation emphasis strong */\n.saltText-notation.saltText strong {\n  font-weight: var(--salt-text-notation-fontWeight-strong);\n}\n\n/* Notation emphasis small */\n.saltText-notation.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-notation-fontWeight-small);\n}\n\n/* Action */\n.saltText-action.saltText {\n  letter-spacing: var(--salt-text-action-letterSpacing);\n  text-transform: var(--salt-text-action-textTransform);\n  text-align: var(--salt-text-action-textAlign);\n  font-weight: var(--salt-text-action-fontWeight);\n}\n\n/* Code */\ncode.saltText,\n.saltText-code.saltText {\n  font-family: var(--salt-text-code-fontFamily);\n}\n\n/* Display 1 */\n.saltText-display1.saltText {\n  font-family: var(--salt-text-display1-fontFamily);\n  font-size: var(--salt-text-display1-fontSize);\n  font-weight: var(--salt-text-display1-fontWeight);\n  line-height: var(--salt-text-display1-lineHeight);\n}\n\n/* Display 1 emphasis strong */\n.saltText-display1.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display1-fontWeight-strong);\n}\n\n/* Display 1 emphasis small */\n.saltText-display1.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display1-fontWeight-small);\n}\n\n/* Display 2 */\n.saltText-display2.saltText {\n  font-family: var(--salt-text-display2-fontFamily);\n  font-size: var(--salt-text-display2-fontSize);\n  font-weight: var(--salt-text-display2-fontWeight);\n  line-height: var(--salt-text-display2-lineHeight);\n}\n\n/* Display 2 emphasis strong */\n.saltText-display2.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display2-fontWeight-strong);\n}\n\n/* Display 2 emphasis small */\n.saltText-display2.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display2-fontWeight-small);\n}\n\n/* Display 3 */\n.saltText-display3.saltText {\n  font-family: var(--salt-text-display3-fontFamily);\n  font-size: var(--salt-text-display3-fontSize);\n  font-weight: var(--salt-text-display3-fontWeight);\n  line-height: var(--salt-text-display3-lineHeight);\n}\n\n/* Display 3 emphasis strong */\n.saltText-display3.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display3-fontWeight-strong);\n}\n\n/* Display 3 emphasis small */\n.saltText-display3.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display3-fontWeight-small);\n}\n\n/* Display 4 */\n.saltText-display4.saltText {\n  font-family: var(--salt-text-display4-fontFamily);\n  font-size: var(--salt-text-display4-fontSize);\n  font-weight: var(--salt-text-display4-fontWeight);\n  line-height: var(--salt-text-display4-lineHeight);\n}\n\n/* Display 4 emphasis strong */\n.saltText-display4.saltText strong {\n  font-size: inherit;\n  font-weight: var(--salt-text-display4-fontWeight-strong);\n}\n\n/* Display 4 emphasis small */\n.saltText-display4.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-display4-fontWeight-small);\n}\n\n/* Heading 1 */\nh1.saltText,\n.saltText-h1.saltText {\n  font-family: var(--salt-text-h1-fontFamily);\n  font-size: var(--salt-text-h1-fontSize);\n  font-weight: var(--salt-text-h1-fontWeight);\n  line-height: var(--salt-text-h1-lineHeight);\n}\n\n/* H1 emphasis strong */\nh1.saltText strong,\n.saltText-h1.saltText strong {\n  font-weight: var(--salt-text-h1-fontWeight-strong);\n}\n\n/* H1 emphasis small */\nh1.saltText small,\n.saltText-h1.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h1-fontWeight-small);\n}\n\n/* Heading 2 */\nh2.saltText,\n.saltText-h2.saltText {\n  font-family: var(--salt-text-h2-fontFamily);\n  font-size: var(--salt-text-h2-fontSize);\n  font-weight: var(--salt-text-h2-fontWeight);\n  line-height: var(--salt-text-h2-lineHeight);\n}\n\n/* H2 emphasis strong */\nh2.saltText strong,\n.saltText-h2.saltText strong {\n  font-weight: var(--salt-text-h2-fontWeight-strong);\n}\n\n/* H2 emphasis small */\nh2.saltText small,\n.saltText-h2.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h2-fontWeight-small);\n}\n\n/* Heading 3 */\nh3.saltText,\n.saltText-h3.saltText {\n  font-family: var(--salt-text-h3-fontFamily);\n  font-size: var(--salt-text-h3-fontSize);\n  font-weight: var(--salt-text-h3-fontWeight);\n  line-height: var(--salt-text-h3-lineHeight);\n}\n\n/* H3 emphasis strong */\nh3.saltText strong,\n.saltText-h3.saltText strong {\n  font-weight: var(--salt-text-h3-fontWeight-strong);\n}\n\n/* H3 emphasis small */\nh3.saltText small,\n.saltText-h3.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h3-fontWeight-small);\n}\n\n/* Heading 4 */\nh4.saltText,\n.saltText-h4.saltText {\n  font-family: var(--salt-text-h4-fontFamily);\n  font-size: var(--salt-text-h4-fontSize);\n  font-weight: var(--salt-text-h4-fontWeight);\n  line-height: var(--salt-text-h4-lineHeight);\n}\n\n/* H4 emphasis strong */\nh4.saltText strong,\n.saltText-h4.saltText strong {\n  font-weight: var(--salt-text-h4-fontWeight-strong);\n}\n\n/* H4 emphasis small */\nh4.saltText small,\n.saltText-h4.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-h4-fontWeight-small);\n}\n\n/* Label */\nlabel.saltText,\n.saltText-label.saltText {\n  font-family: var(--salt-text-label-fontFamily);\n  font-size: var(--salt-text-label-fontSize);\n  line-height: var(--salt-text-label-lineHeight);\n  font-weight: var(--salt-text-fontWeight);\n}\n\n/* Label emphasis strong */\nlabel.saltText strong,\n.saltText-label.saltText strong {\n  font-weight: var(--salt-text-label-fontWeight-strong);\n}\n\n/* Label emphasis small */\nlabel.saltText small,\n.saltText-label.saltText small {\n  font-size: inherit;\n  font-weight: var(--salt-text-fontWeight-small);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=Text.css.js.map

package/dist-es/text/Text.js

@@ -103,47 +103,45 @@ import '../tooltip/Tooltip.js';
 import css_248z from './Text.css.js';
 
 const withBaseName = makePrefixer("saltText");
-const Text = forwardRef(
-  ({
-    as,
-    children,
-    className,
-    disabled = false,
-    maxRows,
-    style,
-    styleAs,
-    variant,
-    color: colorProp,
-    ...restProps
-  }, ref) => {
-    var _a;
-    const targetWindow = useWindow();
-    useComponentCssInjection({
-      testId: "salt-text",
-      css: css_248z,
-      window: targetWindow
-    });
-    const Component = as != null ? as : "div";
-    const textStyles = { "--text-max-rows": maxRows, ...style };
-    const color = (_a = variant != null ? variant : colorProp) != null ? _a : "primary";
-    return /* @__PURE__ */ jsx(Component, {
-      className: clsx(
-        withBaseName(),
-        {
-          [withBaseName("disabled")]: disabled,
-          [withBaseName("lineClamp")]: maxRows,
-          [withBaseName(styleAs)]: styleAs,
-          [withBaseName(color)]: color !== "inherit"
-        },
-        className
-      ),
-      ...restProps,
-      ref,
-      style: textStyles,
-      children
-    });
-  }
-);
+const Text = forwardRef(function Text2({
+  as,
+  children,
+  className,
+  disabled = false,
+  maxRows,
+  style,
+  styleAs,
+  variant,
+  color: colorProp,
+  ...restProps
+}, ref) {
+  var _a;
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "salt-text",
+    css: css_248z,
+    window: targetWindow
+  });
+  const Component = as != null ? as : "div";
+  const textStyles = { "--text-max-rows": maxRows, ...style };
+  const color = (_a = variant != null ? variant : colorProp) != null ? _a : "primary";
+  return /* @__PURE__ */ jsx(Component, {
+    className: clsx(
+      withBaseName(),
+      {
+        [withBaseName("disabled")]: disabled,
+        [withBaseName("lineClamp")]: maxRows,
+        [withBaseName(styleAs)]: styleAs,
+        [withBaseName(color)]: color !== "inherit"
+      },
+      className
+    ),
+    ...restProps,
+    ref,
+    style: textStyles,
+    children
+  });
+});
 
 export { Text };
 //# sourceMappingURL=Text.js.map

package/dist-es/text/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { ValidationStatus } from \"../status-indicator\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n  T,\n  {\n    /**\n     * Applies disabled styling when true\n     */\n    disabled?: boolean;\n    /**\n     * Apply text truncation by mentioning number of rows to be displayed\n     */\n    maxRows?: number;\n    /**\n     * Match styling to another text component's style\n     */\n    styleAs?:\n      | \"h1\"\n      | \"h2\"\n      | \"h3\"\n      | \"h4\"\n      | \"label\"\n      | \"display1\"\n      | \"display2\"\n      | \"display3\"\n      | \"notation\"\n      | \"action\"\n      | \"code\";\n    /**\n     * Change text color palette\n     * @deprecated Use `color` instead\n     */\n    variant?: \"primary\" | \"secondary\";\n    /*\n     * The color of the text. Defaults to \"primary\".\n     */\n    color?: \"inherit\" | \"primary\" | \"secondary\" | ValidationStatus;\n  }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n  props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(\n  <T extends ElementType = \"div\">(\n    {\n      as,\n      children,\n      className,\n      disabled = false,\n      maxRows,\n      style,\n      styleAs,\n      variant,\n      color: colorProp,\n      ...restProps\n    }: TextProps<T>,\n    ref?: PolymorphicRef<T>\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-text\",\n      css: textCss,\n      window: targetWindow,\n    });\n\n    const Component = as ?? \"div\";\n\n    const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n    const color = variant ?? colorProp ?? \"primary\";\n\n    return (\n      <Component\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"lineClamp\")]: maxRows,\n            [withBaseName(styleAs as string)]: styleAs,\n            [withBaseName(color)]: color !== \"inherit\",\n          },\n          className\n        )}\n        {...restProps}\n        ref={ref}\n        style={textStyles}\n      >\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["textCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA,CAAA;AAErC,MAAM,IAAsB,GAAA,UAAA;AAAA,EACjC,CACE;AAAA,IACE,EAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACJ,GAAA,SAAA;AAAA,KAEL,GACG,KAAA;AAxEP,IAAA,IAAA,EAAA,CAAA;AAyEI,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,WAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,EAAM,IAAA,IAAA,GAAA,EAAA,GAAA,KAAA,CAAA;AAExB,IAAA,MAAM,UAAa,GAAA,EAAE,iBAAmB,EAAA,OAAA,EAAS,GAAG,KAAM,EAAA,CAAA;AAE1D,IAAM,MAAA,KAAA,GAAA,CAAQ,EAAW,GAAA,OAAA,IAAA,IAAA,GAAA,OAAA,GAAA,SAAA,KAAX,IAAwB,GAAA,EAAA,GAAA,SAAA,CAAA;AAEtC,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,UAC5B,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,OAAA;AAAA,UAC7B,CAAC,YAAa,CAAA,OAAiB,CAAI,GAAA,OAAA;AAAA,UACnC,CAAC,YAAA,CAAa,KAAK,CAAA,GAAI,KAAU,KAAA,SAAA;AAAA,SACnC;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MACJ,GAAA;AAAA,MACA,KAAO,EAAA,UAAA;AAAA,MAEN,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"Text.js","sources":["../src/text/Text.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  PolymorphicComponentPropWithRef,\n  PolymorphicRef,\n} from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, ReactElement } from \"react\";\n\nimport textCss from \"./Text.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { ValidationStatus } from \"../status-indicator\";\n\nexport type TextProps<T extends ElementType> = PolymorphicComponentPropWithRef<\n  T,\n  {\n    /**\n     * Applies disabled styling when true\n     */\n    disabled?: boolean;\n    /**\n     * Apply text truncation by mentioning number of rows to be displayed\n     */\n    maxRows?: number;\n    /**\n     * Match styling to another text component's style\n     */\n    styleAs?:\n      | \"h1\"\n      | \"h2\"\n      | \"h3\"\n      | \"h4\"\n      | \"label\"\n      | \"display1\"\n      | \"display2\"\n      | \"display3\"\n      | \"display4\"\n      | \"notation\"\n      | \"action\"\n      | \"code\";\n    /**\n     * Change text color palette\n     * @deprecated Use `color` instead\n     */\n    variant?: \"primary\" | \"secondary\";\n    /*\n     * The color of the text. Defaults to \"primary\".\n     */\n    color?: \"inherit\" | \"primary\" | \"secondary\" | ValidationStatus;\n  }\n>;\n\ntype TextComponent = <T extends ElementType = \"div\">(\n  props: TextProps<T>\n) => ReactElement | null;\n\nconst withBaseName = makePrefixer(\"saltText\");\n\nexport const Text: TextComponent = forwardRef(function Text<\n  T extends ElementType = \"div\"\n>(\n  {\n    as,\n    children,\n    className,\n    disabled = false,\n    maxRows,\n    style,\n    styleAs,\n    variant,\n    color: colorProp,\n    ...restProps\n  }: TextProps<T>,\n  ref?: PolymorphicRef<T>\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-text\",\n    css: textCss,\n    window: targetWindow,\n  });\n\n  const Component = as ?? \"div\";\n\n  const textStyles = { \"--text-max-rows\": maxRows, ...style };\n\n  const color = variant ?? colorProp ?? \"primary\";\n\n  return (\n    <Component\n      className={clsx(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: disabled,\n          [withBaseName(\"lineClamp\")]: maxRows,\n          [withBaseName(styleAs as string)]: styleAs,\n          [withBaseName(color)]: color !== \"inherit\",\n        },\n        className\n      )}\n      {...restProps}\n      ref={ref}\n      style={textStyles}\n    >\n      {children}\n    </Component>\n  );\n});\n"],"names":["Text","textCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwDA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA,CAAA;AAE/B,MAAA,IAAA,GAAsB,UAAW,CAAA,SAASA,KAGrD,CAAA;AAAA,EACE,EAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACX,OAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAO,EAAA,SAAA;AAAA,EACJ,GAAA,SAAA;AACL,CAAA,EACA,GACA,EAAA;AA1EF,EAAA,IAAA,EAAA,CAAA;AA2EE,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,YAAY,EAAM,IAAA,IAAA,GAAA,EAAA,GAAA,KAAA,CAAA;AAExB,EAAA,MAAM,UAAa,GAAA,EAAE,iBAAmB,EAAA,OAAA,EAAS,GAAG,KAAM,EAAA,CAAA;AAE1D,EAAM,MAAA,KAAA,GAAA,CAAQ,EAAW,GAAA,OAAA,IAAA,IAAA,GAAA,OAAA,GAAA,SAAA,KAAX,IAAwB,GAAA,EAAA,GAAA,SAAA,CAAA;AAEtC,EAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,OAAA;AAAA,QAC7B,CAAC,YAAa,CAAA,OAAiB,CAAI,GAAA,OAAA;AAAA,QACnC,CAAC,YAAA,CAAa,KAAK,CAAA,GAAI,KAAU,KAAA,SAAA;AAAA,OACnC;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACC,GAAG,SAAA;AAAA,IACJ,GAAA;AAAA,IACA,KAAO,EAAA,UAAA;AAAA,IAEN,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/text/TextAction.js

@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Text } from './Text.js';
 
-const TextAction = forwardRef(function TextAction2({ children, className, ...rest }, ref) {
+const TextAction = forwardRef(function TextAction2({ children, ...rest }, ref) {
   return /* @__PURE__ */ jsx(Text, {
     as: "span",
     styleAs: "action",

package/dist-es/text/TextAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextAction.js","sources":["../src/text/TextAction.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const TextAction = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function TextAction({ children, className, ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs=\"action\" ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["TextAction"],"mappings":";;;;AAGa,MAAA,UAAA,GAAa,WAGxB,SAASA,WAAAA,CAAW,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,IAAK,EAAA,EAAG,GAAK,EAAA;AAC3D,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAQ,EAAA,QAAA;AAAA,IAAS,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC5C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"TextAction.js","sources":["../src/text/TextAction.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const TextAction = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function TextAction({ children, ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs=\"action\" ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["TextAction"],"mappings":";;;;AAGa,MAAA,UAAA,GAAa,WAGxB,SAASA,WAAAA,CAAW,EAAE,QAAa,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AAChD,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAQ,EAAA,QAAA;AAAA,IAAS,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC5C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/text/TextNotation.js

@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Text } from './Text.js';
 
-const TextNotation = forwardRef(function TextNotation2({ children, className, ...rest }, ref) {
+const TextNotation = forwardRef(function TextNotation2({ children, ...rest }, ref) {
   return /* @__PURE__ */ jsx(Text, {
     as: "span",
     styleAs: "notation",

package/dist-es/text/TextNotation.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextNotation.js","sources":["../src/text/TextNotation.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const TextNotation = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function TextNotation({ children, className, ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs=\"notation\" ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["TextNotation"],"mappings":";;;;AAGa,MAAA,YAAA,GAAe,WAG1B,SAASA,aAAAA,CAAa,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,IAAK,EAAA,EAAG,GAAK,EAAA;AAC7D,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAQ,EAAA,UAAA;AAAA,IAAW,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC9C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"TextNotation.js","sources":["../src/text/TextNotation.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Text, TextProps } from \"./Text\";\n\nexport const TextNotation = forwardRef<\n  HTMLSpanElement,\n  Omit<TextProps<\"span\">, \"as\">\n>(function TextNotation({ children, ...rest }, ref) {\n  return (\n    <Text as=\"span\" styleAs=\"notation\" ref={ref} {...rest}>\n      {children}\n    </Text>\n  );\n});\n"],"names":["TextNotation"],"mappings":";;;;AAGa,MAAA,YAAA,GAAe,WAG1B,SAASA,aAAAA,CAAa,EAAE,QAAa,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AAClD,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,EAAG,EAAA,MAAA;AAAA,IAAO,OAAQ,EAAA,UAAA;AAAA,IAAW,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IAC9C,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/toast/Toast.css.js

@@ -1,4 +1,4 @@
-var css_248z = "/* Styles applied to Toast root element */\n.saltToast {\n  --toast-background: var(--salt-container-primary-background);\n  --toast-borderColor: var(--salt-container-primary-borderColor);\n\n  background: var(--saltToast-background, var(--toast-background));\n  border-color: var(--saltToast-borderColor, var(--toast-borderColor));\n  border-width: var(--saltToast-borderWidth, var(--salt-size-border));\n  border-style: var(--saltToast-borderStyle, var(--salt-container-borderStyle));\n  border-radius: var(--saltToast-borderRadius, var(--salt-palette-corner, 0));\n\n  box-sizing: border-box;\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  display: flex;\n  gap: var(--salt-spacing-75);\n  padding: var(--saltToast-padding, var(--salt-spacing-100));\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  margin: 0 var(--salt-spacing-100) var(--salt-spacing-100) var(--salt-spacing-100);\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n}\n\n.saltToast:last-child {\n  margin-bottom: var(--salt-spacing-200);\n}\n\n/* Styles applied to icon */\n.saltToast-icon.saltIcon {\n  margin: calc(var(--salt-spacing-75) + 2px) 0 var(--salt-spacing-75) 0;\n}\n\n.salt-density-high.saltToast-icon.saltIcon {\n  margin: calc(var(--salt-spacing-75) + 1px) 0 var(--salt-spacing-75) 0;\n}\n\n/* Styles applied when state = \"info\" */\n.saltToast-info {\n  --toast-borderColor: var(--salt-status-info-borderColor);\n}\n\n/* Styles applied when state = \"error\" */\n.saltToast-error {\n  --toast-borderColor: var(--salt-status-error-borderColor);\n}\n\n/* Styles applied when state = \"warning\" */\n.saltToast-warning {\n  --toast-borderColor: var(--salt-status-warning-borderColor);\n}\n\n/* Styles applied when state = \"success\" */\n.saltToast-success {\n  --toast-borderColor: var(--salt-status-success-borderColor);\n}\n";
+var css_248z = "/* Styles applied to Toast root element */\n.saltToast {\n  --toast-background: var(--salt-container-primary-background);\n  --toast-borderColor: var(--salt-container-primary-borderColor);\n  --toast-iconColor: var(--salt-content-primary-foreground);\n\n  background: var(--saltToast-background, var(--toast-background));\n  border-color: var(--saltToast-borderColor, var(--toast-borderColor));\n  border-width: var(--saltToast-borderWidth, var(--salt-size-border));\n  border-style: var(--saltToast-borderStyle, var(--salt-container-borderStyle));\n  border-radius: var(--saltToast-borderRadius, var(--salt-palette-corner, 0));\n\n  box-sizing: border-box;\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  display: flex;\n  gap: var(--salt-spacing-75);\n  padding: var(--saltToast-padding, var(--salt-spacing-100));\n  min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  margin: 0 var(--salt-spacing-100) var(--salt-spacing-100) var(--salt-spacing-100);\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n}\n\n.saltToast:last-child {\n  margin-bottom: var(--salt-spacing-200);\n}\n\n/* Styles applied to icon */\n.saltToast-iconContainer > .saltIcon {\n  margin: calc(var(--salt-spacing-75) + 2px) 0 var(--salt-spacing-75) 0;\n  color: var(--toast-iconColor);\n}\n\n/* Styles applied when state = \"info\" */\n.saltToast-info {\n  --toast-borderColor: var(--salt-status-info-borderColor);\n  --toast-iconColor: var(--salt-status-info-foreground-decorative);\n}\n\n/* Styles applied when state = \"error\" */\n.saltToast-error {\n  --toast-borderColor: var(--salt-status-error-borderColor);\n  --toast-iconColor: var(--salt-status-error-foreground-decorative);\n}\n\n/* Styles applied when state = \"warning\" */\n.saltToast-warning {\n  --toast-borderColor: var(--salt-status-warning-borderColor);\n  --toast-iconColor: var(--salt-status-warning-foreground-decorative);\n}\n\n/* Styles applied when state = \"success\" */\n.saltToast-success {\n  --toast-borderColor: var(--salt-status-success-borderColor);\n  --toast-iconColor: var(--salt-status-success-foreground-decorative);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=Toast.css.js.map

package/dist-es/toast/Toast.js

@@ -104,7 +104,7 @@ import css_248z from './Toast.css.js';
 
 const withBaseName = makePrefixer("saltToast");
 const Toast = forwardRef(function Toast2(props, ref) {
-  const { children, className, status, ...rest } = props;
+  const { children, className, status, icon, ...rest } = props;
   const targetWindow = useWindow();
   useComponentCssInjection({
     testId: "salt-toast",
@@ -121,9 +121,11 @@ const Toast = forwardRef(function Toast2(props, ref) {
     ...rest,
     ref,
     children: [
-      status && /* @__PURE__ */ jsx(StatusIndicator, {
-        status,
-        className: withBaseName("icon")
+      status && /* @__PURE__ */ jsx("div", {
+        className: withBaseName("iconContainer"),
+        children: icon ? icon : /* @__PURE__ */ jsx(StatusIndicator, {
+          status
+        })
       }),
       children
     ]

package/dist-es/toast/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   *  A string to determine the current state of the Toast.\n   */\n  status?: ValidationStatus;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n  props,\n  ref\n) {\n  const { children, className, status, ...rest } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-toast\",\n    css: toastCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        { [withBaseName(status ?? \"\")]: status },\n        className\n      )}\n      role=\"alert\"\n      {...rest}\n      ref={ref}\n    >\n      {status && (\n        <StatusIndicator status={status} className={withBaseName(\"icon\")} />\n      )}\n      {children}\n    </div>\n  );\n});\n"],"names":["Toast","toastCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA,CAAA;AAStC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,OACA,GACA,EAAA;AACA,EAAA,MAAM,EAAE,QAAA,EAAU,SAAW,EAAA,MAAA,EAAA,GAAW,MAAS,GAAA,KAAA,CAAA;AACjD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAA,CAAa,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAE,IAAI,MAAO,EAAA;AAAA,MACvC,SAAA;AAAA,KACF;AAAA,IACA,IAAK,EAAA,OAAA;AAAA,IACJ,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,MAAA,oBACE,GAAA,CAAA,eAAA,EAAA;AAAA,QAAgB,MAAA;AAAA,QAAgB,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MAEnE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Toast.js","sources":["../src/toast/Toast.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { ComponentPropsWithoutRef, forwardRef, ReactElement } from \"react\";\nimport { StatusIndicator, ValidationStatus } from \"../status-indicator\";\nimport { makePrefixer } from \"../utils\";\n\nimport toastCss from \"./Toast.css\";\nimport { IconProps } from \"@salt-ds/icons\";\n\nconst withBaseName = makePrefixer(\"saltToast\");\n\nexport interface ToastProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   *  A string to determine the current state of the Toast.\n   */\n  status?: ValidationStatus;\n  /**\n   * (Optional) if provided, this icon component will be used instead of the status icon\n   */\n  icon?: ReactElement<IconProps>;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(function Toast(\n  props,\n  ref\n) {\n  const { children, className, status, icon, ...rest } = props;\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-toast\",\n    css: toastCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        { [withBaseName(status ?? \"\")]: status },\n        className\n      )}\n      role=\"alert\"\n      {...rest}\n      ref={ref}\n    >\n      {status && (\n        <div className={withBaseName(\"iconContainer\")}>\n          {icon ? icon : <StatusIndicator status={status} />}\n        </div>\n      )}\n      {children}\n    </div>\n  );\n});\n"],"names":["Toast","toastCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAe,aAAa,WAAW,CAAA,CAAA;AAatC,MAAM,KAAQ,GAAA,UAAA,CAAuC,SAASA,MAAAA,CACnE,OACA,GACA,EAAA;AACA,EAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,MAAQ,EAAA,IAAA,EAAA,GAAS,MAAS,GAAA,KAAA,CAAA;AACvD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,EAAE,CAAC,YAAA,CAAa,MAAU,IAAA,IAAA,GAAA,MAAA,GAAA,EAAE,IAAI,MAAO,EAAA;AAAA,MACvC,SAAA;AAAA,KACF;AAAA,IACA,IAAK,EAAA,OAAA;AAAA,IACJ,GAAG,IAAA;AAAA,IACJ,GAAA;AAAA,IAEC,QAAA,EAAA;AAAA,MAAA,MAAA,oBACE,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,eAAe,CAAA;AAAA,QACzC,QAAA,EAAA,IAAA,GAAO,uBAAQ,GAAA,CAAA,eAAA,EAAA;AAAA,UAAgB,MAAA;AAAA,SAAgB,CAAA;AAAA,OAClD,CAAA;AAAA,MAED,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-types/input/Input.d.ts

@@ -37,5 +37,8 @@ export interface InputProps extends Omit<ComponentPropsWithoutRef<"div">, "defau
      * Styling variant. Defaults to "primary".
      */
     variant?: "primary" | "secondary";
+    /** Styling variant with full border. Defaults to false
+     */
+    bordered?: boolean;
 }
 export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist-types/text/Display.d.ts

@@ -2,3 +2,4 @@ import { TextProps } from "./Text";
 export declare const Display1: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"span">, "as">, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
 export declare const Display2: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"span">, "as">, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
 export declare const Display3: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"span">, "as">, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const Display4: import("react").ForwardRefExoticComponent<Omit<Omit<TextProps<"span">, "as">, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;

package/dist-types/text/Text.d.ts

@@ -13,7 +13,7 @@ export declare type TextProps<T extends ElementType> = PolymorphicComponentPropW
     /**
      * Match styling to another text component's style
      */
-    styleAs?: "h1" | "h2" | "h3" | "h4" | "label" | "display1" | "display2" | "display3" | "notation" | "action" | "code";
+    styleAs?: "h1" | "h2" | "h3" | "h4" | "label" | "display1" | "display2" | "display3" | "display4" | "notation" | "action" | "code";
     /**
      * Change text color palette
      * @deprecated Use `color` instead

package/dist-types/toast/Toast.d.ts

@@ -1,9 +1,14 @@
-import { ComponentPropsWithoutRef } from "react";
+import { ComponentPropsWithoutRef, ReactElement } from "react";
 import { ValidationStatus } from "../status-indicator";
+import { IconProps } from "@salt-ds/icons";
 export interface ToastProps extends ComponentPropsWithoutRef<"div"> {
     /**
      *  A string to determine the current state of the Toast.
      */
     status?: ValidationStatus;
+    /**
+     * (Optional) if provided, this icon component will be used instead of the status icon
+     */
+    icon?: ReactElement<IconProps>;
 }
 export declare const Toast: import("react").ForwardRefExoticComponent<ToastProps & import("react").RefAttributes<HTMLDivElement>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salt-ds/core",
-  "version": "1.28.0",
+  "version": "1.29.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -15,7 +15,7 @@
     "clsx": "^2.0.0",
     "@salt-ds/window": "^0.1.1",
     "@salt-ds/styles": "^0.2.1",
-    "@salt-ds/icons": "^1.11.2"
+    "@salt-ds/icons": "^1.12.0"
   },
   "peerDependencies": {
     "@types/react": ">=16.14.0",