@salt-ds/lab 1.0.0-alpha.70 → 1.0.0-alpha.72

package/dist-cjs/editable-label/EditableLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditableLabel.js","sources":["../src/editable-label/EditableLabel.tsx"],"sourcesContent":["import { useControlled, useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type ReactElement,\n  forwardRef,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { InputLegacy as Input } from \"../input-legacy\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport editableLabelCss from \"./EditableLabel.css\";\n\nconst classBase = \"saltEditableLabel\";\n\nexport interface EditableLabelProps {\n  className?: string;\n  defaultEditing?: boolean;\n  defaultValue?: string;\n  editing?: boolean;\n  onEnterEditMode: () => void;\n  onChange?: (value: string) => void;\n  onExitEditMode: (\n    originalLabel: string | undefined,\n    editedLabel: string | undefined,\n    allowDeactivation?: boolean,\n  ) => void;\n  defaultIsEditing?: boolean;\n  value?: string;\n}\n\nexport const EditableLabel = forwardRef(function EditableLabel(\n  {\n    className: classNameProp,\n    defaultEditing,\n    defaultValue,\n    editing: editingProp,\n    onChange,\n    onEnterEditMode,\n    onExitEditMode,\n    value: valueProp,\n  }: EditableLabelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n): ReactElement<EditableLabelProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-editable-label\",\n    css: editableLabelCss,\n    window: targetWindow,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue ?? \"\",\n    name: \"EditableLabel\",\n    state: \"value\",\n  });\n\n  const [editing, setEditing] = useControlled({\n    controlled: editingProp,\n    default: defaultEditing || false,\n    name: \"EditableLabel\",\n    state: \"editing\",\n  });\n\n  const initialValue = useRef(value);\n\n  useIsomorphicLayoutEffect(() => {\n    if (editing) {\n      if (inputRef.current !== null) {\n        inputRef.current.select();\n        inputRef.current.focus();\n      }\n    }\n  }, [editing]);\n\n  const enterEditMode = useCallback(() => {\n    setEditing(true);\n    // ignoreBlur.current = false;\n    onEnterEditMode?.();\n  }, [onEnterEditMode]);\n\n  const exitEditMode = ({\n    cancelEdit = false,\n    allowDeactivation = false,\n  } = {}) => {\n    setEditing(false);\n    const originalValue = initialValue.current;\n    if (originalValue !== value) {\n      if (cancelEdit) {\n        setValue(originalValue);\n      } else {\n        initialValue.current = value;\n      }\n    }\n    onExitEditMode?.(originalValue, value, allowDeactivation);\n  };\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {\n    const { value } = evt.target;\n    setValue(value);\n    onChange?.(value);\n  };\n\n  const handleDoubleClick = () => {\n    enterEditMode();\n  };\n\n  const handleBlur = () => {\n    exitEditMode({ allowDeactivation: true });\n  };\n\n  const handleKeyDown = (evt: KeyboardEvent<HTMLInputElement>) => {\n    if (editing && evt.key === \"Enter\") {\n      evt.stopPropagation();\n      // we are likely to lose focus as a consequence of user response\n      // to exitEdit transition, don't want it to trigger another\n      //shouldn't we call setEditing here in case we are in uncontrolled mode ?\n      exitEditMode();\n    } else if (evt.key === \"ArrowRight\" || evt.key === \"ArrowLeft\") {\n      evt.stopPropagation();\n    } else if (evt.key === \"Escape\") {\n      exitEditMode({ cancelEdit: true });\n    }\n  };\n\n  const className = clsx(classBase, classNameProp, {\n    [`${classBase}-editing`]: editing,\n  });\n  return (\n    <div\n      className={className}\n      onDoubleClick={handleDoubleClick}\n      data-text={value}\n      ref={forwardedRef}\n    >\n      {editing ? (\n        <Input\n          inputProps={{ className: `${classBase}-input` }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          ref={inputRef}\n          style={{ padding: 0 }}\n          textAlign=\"left\"\n        />\n      ) : (\n        value\n      )}\n    </div>\n  );\n});\n"],"names":["forwardRef","EditableLabel","useWindow","useComponentCssInjection","editableLabelCss","useRef","useControlled","useIsomorphicLayoutEffect","useCallback","value","clsx","jsx","Input"],"mappings":";;;;;;;;;;;;AAkBA,MAAM,SAAY,GAAA,mBAAA;AAkBL,MAAA,aAAA,GAAgBA,gBAAW,CAAA,SAASC,cAC/C,CAAA;AAAA,EACE,SAAW,EAAA,aAAA;AAAA,EACX,cAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAS,EAAA,WAAA;AAAA,EACT,QAAA;AAAA,EACA,eAAA;AAAA,EACA,cAAA;AAAA,EACA,KAAO,EAAA;AACT,CAAA,EACA,YACkC,EAAA;AAClC,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAAC,eAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,QAAA,GAAWC,aAAgC,IAAI,CAAA;AAErD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,kBAAc,CAAA;AAAA,IACtC,UAAY,EAAA,SAAA;AAAA,IACZ,SAAS,YAAgB,IAAA,EAAA;AAAA,IACzB,IAAM,EAAA,eAAA;AAAA,IACN,KAAO,EAAA;AAAA,GACR,CAAA;AAED,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIA,kBAAc,CAAA;AAAA,IAC1C,UAAY,EAAA,WAAA;AAAA,IACZ,SAAS,cAAkB,IAAA,KAAA;AAAA,IAC3B,IAAM,EAAA,eAAA;AAAA,IACN,KAAO,EAAA;AAAA,GACR,CAAA;AAED,EAAM,MAAA,YAAA,GAAeD,aAAO,KAAK,CAAA;AAEjC,EAAAE,8BAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,OAAS,EAAA;AACX,MAAI,IAAA,QAAA,CAAS,YAAY,IAAM,EAAA;AAC7B,QAAA,QAAA,CAAS,QAAQ,MAAO,EAAA;AACxB,QAAA,QAAA,CAAS,QAAQ,KAAM,EAAA;AAAA;AACzB;AACF,GACF,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,EAAM,MAAA,aAAA,GAAgBC,kBAAY,MAAM;AACtC,IAAA,UAAA,CAAW,IAAI,CAAA;AAEf,IAAA,eAAA,IAAA,IAAA,GAAA,MAAA,GAAA,eAAA,EAAA;AAAA,GACF,EAAG,CAAC,eAAe,CAAC,CAAA;AAEpB,EAAA,MAAM,eAAe,CAAC;AAAA,IACpB,UAAa,GAAA,KAAA;AAAA,IACb,iBAAoB,GAAA;AAAA,GACtB,GAAI,EAAO,KAAA;AACT,IAAA,UAAA,CAAW,KAAK,CAAA;AAChB,IAAA,MAAM,gBAAgB,YAAa,CAAA,OAAA;AACnC,IAAA,IAAI,kBAAkB,KAAO,EAAA;AAC3B,MAAA,IAAI,UAAY,EAAA;AACd,QAAA,QAAA,CAAS,aAAa,CAAA;AAAA,OACjB,MAAA;AACL,QAAA,YAAA,CAAa,OAAU,GAAA,KAAA;AAAA;AACzB;AAEF,IAAA,cAAA,IAAA,IAAA,GAAA,MAAA,GAAA,cAAA,CAAiB,eAAe,KAAO,EAAA,iBAAA,CAAA;AAAA,GACzC;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,GAAuC,KAAA;AAC3D,IAAA,MAAM,EAAE,KAAA,EAAAC,MAAM,EAAA,GAAI,GAAI,CAAA,MAAA;AACtB,IAAA,QAAA,CAASA,MAAK,CAAA;AACd,IAAWA,QAAAA,IAAAA,IAAAA,GAAAA,MAAAA,GAAAA,QAAAA,CAAAA,MAAAA,CAAAA;AAAA,GACb;AAEA,EAAA,MAAM,oBAAoB,MAAM;AAC9B,IAAc,aAAA,EAAA;AAAA,GAChB;AAEA,EAAA,MAAM,aAAa,MAAM;AACvB,IAAa,YAAA,CAAA,EAAE,iBAAmB,EAAA,IAAA,EAAM,CAAA;AAAA,GAC1C;AAEA,EAAM,MAAA,aAAA,GAAgB,CAAC,GAAyC,KAAA;AAC9D,IAAI,IAAA,OAAA,IAAW,GAAI,CAAA,GAAA,KAAQ,OAAS,EAAA;AAClC,MAAA,GAAA,CAAI,eAAgB,EAAA;AAIpB,MAAa,YAAA,EAAA;AAAA,eACJ,GAAI,CAAA,GAAA,KAAQ,YAAgB,IAAA,GAAA,CAAI,QAAQ,WAAa,EAAA;AAC9D,MAAA,GAAA,CAAI,eAAgB,EAAA;AAAA,KACtB,MAAA,IAAW,GAAI,CAAA,GAAA,KAAQ,QAAU,EAAA;AAC/B,MAAa,YAAA,CAAA,EAAE,UAAY,EAAA,IAAA,EAAM,CAAA;AAAA;AACnC,GACF;AAEA,EAAM,MAAA,SAAA,GAAYC,SAAK,CAAA,SAAA,EAAW,aAAe,EAAA;AAAA,IAC/C,CAAC,CAAA,EAAG,SAAS,CAAA,QAAA,CAAU,GAAG;AAAA,GAC3B,CAAA;AACD,EACE,uBAAAC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,aAAe,EAAA,iBAAA;AAAA,MACf,WAAW,EAAA,KAAA;AAAA,MACX,GAAK,EAAA,YAAA;AAAA,MAEJ,QACC,EAAA,OAAA,mBAAAA,cAAA;AAAA,QAACC,uBAAA;AAAA,QAAA;AAAA,UACC,UAAY,EAAA,EAAE,SAAW,EAAA,CAAA,EAAG,SAAS,CAAS,MAAA,CAAA,EAAA;AAAA,UAC9C,KAAA;AAAA,UACA,MAAQ,EAAA,UAAA;AAAA,UACR,QAAU,EAAA,YAAA;AAAA,UACV,SAAW,EAAA,aAAA;AAAA,UACX,GAAK,EAAA,QAAA;AAAA,UACL,KAAA,EAAO,EAAE,OAAA,EAAS,CAAE,EAAA;AAAA,UACpB,SAAU,EAAA;AAAA;AAAA,OAGZ,GAAA;AAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}
+{"version":3,"file":"EditableLabel.js","sources":["../src/editable-label/EditableLabel.tsx"],"sourcesContent":["import { useControlled, useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type ForwardedRef,\n  forwardRef,\n  type KeyboardEvent,\n  type ReactElement,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { InputLegacy as Input } from \"../input-legacy\";\n\nimport editableLabelCss from \"./EditableLabel.css\";\n\nconst classBase = \"saltEditableLabel\";\n\nexport interface EditableLabelProps {\n  className?: string;\n  defaultEditing?: boolean;\n  defaultValue?: string;\n  editing?: boolean;\n  onEnterEditMode: () => void;\n  onChange?: (value: string) => void;\n  onExitEditMode: (\n    originalLabel: string | undefined,\n    editedLabel: string | undefined,\n    allowDeactivation?: boolean,\n  ) => void;\n  defaultIsEditing?: boolean;\n  value?: string;\n}\n\nexport const EditableLabel = forwardRef(function EditableLabel(\n  {\n    className: classNameProp,\n    defaultEditing,\n    defaultValue,\n    editing: editingProp,\n    onChange,\n    onEnterEditMode,\n    onExitEditMode,\n    value: valueProp,\n  }: EditableLabelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n): ReactElement<EditableLabelProps> {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-editable-label\",\n    css: editableLabelCss,\n    window: targetWindow,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [value, setValue] = useControlled({\n    controlled: valueProp,\n    default: defaultValue ?? \"\",\n    name: \"EditableLabel\",\n    state: \"value\",\n  });\n\n  const [editing, setEditing] = useControlled({\n    controlled: editingProp,\n    default: defaultEditing || false,\n    name: \"EditableLabel\",\n    state: \"editing\",\n  });\n\n  const initialValue = useRef(value);\n\n  useIsomorphicLayoutEffect(() => {\n    if (editing) {\n      if (inputRef.current !== null) {\n        inputRef.current.select();\n        inputRef.current.focus();\n      }\n    }\n  }, [editing]);\n\n  const enterEditMode = useCallback(() => {\n    setEditing(true);\n    // ignoreBlur.current = false;\n    onEnterEditMode?.();\n  }, [onEnterEditMode]);\n\n  const exitEditMode = ({\n    cancelEdit = false,\n    allowDeactivation = false,\n  } = {}) => {\n    setEditing(false);\n    const originalValue = initialValue.current;\n    if (originalValue !== value) {\n      if (cancelEdit) {\n        setValue(originalValue);\n      } else {\n        initialValue.current = value;\n      }\n    }\n    onExitEditMode?.(originalValue, value, allowDeactivation);\n  };\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>) => {\n    const { value } = evt.target;\n    setValue(value);\n    onChange?.(value);\n  };\n\n  const handleDoubleClick = () => {\n    enterEditMode();\n  };\n\n  const handleBlur = () => {\n    exitEditMode({ allowDeactivation: true });\n  };\n\n  const handleKeyDown = (evt: KeyboardEvent<HTMLInputElement>) => {\n    if (editing && evt.key === \"Enter\") {\n      evt.stopPropagation();\n      // we are likely to lose focus as a consequence of user response\n      // to exitEdit transition, don't want it to trigger another\n      //shouldn't we call setEditing here in case we are in uncontrolled mode ?\n      exitEditMode();\n    } else if (evt.key === \"ArrowRight\" || evt.key === \"ArrowLeft\") {\n      evt.stopPropagation();\n    } else if (evt.key === \"Escape\") {\n      exitEditMode({ cancelEdit: true });\n    }\n  };\n\n  const className = clsx(classBase, classNameProp, {\n    [`${classBase}-editing`]: editing,\n  });\n  return (\n    <div\n      className={className}\n      onDoubleClick={handleDoubleClick}\n      data-text={value}\n      ref={forwardedRef}\n    >\n      {editing ? (\n        <Input\n          inputProps={{ className: `${classBase}-input` }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          ref={inputRef}\n          style={{ padding: 0 }}\n          textAlign=\"left\"\n        />\n      ) : (\n        value\n      )}\n    </div>\n  );\n});\n"],"names":["forwardRef","EditableLabel","useWindow","useComponentCssInjection","editableLabelCss","useRef","useControlled","useIsomorphicLayoutEffect","useCallback","value","clsx","jsx","Input"],"mappings":"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"}

package/dist-cjs/form-field-legacy/FormActivationIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormActivationIndicator.js","sources":["../src/form-field-legacy/FormActivationIndicator.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport type { SVGAttributes } from \"react\";\nimport type { FormFieldLegacyProps as FormFieldProps } from \"./FormFieldLegacy\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formActivationIndicatorCss from \"./FormActivationIndicator.css\";\n\nconst ErrorIndicatorIcon = (props: SVGAttributes<SVGSVGElement>) => {\n  return (\n    <svg\n      viewBox=\"0 0 16 16\"\n      focusable={false}\n      data-testid=\"ErrorIndicatorIcon\"\n      {...props}\n    >\n      <circle cx={8} cy={8} r={8} />\n    </svg>\n  );\n};\n\nconst WarningIndicatorIcon = (props: SVGAttributes<SVGSVGElement>) => {\n  return (\n    <svg\n      viewBox=\"0 0 16 16\"\n      focusable={false}\n      data-testid=\"WarningIndicatorIcon\"\n      {...props}\n    >\n      <polygon points=\"0, 16 16, 16 16, 0\" />\n    </svg>\n  );\n};\n\nconst withBaseName = makePrefixer(\"saltFormActivationIndicator\");\n\nconst ActivationIndicatorIcon = ({\n  validationStatus,\n  ...restSvgProps\n}: Pick<FormFieldProps, \"validationStatus\"> & SVGAttributes<SVGSVGElement>) => {\n  if (validationStatus === \"error\") {\n    return <ErrorIndicatorIcon {...restSvgProps} />;\n  }\n  if (validationStatus === \"warning\") {\n    return <WarningIndicatorIcon {...restSvgProps} />;\n  }\n  return null;\n};\n\n// Removed `enabled` prop, it's better to let parent to control render\nexport interface FormActivationIndicatorProps\n  extends Pick<FormFieldProps, \"validationStatus\"> {\n  hasIcon?: boolean;\n}\n\nexport const FormActivationIndicator = ({\n  hasIcon,\n  validationStatus,\n}: FormActivationIndicatorProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-activation-indicator\",\n    css: formActivationIndicatorCss,\n    window: targetWindow,\n  });\n\n  const rootClass = \"saltFormActivationIndicator\";\n\n  return (\n    <div className={withBaseName()}>\n      <div className={withBaseName(\"bar\")}>\n        {hasIcon && validationStatus && (\n          <ActivationIndicatorIcon\n            className={`${rootClass}-icon`}\n            validationStatus={validationStatus}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["jsx","makePrefixer","useWindow","useComponentCssInjection","formActivationIndicatorCss"],"mappings":";;;;;;;;AASA,MAAM,kBAAA,GAAqB,CAAC,KAAwC,KAAA;AAClE,EACE,uBAAAA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACR,SAAW,EAAA,KAAA;AAAA,MACX,aAAY,EAAA,oBAAA;AAAA,MACX,GAAG,KAAA;AAAA,MAEJ,yCAAC,QAAO,EAAA,EAAA,EAAA,EAAI,GAAG,EAAI,EAAA,CAAA,EAAG,GAAG,CAAG,EAAA;AAAA;AAAA,GAC9B;AAEJ,CAAA;AAEA,MAAM,oBAAA,GAAuB,CAAC,KAAwC,KAAA;AACpE,EACE,uBAAAA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACR,SAAW,EAAA,KAAA;AAAA,MACX,aAAY,EAAA,sBAAA;AAAA,MACX,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAAA,cAAA,CAAC,SAAQ,EAAA,EAAA,MAAA,EAAO,oBAAqB,EAAA;AAAA;AAAA,GACvC;AAEJ,CAAA;AAEA,MAAM,YAAA,GAAeC,kBAAa,6BAA6B,CAAA;AAE/D,MAAM,0BAA0B,CAAC;AAAA,EAC/B,gBAAA;AAAA,EACA,GAAG;AACL,CAA+E,KAAA;AAC7E,EAAA,IAAI,qBAAqB,OAAS,EAAA;AAChC,IAAO,uBAAAD,cAAA,CAAC,kBAAoB,EAAA,EAAA,GAAG,YAAc,EAAA,CAAA;AAAA;AAE/C,EAAA,IAAI,qBAAqB,SAAW,EAAA;AAClC,IAAO,uBAAAA,cAAA,CAAC,oBAAsB,EAAA,EAAA,GAAG,YAAc,EAAA,CAAA;AAAA;AAEjD,EAAO,OAAA,IAAA;AACT,CAAA;AAQO,MAAM,0BAA0B,CAAC;AAAA,EACtC,OAAA;AAAA,EACA;AACF,CAAoC,KAAA;AAClC,EAAA,MAAM,eAAeE,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gCAAA;AAAA,IACR,GAAK,EAAAC,yBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAY,GAAA,6BAAA;AAElB,EAAA,uBACGJ,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,EACd,EAAA,QAAA,kBAAAA,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,KAAK,CAC/B,EAAA,QAAA,EAAA,OAAA,IAAW,gBACV,oBAAAA,cAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA;AAAA,MACvB;AAAA;AAAA,KAGN,CACF,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"FormActivationIndicator.js","sources":["../src/form-field-legacy/FormActivationIndicator.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type { SVGAttributes } from \"react\";\nimport formActivationIndicatorCss from \"./FormActivationIndicator.css\";\nimport type { FormFieldLegacyProps as FormFieldProps } from \"./FormFieldLegacy\";\n\nconst ErrorIndicatorIcon = (props: SVGAttributes<SVGSVGElement>) => {\n  return (\n    <svg\n      viewBox=\"0 0 16 16\"\n      focusable={false}\n      data-testid=\"ErrorIndicatorIcon\"\n      {...props}\n    >\n      <circle cx={8} cy={8} r={8} />\n    </svg>\n  );\n};\n\nconst WarningIndicatorIcon = (props: SVGAttributes<SVGSVGElement>) => {\n  return (\n    <svg\n      viewBox=\"0 0 16 16\"\n      focusable={false}\n      data-testid=\"WarningIndicatorIcon\"\n      {...props}\n    >\n      <polygon points=\"0, 16 16, 16 16, 0\" />\n    </svg>\n  );\n};\n\nconst withBaseName = makePrefixer(\"saltFormActivationIndicator\");\n\nconst ActivationIndicatorIcon = ({\n  validationStatus,\n  ...restSvgProps\n}: Pick<FormFieldProps, \"validationStatus\"> & SVGAttributes<SVGSVGElement>) => {\n  if (validationStatus === \"error\") {\n    return <ErrorIndicatorIcon {...restSvgProps} />;\n  }\n  if (validationStatus === \"warning\") {\n    return <WarningIndicatorIcon {...restSvgProps} />;\n  }\n  return null;\n};\n\n// Removed `enabled` prop, it's better to let parent to control render\nexport interface FormActivationIndicatorProps\n  extends Pick<FormFieldProps, \"validationStatus\"> {\n  hasIcon?: boolean;\n}\n\nexport const FormActivationIndicator = ({\n  hasIcon,\n  validationStatus,\n}: FormActivationIndicatorProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-activation-indicator\",\n    css: formActivationIndicatorCss,\n    window: targetWindow,\n  });\n\n  const rootClass = \"saltFormActivationIndicator\";\n\n  return (\n    <div className={withBaseName()}>\n      <div className={withBaseName(\"bar\")}>\n        {hasIcon && validationStatus && (\n          <ActivationIndicatorIcon\n            className={`${rootClass}-icon`}\n            validationStatus={validationStatus}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["jsx","makePrefixer","useWindow","useComponentCssInjection","formActivationIndicatorCss"],"mappings":";;;;;;;;AAOA,MAAM,kBAAA,GAAqB,CAAC,KAAwC,KAAA;AAClE,EACE,uBAAAA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACR,SAAW,EAAA,KAAA;AAAA,MACX,aAAY,EAAA,oBAAA;AAAA,MACX,GAAG,KAAA;AAAA,MAEJ,yCAAC,QAAO,EAAA,EAAA,EAAA,EAAI,GAAG,EAAI,EAAA,CAAA,EAAG,GAAG,CAAG,EAAA;AAAA;AAAA,GAC9B;AAEJ,CAAA;AAEA,MAAM,oBAAA,GAAuB,CAAC,KAAwC,KAAA;AACpE,EACE,uBAAAA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACR,SAAW,EAAA,KAAA;AAAA,MACX,aAAY,EAAA,sBAAA;AAAA,MACX,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAAA,cAAA,CAAC,SAAQ,EAAA,EAAA,MAAA,EAAO,oBAAqB,EAAA;AAAA;AAAA,GACvC;AAEJ,CAAA;AAEA,MAAM,YAAA,GAAeC,kBAAa,6BAA6B,CAAA;AAE/D,MAAM,0BAA0B,CAAC;AAAA,EAC/B,gBAAA;AAAA,EACA,GAAG;AACL,CAA+E,KAAA;AAC7E,EAAA,IAAI,qBAAqB,OAAS,EAAA;AAChC,IAAO,uBAAAD,cAAA,CAAC,kBAAoB,EAAA,EAAA,GAAG,YAAc,EAAA,CAAA;AAAA;AAE/C,EAAA,IAAI,qBAAqB,SAAW,EAAA;AAClC,IAAO,uBAAAA,cAAA,CAAC,oBAAsB,EAAA,EAAA,GAAG,YAAc,EAAA,CAAA;AAAA;AAEjD,EAAO,OAAA,IAAA;AACT,CAAA;AAQO,MAAM,0BAA0B,CAAC;AAAA,EACtC,OAAA;AAAA,EACA;AACF,CAAoC,KAAA;AAClC,EAAA,MAAM,eAAeE,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gCAAA;AAAA,IACR,GAAK,EAAAC,yBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,SAAY,GAAA,6BAAA;AAElB,EAAA,uBACGJ,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,EACd,EAAA,QAAA,kBAAAA,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,KAAK,CAC/B,EAAA,QAAA,EAAA,OAAA,IAAW,gBACV,oBAAAA,cAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA;AAAA,MACvB;AAAA;AAAA,KAGN,CACF,EAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/form-field-legacy/FormFieldLegacy.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".salt-density-high {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-top-marginBottom: 4px;\n}\n.salt-density-touch {\n  --formFieldLegacy-label-top-marginBottom: 8px;\n}\n\n/* Style applied to the root element */\n.saltFormFieldLegacy {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle);\n  --formFieldLegacy-background: var(--salt-editable-primary-background);\n  --formFieldLegacy-focused-outlineColor: var(--salt-focused-outlineColor);\n  /* Set to 0 until helper text class provided */\n  --formFieldLegacy-helperText-height: 0px;\n}\n\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-secondary-background);\n}\n\n.saltFormFieldLegacy {\n  border: 0;\n  display: inline-grid;\n  margin: var(--saltFormFieldLegacy-margin, 0);\n  padding: 0;\n  position: relative;\n  min-width: 0;\n  vertical-align: top;\n  width: var(--saltFormFieldLegacy-width, auto);\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltFormFieldLegacy-fontSize, var(--salt-text-fontSize));\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n}\n\n/* Class applied to the root element on hover */\n.saltFormFieldLegacy:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-hover);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-hover);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-hover);\n}\n\n/* Class applied to the root element when focused */\n.saltFormFieldLegacy-focused,\n.saltFormFieldLegacy-lowFocused,\n.saltFormFieldLegacy.saltFormFieldLegacy-focused:hover,\n.saltFormFieldLegacy.saltFormFieldLegacy-lowFocused:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-active);\n  --formFieldLegacy-activationIndicator-size: var(--salt-editable-borderWidth-active);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-active);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-default);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(var(--formFieldLegacy-helperText-marginTop) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n}\n\n/* Class applied if `fullWidth={true}` and helper text is provided */\n.saltFormFieldLegacy-fullWidth.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-fullWidth);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(\n    var(--formFieldLegacy-helperText-marginTop-fullWidth) +\n    var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height))\n  );\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-fontSize: var(--saltFormFieldLegacy-helperText-fontSize, var(--salt-text-fontSize));\n  --formFieldLegacy-helperText-baseHeight: calc(1.3 * var(--formFieldLegacy-helperText-fontSize));\n  --formFieldLegacy-helperText-calculatedHeight: max(var(--salt-text-label-minHeight), var(--formFieldLegacy-helperText-baseHeight));\n  --formFieldLegacy-helperText-height: calc(var(--formFieldLegacy-helperText-calculatedHeight) + var(--formFieldLegacy-helperText-marginTop));\n}\n\n/* Class applied to the root element if `fillWidth={true}` */\n.saltFormFieldLegacy-fullWidth {\n  width: 100%;\n}\n\n/* Class applied to the root element if `disabled={true}` */\n.saltFormFieldLegacy-disabled {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-opacity: var(--salt-palette-opacity-disabled);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-disabled);\n  --formFieldLegacy-helperText-opacity: var(--salt-palette-opacity-disabled);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Class applied to the root element on hover if `disabled={true}` */\n.saltFormFieldLegacy.saltFormFieldLegacy-disabled:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-disabled);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Class applied to the root element on warning state */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-warning-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on warning state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on error state */\n.saltFormFieldLegacy.saltFormFieldLegacy-error {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-error-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Class applied to the root element on error state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-error:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Error state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-error {\n  --formFieldLegacy-background: var(--salt-status-error-background);\n}\n\n/* Warning state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-warning {\n  --formFieldLegacy-background: var(--salt-status-warning-background);\n}\n\n/* Class applied to the root element if `labelPlacement=\"left\"` */\n.saltFormFieldLegacy-labelLeft {\n  --formFieldLegacy-label-marginTop: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingLeft: 0px;\n  --formFieldLegacy-label-paddingRight: calc(0.75 * var(--salt-size-unit));\n\n  align-self: start;\n  grid-template-columns: auto 1fr;\n}\n\n/* Class applied to the root element if `labelPlacement=\"top\"` or labelPlacement omitted (default is 'top') */\n.saltFormFieldLegacy-labelTop {\n  --formFieldLegacy-label-marginBottom: var(--formFieldLegacy-label-top-marginBottom);\n  --formFieldLegacy-label-marginTop: 0;\n  --formFieldLegacy-label-paddingLeft: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingRight: var(--salt-size-unit);\n  /* Uses density invariant value unless helper text provided */\n  --formFieldLegacy-background-offset-height: calc(var(--formFieldLegacy-helperText-marginTop, 0px) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n\n  background: linear-gradient(\n    to top,\n    transparent var(--formFieldLegacy-background-offset-height),\n    var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background)) var(--formFieldLegacy-background-offset-height)\n  );\n}\n\n/* Class applied if `labelPlacement=\"top\"` and helper text is provided */\n.saltFormFieldLegacy-labelTop.saltFormFieldLegacy-withHelperText {\n  /* Uses density aware value from FormHelperText */\n  --formFieldLegacy-background-offset-height: var(--formFieldLegacy-helperText-background-offset-height);\n}\n\n.saltFormFieldLegacy > * {\n  grid-column-start: 1;\n  grid-column-end: 2;\n  grid-row-start: 2;\n  grid-row-end: 3;\n}\n\n.saltFormFieldLegacy-labelLeft > * {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormLabel {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormActivationIndicator {\n  grid-row-start: 3;\n  grid-row-end: 4;\n}\n\n.saltFormFieldLegacy > .saltFormHelperText {\n  grid-row-start: 4;\n  grid-row-end: 5;\n}\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  grid-column-start: 2;\n  grid-column-end: 2;\n}\n\n/* Class applied if `readOnly={true}\"` */\n.saltFormFieldLegacy-readOnly {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Class applied to the root element if `readOnly={true}\"` on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-readOnly:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-readonly);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Class applied on focus with `labelTop={true}` and no helper text provided */\n.saltFormFieldLegacy:not(.saltFormFieldLegacy-withHelperText):not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height, 0px));\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n/* Class applied on focus with `labelTop={true}` and helper text provided */\n.saltFormFieldLegacy-withHelperText:not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--formFieldLegacy-helperText-height, 0px);\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused:before {\n  content: none;\n}\n\n/* Class applied on focus with `labelLeft={true}` */\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > *:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0px;\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  z-index: -1;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormActivationIndicator, .saltFormHelperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused {\n  outline: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormFieldLegacy-activationIndicator, .saltFormFieldLegacy-helperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused .saltFormLabel + * {\n  outline: none;\n}\n\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* TODO: I don't think this is needed, but commenting until work on FF done\n.saltFormFieldLegacy-primary.saltFormFieldLegacy > :not(.saltFormLabel):first-child {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n} */\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ :not(.saltFormHelperText) {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* **Deprecated:** Tertiary variant no longer supported */\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-tertiary-background);\n}\n";
+var css_248z = ".salt-density-high {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-top-marginBottom: 4px;\n}\n.salt-density-touch {\n  --formFieldLegacy-label-top-marginBottom: 8px;\n}\n\n/* Style applied to the root element */\n.saltFormFieldLegacy {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-fixed-100);\n  --formFieldLegacy-activationIndicator-style: var(--salt-borderStyle-solid);\n  --formFieldLegacy-background: var(--salt-editable-primary-background);\n  --formFieldLegacy-focused-outlineColor: var(--salt-focused-outlineColor);\n  /* Set to 0 until helper text class provided */\n  --formFieldLegacy-helperText-height: 0px;\n}\n\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-secondary-background);\n}\n\n.saltFormFieldLegacy {\n  border: 0;\n  display: inline-grid;\n  margin: var(--saltFormFieldLegacy-margin, 0);\n  padding: 0;\n  position: relative;\n  min-width: 0;\n  vertical-align: top;\n  width: var(--saltFormFieldLegacy-width, auto);\n\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltFormFieldLegacy-fontSize, var(--salt-text-fontSize));\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n}\n\n/* Class applied to the root element on hover */\n.saltFormFieldLegacy:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-hover);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-fixed-100);\n  --formFieldLegacy-activationIndicator-style: var(--salt-borderStyle-solid);\n\n  --saltInputLegacy-cursor: var(--salt-cursor-hover);\n}\n\n/* Class applied to the root element when focused */\n.saltFormFieldLegacy-focused,\n.saltFormFieldLegacy-lowFocused,\n.saltFormFieldLegacy.saltFormFieldLegacy-focused:hover,\n.saltFormFieldLegacy.saltFormFieldLegacy-lowFocused:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-active);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-fixed-200);\n  --formFieldLegacy-activationIndicator-style: var(--salt-borderStyle-solid);\n\n  --saltInputLegacy-cursor: var(--salt-cursor-active);\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-default);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(var(--formFieldLegacy-helperText-marginTop) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n}\n\n/* Class applied if `fullWidth={true}` and helper text is provided */\n.saltFormFieldLegacy-fullWidth.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-fullWidth);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(\n    var(--formFieldLegacy-helperText-marginTop-fullWidth) +\n    var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height))\n  );\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-fontSize: var(--saltFormFieldLegacy-helperText-fontSize, var(--salt-text-fontSize));\n  --formFieldLegacy-helperText-baseHeight: calc(1.3 * var(--formFieldLegacy-helperText-fontSize));\n  --formFieldLegacy-helperText-calculatedHeight: max(var(--salt-text-label-minHeight), var(--formFieldLegacy-helperText-baseHeight));\n  --formFieldLegacy-helperText-height: calc(var(--formFieldLegacy-helperText-calculatedHeight) + var(--formFieldLegacy-helperText-marginTop));\n}\n\n/* Class applied to the root element if `fillWidth={true}` */\n.saltFormFieldLegacy-fullWidth {\n  width: 100%;\n}\n\n/* Class applied to the root element if `disabled={true}` */\n.saltFormFieldLegacy-disabled {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-opacity: var(--salt-palette-opacity-disabled);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-fixed-100);\n  --formFieldLegacy-activationIndicator-style: var(--salt-borderStyle-solid);\n  --formFieldLegacy-helperText-opacity: var(--salt-palette-opacity-disabled);\n\n  --saltInputLegacy-cursor: var(--salt-cursor-disabled);\n}\n\n/* Class applied to the root element on hover if `disabled={true}` */\n.saltFormFieldLegacy.saltFormFieldLegacy-disabled:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-fixed-100);\n  --formFieldLegacy-activationIndicator-style: var(--salt-borderStyle-solid);\n\n  --saltInputLegacy-cursor: var(--salt-cursor-disabled);\n}\n\n/* Class applied to the root element on warning state */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-warning-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on warning state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on error state */\n.saltFormFieldLegacy.saltFormFieldLegacy-error {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-error-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Class applied to the root element on error state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-error:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Error state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-error {\n  --formFieldLegacy-background: var(--salt-status-error-background);\n}\n\n/* Warning state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-warning {\n  --formFieldLegacy-background: var(--salt-status-warning-background);\n}\n\n/* Class applied to the root element if `labelPlacement=\"left\"` */\n.saltFormFieldLegacy-labelLeft {\n  --formFieldLegacy-label-marginTop: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingLeft: 0px;\n  --formFieldLegacy-label-paddingRight: calc(0.75 * var(--salt-size-unit));\n\n  align-self: start;\n  grid-template-columns: auto 1fr;\n}\n\n/* Class applied to the root element if `labelPlacement=\"top\"` or labelPlacement omitted (default is 'top') */\n.saltFormFieldLegacy-labelTop {\n  --formFieldLegacy-label-marginBottom: var(--formFieldLegacy-label-top-marginBottom);\n  --formFieldLegacy-label-marginTop: 0;\n  --formFieldLegacy-label-paddingLeft: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingRight: var(--salt-size-unit);\n  /* Uses density invariant value unless helper text provided */\n  --formFieldLegacy-background-offset-height: calc(var(--formFieldLegacy-helperText-marginTop, 0px) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n\n  background: linear-gradient(\n    to top,\n    transparent var(--formFieldLegacy-background-offset-height),\n    var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background)) var(--formFieldLegacy-background-offset-height)\n  );\n}\n\n/* Class applied if `labelPlacement=\"top\"` and helper text is provided */\n.saltFormFieldLegacy-labelTop.saltFormFieldLegacy-withHelperText {\n  /* Uses density aware value from FormHelperText */\n  --formFieldLegacy-background-offset-height: var(--formFieldLegacy-helperText-background-offset-height);\n}\n\n.saltFormFieldLegacy > * {\n  grid-column-start: 1;\n  grid-column-end: 2;\n  grid-row-start: 2;\n  grid-row-end: 3;\n}\n\n.saltFormFieldLegacy-labelLeft > * {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormLabel {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormActivationIndicator {\n  grid-row-start: 3;\n  grid-row-end: 4;\n}\n\n.saltFormFieldLegacy > .saltFormHelperText {\n  grid-row-start: 4;\n  grid-row-end: 5;\n}\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  grid-column-start: 2;\n  grid-column-end: 2;\n}\n\n/* Class applied if `readOnly={true}\"` */\n.saltFormFieldLegacy-readOnly {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n\n  --saltInputLegacy-cursor: var(--salt-cursor-readonly);\n}\n\n/* Class applied to the root element if `readOnly={true}\"` on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-readOnly:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-fixed-100);\n  --formFieldLegacy-activationIndicator-style: var(--salt-borderStyle-solid);\n\n  --saltInputLegacy-cursor: var(--salt-cursor-readonly);\n}\n\n/* Class applied on focus with `labelTop={true}` and no helper text provided */\n.saltFormFieldLegacy:not(.saltFormFieldLegacy-withHelperText):not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height, 0px));\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n/* Class applied on focus with `labelTop={true}` and helper text provided */\n.saltFormFieldLegacy-withHelperText:not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--formFieldLegacy-helperText-height, 0px);\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused:before {\n  content: none;\n}\n\n/* Class applied on focus with `labelLeft={true}` */\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > *:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0px;\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  z-index: -1;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormActivationIndicator, .saltFormHelperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused {\n  outline: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormFieldLegacy-activationIndicator, .saltFormFieldLegacy-helperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused .saltFormLabel + * {\n  outline: none;\n}\n\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* TODO: I don't think this is needed, but commenting until work on FF done\n.saltFormFieldLegacy-primary.saltFormFieldLegacy > :not(.saltFormLabel):first-child {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n} */\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ :not(.saltFormHelperText) {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* **Deprecated:** Tertiary variant no longer supported */\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-tertiary-background);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=FormFieldLegacy.css.js.map

package/dist-cjs/form-field-legacy/FormFieldLegacy.js

@@ -2,16 +2,16 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
 var clsx = require('clsx');
 var react = require('react');
 var FormFieldLegacyContext = require('../form-field-context-legacy/FormFieldLegacyContext.js');
+var constant = require('./constant.js');
 var FormActivationIndicator = require('./FormActivationIndicator.js');
+var FormFieldLegacy$1 = require('./FormFieldLegacy.css.js');
 var FormHelperText = require('./FormHelperText.js');
 var FormLabel = require('./FormLabel.js');
-var constant = require('./constant.js');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var FormFieldLegacy$1 = require('./FormFieldLegacy.css.js');
 
 const useA11yValue = ({
   required,

package/dist-cjs/form-field-legacy/FormFieldLegacy.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormFieldLegacy.js","sources":["../src/form-field-legacy/FormFieldLegacy.tsx"],"sourcesContent":["import { Tooltip, makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type Dispatch,\n  type ElementType,\n  type FocusEventHandler,\n  type ForwardedRef,\n  type HTMLAttributes,\n  type SetStateAction,\n  forwardRef,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { FormFieldLegacyContext } from \"../form-field-context-legacy\";\nimport {\n  FormActivationIndicator,\n  type FormActivationIndicatorProps,\n} from \"./FormActivationIndicator\";\nimport { FormHelperText, type FormHelperTextProps } from \"./FormHelperText\";\nimport { FormLabel, type FormLabelProps } from \"./FormLabel\";\nimport type { NecessityIndicatorOptions } from \"./NecessityIndicator\";\nimport type { StatusIndicatorProps } from \"./StatusIndicator\";\nimport { classBase } from \"./constant\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formFieldLegacyCss from \"./FormFieldLegacy.css\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\";\nexport type FormFieldHelperTextPlacement = \"bottom\" | \"tooltip\";\nexport type FormFieldValidationStatus = \"error\" | \"warning\";\n\nexport interface A11yValueProps\n  extends Pick<NecessityIndicatorOptions, \"required\"> {\n  /**\n   * If `true`, the FormField will be disabled.\n   */\n  disabled?: boolean;\n  /** id of the helper text node */\n  helperTextId?: string;\n  /** id of the label node */\n  labelId?: string;\n  /**\n   * The FormField value is Readonly\n   */\n  readOnly?: boolean;\n\n  /**\n   * Whether the form field needs to render helper text\n   */\n  renderHelperText?: boolean;\n}\n\nexport interface FormFieldLegacyProps\n  extends HTMLAttributes<HTMLDivElement>,\n    A11yValueProps {\n  /**\n   * The component used for activation indicator. Default to `FormActivationIndicator`.\n   */\n  ActivationIndicatorComponent?: ElementType<FormActivationIndicatorProps>;\n  /**\n   * Outer focus ring focus will not be applied. Defaults to false.\n   */\n  disableFocusRing?: boolean;\n  // I hate this fullWidth business. We should support a width prop. The default should be 100% (standard block behaviour)\n  // we should also support 'auto' or explicit numeric values\n  /**\n   * Whether the form field is occupying full width.\n   */\n  fullWidth?: boolean;\n  /**\n   * Whether to show the StatusIndicator component for validation states.\n   */\n  hasStatusIndicator?: boolean;\n  /**\n   * The helper text content\n   */\n  helperText?: string;\n  /**\n   * The component used for the helper text. Default to `FormHelperText`.\n   */\n  HelperTextComponent?: ElementType<FormHelperTextProps>;\n  /**\n   * Location the helperText, values: 'bottom' (default) or 'tooltip'.\n   */\n  helperTextPlacement?: FormFieldHelperTextPlacement;\n  /**\n   * Props to be applied to the `HelperTextComponent`.\n   *\n   * Generic on `FormHelperTextProps` is omitted.\n   */\n  HelperTextProps?: Partial<FormHelperTextProps>;\n  /**\n   * The label value for the FormField\n   */\n  label?: string;\n  /**\n   * The component used for the label. Default to `FormLabel`.\n   */\n  LabelComponent?: ElementType;\n  /**\n   * Location the label, values: 'top' (default) or 'left'\n   */\n  labelPlacement?: FormFieldLabelPlacement;\n  /**\n   * Props to be applied to the `LabelComponent`\n   */\n  LabelProps?: Partial<FormLabelProps>;\n  /**\n   * Override props to be used with the StatusIndicator component\n   */\n  StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n  /**\n   * The state for the FormField: Must be one of: 'error'|'warning'|undefined\n   */\n  validationStatus?: FormFieldValidationStatus;\n  /**\n   * FormField variants; defaults to primary.\n   *\n   * **Deprecated:** The 'tertiary' variant has been deprecated\n   */\n  variant?: \"primary\" | \"secondary\" | \"tertiary\";\n}\n\nexport interface useA11yValueValue {\n  \"aria-labelledby\": A11yValueProps[\"labelId\"];\n  \"aria-required\": A11yValueProps[\"required\"];\n  \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n  disabled: A11yValueProps[\"disabled\"];\n  readOnly: A11yValueProps[\"readOnly\"];\n}\n\nconst useA11yValue = ({\n  required,\n  disabled,\n  readOnly,\n  labelId,\n  helperTextId,\n  renderHelperText,\n}: A11yValueProps) => {\n  return useMemo(\n    () => ({\n      \"aria-labelledby\": labelId,\n      \"aria-required\": required,\n      \"aria-describedby\": renderHelperText ? helperTextId : undefined,\n      disabled,\n      readOnly,\n    }),\n    [labelId, disabled, readOnly, required, renderHelperText, helperTextId],\n  );\n};\n\n// TODO: Add TS props for this\nexport const useFormFieldLegacy = ({\n  onBlur,\n  onFocus,\n}: {\n  onBlur?: FocusEventHandler<HTMLDivElement>;\n  onFocus?: FocusEventHandler<HTMLDivElement>;\n}): [\n  { focused: boolean },\n  { setFocused: Dispatch<SetStateAction<boolean>> },\n  {\n    onBlur: FocusEventHandler<HTMLDivElement>;\n    onFocus: FocusEventHandler<HTMLDivElement>;\n  },\n] => {\n  const [focused, setFocused] = useState(false);\n  const handleBlur: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n  const handleFocus: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(true);\n    onFocus?.(event);\n  };\n  return [\n    {\n      focused,\n    },\n    {\n      setFocused,\n    },\n    {\n      onBlur: handleBlur,\n      onFocus: handleFocus,\n    },\n  ];\n};\n\nconst withBaseName = makePrefixer(classBase);\n\nexport const FormFieldLegacy = forwardRef(\n  (\n    {\n      ActivationIndicatorComponent = FormActivationIndicator,\n      children,\n      className,\n      disabled,\n      disableFocusRing = false,\n      fullWidth = true,\n      hasStatusIndicator,\n      HelperTextComponent = FormHelperText,\n      HelperTextProps,\n      helperText,\n      helperTextPlacement = \"bottom\",\n      label,\n      LabelComponent = FormLabel,\n      labelPlacement = \"top\",\n      LabelProps = { displayedNecessity: \"required\" },\n      onBlur,\n      onFocus,\n      readOnly,\n      required,\n      StatusIndicatorProps,\n      validationStatus,\n      variant = \"primary\",\n      ...restProps\n    }: FormFieldLegacyProps,\n    ref: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-field-legacy\",\n      css: formFieldLegacyCss,\n      window: targetWindow,\n    });\n\n    const labelId = useId(LabelProps?.id);\n    const helperTextId = useId(HelperTextProps?.id);\n    const rootRef = useRef<HTMLDivElement>(null);\n\n    const renderHelperText = !!helperText;\n\n    const a11yValue = useA11yValue({\n      required,\n      disabled,\n      readOnly,\n      labelId,\n      helperTextId,\n      renderHelperText,\n    });\n\n    const [states, dispatchers, eventHandlers] = useFormFieldLegacy({\n      onBlur,\n      onFocus,\n    });\n\n    const hasLabel = label !== undefined;\n    const labelTop = hasLabel && labelPlacement === \"top\";\n    const labelLeft = hasLabel && labelPlacement === \"left\";\n    const isWarning = validationStatus === \"warning\";\n    const isError = validationStatus === \"error\";\n    const focusClass = disableFocusRing\n      ? \"lowFocused\"\n      : \"focused\"; /* NOTE: need to look at */\n    const inlineHelperText =\n      renderHelperText && helperTextPlacement === \"bottom\";\n    const tooltipHelperText =\n      renderHelperText &&\n      helperTextPlacement === \"tooltip\" &&\n      !hasStatusIndicator;\n\n    const handleTriggerRef = useForkRef(rootRef, ref);\n\n    return (\n      <Tooltip disabled={!tooltipHelperText} content={helperText}>\n        <div\n          ref={handleTriggerRef}\n          className={clsx(\n            withBaseName(),\n            {\n              [withBaseName(\"disabled\")]: disabled,\n              [withBaseName(\"readOnly\")]: readOnly,\n              [withBaseName(\"warning\")]: isWarning,\n              [withBaseName(\"error\")]: isError,\n              [withBaseName(\"fullWidth\")]: fullWidth,\n              [withBaseName(focusClass)]: states.focused,\n              [withBaseName(\"labelTop\")]: labelTop,\n              [withBaseName(\"labelLeft\")]: labelLeft,\n              [withBaseName(\"withHelperText\")]: inlineHelperText,\n              [withBaseName(variant)]: variant,\n            },\n            className,\n          )}\n          {...eventHandlers}\n          {...restProps}\n        >\n          <FormFieldLegacyContext.Provider\n            value={{\n              ...states,\n              ...dispatchers,\n              ...eventHandlers,\n              a11yProps: a11yValue,\n              inFormField: true,\n              ref: rootRef,\n            }}\n          >\n            {hasLabel && (\n              <LabelComponent\n                {...LabelProps}\n                validationStatus={validationStatus}\n                hasStatusIndicator={hasStatusIndicator}\n                StatusIndicatorProps={StatusIndicatorProps}\n                className={LabelProps.className}\n                label={label}\n                disabled={disabled}\n                readOnly={readOnly}\n                required={required}\n                tooltipText={helperText}\n                id={labelId}\n              />\n            )}\n            {children}\n            <ActivationIndicatorComponent\n              hasIcon={!hasStatusIndicator}\n              validationStatus={validationStatus}\n            />\n            {renderHelperText && (\n              <HelperTextComponent\n                helperText={helperText}\n                helperTextPlacement={helperTextPlacement}\n                {...HelperTextProps}\n                id={helperTextId}\n              />\n            )}\n          </FormFieldLegacyContext.Provider>\n        </div>\n      </Tooltip>\n    );\n  },\n);\n"],"names":["useMemo","useState","makePrefixer","classBase","forwardRef","FormActivationIndicator","FormHelperText","FormLabel","useWindow","useComponentCssInjection","formFieldLegacyCss","useId","useRef","useForkRef","Tooltip","jsx","clsx","jsxs","FormFieldLegacyContext"],"mappings":"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"}
+{"version":3,"file":"FormFieldLegacy.js","sources":["../src/form-field-legacy/FormFieldLegacy.tsx"],"sourcesContent":["import { makePrefixer, Tooltip, useForkRef, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type Dispatch,\n  type ElementType,\n  type FocusEventHandler,\n  type ForwardedRef,\n  forwardRef,\n  type HTMLAttributes,\n  type SetStateAction,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { FormFieldLegacyContext } from \"../form-field-context-legacy\";\nimport { classBase } from \"./constant\";\nimport {\n  FormActivationIndicator,\n  type FormActivationIndicatorProps,\n} from \"./FormActivationIndicator\";\nimport formFieldLegacyCss from \"./FormFieldLegacy.css\";\nimport { FormHelperText, type FormHelperTextProps } from \"./FormHelperText\";\nimport { FormLabel, type FormLabelProps } from \"./FormLabel\";\nimport type { NecessityIndicatorOptions } from \"./NecessityIndicator\";\nimport type { StatusIndicatorProps } from \"./StatusIndicator\";\n\nexport type FormFieldLabelPlacement = \"top\" | \"left\";\nexport type FormFieldHelperTextPlacement = \"bottom\" | \"tooltip\";\nexport type FormFieldValidationStatus = \"error\" | \"warning\";\n\nexport interface A11yValueProps\n  extends Pick<NecessityIndicatorOptions, \"required\"> {\n  /**\n   * If `true`, the FormField will be disabled.\n   */\n  disabled?: boolean;\n  /** id of the helper text node */\n  helperTextId?: string;\n  /** id of the label node */\n  labelId?: string;\n  /**\n   * The FormField value is Readonly\n   */\n  readOnly?: boolean;\n\n  /**\n   * Whether the form field needs to render helper text\n   */\n  renderHelperText?: boolean;\n}\n\nexport interface FormFieldLegacyProps\n  extends HTMLAttributes<HTMLDivElement>,\n    A11yValueProps {\n  /**\n   * The component used for activation indicator. Default to `FormActivationIndicator`.\n   */\n  ActivationIndicatorComponent?: ElementType<FormActivationIndicatorProps>;\n  /**\n   * Outer focus ring focus will not be applied. Defaults to false.\n   */\n  disableFocusRing?: boolean;\n  // I hate this fullWidth business. We should support a width prop. The default should be 100% (standard block behaviour)\n  // we should also support 'auto' or explicit numeric values\n  /**\n   * Whether the form field is occupying full width.\n   */\n  fullWidth?: boolean;\n  /**\n   * Whether to show the StatusIndicator component for validation states.\n   */\n  hasStatusIndicator?: boolean;\n  /**\n   * The helper text content\n   */\n  helperText?: string;\n  /**\n   * The component used for the helper text. Default to `FormHelperText`.\n   */\n  HelperTextComponent?: ElementType<FormHelperTextProps>;\n  /**\n   * Location the helperText, values: 'bottom' (default) or 'tooltip'.\n   */\n  helperTextPlacement?: FormFieldHelperTextPlacement;\n  /**\n   * Props to be applied to the `HelperTextComponent`.\n   *\n   * Generic on `FormHelperTextProps` is omitted.\n   */\n  HelperTextProps?: Partial<FormHelperTextProps>;\n  /**\n   * The label value for the FormField\n   */\n  label?: string;\n  /**\n   * The component used for the label. Default to `FormLabel`.\n   */\n  LabelComponent?: ElementType;\n  /**\n   * Location the label, values: 'top' (default) or 'left'\n   */\n  labelPlacement?: FormFieldLabelPlacement;\n  /**\n   * Props to be applied to the `LabelComponent`\n   */\n  LabelProps?: Partial<FormLabelProps>;\n  /**\n   * Override props to be used with the StatusIndicator component\n   */\n  StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n  /**\n   * The state for the FormField: Must be one of: 'error'|'warning'|undefined\n   */\n  validationStatus?: FormFieldValidationStatus;\n  /**\n   * FormField variants; defaults to primary.\n   *\n   * **Deprecated:** The 'tertiary' variant has been deprecated\n   */\n  variant?: \"primary\" | \"secondary\" | \"tertiary\";\n}\n\nexport interface useA11yValueValue {\n  \"aria-labelledby\": A11yValueProps[\"labelId\"];\n  \"aria-required\": A11yValueProps[\"required\"];\n  \"aria-describedby\": A11yValueProps[\"helperTextId\"] | undefined;\n  disabled: A11yValueProps[\"disabled\"];\n  readOnly: A11yValueProps[\"readOnly\"];\n}\n\nconst useA11yValue = ({\n  required,\n  disabled,\n  readOnly,\n  labelId,\n  helperTextId,\n  renderHelperText,\n}: A11yValueProps) => {\n  return useMemo(\n    () => ({\n      \"aria-labelledby\": labelId,\n      \"aria-required\": required,\n      \"aria-describedby\": renderHelperText ? helperTextId : undefined,\n      disabled,\n      readOnly,\n    }),\n    [labelId, disabled, readOnly, required, renderHelperText, helperTextId],\n  );\n};\n\n// TODO: Add TS props for this\nexport const useFormFieldLegacy = ({\n  onBlur,\n  onFocus,\n}: {\n  onBlur?: FocusEventHandler<HTMLDivElement>;\n  onFocus?: FocusEventHandler<HTMLDivElement>;\n}): [\n  { focused: boolean },\n  { setFocused: Dispatch<SetStateAction<boolean>> },\n  {\n    onBlur: FocusEventHandler<HTMLDivElement>;\n    onFocus: FocusEventHandler<HTMLDivElement>;\n  },\n] => {\n  const [focused, setFocused] = useState(false);\n  const handleBlur: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n  const handleFocus: FocusEventHandler<HTMLDivElement> = (event) => {\n    setFocused(true);\n    onFocus?.(event);\n  };\n  return [\n    {\n      focused,\n    },\n    {\n      setFocused,\n    },\n    {\n      onBlur: handleBlur,\n      onFocus: handleFocus,\n    },\n  ];\n};\n\nconst withBaseName = makePrefixer(classBase);\n\nexport const FormFieldLegacy = forwardRef(\n  (\n    {\n      ActivationIndicatorComponent = FormActivationIndicator,\n      children,\n      className,\n      disabled,\n      disableFocusRing = false,\n      fullWidth = true,\n      hasStatusIndicator,\n      HelperTextComponent = FormHelperText,\n      HelperTextProps,\n      helperText,\n      helperTextPlacement = \"bottom\",\n      label,\n      LabelComponent = FormLabel,\n      labelPlacement = \"top\",\n      LabelProps = { displayedNecessity: \"required\" },\n      onBlur,\n      onFocus,\n      readOnly,\n      required,\n      StatusIndicatorProps,\n      validationStatus,\n      variant = \"primary\",\n      ...restProps\n    }: FormFieldLegacyProps,\n    ref: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-field-legacy\",\n      css: formFieldLegacyCss,\n      window: targetWindow,\n    });\n\n    const labelId = useId(LabelProps?.id);\n    const helperTextId = useId(HelperTextProps?.id);\n    const rootRef = useRef<HTMLDivElement>(null);\n\n    const renderHelperText = !!helperText;\n\n    const a11yValue = useA11yValue({\n      required,\n      disabled,\n      readOnly,\n      labelId,\n      helperTextId,\n      renderHelperText,\n    });\n\n    const [states, dispatchers, eventHandlers] = useFormFieldLegacy({\n      onBlur,\n      onFocus,\n    });\n\n    const hasLabel = label !== undefined;\n    const labelTop = hasLabel && labelPlacement === \"top\";\n    const labelLeft = hasLabel && labelPlacement === \"left\";\n    const isWarning = validationStatus === \"warning\";\n    const isError = validationStatus === \"error\";\n    const focusClass = disableFocusRing\n      ? \"lowFocused\"\n      : \"focused\"; /* NOTE: need to look at */\n    const inlineHelperText =\n      renderHelperText && helperTextPlacement === \"bottom\";\n    const tooltipHelperText =\n      renderHelperText &&\n      helperTextPlacement === \"tooltip\" &&\n      !hasStatusIndicator;\n\n    const handleTriggerRef = useForkRef(rootRef, ref);\n\n    return (\n      <Tooltip disabled={!tooltipHelperText} content={helperText}>\n        <div\n          ref={handleTriggerRef}\n          className={clsx(\n            withBaseName(),\n            {\n              [withBaseName(\"disabled\")]: disabled,\n              [withBaseName(\"readOnly\")]: readOnly,\n              [withBaseName(\"warning\")]: isWarning,\n              [withBaseName(\"error\")]: isError,\n              [withBaseName(\"fullWidth\")]: fullWidth,\n              [withBaseName(focusClass)]: states.focused,\n              [withBaseName(\"labelTop\")]: labelTop,\n              [withBaseName(\"labelLeft\")]: labelLeft,\n              [withBaseName(\"withHelperText\")]: inlineHelperText,\n              [withBaseName(variant)]: variant,\n            },\n            className,\n          )}\n          {...eventHandlers}\n          {...restProps}\n        >\n          <FormFieldLegacyContext.Provider\n            value={{\n              ...states,\n              ...dispatchers,\n              ...eventHandlers,\n              a11yProps: a11yValue,\n              inFormField: true,\n              ref: rootRef,\n            }}\n          >\n            {hasLabel && (\n              <LabelComponent\n                {...LabelProps}\n                validationStatus={validationStatus}\n                hasStatusIndicator={hasStatusIndicator}\n                StatusIndicatorProps={StatusIndicatorProps}\n                className={LabelProps.className}\n                label={label}\n                disabled={disabled}\n                readOnly={readOnly}\n                required={required}\n                tooltipText={helperText}\n                id={labelId}\n              />\n            )}\n            {children}\n            <ActivationIndicatorComponent\n              hasIcon={!hasStatusIndicator}\n              validationStatus={validationStatus}\n            />\n            {renderHelperText && (\n              <HelperTextComponent\n                helperText={helperText}\n                helperTextPlacement={helperTextPlacement}\n                {...HelperTextProps}\n                id={helperTextId}\n              />\n            )}\n          </FormFieldLegacyContext.Provider>\n        </div>\n      </Tooltip>\n    );\n  },\n);\n"],"names":["useMemo","useState","makePrefixer","classBase","forwardRef","FormActivationIndicator","FormHelperText","FormLabel","useWindow","useComponentCssInjection","formFieldLegacyCss","useId","useRef","useForkRef","Tooltip","jsx","clsx","jsxs","FormFieldLegacyContext"],"mappings":"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"}

package/dist-cjs/form-field-legacy/FormHelperText.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormHelperText.js","sources":["../src/form-field-legacy/FormHelperText.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from \"react\";\nimport type { FormFieldLegacyProps as FormFieldProps } from \"./FormFieldLegacy\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formHelperTextCss from \"./FormHelperText.css\";\n\nexport interface FormHelperTextProps extends ComponentPropsWithoutRef<\"p\"> {\n  helperText: FormFieldProps[\"helperText\"];\n  helperTextPlacement: FormFieldProps[\"helperTextPlacement\"];\n}\n\nexport const FormHelperText = ({\n  helperText,\n  helperTextPlacement,\n  ...restProps\n}: FormHelperTextProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-helper-text\",\n    css: formHelperTextCss,\n    window: targetWindow,\n  });\n\n  if (helperText) {\n    if (helperTextPlacement === \"bottom\") {\n      return (\n        <p className=\"saltFormHelperText\" {...restProps}>\n          {helperText}\n        </p>\n      );\n    }\n    if (helperTextPlacement === \"tooltip\") {\n      console.warn(\"helperTextPlacement tooltip has not yet implemented\");\n      return null;\n    }\n    return null;\n  }\n  return null;\n};\n"],"names":["useWindow","useComponentCssInjection","formHelperTextCss"],"mappings":";;;;;;;AAaO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,UAAA;AAAA,EACA,mBAAA;AAAA,EACA,GAAG;AACL,CAA2B,KAAA;AACzB,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,gBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,IAAI,UAAY,EAAA;AACd,IAAA,IAAI,wBAAwB,QAAU,EAAA;AACpC,MAAA,sCACG,GAAE,EAAA,EAAA,SAAA,EAAU,oBAAsB,EAAA,GAAG,WACnC,QACH,EAAA,UAAA,EAAA,CAAA;AAAA;AAGJ,IAAA,IAAI,wBAAwB,SAAW,EAAA;AACrC,MAAA,OAAA,CAAQ,KAAK,qDAAqD,CAAA;AAClE,MAAO,OAAA,IAAA;AAAA;AAET,IAAO,OAAA,IAAA;AAAA;AAET,EAAO,OAAA,IAAA;AACT;;;;"}
+{"version":3,"file":"FormHelperText.js","sources":["../src/form-field-legacy/FormHelperText.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { FormFieldLegacyProps as FormFieldProps } from \"./FormFieldLegacy\";\n\nimport formHelperTextCss from \"./FormHelperText.css\";\n\nexport interface FormHelperTextProps extends ComponentPropsWithoutRef<\"p\"> {\n  helperText: FormFieldProps[\"helperText\"];\n  helperTextPlacement: FormFieldProps[\"helperTextPlacement\"];\n}\n\nexport const FormHelperText = ({\n  helperText,\n  helperTextPlacement,\n  ...restProps\n}: FormHelperTextProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-helper-text\",\n    css: formHelperTextCss,\n    window: targetWindow,\n  });\n\n  if (helperText) {\n    if (helperTextPlacement === \"bottom\") {\n      return (\n        <p className=\"saltFormHelperText\" {...restProps}>\n          {helperText}\n        </p>\n      );\n    }\n    if (helperTextPlacement === \"tooltip\") {\n      console.warn(\"helperTextPlacement tooltip has not yet implemented\");\n      return null;\n    }\n    return null;\n  }\n  return null;\n};\n"],"names":["useWindow","useComponentCssInjection","formHelperTextCss"],"mappings":";;;;;;;AAYO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,UAAA;AAAA,EACA,mBAAA;AAAA,EACA,GAAG;AACL,CAA2B,KAAA;AACzB,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,gBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,IAAI,UAAY,EAAA;AACd,IAAA,IAAI,wBAAwB,QAAU,EAAA;AACpC,MAAA,sCACG,GAAE,EAAA,EAAA,SAAA,EAAU,oBAAsB,EAAA,GAAG,WACnC,QACH,EAAA,UAAA,EAAA,CAAA;AAAA;AAGJ,IAAA,IAAI,wBAAwB,SAAW,EAAA;AACrC,MAAA,OAAA,CAAQ,KAAK,qDAAqD,CAAA;AAClE,MAAO,OAAA,IAAA;AAAA;AAET,IAAO,OAAA,IAAA;AAAA;AAET,EAAO,OAAA,IAAA;AACT;;;;"}

package/dist-cjs/form-field-legacy/FormLabel.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Styles applied to root element */\n.salt-density-touch {\n  --formFieldLegacy-label-default-top: 11px;\n  --formFieldLegacy-label-left-top: 16px;\n  --formFieldLegacy-label-minHeight: 16px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-default-top: 7px;\n  --formFieldLegacy-label-left-top: 12px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-default-top: 5px;\n  --formFieldLegacy-label-left-top: 8px;\n}\n.salt-density-high {\n  --formFieldLegacy-label-default-top: 3px;\n  --formFieldLegacy-label-left-top: 4px;\n}\n\n.saltFormLabel {\n  --formFieldLegacy-label-fontSize: var(--saltFormFieldLegacy-label-fontSize, var(--salt-text-label-fontSize));\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-default-top);\n  --formFieldLegacy-label-width: 100%;\n}\n\n.saltFormFieldLegacy-labelLeft .saltFormLabel {\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-left-top);\n  --formFieldLegacy-label-width: auto;\n}\n\n.saltFormLabel {\n  align-items: center;\n  color: var(--saltFormFieldLegacy-label-text-color, var(--salt-content-secondary-foreground));\n  display: block;\n  font-size: var(--formFieldLegacy-label-fontSize);\n  margin-bottom: var(--saltFormFieldLegacy-label-marginBottom, var(--formFieldLegacy-label-marginBottom));\n  min-height: var(--saltFormFieldLegacy-label-minHeight, var(--formFieldLegacy-label-minHeight, var(--salt-text-label-minHeight)));\n  margin-top: var(--saltFormFieldLegacy-label-marginTop, 0px);\n  line-height: var(--saltFormFieldLegacy-label-lineHeight, var(--salt-text-label-lineHeight));\n  overflow: hidden;\n  padding-left: var(--saltFormFieldLegacy-label-paddingLeft, var(--formFieldLegacy-label-paddingLeft));\n  padding-right: var(--saltFormFieldLegacy-label-paddingRight, var(--formFieldLegacy-label-paddingRight));\n  padding-top: var(--saltFormFieldLegacy-label-paddingTop, 0);\n  padding-bottom: var(--saltFormFieldLegacy-label-paddingBottom, 0);\n  text-overflow: ellipsis;\n  top: var(--saltFormFieldLegacy-label-top, var(--formFieldLegacy-label-top));\n  transform: translate(var(--saltFormFieldLegacy-label-transform-x, 0), var(--saltFormFieldLegacy-label-transform-y, var(--formFieldLegacy-label-top)));\n  white-space: nowrap;\n  width: var(--saltFormFieldLegacy-label-width, var(--formFieldLegacy-label-width, 100%));\n  box-sizing: border-box;\n}\n\n.saltFormLabel ~ * {\n  z-index: 1;\n}\n\n/* Styles applied when `disabled={true}` */\n.saltFormLabel-disabled {\n  color: var(--saltFormFieldLegacy-label-text-color-disabled, var(--salt-content-secondary-foreground-disabled));\n  cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Styles applied when displayedNecessity or necessityText provided */\n.saltFormLabel-necessityIndicator {\n  font-style: var(--saltFormFieldLegacy-label-necessityIndicator-fontStyle, var(--salt-editable-help-fontStyle));\n  margin-left: 1ch;\n}\n\n/* Styles applied if `hasStatusIndicator={true}` */\n.saltFormLabel-statusIndicator.saltIcon {\n  margin-left: 6px;\n  vertical-align: top;\n}\n";
+var css_248z = "/* Styles applied to root element */\n.salt-density-touch {\n  --formFieldLegacy-label-default-top: 11px;\n  --formFieldLegacy-label-left-top: 16px;\n  --formFieldLegacy-label-minHeight: 16px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-default-top: 7px;\n  --formFieldLegacy-label-left-top: 12px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-default-top: 5px;\n  --formFieldLegacy-label-left-top: 8px;\n}\n.salt-density-high {\n  --formFieldLegacy-label-default-top: 3px;\n  --formFieldLegacy-label-left-top: 4px;\n}\n\n.saltFormLabel {\n  --formFieldLegacy-label-fontSize: var(--saltFormFieldLegacy-label-fontSize, var(--salt-text-label-fontSize));\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-default-top);\n  --formFieldLegacy-label-width: 100%;\n}\n\n.saltFormFieldLegacy-labelLeft .saltFormLabel {\n  --formFieldLegacy-label-top: var(--formFieldLegacy-label-left-top);\n  --formFieldLegacy-label-width: auto;\n}\n\n.saltFormLabel {\n  align-items: center;\n  color: var(--saltFormFieldLegacy-label-text-color, var(--salt-content-secondary-foreground));\n  display: block;\n  font-size: var(--formFieldLegacy-label-fontSize);\n  margin-bottom: var(--saltFormFieldLegacy-label-marginBottom, var(--formFieldLegacy-label-marginBottom));\n  min-height: var(--saltFormFieldLegacy-label-minHeight, var(--formFieldLegacy-label-minHeight, var(--salt-text-label-minHeight)));\n  margin-top: var(--saltFormFieldLegacy-label-marginTop, 0px);\n  line-height: var(--saltFormFieldLegacy-label-lineHeight, var(--salt-text-label-lineHeight));\n  overflow: hidden;\n  padding-left: var(--saltFormFieldLegacy-label-paddingLeft, var(--formFieldLegacy-label-paddingLeft));\n  padding-right: var(--saltFormFieldLegacy-label-paddingRight, var(--formFieldLegacy-label-paddingRight));\n  padding-top: var(--saltFormFieldLegacy-label-paddingTop, 0);\n  padding-bottom: var(--saltFormFieldLegacy-label-paddingBottom, 0);\n  text-overflow: ellipsis;\n  top: var(--saltFormFieldLegacy-label-top, var(--formFieldLegacy-label-top));\n  transform: translate(var(--saltFormFieldLegacy-label-transform-x, 0), var(--saltFormFieldLegacy-label-transform-y, var(--formFieldLegacy-label-top)));\n  white-space: nowrap;\n  width: var(--saltFormFieldLegacy-label-width, var(--formFieldLegacy-label-width, 100%));\n  box-sizing: border-box;\n}\n\n.saltFormLabel ~ * {\n  z-index: 1;\n}\n\n/* Styles applied when `disabled={true}` */\n.saltFormLabel-disabled {\n  color: var(--saltFormFieldLegacy-label-text-color-disabled, var(--salt-content-secondary-foreground-disabled));\n  cursor: var(--salt-cursor-disabled);\n}\n\n/* Styles applied when displayedNecessity or necessityText provided */\n.saltFormLabel-necessityIndicator {\n  font-style: var(--saltFormFieldLegacy-label-necessityIndicator-fontStyle, var(--salt-editable-help-fontStyle));\n  margin-left: 1ch;\n}\n\n/* Styles applied if `hasStatusIndicator={true}` */\n.saltFormLabel-statusIndicator.saltIcon {\n  margin-left: 6px;\n  vertical-align: top;\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=FormLabel.css.js.map

package/dist-cjs/form-field-legacy/FormLabel.js

@@ -2,12 +2,12 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
-var clsx = require('clsx');
-var NecessityIndicator = require('./NecessityIndicator.js');
-var StatusIndicator = require('./StatusIndicator.js');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
+var clsx = require('clsx');
 var FormLabel$1 = require('./FormLabel.css.js');
+var NecessityIndicator = require('./NecessityIndicator.js');
+var StatusIndicator = require('./StatusIndicator.js');
 
 const withBaseName = core.makePrefixer("saltFormLabel");
 const FormLabel = ({

package/dist-cjs/form-field-legacy/FormLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormLabel.js","sources":["../src/form-field-legacy/FormLabel.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport type { ElementType, HTMLAttributes } from \"react\";\nimport type { FormFieldValidationStatus } from \"./FormFieldLegacy\";\nimport {\n  NecessityIndicator as DefaultNecessityIndicator,\n  type NecessityIndicatorOptions,\n} from \"./NecessityIndicator\";\nimport { StatusIndicator, type StatusIndicatorProps } from \"./StatusIndicator\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formLabelCss from \"./FormLabel.css\";\n\nconst withBaseName = makePrefixer(\"saltFormLabel\");\nexport interface FormLabelProps\n  extends HTMLAttributes<HTMLLabelElement>,\n    NecessityIndicatorOptions {\n  /**\n   * Whether the form field is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Adjusts whether the StatusIndicator component is shown\n   */\n  hasStatusIndicator?: boolean;\n  /**\n   * The label value for the FormLabel\n   */\n  label?: string;\n  /**\n   * An optional renderer function used to customize the necessity adornment\n   */\n  NecessityIndicator?: ElementType<NecessityIndicatorOptions>;\n  /**\n   * Whether the form field is readOnly.\n   */\n  readOnly?: boolean;\n  /**\n   * Props used to configure the StatusIndicator component if hasStatusIndicator is true\n   */\n  StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n  /**\n   * The status for the FormField: Must be one of: 'error'|'warning'|undefined\n   */\n  validationStatus?: FormFieldValidationStatus;\n  /**\n   * Text to be shown in the Tooltip.\n   */\n  tooltipText?: string;\n}\n\nexport const FormLabel = ({\n  label,\n  NecessityIndicator = DefaultNecessityIndicator,\n  required,\n  displayedNecessity,\n  hasStatusIndicator = false,\n  StatusIndicatorProps,\n  validationStatus,\n  necessityText,\n  className,\n  disabled,\n  readOnly,\n  tooltipText,\n  ...restProps\n}: FormLabelProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-label\",\n    css: formLabelCss,\n    window: targetWindow,\n  });\n\n  return (\n    // biome-ignore lint/a11y/noLabelWithoutControl: this is a label for a form field and will wrap a form control\n    <label\n      className={clsx(withBaseName(), className, {\n        [withBaseName(\"disabled\")]: disabled,\n      })}\n      {...restProps}\n    >\n      {label}\n\n      <NecessityIndicator\n        required={required}\n        displayedNecessity={displayedNecessity}\n        necessityText={necessityText}\n        className={withBaseName(\"necessityIndicator\")}\n      />\n      {hasStatusIndicator && (\n        <StatusIndicator\n          className={withBaseName(\"statusIndicator\")}\n          status={validationStatus}\n          tooltipText={tooltipText}\n          hasTooltip\n          {...StatusIndicatorProps}\n        />\n      )}\n    </label>\n  );\n};\n"],"names":["makePrefixer","NecessityIndicator","DefaultNecessityIndicator","useWindow","useComponentCssInjection","formLabelCss","jsxs","clsx","jsx","StatusIndicator"],"mappings":";;;;;;;;;;;AAeA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA;AAsC1C,MAAM,YAAY,CAAC;AAAA,EACxB,KAAA;AAAA,sBACAC,oBAAqB,GAAAC,qCAAA;AAAA,EACrB,QAAA;AAAA,EACA,kBAAA;AAAA,EACA,kBAAqB,GAAA,KAAA;AAAA,EACrB,oBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA;AAAA,EACA,GAAG;AACL,CAAsB,KAAA;AACpB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA;AAAA;AAAA,oBAEEC,eAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAW,EAAA;AAAA,UACzC,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,SAC7B,CAAA;AAAA,QACA,GAAG,SAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,KAAA;AAAA,0BAEDC,cAAA;AAAA,YAACP,oBAAA;AAAA,YAAA;AAAA,cACC,QAAA;AAAA,cACA,kBAAA;AAAA,cACA,aAAA;AAAA,cACA,SAAA,EAAW,aAAa,oBAAoB;AAAA;AAAA,WAC9C;AAAA,UACC,kBACC,oBAAAO,cAAA;AAAA,YAACC,+BAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,cACzC,MAAQ,EAAA,gBAAA;AAAA,cACR,WAAA;AAAA,cACA,UAAU,EAAA,IAAA;AAAA,cACT,GAAG;AAAA;AAAA;AACN;AAAA;AAAA;AAEJ;AAEJ;;;;"}
+{"version":3,"file":"FormLabel.js","sources":["../src/form-field-legacy/FormLabel.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport type { ElementType, HTMLAttributes } from \"react\";\nimport type { FormFieldValidationStatus } from \"./FormFieldLegacy\";\nimport formLabelCss from \"./FormLabel.css\";\nimport {\n  NecessityIndicator as DefaultNecessityIndicator,\n  type NecessityIndicatorOptions,\n} from \"./NecessityIndicator\";\nimport { StatusIndicator, type StatusIndicatorProps } from \"./StatusIndicator\";\n\nconst withBaseName = makePrefixer(\"saltFormLabel\");\nexport interface FormLabelProps\n  extends HTMLAttributes<HTMLLabelElement>,\n    NecessityIndicatorOptions {\n  /**\n   * Whether the form field is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Adjusts whether the StatusIndicator component is shown\n   */\n  hasStatusIndicator?: boolean;\n  /**\n   * The label value for the FormLabel\n   */\n  label?: string;\n  /**\n   * An optional renderer function used to customize the necessity adornment\n   */\n  NecessityIndicator?: ElementType<NecessityIndicatorOptions>;\n  /**\n   * Whether the form field is readOnly.\n   */\n  readOnly?: boolean;\n  /**\n   * Props used to configure the StatusIndicator component if hasStatusIndicator is true\n   */\n  StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n  /**\n   * The status for the FormField: Must be one of: 'error'|'warning'|undefined\n   */\n  validationStatus?: FormFieldValidationStatus;\n  /**\n   * Text to be shown in the Tooltip.\n   */\n  tooltipText?: string;\n}\n\nexport const FormLabel = ({\n  label,\n  NecessityIndicator = DefaultNecessityIndicator,\n  required,\n  displayedNecessity,\n  hasStatusIndicator = false,\n  StatusIndicatorProps,\n  validationStatus,\n  necessityText,\n  className,\n  disabled,\n  readOnly,\n  tooltipText,\n  ...restProps\n}: FormLabelProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-form-label\",\n    css: formLabelCss,\n    window: targetWindow,\n  });\n\n  return (\n    // biome-ignore lint/a11y/noLabelWithoutControl: this is a label for a form field and will wrap a form control\n    <label\n      className={clsx(withBaseName(), className, {\n        [withBaseName(\"disabled\")]: disabled,\n      })}\n      {...restProps}\n    >\n      {label}\n\n      <NecessityIndicator\n        required={required}\n        displayedNecessity={displayedNecessity}\n        necessityText={necessityText}\n        className={withBaseName(\"necessityIndicator\")}\n      />\n      {hasStatusIndicator && (\n        <StatusIndicator\n          className={withBaseName(\"statusIndicator\")}\n          status={validationStatus}\n          tooltipText={tooltipText}\n          hasTooltip\n          {...StatusIndicatorProps}\n        />\n      )}\n    </label>\n  );\n};\n"],"names":["makePrefixer","NecessityIndicator","DefaultNecessityIndicator","useWindow","useComponentCssInjection","formLabelCss","jsxs","clsx","jsx","StatusIndicator"],"mappings":";;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA;AAsC1C,MAAM,YAAY,CAAC;AAAA,EACxB,KAAA;AAAA,sBACAC,oBAAqB,GAAAC,qCAAA;AAAA,EACrB,QAAA;AAAA,EACA,kBAAA;AAAA,EACA,kBAAqB,GAAA,KAAA;AAAA,EACrB,oBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA;AAAA,EACA,GAAG;AACL,CAAsB,KAAA;AACpB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA;AAAA;AAAA,oBAEEC,eAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAW,EAAA;AAAA,UACzC,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,SAC7B,CAAA;AAAA,QACA,GAAG,SAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,KAAA;AAAA,0BAEDC,cAAA;AAAA,YAACP,oBAAA;AAAA,YAAA;AAAA,cACC,QAAA;AAAA,cACA,kBAAA;AAAA,cACA,aAAA;AAAA,cACA,SAAA,EAAW,aAAa,oBAAoB;AAAA;AAAA,WAC9C;AAAA,UACC,kBACC,oBAAAO,cAAA;AAAA,YAACC,+BAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,cACzC,MAAQ,EAAA,gBAAA;AAAA,cACR,WAAA;AAAA,cACA,UAAU,EAAA,IAAA;AAAA,cACT,GAAG;AAAA;AAAA;AACN;AAAA;AAAA;AAEJ;AAEJ;;;;"}

package/dist-cjs/form-field-legacy/StatusIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusIndicator.js","sources":["../src/form-field-legacy/StatusIndicator.tsx"],"sourcesContent":["import {\n  StatusIndicator as BaseStatusIndicator,\n  Tooltip,\n  type TooltipProps,\n  makePrefixer,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport type { ElementType } from \"react\";\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport type StatusIndicatorStatus = \"error\" | \"info\" | \"warning\" | \"success\";\n\nexport interface StatusIndicatorProps extends IconProps {\n  hasTooltip?: boolean;\n  IconProps?: Partial<IconProps>;\n  status?: StatusIndicatorStatus;\n  TooltipComponent?: ElementType<TooltipProps>;\n  TooltipProps?: Partial<TooltipProps>;\n  tooltipText?: string;\n}\n\nexport const StatusIndicator = (props: StatusIndicatorProps) => {\n  const {\n    TooltipComponent = Tooltip,\n    hasTooltip = false,\n    TooltipProps,\n    tooltipText,\n    IconProps,\n    className,\n    status = \"info\",\n    ...restProps\n  } = props;\n\n  return (\n    <TooltipComponent\n      hideIcon\n      status={status}\n      content={tooltipText}\n      placement=\"top\"\n      disabled={!hasTooltip}\n      {...TooltipProps}\n    >\n      <BaseStatusIndicator\n        status={status}\n        {...restProps}\n        {...IconProps}\n        className={clsx(\n          withBaseName(\"statusIndicator\"),\n          className,\n          IconProps?.className,\n        )}\n      />\n    </TooltipComponent>\n  );\n};\n"],"names":["makePrefixer","Tooltip","jsx","BaseStatusIndicator","clsx"],"mappings":";;;;;;AAUA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA;AAapC,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA;AAAA,IACJ,gBAAmB,GAAAC,YAAA;AAAA,IACnB,UAAa,GAAA,KAAA;AAAA,IACb,YAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACT,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EACE,uBAAAC,cAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,QAAQ,EAAA,IAAA;AAAA,MACR,MAAA;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,MACT,SAAU,EAAA,KAAA;AAAA,MACV,UAAU,CAAC,UAAA;AAAA,MACV,GAAG,YAAA;AAAA,MAEJ,QAAA,kBAAAA,cAAA;AAAA,QAACC,oBAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACC,GAAG,SAAA;AAAA,UACH,GAAG,SAAA;AAAA,UACJ,SAAW,EAAAC,SAAA;AAAA,YACT,aAAa,iBAAiB,CAAA;AAAA,YAC9B,SAAA;AAAA,YACA,SAAW,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA;AAAA;AACb;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"StatusIndicator.js","sources":["../src/form-field-legacy/StatusIndicator.tsx"],"sourcesContent":["import {\n  StatusIndicator as BaseStatusIndicator,\n  makePrefixer,\n  Tooltip,\n  type TooltipProps,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport type { ElementType } from \"react\";\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport type StatusIndicatorStatus = \"error\" | \"info\" | \"warning\" | \"success\";\n\nexport interface StatusIndicatorProps extends IconProps {\n  hasTooltip?: boolean;\n  IconProps?: Partial<IconProps>;\n  status?: StatusIndicatorStatus;\n  TooltipComponent?: ElementType<TooltipProps>;\n  TooltipProps?: Partial<TooltipProps>;\n  tooltipText?: string;\n}\n\nexport const StatusIndicator = (props: StatusIndicatorProps) => {\n  const {\n    TooltipComponent = Tooltip,\n    hasTooltip = false,\n    TooltipProps,\n    tooltipText,\n    IconProps,\n    className,\n    status = \"info\",\n    ...restProps\n  } = props;\n\n  return (\n    <TooltipComponent\n      hideIcon\n      status={status}\n      content={tooltipText}\n      placement=\"top\"\n      disabled={!hasTooltip}\n      {...TooltipProps}\n    >\n      <BaseStatusIndicator\n        status={status}\n        {...restProps}\n        {...IconProps}\n        className={clsx(\n          withBaseName(\"statusIndicator\"),\n          className,\n          IconProps?.className,\n        )}\n      />\n    </TooltipComponent>\n  );\n};\n"],"names":["makePrefixer","Tooltip","jsx","BaseStatusIndicator","clsx"],"mappings":";;;;;;AAUA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA;AAapC,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA;AAAA,IACJ,gBAAmB,GAAAC,YAAA;AAAA,IACnB,UAAa,GAAA,KAAA;AAAA,IACb,YAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACT,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EACE,uBAAAC,cAAA;AAAA,IAAC,gBAAA;AAAA,IAAA;AAAA,MACC,QAAQ,EAAA,IAAA;AAAA,MACR,MAAA;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,MACT,SAAU,EAAA,KAAA;AAAA,MACV,UAAU,CAAC,UAAA;AAAA,MACV,GAAG,YAAA;AAAA,MAEJ,QAAA,kBAAAA,cAAA;AAAA,QAACC,oBAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACC,GAAG,SAAA;AAAA,UACH,GAAG,SAAA;AAAA,UACJ,SAAW,EAAAC,SAAA;AAAA,YACT,aAAa,iBAAiB,CAAA;AAAA,YAC9B,SAAA;AAAA,YACA,SAAW,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA;AAAA;AACb;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}

package/dist-cjs/form-group/FormGroup.js

@@ -1,10 +1,10 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var react = require('react');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
 var FormGroup$1 = require('./FormGroup.css.js');
 
 const baseName = "saltFormGroup";

package/dist-cjs/form-group/FormGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormGroup.js","sources":["../src/form-group/FormGroup.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formGroupCss from \"./FormGroup.css\";\n\nexport interface FormGroupProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Display group of elements in a compact row.\n   */\n  row?: boolean;\n}\n\nconst baseName = \"saltFormGroup\";\n\nexport const FormGroup = forwardRef<HTMLDivElement, FormGroupProps>(\n  function FormGroup({ className, row, ...other }, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-group\",\n      css: formGroupCss,\n      window: targetWindow,\n    });\n    return (\n      <div\n        className={clsx(baseName, { [`${baseName}-row`]: row }, className)}\n        ref={ref}\n        {...other}\n      />\n    );\n  },\n);\n"],"names":["forwardRef","FormGroup","useWindow","useComponentCssInjection","formGroupCss","jsx","clsx"],"mappings":";;;;;;;;;AAeA,MAAM,QAAW,GAAA,eAAA;AAEV,MAAM,SAAY,GAAAA,gBAAA;AAAA,EACvB,SAASC,WAAU,EAAE,SAAA,EAAW,KAAK,GAAG,KAAA,IAAS,GAAK,EAAA;AACpD,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AACD,IACE,uBAAAC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAK,CAAA,QAAA,EAAU,EAAE,CAAC,CAAG,EAAA,QAAQ,CAAM,IAAA,CAAA,GAAG,GAAI,EAAA,EAAG,SAAS,CAAA;AAAA,QACjE,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA;AAGN;;;;"}
+{"version":3,"file":"FormGroup.js","sources":["../src/form-group/FormGroup.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\n\nimport formGroupCss from \"./FormGroup.css\";\n\nexport interface FormGroupProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Display group of elements in a compact row.\n   */\n  row?: boolean;\n}\n\nconst baseName = \"saltFormGroup\";\n\nexport const FormGroup = forwardRef<HTMLDivElement, FormGroupProps>(\n  function FormGroup({ className, row, ...other }, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-form-group\",\n      css: formGroupCss,\n      window: targetWindow,\n    });\n    return (\n      <div\n        className={clsx(baseName, { [`${baseName}-row`]: row }, className)}\n        ref={ref}\n        {...other}\n      />\n    );\n  },\n);\n"],"names":["forwardRef","FormGroup","useWindow","useComponentCssInjection","formGroupCss","jsx","clsx"],"mappings":";;;;;;;;;AAcA,MAAM,QAAW,GAAA,eAAA;AAEV,MAAM,SAAY,GAAAA,gBAAA;AAAA,EACvB,SAASC,WAAU,EAAE,SAAA,EAAW,KAAK,GAAG,KAAA,IAAS,GAAK,EAAA;AACpD,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AACD,IACE,uBAAAC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAK,CAAA,QAAA,EAAU,EAAE,CAAC,CAAG,EAAA,QAAQ,CAAM,IAAA,CAAA,GAAG,GAAI,EAAA,EAAG,SAAS,CAAA;AAAA,QACjE,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA;AAGN;;;;"}

package/dist-cjs/formatted-input/FormattedInput.js

@@ -2,15 +2,15 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
 var clsx = require('clsx');
 var react = require('react');
 var rifm = require('rifm');
 var InputLegacy = require('../input-legacy/InputLegacy.js');
 require('../input-legacy/StaticInputAdornment.js');
-var InputWithMask = require('./internal/InputWithMask.js');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
 var FormattedInput$1 = require('./FormattedInput.css.js');
+var InputWithMask = require('./internal/InputWithMask.js');
 
 const defaultFormatter = (string) => string;
 const defaultRifmOptions = {};

package/dist-cjs/formatted-input/FormattedInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormattedInput.js","sources":["../src/formatted-input/FormattedInput.tsx"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useRifm } from \"rifm\";\nimport {\n  InputLegacy as Input,\n  type InputLegacyProps as InputProps,\n} from \"../input-legacy\";\nimport {\n  InputWithMask,\n  type InputWithMaskProps,\n  baseName,\n} from \"./internal/InputWithMask\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport formattedInputCss from \"./FormattedInput.css\";\n\nexport type MaskFunction = (value: string | undefined) => boolean;\n\nexport interface RifmOptions {\n  format?: (str: string) => string;\n  replace?: (str: string) => string;\n  append?: (str: string) => string;\n  mask?: boolean | MaskFunction;\n  accept?: RegExp;\n}\n\nexport interface FormattedInputProps extends Omit<InputProps, \"onChange\"> {\n  mask?: string;\n  onChange?: (value: string) => void;\n  rifmOptions?: RifmOptions;\n  value?: string;\n  defaultValue?: string;\n}\n\nconst defaultFormatter = (string: string): string => string;\nconst defaultRifmOptions: RifmOptions = {};\n\nexport const FormattedInput = forwardRef<HTMLInputElement, FormattedInputProps>(\n  function FormattedInput(\n    {\n      defaultValue = \"\",\n      className,\n      inputProps,\n      mask,\n      onChange,\n      rifmOptions = defaultRifmOptions,\n      value: valueProp,\n      textAlign,\n      ...other\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-formatted-input\",\n      css: formattedInputCss,\n      window: targetWindow,\n    });\n\n    const [valueState, setValueState] = useControlled<string | undefined>({\n      default: defaultValue,\n      controlled: valueProp,\n      name: \"FormattedInput\",\n      state: \"value\",\n    });\n\n    const handleChange = (value: string) => {\n      setValueState(value);\n      onChange?.(value);\n    };\n\n    let rifmMask = false;\n\n    if (rifmOptions.mask) {\n      rifmMask =\n        typeof rifmOptions.mask === \"function\"\n          ? rifmOptions.mask(valueState)\n          : rifmOptions.mask;\n    }\n\n    const rifm = useRifm({\n      format: defaultFormatter,\n      accept: /.*/,\n      ...rifmOptions,\n      mask: rifmMask,\n      value: valueState || \"\",\n      onChange: handleChange,\n    });\n\n    return (\n      <Input\n        className={clsx(baseName, className)}\n        inputComponent={InputWithMask}\n        inputProps={{ mask, textAlign, ...inputProps } as InputWithMaskProps}\n        onChange={rifm.onChange}\n        textAlign={textAlign}\n        value={rifm.value}\n        {...other}\n        ref={ref}\n      />\n    );\n  },\n);\n"],"names":["forwardRef","FormattedInput","useWindow","useComponentCssInjection","formattedInputCss","useControlled","rifm","useRifm","jsx","Input","clsx","baseName","InputWithMask"],"mappings":";;;;;;;;;;;;;;AAqCA,MAAM,gBAAA,GAAmB,CAAC,MAA2B,KAAA,MAAA;AACrD,MAAM,qBAAkC,EAAC;AAElC,MAAM,cAAiB,GAAAA,gBAAA;AAAA,EAC5B,SAASC,eACP,CAAA;AAAA,IACE,YAAe,GAAA,EAAA;AAAA,IACf,SAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAc,GAAA,kBAAA;AAAA,IACd,KAAO,EAAA,SAAA;AAAA,IACP,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,gBAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIC,kBAAkC,CAAA;AAAA,MACpE,OAAS,EAAA,YAAA;AAAA,MACT,UAAY,EAAA,SAAA;AAAA,MACZ,IAAM,EAAA,gBAAA;AAAA,MACN,KAAO,EAAA;AAAA,KACR,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,CAAC,KAAkB,KAAA;AACtC,MAAA,aAAA,CAAc,KAAK,CAAA;AACnB,MAAW,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAA,KAAA,CAAA;AAAA,KACb;AAEA,IAAA,IAAI,QAAW,GAAA,KAAA;AAEf,IAAA,IAAI,YAAY,IAAM,EAAA;AACpB,MACE,QAAA,GAAA,OAAO,YAAY,IAAS,KAAA,UAAA,GACxB,YAAY,IAAK,CAAA,UAAU,IAC3B,WAAY,CAAA,IAAA;AAAA;AAGpB,IAAA,MAAMC,SAAOC,YAAQ,CAAA;AAAA,MACnB,MAAQ,EAAA,gBAAA;AAAA,MACR,MAAQ,EAAA,IAAA;AAAA,MACR,GAAG,WAAA;AAAA,MACH,IAAM,EAAA,QAAA;AAAA,MACN,OAAO,UAAc,IAAA,EAAA;AAAA,MACrB,QAAU,EAAA;AAAA,KACX,CAAA;AAED,IACE,uBAAAC,cAAA;AAAA,MAACC,uBAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAK,CAAAC,sBAAA,EAAU,SAAS,CAAA;AAAA,QACnC,cAAgB,EAAAC,2BAAA;AAAA,QAChB,UAAY,EAAA,EAAE,IAAM,EAAA,SAAA,EAAW,GAAG,UAAW,EAAA;AAAA,QAC7C,UAAUN,MAAK,CAAA,QAAA;AAAA,QACf,SAAA;AAAA,QACA,OAAOA,MAAK,CAAA,KAAA;AAAA,QACX,GAAG,KAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
+{"version":3,"file":"FormattedInput.js","sources":["../src/formatted-input/FormattedInput.tsx"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useRifm } from \"rifm\";\nimport {\n  InputLegacy as Input,\n  type InputLegacyProps as InputProps,\n} from \"../input-legacy\";\nimport formattedInputCss from \"./FormattedInput.css\";\nimport {\n  baseName,\n  InputWithMask,\n  type InputWithMaskProps,\n} from \"./internal/InputWithMask\";\n\nexport type MaskFunction = (value: string | undefined) => boolean;\n\nexport interface RifmOptions {\n  format?: (str: string) => string;\n  replace?: (str: string) => string;\n  append?: (str: string) => string;\n  mask?: boolean | MaskFunction;\n  accept?: RegExp;\n}\n\nexport interface FormattedInputProps extends Omit<InputProps, \"onChange\"> {\n  mask?: string;\n  onChange?: (value: string) => void;\n  rifmOptions?: RifmOptions;\n  value?: string;\n  defaultValue?: string;\n}\n\nconst defaultFormatter = (string: string): string => string;\nconst defaultRifmOptions: RifmOptions = {};\n\nexport const FormattedInput = forwardRef<HTMLInputElement, FormattedInputProps>(\n  function FormattedInput(\n    {\n      defaultValue = \"\",\n      className,\n      inputProps,\n      mask,\n      onChange,\n      rifmOptions = defaultRifmOptions,\n      value: valueProp,\n      textAlign,\n      ...other\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-formatted-input\",\n      css: formattedInputCss,\n      window: targetWindow,\n    });\n\n    const [valueState, setValueState] = useControlled<string | undefined>({\n      default: defaultValue,\n      controlled: valueProp,\n      name: \"FormattedInput\",\n      state: \"value\",\n    });\n\n    const handleChange = (value: string) => {\n      setValueState(value);\n      onChange?.(value);\n    };\n\n    let rifmMask = false;\n\n    if (rifmOptions.mask) {\n      rifmMask =\n        typeof rifmOptions.mask === \"function\"\n          ? rifmOptions.mask(valueState)\n          : rifmOptions.mask;\n    }\n\n    const rifm = useRifm({\n      format: defaultFormatter,\n      accept: /.*/,\n      ...rifmOptions,\n      mask: rifmMask,\n      value: valueState || \"\",\n      onChange: handleChange,\n    });\n\n    return (\n      <Input\n        className={clsx(baseName, className)}\n        inputComponent={InputWithMask}\n        inputProps={{ mask, textAlign, ...inputProps } as InputWithMaskProps}\n        onChange={rifm.onChange}\n        textAlign={textAlign}\n        value={rifm.value}\n        {...other}\n        ref={ref}\n      />\n    );\n  },\n);\n"],"names":["forwardRef","FormattedInput","useWindow","useComponentCssInjection","formattedInputCss","useControlled","rifm","useRifm","jsx","Input","clsx","baseName","InputWithMask"],"mappings":";;;;;;;;;;;;;;AAmCA,MAAM,gBAAA,GAAmB,CAAC,MAA2B,KAAA,MAAA;AACrD,MAAM,qBAAkC,EAAC;AAElC,MAAM,cAAiB,GAAAA,gBAAA;AAAA,EAC5B,SAASC,eACP,CAAA;AAAA,IACE,YAAe,GAAA,EAAA;AAAA,IACf,SAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAc,GAAA,kBAAA;AAAA,IACd,KAAO,EAAA,SAAA;AAAA,IACP,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,gBAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIC,kBAAkC,CAAA;AAAA,MACpE,OAAS,EAAA,YAAA;AAAA,MACT,UAAY,EAAA,SAAA;AAAA,MACZ,IAAM,EAAA,gBAAA;AAAA,MACN,KAAO,EAAA;AAAA,KACR,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,CAAC,KAAkB,KAAA;AACtC,MAAA,aAAA,CAAc,KAAK,CAAA;AACnB,MAAW,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAA,KAAA,CAAA;AAAA,KACb;AAEA,IAAA,IAAI,QAAW,GAAA,KAAA;AAEf,IAAA,IAAI,YAAY,IAAM,EAAA;AACpB,MACE,QAAA,GAAA,OAAO,YAAY,IAAS,KAAA,UAAA,GACxB,YAAY,IAAK,CAAA,UAAU,IAC3B,WAAY,CAAA,IAAA;AAAA;AAGpB,IAAA,MAAMC,SAAOC,YAAQ,CAAA;AAAA,MACnB,MAAQ,EAAA,gBAAA;AAAA,MACR,MAAQ,EAAA,IAAA;AAAA,MACR,GAAG,WAAA;AAAA,MACH,IAAM,EAAA,QAAA;AAAA,MACN,OAAO,UAAc,IAAA,EAAA;AAAA,MACrB,QAAU,EAAA;AAAA,KACX,CAAA;AAED,IACE,uBAAAC,cAAA;AAAA,MAACC,uBAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAK,CAAAC,sBAAA,EAAU,SAAS,CAAA;AAAA,QACnC,cAAgB,EAAAC,2BAAA;AAAA,QAChB,UAAY,EAAA,EAAE,IAAM,EAAA,SAAA,EAAW,GAAG,UAAW,EAAA;AAAA,QAC7C,UAAUN,MAAK,CAAA,QAAA;AAAA,QACf,SAAA;AAAA,QACA,OAAOA,MAAK,CAAA,KAAA;AAAA,QACX,GAAG,KAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}

package/dist-cjs/formatted-input/internal/InputWithMask.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputWithMask.js","sources":["../src/formatted-input/internal/InputWithMask.tsx"],"sourcesContent":["import { useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type InputHTMLAttributes, forwardRef } from \"react\";\nimport type { FormattedInputProps } from \"../FormattedInput\";\n\nexport const baseName = \"saltFormattedInput\";\n\nfunction getClippedMask(\n  mask: FormattedInputProps[\"mask\"],\n  value: FormattedInputProps[\"value\"],\n  textAlign: FormattedInputProps[\"textAlign\"],\n) {\n  if (mask) {\n    if (textAlign === \"right\") {\n      return mask.substring(\n        0,\n        value ? mask.length - value.length : mask.length,\n      );\n    }\n\n    return mask.substring(value ? value.length : 0);\n  }\n  return \"\";\n}\n\nexport interface InputWithMaskProps\n  extends InputHTMLAttributes<HTMLInputElement> {\n  mask?: FormattedInputProps[\"mask\"];\n  textAlign?: FormattedInputProps[\"textAlign\"];\n  value?: FormattedInputProps[\"value\"];\n}\n\nexport const InputWithMask = forwardRef<HTMLInputElement, InputWithMaskProps>(\n  function InputWithMask(\n    {\n      \"aria-labelledby\": ariaLabelledBy,\n      className,\n      mask = \"\",\n      value,\n      id: idProp,\n      style,\n      textAlign,\n      ...other\n    },\n    ref,\n  ) {\n    const id = useId(idProp);\n\n    const spacerAndMask = [\n      <i key={value}>{value}</i>,\n      getClippedMask(mask, value, textAlign),\n    ];\n\n    return (\n      <div className={`${baseName}-inputWrapper`}>\n        <input\n          className={className}\n          {...other}\n          aria-label={mask}\n          aria-labelledby={[ariaLabelledBy, id]\n            .filter((label) => label != null)\n            .join(\" \")}\n          id={id}\n          ref={ref}\n          style={style}\n          value={value}\n        />\n        <span\n          aria-hidden=\"true\"\n          className={clsx(`${baseName}-mask`, className)}\n          style={style}\n        >\n          {textAlign !== \"right\" ? spacerAndMask : spacerAndMask.reverse()}\n        </span>\n      </div>\n    );\n  },\n);\n"],"names":["forwardRef","InputWithMask","useId","jsx","jsxs","clsx"],"mappings":";;;;;;;AAKO,MAAM,QAAW,GAAA;AAExB,SAAS,cAAA,CACP,IACA,EAAA,KAAA,EACA,SACA,EAAA;AACA,EAAA,IAAI,IAAM,EAAA;AACR,IAAA,IAAI,cAAc,OAAS,EAAA;AACzB,MAAA,OAAO,IAAK,CAAA,SAAA;AAAA,QACV,CAAA;AAAA,QACA,KAAQ,GAAA,IAAA,CAAK,MAAS,GAAA,KAAA,CAAM,SAAS,IAAK,CAAA;AAAA,OAC5C;AAAA;AAGF,IAAA,OAAO,IAAK,CAAA,SAAA,CAAU,KAAQ,GAAA,KAAA,CAAM,SAAS,CAAC,CAAA;AAAA;AAEhD,EAAO,OAAA,EAAA;AACT;AASO,MAAM,aAAgB,GAAAA,gBAAA;AAAA,EAC3B,SAASC,cACP,CAAA;AAAA,IACE,iBAAmB,EAAA,cAAA;AAAA,IACnB,SAAA;AAAA,IACA,IAAO,GAAA,EAAA;AAAA,IACP,KAAA;AAAA,IACA,EAAI,EAAA,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAM,MAAA,EAAA,GAAKC,WAAM,MAAM,CAAA;AAEvB,IAAA,MAAM,aAAgB,GAAA;AAAA,sBACpBC,cAAA,CAAC,GAAe,EAAA,EAAA,QAAA,EAAA,KAAA,EAAA,EAAR,KAAc,CAAA;AAAA,MACtB,cAAA,CAAe,IAAM,EAAA,KAAA,EAAO,SAAS;AAAA,KACvC;AAEA,IAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,QAAQ,CACzB,aAAA,CAAA,EAAA,QAAA,EAAA;AAAA,sBAAAD,cAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,SAAA;AAAA,UACC,GAAG,KAAA;AAAA,UACJ,YAAY,EAAA,IAAA;AAAA,UACZ,iBAAiB,EAAA,CAAC,cAAgB,EAAA,EAAE,CACjC,CAAA,MAAA,CAAO,CAAC,KAAA,KAAU,KAAS,IAAA,IAAI,CAC/B,CAAA,IAAA,CAAK,GAAG,CAAA;AAAA,UACX,EAAA;AAAA,UACA,GAAA;AAAA,UACA,KAAA;AAAA,UACA;AAAA;AAAA,OACF;AAAA,sBACAA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,aAAY,EAAA,MAAA;AAAA,UACZ,SAAW,EAAAE,SAAA,CAAK,CAAG,EAAA,QAAQ,SAAS,SAAS,CAAA;AAAA,UAC7C,KAAA;AAAA,UAEC,QAAc,EAAA,SAAA,KAAA,OAAA,GAAU,aAAgB,GAAA,aAAA,CAAc,OAAQ;AAAA;AAAA;AACjE,KACF,EAAA,CAAA;AAAA;AAGN;;;;;"}
+{"version":3,"file":"InputWithMask.js","sources":["../src/formatted-input/internal/InputWithMask.tsx"],"sourcesContent":["import { useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type InputHTMLAttributes } from \"react\";\nimport type { FormattedInputProps } from \"../FormattedInput\";\n\nexport const baseName = \"saltFormattedInput\";\n\nfunction getClippedMask(\n  mask: FormattedInputProps[\"mask\"],\n  value: FormattedInputProps[\"value\"],\n  textAlign: FormattedInputProps[\"textAlign\"],\n) {\n  if (mask) {\n    if (textAlign === \"right\") {\n      return mask.substring(\n        0,\n        value ? mask.length - value.length : mask.length,\n      );\n    }\n\n    return mask.substring(value ? value.length : 0);\n  }\n  return \"\";\n}\n\nexport interface InputWithMaskProps\n  extends InputHTMLAttributes<HTMLInputElement> {\n  mask?: FormattedInputProps[\"mask\"];\n  textAlign?: FormattedInputProps[\"textAlign\"];\n  value?: FormattedInputProps[\"value\"];\n}\n\nexport const InputWithMask = forwardRef<HTMLInputElement, InputWithMaskProps>(\n  function InputWithMask(\n    {\n      \"aria-labelledby\": ariaLabelledBy,\n      className,\n      mask = \"\",\n      value,\n      id: idProp,\n      style,\n      textAlign,\n      ...other\n    },\n    ref,\n  ) {\n    const id = useId(idProp);\n\n    const spacerAndMask = [\n      <i key={value}>{value}</i>,\n      getClippedMask(mask, value, textAlign),\n    ];\n\n    return (\n      <div className={`${baseName}-inputWrapper`}>\n        <input\n          className={className}\n          {...other}\n          aria-label={mask}\n          aria-labelledby={[ariaLabelledBy, id]\n            .filter((label) => label != null)\n            .join(\" \")}\n          id={id}\n          ref={ref}\n          style={style}\n          value={value}\n        />\n        <span\n          aria-hidden=\"true\"\n          className={clsx(`${baseName}-mask`, className)}\n          style={style}\n        >\n          {textAlign !== \"right\" ? spacerAndMask : spacerAndMask.reverse()}\n        </span>\n      </div>\n    );\n  },\n);\n"],"names":["forwardRef","InputWithMask","useId","jsx","jsxs","clsx"],"mappings":";;;;;;;AAKO,MAAM,QAAW,GAAA;AAExB,SAAS,cAAA,CACP,IACA,EAAA,KAAA,EACA,SACA,EAAA;AACA,EAAA,IAAI,IAAM,EAAA;AACR,IAAA,IAAI,cAAc,OAAS,EAAA;AACzB,MAAA,OAAO,IAAK,CAAA,SAAA;AAAA,QACV,CAAA;AAAA,QACA,KAAQ,GAAA,IAAA,CAAK,MAAS,GAAA,KAAA,CAAM,SAAS,IAAK,CAAA;AAAA,OAC5C;AAAA;AAGF,IAAA,OAAO,IAAK,CAAA,SAAA,CAAU,KAAQ,GAAA,KAAA,CAAM,SAAS,CAAC,CAAA;AAAA;AAEhD,EAAO,OAAA,EAAA;AACT;AASO,MAAM,aAAgB,GAAAA,gBAAA;AAAA,EAC3B,SAASC,cACP,CAAA;AAAA,IACE,iBAAmB,EAAA,cAAA;AAAA,IACnB,SAAA;AAAA,IACA,IAAO,GAAA,EAAA;AAAA,IACP,KAAA;AAAA,IACA,EAAI,EAAA,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAM,MAAA,EAAA,GAAKC,WAAM,MAAM,CAAA;AAEvB,IAAA,MAAM,aAAgB,GAAA;AAAA,sBACpBC,cAAA,CAAC,GAAe,EAAA,EAAA,QAAA,EAAA,KAAA,EAAA,EAAR,KAAc,CAAA;AAAA,MACtB,cAAA,CAAe,IAAM,EAAA,KAAA,EAAO,SAAS;AAAA,KACvC;AAEA,IAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,QAAQ,CACzB,aAAA,CAAA,EAAA,QAAA,EAAA;AAAA,sBAAAD,cAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,SAAA;AAAA,UACC,GAAG,KAAA;AAAA,UACJ,YAAY,EAAA,IAAA;AAAA,UACZ,iBAAiB,EAAA,CAAC,cAAgB,EAAA,EAAE,CACjC,CAAA,MAAA,CAAO,CAAC,KAAA,KAAU,KAAS,IAAA,IAAI,CAC/B,CAAA,IAAA,CAAK,GAAG,CAAA;AAAA,UACX,EAAA;AAAA,UACA,GAAA;AAAA,UACA,KAAA;AAAA,UACA;AAAA;AAAA,OACF;AAAA,sBACAA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,aAAY,EAAA,MAAA;AAAA,UACZ,SAAW,EAAAE,SAAA,CAAK,CAAG,EAAA,QAAQ,SAAS,SAAS,CAAA;AAAA,UAC7C,KAAA;AAAA,UAEC,QAAc,EAAA,SAAA,KAAA,OAAA,GAAU,aAAgB,GAAA,aAAA,CAAc,OAAQ;AAAA;AAAA;AACjE,KACF,EAAA,CAAA;AAAA;AAGN;;;;;"}