@spark-ui/components 10.11.13 → 10.11.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -336,7 +336,7 @@ var FormFieldCharactersCount = ({
336
336
  }, 1e3);
337
337
  return () => clearTimeout(timeoutId);
338
338
  }, [value]);
339
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "ml-auto self-end", children: [
339
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "ml-auto self-start", children: [
340
340
  description && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(FormFieldMessage, { className: "default:sr-only", children: description }),
341
341
  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
342
342
  "span",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/form-field/index.ts","../../src/form-field/FormField.tsx","../../src/slot/Slot.tsx","../../src/form-field/FormFieldContext.tsx","../../src/form-field/FormFieldProvider.tsx","../../src/form-field/FormFieldStateMessage.tsx","../../src/icon/Icon.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx","../../src/form-field/FormFieldMessage.tsx","../../src/form-field/FormFieldAlertMessage.tsx","../../src/form-field/FormFieldCharactersCount.tsx","../../src/form-field/FormFieldControl.tsx","../../src/form-field/FormFieldErrorMessage.tsx","../../src/form-field/FormFieldHelperMessage.tsx","../../src/form-field/FormFieldLabel.tsx","../../src/label/Label.tsx","../../src/label/LabelRequiredIndicator.tsx","../../src/label/index.ts","../../src/form-field/FormFieldRequiredIndicator.tsx","../../src/form-field/FormFieldSuccessMessage.tsx"],"sourcesContent":["import { FormField as Root } from './FormField'\nimport { FormFieldAlertMessage } from './FormFieldAlertMessage'\nimport { FormFieldCharactersCount } from './FormFieldCharactersCount'\nimport { FormFieldControl } from './FormFieldControl'\nimport { FormFieldErrorMessage } from './FormFieldErrorMessage'\nimport { FormFieldHelperMessage } from './FormFieldHelperMessage'\nimport { FormFieldLabel } from './FormFieldLabel'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\nimport { FormFieldStateMessage } from './FormFieldStateMessage'\nimport { FormFieldSuccessMessage } from './FormFieldSuccessMessage'\n\nexport const FormField: typeof Root & {\n Label: typeof FormFieldLabel\n Control: typeof FormFieldControl\n StateMessage: typeof FormFieldStateMessage\n SuccessMessage: typeof FormFieldSuccessMessage\n AlertMessage: typeof FormFieldAlertMessage\n ErrorMessage: typeof FormFieldErrorMessage\n HelperMessage: typeof FormFieldHelperMessage\n RequiredIndicator: typeof FormFieldRequiredIndicator\n CharactersCount: typeof FormFieldCharactersCount\n} = Object.assign(Root, {\n Label: FormFieldLabel,\n Control: FormFieldControl,\n StateMessage: FormFieldStateMessage,\n SuccessMessage: FormFieldSuccessMessage,\n AlertMessage: FormFieldAlertMessage,\n ErrorMessage: FormFieldErrorMessage,\n HelperMessage: FormFieldHelperMessage,\n RequiredIndicator: FormFieldRequiredIndicator,\n CharactersCount: FormFieldCharactersCount,\n})\n\nFormField.displayName = 'FormField'\nFormFieldLabel.displayName = 'FormField.Label'\nFormFieldControl.displayName = 'FormField.Control'\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n\nexport { type FormFieldProps } from './FormField'\nexport { type FormFieldStateMessageProps } from './FormFieldStateMessage'\nexport { type FormFieldControl, useFormFieldControl } from './FormFieldControl'\nexport { type FormFieldHelperMessageProps } from './FormFieldHelperMessage'\nexport { type FormFieldSuccessMessageProps } from './FormFieldSuccessMessage'\nexport { type FormFieldAlertMessageProps } from './FormFieldAlertMessage'\nexport { type FormFieldErrorMessageProps } from './FormFieldErrorMessage'\nexport { type FormFieldLabelProps } from './FormFieldLabel'\nexport { type FormFieldRequiredIndicatorProps } from './FormFieldRequiredIndicator'\nexport { type FormFieldCharactersCountProps } from './FormFieldCharactersCount'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useId } from 'react'\n\nimport { Slot } from '../slot'\nimport { FormFieldContextState, ID_PREFIX } from './FormFieldContext'\nimport { FormFieldProvider } from './FormFieldProvider'\n\nexport interface FormFieldProps\n extends ComponentPropsWithoutRef<'div'>,\n Pick<FormFieldContextState, 'name' | 'state' | 'isRequired'> {\n /**\n * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n */\n asChild?: boolean\n /**\n * When `true`, prevents the user from interacting.\n */\n disabled?: boolean\n /**\n * Sets the component as interactive or not.\n */\n readOnly?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const FormField = ({\n className,\n disabled = false,\n readOnly = false,\n name,\n state,\n isRequired = false,\n asChild = false,\n ref,\n ...others\n}: FormFieldProps) => {\n const id = `${ID_PREFIX}-${useId()}`\n const Component = asChild ? Slot : 'div'\n\n return (\n <FormFieldProvider\n id={id}\n name={name}\n isRequired={isRequired}\n disabled={disabled}\n readOnly={readOnly}\n state={state}\n >\n <Component\n ref={ref}\n data-spark-component=\"form-field\"\n className={cx(className, 'gap-sm flex flex-col')}\n {...others}\n />\n </FormFieldProvider>\n )\n}\n\nFormField.displayName = 'FormField'\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n cloneElement,\n HTMLAttributes,\n isValidElement,\n PropsWithChildren,\n ReactNode,\n Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n asChild: boolean | undefined,\n children: ReactNode,\n callback: (children: ReactNode) => ReactNode\n) => {\n if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n return isValidElement(children)\n ? cloneElement(\n children,\n undefined,\n callback((children.props as { children: ReactNode }).children)\n )\n : null\n}\n","import { createContext, useContext } from 'react'\n\nexport interface FormFieldContextState {\n /**\n * Generated id for the input component.\n */\n id: string\n /**\n * Generated id for the label component.\n */\n labelId?: string\n /**\n * The name of the input. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * A set of ids separated by a space used to describe the input component given by a set of messages.\n */\n description?: string\n /**\n * Disables the field and its associated input\n */\n disabled?: boolean\n /**\n * Marks the field and its associated input as read only\n */\n readOnly?: boolean\n /**\n * The validation state of the input.\n */\n state?: 'error' | 'success' | 'alert'\n /**\n * If true, the form field will be invalid.\n */\n isInvalid?: boolean\n /**\n * If true, the form field will be required.\n */\n isRequired?: boolean\n /**\n * Callback used to store a descriptive message.\n */\n onMessageIdAdd: (id: string) => void\n /**\n * Callback used to remove a descriptive message.\n */\n onMessageIdRemove: (id: string) => void\n}\n\nexport const FormFieldContext = createContext<FormFieldContextState | null>(null)\n\nexport const ID_PREFIX = ':form-field'\n\nexport const useFormField = () => {\n const context = useContext(FormFieldContext)\n\n if (!context) {\n throw Error('useFormField must be used within a FormField provider')\n }\n\n return context\n}\n","import { ReactNode, useCallback, useId, useMemo, useState } from 'react'\n\nimport { FormFieldContext, FormFieldContextState, ID_PREFIX } from './FormFieldContext'\n\nexport interface FormFieldProviderProps\n extends Pick<\n FormFieldContextState,\n 'id' | 'name' | 'disabled' | 'readOnly' | 'state' | 'isRequired'\n > {\n children: ReactNode\n}\n\nexport const FormFieldProvider = ({\n id,\n name,\n disabled = false,\n readOnly = false,\n state,\n isRequired,\n children,\n}: FormFieldProviderProps) => {\n const labelId = `${ID_PREFIX}-label-${useId()}`\n const [messageIds, setMessageIds] = useState<string[]>([])\n const description = messageIds.length > 0 ? messageIds.join(' ') : undefined\n\n const handleMessageIdAdd = useCallback((msgId: string) => {\n setMessageIds(ids => [...ids, msgId])\n }, [])\n\n const handleMessageIdRemove = useCallback((msgId: string) => {\n setMessageIds(ids => ids.filter(current => current !== msgId))\n }, [])\n\n const value = useMemo(() => {\n const isInvalid = state === 'error'\n\n return {\n id,\n labelId,\n name,\n disabled,\n readOnly,\n state,\n isRequired,\n isInvalid,\n description,\n onMessageIdAdd: handleMessageIdAdd,\n onMessageIdRemove: handleMessageIdRemove,\n }\n }, [\n id,\n labelId,\n name,\n disabled,\n readOnly,\n description,\n state,\n isRequired,\n handleMessageIdAdd,\n handleMessageIdRemove,\n ])\n\n return <FormFieldContext.Provider value={value}>{children}</FormFieldContext.Provider>\n}\n\nFormFieldProvider.displayName = 'FormFieldProvider'\n","import { AlertOutline } from '@spark-ui/icons/AlertOutline'\nimport { Check } from '@spark-ui/icons/Check'\nimport { WarningOutline } from '@spark-ui/icons/WarningOutline'\nimport { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport interface FormFieldStateMessageProps extends FormFieldMessageProps {\n state: 'error' | 'alert' | 'success'\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldStateMessage = ({\n className,\n state,\n children,\n ref,\n ...others\n}: FormFieldStateMessageProps) => {\n const field = useFormField()\n\n if (field.state !== state) {\n return null\n }\n\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-state-message\"\n className={cx(\n 'gap-sm flex items-center',\n state === 'error' ? 'text-error' : 'text-on-surface/dim-1',\n className\n )}\n {...others}\n >\n {state === 'alert' && (\n <Icon size=\"sm\">\n <WarningOutline />\n </Icon>\n )}\n {state === 'error' && (\n <Icon size=\"sm\" intent=\"error\">\n <AlertOutline />\n </Icon>\n )}\n {state === 'success' && (\n <Icon size=\"sm\">\n <Check />\n </Icon>\n )}\n\n {children}\n </FormFieldMessage>\n )\n}\n\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\n","import { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n /**\n * The svg icon that will be wrapped\n */\n children: ReactNode\n /**\n * The accessible label for the icon. This label will be visually hidden but announced to screen\n * reader users, similar to `alt` text for `img` tags.\n */\n label?: string\n}\n\nexport const Icon = ({\n label,\n className,\n size = 'current',\n intent = 'current',\n children,\n ...others\n}: IconProps) => {\n const child = Children.only(children)\n\n return (\n <>\n {cloneElement(child as ReactElement<Record<string, any>>, {\n className: iconStyles({ className, size, intent }),\n 'data-spark-component': 'icon',\n 'aria-hidden': 'true',\n focusable: 'false',\n ...others,\n })}\n\n {label && <VisuallyHidden>{label}</VisuallyHidden>}\n </>\n )\n}\n\nIcon.displayName = 'Icon'\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n const Component = asChild ? Slot : 'span'\n\n return (\n <Component\n {...props}\n ref={ref}\n style={{\n // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n whiteSpace: 'nowrap',\n wordWrap: 'normal',\n ...props.style,\n }}\n />\n )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n variants: {\n /**\n * Color scheme of the icon.\n */\n intent: makeVariants<\n 'intent',\n [\n 'current',\n 'main',\n 'support',\n 'accent',\n 'basic',\n 'success',\n 'alert',\n 'error',\n 'info',\n 'neutral',\n ]\n >({\n current: ['text-current'],\n main: ['text-main'],\n support: ['text-support'],\n accent: ['text-accent'],\n basic: ['text-basic'],\n success: ['text-success'],\n alert: ['text-alert'],\n error: ['text-error'],\n info: ['text-info'],\n neutral: ['text-neutral'],\n }),\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n current: ['u-current-font-size'],\n sm: ['w-sz-16', 'h-sz-16'],\n md: ['w-sz-24', 'h-sz-24'],\n lg: ['w-sz-32', 'h-sz-32'],\n xl: ['w-sz-40', 'h-sz-40'],\n }),\n },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useId } from 'react'\n\nimport { ID_PREFIX, useFormField } from './FormFieldContext'\n\nexport type FormFieldMessageProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldMessage = ({\n id: idProp,\n className,\n ref,\n ...others\n}: FormFieldMessageProps) => {\n const { onMessageIdAdd, onMessageIdRemove } = useFormField()\n const currentId = `${ID_PREFIX}-message-${useId()}`\n const id = idProp || currentId\n\n useEffect(() => {\n onMessageIdAdd(id)\n\n return () => {\n onMessageIdRemove(id)\n }\n }, [id, onMessageIdAdd, onMessageIdRemove])\n\n return (\n <span\n ref={ref}\n id={id}\n data-spark-component=\"form-field-message\"\n className={cx(className, 'text-caption')}\n {...others}\n />\n )\n}\n\nFormFieldMessage.displayName = 'FormField.Message'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldAlertMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldAlertMessage = ({ ref, ...props }: FormFieldAlertMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-alert-message\"\n state=\"alert\"\n {...props}\n />\n )\n}\n\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useState } from 'react'\n\nimport { FormFieldMessage } from './FormFieldMessage'\n\nexport type FormFieldCharactersCountProps = ComponentPropsWithoutRef<'span'> & {\n /**\n * This description is for the screen reader, read when the input is focused.\n */\n description?: string\n /**\n * The live announcement is for the screen read after a delay once the input value changes.\n */\n liveAnnouncement?: ({ remainingChars }: { remainingChars: number }) => string\n /**\n * Current value for the input this component belongs to.\n */\n value?: string\n /**\n * Maximum numeric value to be displayed.\n */\n maxLength: number\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldCharactersCount = ({\n className,\n value = '',\n maxLength,\n description,\n liveAnnouncement,\n ref,\n ...others\n}: FormFieldCharactersCountProps) => {\n const [throttledValue, setThrottledValue] = useState(value)\n\n /**\n * The value is throttled to avoid spamming the aria-live region (and consequently the screen reader).\n */\n useEffect(() => {\n const timeoutId = setTimeout(() => {\n setThrottledValue(value)\n }, 1000)\n\n return () => clearTimeout(timeoutId)\n }, [value])\n\n return (\n <span className=\"ml-auto self-end\">\n {description && (\n <FormFieldMessage className=\"default:sr-only\">{description}</FormFieldMessage>\n )}\n <span\n ref={ref}\n aria-hidden\n data-spark-component=\"form-field-characters-count\"\n className={cx(className, 'text-caption', 'text-neutral')}\n {...others}\n >\n {`${value.length}/${maxLength}`}\n </span>\n\n {liveAnnouncement && (\n <span className=\"sr-only\" aria-live=\"polite\">\n {liveAnnouncement({ remainingChars: maxLength - throttledValue.length })}\n </span>\n )}\n </span>\n )\n}\n\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n","import { ReactNode, useContext } from 'react'\n\nimport { FormFieldContext, FormFieldContextState } from './FormFieldContext'\n\ntype State = Partial<\n Pick<\n FormFieldContextState,\n | 'id'\n | 'name'\n | 'description'\n | 'labelId'\n | 'disabled'\n | 'readOnly'\n | 'state'\n | 'isInvalid'\n | 'isRequired'\n >\n>\n\nexport interface FormFieldControlProps {\n children: (state: State) => ReactNode\n}\n\nexport const useFormFieldControl = () => {\n const { id, name, description, disabled, readOnly, state, labelId, isInvalid, isRequired } =\n useContext(FormFieldContext) || {}\n\n return {\n id,\n name,\n description,\n disabled,\n readOnly,\n state,\n labelId,\n isInvalid,\n isRequired,\n } as State\n}\n\nexport const FormFieldControl = ({ children }: FormFieldControlProps) => {\n const props = useFormFieldControl()\n\n return <>{children(props)}</>\n}\n\nFormFieldControl.displayName = 'FormField.Control'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldErrorMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldErrorMessage = ({ ref, ...props }: FormFieldErrorMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-error-message\"\n state=\"error\"\n {...props}\n />\n )\n}\n\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport type FormFieldHelperMessageProps = FormFieldMessageProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldHelperMessage = ({\n className,\n ref,\n ...others\n}: FormFieldHelperMessageProps) => {\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-helper-message\"\n className={cx('text-on-surface/dim-1', className)}\n {...others}\n />\n )\n}\n\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, Ref } from 'react'\n\nimport { Label, LabelProps } from '../label'\nimport { Slottable } from '../slot'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\n\nexport interface FormFieldLabelProps extends LabelProps {\n /**\n * Element shown when the input is required inside the label.\n */\n requiredIndicator?: ReactNode\n ref?: Ref<HTMLLabelElement>\n}\n\nexport const FormFieldLabel = ({\n htmlFor: htmlForProp,\n className,\n children,\n requiredIndicator = <FormFieldRequiredIndicator />,\n asChild,\n ref,\n ...others\n}: FormFieldLabelProps) => {\n const control = useFormField()\n\n const { disabled, labelId, isRequired } = control\n const htmlFor = asChild ? undefined : htmlForProp || control.id\n\n return (\n <Label\n ref={ref}\n id={labelId}\n data-spark-component=\"form-field-label\"\n htmlFor={htmlFor}\n className={cx(className, disabled ? 'text-on-surface/dim-3 pointer-events-none' : undefined)}\n asChild={asChild}\n {...others}\n >\n <>\n <Slottable>{children}</Slottable>\n {isRequired && requiredIndicator}\n </>\n </Label>\n )\n}\n\nFormFieldLabel.displayName = 'FormField.Label'\n","import { cx } from 'class-variance-authority'\nimport { Label as RadixLabel } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type LabelProps = RadixLabel.LabelProps & {\n ref?: Ref<HTMLLabelElement>\n}\n\nexport const Label = ({ className, ref, ...others }: LabelProps) => {\n return (\n <RadixLabel.Label\n ref={ref}\n data-spark-component=\"label\"\n className={cx('text-body-1', className)}\n {...others}\n />\n )\n}\n\nLabel.displayName = 'Label'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithRef } from 'react'\n\nexport type LabelRequiredIndicatorProps = ComponentPropsWithRef<'span'>\n\nexport const LabelRequiredIndicator = ({\n className,\n children = '*',\n ref,\n ...others\n}: LabelRequiredIndicatorProps) => {\n return (\n <span\n ref={ref}\n data-spark-component=\"label-required-indicator\"\n role=\"presentation\"\n aria-hidden=\"true\"\n className={cx(className, 'text-caption text-on-surface/dim-1')}\n {...others}\n >\n {children}\n </span>\n )\n}\n\nLabelRequiredIndicator.displayName = 'Label.RequiredIndicator'\n","import { Label as Root } from './Label'\nimport { LabelRequiredIndicator } from './LabelRequiredIndicator'\n\nexport const Label: typeof Root & {\n RequiredIndicator: typeof LabelRequiredIndicator\n} = Object.assign(Root, {\n RequiredIndicator: LabelRequiredIndicator,\n})\n\nLabel.displayName = 'Label'\nLabelRequiredIndicator.displayName = 'Label.RequiredIndicator'\n\nexport type { LabelProps } from './Label'\nexport type { LabelRequiredIndicatorProps } from './LabelRequiredIndicator'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Label, LabelRequiredIndicatorProps } from '../label'\n\nexport type FormFieldRequiredIndicatorProps = LabelRequiredIndicatorProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldRequiredIndicator = ({\n className,\n ref,\n ...props\n}: FormFieldRequiredIndicatorProps) => {\n return <Label.RequiredIndicator ref={ref} className={cx('ml-sm', className)} {...props} />\n}\n\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldSuccessMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldSuccessMessage = ({ ref, ...props }: FormFieldSuccessMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-success-message\"\n state=\"success\"\n {...props}\n />\n )\n}\n\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\n"],"mappings":"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","names":["FormField","import_react","RadixSlot","import_react","import_react","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_react","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_class_variance_authority","import_class_variance_authority","import_radix_ui","import_jsx_runtime","RadixLabel","import_class_variance_authority","import_jsx_runtime","Label","import_class_variance_authority","import_jsx_runtime","Label","import_jsx_runtime","Label","import_jsx_runtime","FormField"]}
1
+ {"version":3,"sources":["../../src/form-field/index.ts","../../src/form-field/FormField.tsx","../../src/slot/Slot.tsx","../../src/form-field/FormFieldContext.tsx","../../src/form-field/FormFieldProvider.tsx","../../src/form-field/FormFieldStateMessage.tsx","../../src/icon/Icon.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx","../../src/form-field/FormFieldMessage.tsx","../../src/form-field/FormFieldAlertMessage.tsx","../../src/form-field/FormFieldCharactersCount.tsx","../../src/form-field/FormFieldControl.tsx","../../src/form-field/FormFieldErrorMessage.tsx","../../src/form-field/FormFieldHelperMessage.tsx","../../src/form-field/FormFieldLabel.tsx","../../src/label/Label.tsx","../../src/label/LabelRequiredIndicator.tsx","../../src/label/index.ts","../../src/form-field/FormFieldRequiredIndicator.tsx","../../src/form-field/FormFieldSuccessMessage.tsx"],"sourcesContent":["import { FormField as Root } from './FormField'\nimport { FormFieldAlertMessage } from './FormFieldAlertMessage'\nimport { FormFieldCharactersCount } from './FormFieldCharactersCount'\nimport { FormFieldControl } from './FormFieldControl'\nimport { FormFieldErrorMessage } from './FormFieldErrorMessage'\nimport { FormFieldHelperMessage } from './FormFieldHelperMessage'\nimport { FormFieldLabel } from './FormFieldLabel'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\nimport { FormFieldStateMessage } from './FormFieldStateMessage'\nimport { FormFieldSuccessMessage } from './FormFieldSuccessMessage'\n\nexport const FormField: typeof Root & {\n Label: typeof FormFieldLabel\n Control: typeof FormFieldControl\n StateMessage: typeof FormFieldStateMessage\n SuccessMessage: typeof FormFieldSuccessMessage\n AlertMessage: typeof FormFieldAlertMessage\n ErrorMessage: typeof FormFieldErrorMessage\n HelperMessage: typeof FormFieldHelperMessage\n RequiredIndicator: typeof FormFieldRequiredIndicator\n CharactersCount: typeof FormFieldCharactersCount\n} = Object.assign(Root, {\n Label: FormFieldLabel,\n Control: FormFieldControl,\n StateMessage: FormFieldStateMessage,\n SuccessMessage: FormFieldSuccessMessage,\n AlertMessage: FormFieldAlertMessage,\n ErrorMessage: FormFieldErrorMessage,\n HelperMessage: FormFieldHelperMessage,\n RequiredIndicator: FormFieldRequiredIndicator,\n CharactersCount: FormFieldCharactersCount,\n})\n\nFormField.displayName = 'FormField'\nFormFieldLabel.displayName = 'FormField.Label'\nFormFieldControl.displayName = 'FormField.Control'\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n\nexport { type FormFieldProps } from './FormField'\nexport { type FormFieldStateMessageProps } from './FormFieldStateMessage'\nexport { type FormFieldControl, useFormFieldControl } from './FormFieldControl'\nexport { type FormFieldHelperMessageProps } from './FormFieldHelperMessage'\nexport { type FormFieldSuccessMessageProps } from './FormFieldSuccessMessage'\nexport { type FormFieldAlertMessageProps } from './FormFieldAlertMessage'\nexport { type FormFieldErrorMessageProps } from './FormFieldErrorMessage'\nexport { type FormFieldLabelProps } from './FormFieldLabel'\nexport { type FormFieldRequiredIndicatorProps } from './FormFieldRequiredIndicator'\nexport { type FormFieldCharactersCountProps } from './FormFieldCharactersCount'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useId } from 'react'\n\nimport { Slot } from '../slot'\nimport { FormFieldContextState, ID_PREFIX } from './FormFieldContext'\nimport { FormFieldProvider } from './FormFieldProvider'\n\nexport interface FormFieldProps\n extends ComponentPropsWithoutRef<'div'>,\n Pick<FormFieldContextState, 'name' | 'state' | 'isRequired'> {\n /**\n * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n */\n asChild?: boolean\n /**\n * When `true`, prevents the user from interacting.\n */\n disabled?: boolean\n /**\n * Sets the component as interactive or not.\n */\n readOnly?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const FormField = ({\n className,\n disabled = false,\n readOnly = false,\n name,\n state,\n isRequired = false,\n asChild = false,\n ref,\n ...others\n}: FormFieldProps) => {\n const id = `${ID_PREFIX}-${useId()}`\n const Component = asChild ? Slot : 'div'\n\n return (\n <FormFieldProvider\n id={id}\n name={name}\n isRequired={isRequired}\n disabled={disabled}\n readOnly={readOnly}\n state={state}\n >\n <Component\n ref={ref}\n data-spark-component=\"form-field\"\n className={cx(className, 'gap-sm flex flex-col')}\n {...others}\n />\n </FormFieldProvider>\n )\n}\n\nFormField.displayName = 'FormField'\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n cloneElement,\n HTMLAttributes,\n isValidElement,\n PropsWithChildren,\n ReactNode,\n Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n asChild: boolean | undefined,\n children: ReactNode,\n callback: (children: ReactNode) => ReactNode\n) => {\n if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n return isValidElement(children)\n ? cloneElement(\n children,\n undefined,\n callback((children.props as { children: ReactNode }).children)\n )\n : null\n}\n","import { createContext, useContext } from 'react'\n\nexport interface FormFieldContextState {\n /**\n * Generated id for the input component.\n */\n id: string\n /**\n * Generated id for the label component.\n */\n labelId?: string\n /**\n * The name of the input. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * A set of ids separated by a space used to describe the input component given by a set of messages.\n */\n description?: string\n /**\n * Disables the field and its associated input\n */\n disabled?: boolean\n /**\n * Marks the field and its associated input as read only\n */\n readOnly?: boolean\n /**\n * The validation state of the input.\n */\n state?: 'error' | 'success' | 'alert'\n /**\n * If true, the form field will be invalid.\n */\n isInvalid?: boolean\n /**\n * If true, the form field will be required.\n */\n isRequired?: boolean\n /**\n * Callback used to store a descriptive message.\n */\n onMessageIdAdd: (id: string) => void\n /**\n * Callback used to remove a descriptive message.\n */\n onMessageIdRemove: (id: string) => void\n}\n\nexport const FormFieldContext = createContext<FormFieldContextState | null>(null)\n\nexport const ID_PREFIX = ':form-field'\n\nexport const useFormField = () => {\n const context = useContext(FormFieldContext)\n\n if (!context) {\n throw Error('useFormField must be used within a FormField provider')\n }\n\n return context\n}\n","import { ReactNode, useCallback, useId, useMemo, useState } from 'react'\n\nimport { FormFieldContext, FormFieldContextState, ID_PREFIX } from './FormFieldContext'\n\nexport interface FormFieldProviderProps\n extends Pick<\n FormFieldContextState,\n 'id' | 'name' | 'disabled' | 'readOnly' | 'state' | 'isRequired'\n > {\n children: ReactNode\n}\n\nexport const FormFieldProvider = ({\n id,\n name,\n disabled = false,\n readOnly = false,\n state,\n isRequired,\n children,\n}: FormFieldProviderProps) => {\n const labelId = `${ID_PREFIX}-label-${useId()}`\n const [messageIds, setMessageIds] = useState<string[]>([])\n const description = messageIds.length > 0 ? messageIds.join(' ') : undefined\n\n const handleMessageIdAdd = useCallback((msgId: string) => {\n setMessageIds(ids => [...ids, msgId])\n }, [])\n\n const handleMessageIdRemove = useCallback((msgId: string) => {\n setMessageIds(ids => ids.filter(current => current !== msgId))\n }, [])\n\n const value = useMemo(() => {\n const isInvalid = state === 'error'\n\n return {\n id,\n labelId,\n name,\n disabled,\n readOnly,\n state,\n isRequired,\n isInvalid,\n description,\n onMessageIdAdd: handleMessageIdAdd,\n onMessageIdRemove: handleMessageIdRemove,\n }\n }, [\n id,\n labelId,\n name,\n disabled,\n readOnly,\n description,\n state,\n isRequired,\n handleMessageIdAdd,\n handleMessageIdRemove,\n ])\n\n return <FormFieldContext.Provider value={value}>{children}</FormFieldContext.Provider>\n}\n\nFormFieldProvider.displayName = 'FormFieldProvider'\n","import { AlertOutline } from '@spark-ui/icons/AlertOutline'\nimport { Check } from '@spark-ui/icons/Check'\nimport { WarningOutline } from '@spark-ui/icons/WarningOutline'\nimport { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport interface FormFieldStateMessageProps extends FormFieldMessageProps {\n state: 'error' | 'alert' | 'success'\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldStateMessage = ({\n className,\n state,\n children,\n ref,\n ...others\n}: FormFieldStateMessageProps) => {\n const field = useFormField()\n\n if (field.state !== state) {\n return null\n }\n\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-state-message\"\n className={cx(\n 'gap-sm flex items-center',\n state === 'error' ? 'text-error' : 'text-on-surface/dim-1',\n className\n )}\n {...others}\n >\n {state === 'alert' && (\n <Icon size=\"sm\">\n <WarningOutline />\n </Icon>\n )}\n {state === 'error' && (\n <Icon size=\"sm\" intent=\"error\">\n <AlertOutline />\n </Icon>\n )}\n {state === 'success' && (\n <Icon size=\"sm\">\n <Check />\n </Icon>\n )}\n\n {children}\n </FormFieldMessage>\n )\n}\n\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\n","import { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n /**\n * The svg icon that will be wrapped\n */\n children: ReactNode\n /**\n * The accessible label for the icon. This label will be visually hidden but announced to screen\n * reader users, similar to `alt` text for `img` tags.\n */\n label?: string\n}\n\nexport const Icon = ({\n label,\n className,\n size = 'current',\n intent = 'current',\n children,\n ...others\n}: IconProps) => {\n const child = Children.only(children)\n\n return (\n <>\n {cloneElement(child as ReactElement<Record<string, any>>, {\n className: iconStyles({ className, size, intent }),\n 'data-spark-component': 'icon',\n 'aria-hidden': 'true',\n focusable: 'false',\n ...others,\n })}\n\n {label && <VisuallyHidden>{label}</VisuallyHidden>}\n </>\n )\n}\n\nIcon.displayName = 'Icon'\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n const Component = asChild ? Slot : 'span'\n\n return (\n <Component\n {...props}\n ref={ref}\n style={{\n // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n whiteSpace: 'nowrap',\n wordWrap: 'normal',\n ...props.style,\n }}\n />\n )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n variants: {\n /**\n * Color scheme of the icon.\n */\n intent: makeVariants<\n 'intent',\n [\n 'current',\n 'main',\n 'support',\n 'accent',\n 'basic',\n 'success',\n 'alert',\n 'error',\n 'info',\n 'neutral',\n ]\n >({\n current: ['text-current'],\n main: ['text-main'],\n support: ['text-support'],\n accent: ['text-accent'],\n basic: ['text-basic'],\n success: ['text-success'],\n alert: ['text-alert'],\n error: ['text-error'],\n info: ['text-info'],\n neutral: ['text-neutral'],\n }),\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n current: ['u-current-font-size'],\n sm: ['w-sz-16', 'h-sz-16'],\n md: ['w-sz-24', 'h-sz-24'],\n lg: ['w-sz-32', 'h-sz-32'],\n xl: ['w-sz-40', 'h-sz-40'],\n }),\n },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useId } from 'react'\n\nimport { ID_PREFIX, useFormField } from './FormFieldContext'\n\nexport type FormFieldMessageProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldMessage = ({\n id: idProp,\n className,\n ref,\n ...others\n}: FormFieldMessageProps) => {\n const { onMessageIdAdd, onMessageIdRemove } = useFormField()\n const currentId = `${ID_PREFIX}-message-${useId()}`\n const id = idProp || currentId\n\n useEffect(() => {\n onMessageIdAdd(id)\n\n return () => {\n onMessageIdRemove(id)\n }\n }, [id, onMessageIdAdd, onMessageIdRemove])\n\n return (\n <span\n ref={ref}\n id={id}\n data-spark-component=\"form-field-message\"\n className={cx(className, 'text-caption')}\n {...others}\n />\n )\n}\n\nFormFieldMessage.displayName = 'FormField.Message'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldAlertMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldAlertMessage = ({ ref, ...props }: FormFieldAlertMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-alert-message\"\n state=\"alert\"\n {...props}\n />\n )\n}\n\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useState } from 'react'\n\nimport { FormFieldMessage } from './FormFieldMessage'\n\nexport type FormFieldCharactersCountProps = ComponentPropsWithoutRef<'span'> & {\n /**\n * This description is for the screen reader, read when the input is focused.\n */\n description?: string\n /**\n * The live announcement is for the screen read after a delay once the input value changes.\n */\n liveAnnouncement?: ({ remainingChars }: { remainingChars: number }) => string\n /**\n * Current value for the input this component belongs to.\n */\n value?: string\n /**\n * Maximum numeric value to be displayed.\n */\n maxLength: number\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldCharactersCount = ({\n className,\n value = '',\n maxLength,\n description,\n liveAnnouncement,\n ref,\n ...others\n}: FormFieldCharactersCountProps) => {\n const [throttledValue, setThrottledValue] = useState(value)\n\n /**\n * The value is throttled to avoid spamming the aria-live region (and consequently the screen reader).\n */\n useEffect(() => {\n const timeoutId = setTimeout(() => {\n setThrottledValue(value)\n }, 1000)\n\n return () => clearTimeout(timeoutId)\n }, [value])\n\n return (\n <span className=\"ml-auto self-start\">\n {description && (\n <FormFieldMessage className=\"default:sr-only\">{description}</FormFieldMessage>\n )}\n <span\n ref={ref}\n aria-hidden\n data-spark-component=\"form-field-characters-count\"\n className={cx(className, 'text-caption', 'text-neutral')}\n {...others}\n >\n {`${value.length}/${maxLength}`}\n </span>\n\n {liveAnnouncement && (\n <span className=\"sr-only\" aria-live=\"polite\">\n {liveAnnouncement({ remainingChars: maxLength - throttledValue.length })}\n </span>\n )}\n </span>\n )\n}\n\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n","import { ReactNode, useContext } from 'react'\n\nimport { FormFieldContext, FormFieldContextState } from './FormFieldContext'\n\ntype State = Partial<\n Pick<\n FormFieldContextState,\n | 'id'\n | 'name'\n | 'description'\n | 'labelId'\n | 'disabled'\n | 'readOnly'\n | 'state'\n | 'isInvalid'\n | 'isRequired'\n >\n>\n\nexport interface FormFieldControlProps {\n children: (state: State) => ReactNode\n}\n\nexport const useFormFieldControl = () => {\n const { id, name, description, disabled, readOnly, state, labelId, isInvalid, isRequired } =\n useContext(FormFieldContext) || {}\n\n return {\n id,\n name,\n description,\n disabled,\n readOnly,\n state,\n labelId,\n isInvalid,\n isRequired,\n } as State\n}\n\nexport const FormFieldControl = ({ children }: FormFieldControlProps) => {\n const props = useFormFieldControl()\n\n return <>{children(props)}</>\n}\n\nFormFieldControl.displayName = 'FormField.Control'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldErrorMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldErrorMessage = ({ ref, ...props }: FormFieldErrorMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-error-message\"\n state=\"error\"\n {...props}\n />\n )\n}\n\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport type FormFieldHelperMessageProps = FormFieldMessageProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldHelperMessage = ({\n className,\n ref,\n ...others\n}: FormFieldHelperMessageProps) => {\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-helper-message\"\n className={cx('text-on-surface/dim-1', className)}\n {...others}\n />\n )\n}\n\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, Ref } from 'react'\n\nimport { Label, LabelProps } from '../label'\nimport { Slottable } from '../slot'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\n\nexport interface FormFieldLabelProps extends LabelProps {\n /**\n * Element shown when the input is required inside the label.\n */\n requiredIndicator?: ReactNode\n ref?: Ref<HTMLLabelElement>\n}\n\nexport const FormFieldLabel = ({\n htmlFor: htmlForProp,\n className,\n children,\n requiredIndicator = <FormFieldRequiredIndicator />,\n asChild,\n ref,\n ...others\n}: FormFieldLabelProps) => {\n const control = useFormField()\n\n const { disabled, labelId, isRequired } = control\n const htmlFor = asChild ? undefined : htmlForProp || control.id\n\n return (\n <Label\n ref={ref}\n id={labelId}\n data-spark-component=\"form-field-label\"\n htmlFor={htmlFor}\n className={cx(className, disabled ? 'text-on-surface/dim-3 pointer-events-none' : undefined)}\n asChild={asChild}\n {...others}\n >\n <>\n <Slottable>{children}</Slottable>\n {isRequired && requiredIndicator}\n </>\n </Label>\n )\n}\n\nFormFieldLabel.displayName = 'FormField.Label'\n","import { cx } from 'class-variance-authority'\nimport { Label as RadixLabel } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type LabelProps = RadixLabel.LabelProps & {\n ref?: Ref<HTMLLabelElement>\n}\n\nexport const Label = ({ className, ref, ...others }: LabelProps) => {\n return (\n <RadixLabel.Label\n ref={ref}\n data-spark-component=\"label\"\n className={cx('text-body-1', className)}\n {...others}\n />\n )\n}\n\nLabel.displayName = 'Label'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithRef } from 'react'\n\nexport type LabelRequiredIndicatorProps = ComponentPropsWithRef<'span'>\n\nexport const LabelRequiredIndicator = ({\n className,\n children = '*',\n ref,\n ...others\n}: LabelRequiredIndicatorProps) => {\n return (\n <span\n ref={ref}\n data-spark-component=\"label-required-indicator\"\n role=\"presentation\"\n aria-hidden=\"true\"\n className={cx(className, 'text-caption text-on-surface/dim-1')}\n {...others}\n >\n {children}\n </span>\n )\n}\n\nLabelRequiredIndicator.displayName = 'Label.RequiredIndicator'\n","import { Label as Root } from './Label'\nimport { LabelRequiredIndicator } from './LabelRequiredIndicator'\n\nexport const Label: typeof Root & {\n RequiredIndicator: typeof LabelRequiredIndicator\n} = Object.assign(Root, {\n RequiredIndicator: LabelRequiredIndicator,\n})\n\nLabel.displayName = 'Label'\nLabelRequiredIndicator.displayName = 'Label.RequiredIndicator'\n\nexport type { LabelProps } from './Label'\nexport type { LabelRequiredIndicatorProps } from './LabelRequiredIndicator'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Label, LabelRequiredIndicatorProps } from '../label'\n\nexport type FormFieldRequiredIndicatorProps = LabelRequiredIndicatorProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldRequiredIndicator = ({\n className,\n ref,\n ...props\n}: FormFieldRequiredIndicatorProps) => {\n return <Label.RequiredIndicator ref={ref} className={cx('ml-sm', className)} {...props} />\n}\n\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldSuccessMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldSuccessMessage = ({ ref, ...props }: FormFieldSuccessMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-success-message\"\n state=\"success\"\n {...props}\n />\n )\n}\n\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\n"],"mappings":"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","names":["FormField","import_react","RadixSlot","import_react","import_react","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_react","import_jsx_runtime","import_react","import_jsx_runtime","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_class_variance_authority","import_class_variance_authority","import_radix_ui","import_jsx_runtime","RadixLabel","import_class_variance_authority","import_jsx_runtime","Label","import_class_variance_authority","import_jsx_runtime","Label","import_jsx_runtime","Label","import_jsx_runtime","FormField"]}
@@ -224,7 +224,7 @@ var FormFieldCharactersCount = ({
224
224
  }, 1e3);
225
225
  return () => clearTimeout(timeoutId);
226
226
  }, [value]);
227
- return /* @__PURE__ */ jsxs2("span", { className: "ml-auto self-end", children: [
227
+ return /* @__PURE__ */ jsxs2("span", { className: "ml-auto self-start", children: [
228
228
  description && /* @__PURE__ */ jsx6(FormFieldMessage, { className: "default:sr-only", children: description }),
229
229
  /* @__PURE__ */ jsx6(
230
230
  "span",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/form-field/FormField.tsx","../../src/form-field/FormFieldContext.tsx","../../src/form-field/FormFieldProvider.tsx","../../src/form-field/FormFieldStateMessage.tsx","../../src/form-field/FormFieldMessage.tsx","../../src/form-field/FormFieldAlertMessage.tsx","../../src/form-field/FormFieldCharactersCount.tsx","../../src/form-field/FormFieldControl.tsx","../../src/form-field/FormFieldErrorMessage.tsx","../../src/form-field/FormFieldHelperMessage.tsx","../../src/form-field/FormFieldLabel.tsx","../../src/form-field/FormFieldRequiredIndicator.tsx","../../src/form-field/FormFieldSuccessMessage.tsx","../../src/form-field/index.ts"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useId } from 'react'\n\nimport { Slot } from '../slot'\nimport { FormFieldContextState, ID_PREFIX } from './FormFieldContext'\nimport { FormFieldProvider } from './FormFieldProvider'\n\nexport interface FormFieldProps\n extends ComponentPropsWithoutRef<'div'>,\n Pick<FormFieldContextState, 'name' | 'state' | 'isRequired'> {\n /**\n * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n */\n asChild?: boolean\n /**\n * When `true`, prevents the user from interacting.\n */\n disabled?: boolean\n /**\n * Sets the component as interactive or not.\n */\n readOnly?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const FormField = ({\n className,\n disabled = false,\n readOnly = false,\n name,\n state,\n isRequired = false,\n asChild = false,\n ref,\n ...others\n}: FormFieldProps) => {\n const id = `${ID_PREFIX}-${useId()}`\n const Component = asChild ? Slot : 'div'\n\n return (\n <FormFieldProvider\n id={id}\n name={name}\n isRequired={isRequired}\n disabled={disabled}\n readOnly={readOnly}\n state={state}\n >\n <Component\n ref={ref}\n data-spark-component=\"form-field\"\n className={cx(className, 'gap-sm flex flex-col')}\n {...others}\n />\n </FormFieldProvider>\n )\n}\n\nFormField.displayName = 'FormField'\n","import { createContext, useContext } from 'react'\n\nexport interface FormFieldContextState {\n /**\n * Generated id for the input component.\n */\n id: string\n /**\n * Generated id for the label component.\n */\n labelId?: string\n /**\n * The name of the input. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * A set of ids separated by a space used to describe the input component given by a set of messages.\n */\n description?: string\n /**\n * Disables the field and its associated input\n */\n disabled?: boolean\n /**\n * Marks the field and its associated input as read only\n */\n readOnly?: boolean\n /**\n * The validation state of the input.\n */\n state?: 'error' | 'success' | 'alert'\n /**\n * If true, the form field will be invalid.\n */\n isInvalid?: boolean\n /**\n * If true, the form field will be required.\n */\n isRequired?: boolean\n /**\n * Callback used to store a descriptive message.\n */\n onMessageIdAdd: (id: string) => void\n /**\n * Callback used to remove a descriptive message.\n */\n onMessageIdRemove: (id: string) => void\n}\n\nexport const FormFieldContext = createContext<FormFieldContextState | null>(null)\n\nexport const ID_PREFIX = ':form-field'\n\nexport const useFormField = () => {\n const context = useContext(FormFieldContext)\n\n if (!context) {\n throw Error('useFormField must be used within a FormField provider')\n }\n\n return context\n}\n","import { ReactNode, useCallback, useId, useMemo, useState } from 'react'\n\nimport { FormFieldContext, FormFieldContextState, ID_PREFIX } from './FormFieldContext'\n\nexport interface FormFieldProviderProps\n extends Pick<\n FormFieldContextState,\n 'id' | 'name' | 'disabled' | 'readOnly' | 'state' | 'isRequired'\n > {\n children: ReactNode\n}\n\nexport const FormFieldProvider = ({\n id,\n name,\n disabled = false,\n readOnly = false,\n state,\n isRequired,\n children,\n}: FormFieldProviderProps) => {\n const labelId = `${ID_PREFIX}-label-${useId()}`\n const [messageIds, setMessageIds] = useState<string[]>([])\n const description = messageIds.length > 0 ? messageIds.join(' ') : undefined\n\n const handleMessageIdAdd = useCallback((msgId: string) => {\n setMessageIds(ids => [...ids, msgId])\n }, [])\n\n const handleMessageIdRemove = useCallback((msgId: string) => {\n setMessageIds(ids => ids.filter(current => current !== msgId))\n }, [])\n\n const value = useMemo(() => {\n const isInvalid = state === 'error'\n\n return {\n id,\n labelId,\n name,\n disabled,\n readOnly,\n state,\n isRequired,\n isInvalid,\n description,\n onMessageIdAdd: handleMessageIdAdd,\n onMessageIdRemove: handleMessageIdRemove,\n }\n }, [\n id,\n labelId,\n name,\n disabled,\n readOnly,\n description,\n state,\n isRequired,\n handleMessageIdAdd,\n handleMessageIdRemove,\n ])\n\n return <FormFieldContext.Provider value={value}>{children}</FormFieldContext.Provider>\n}\n\nFormFieldProvider.displayName = 'FormFieldProvider'\n","import { AlertOutline } from '@spark-ui/icons/AlertOutline'\nimport { Check } from '@spark-ui/icons/Check'\nimport { WarningOutline } from '@spark-ui/icons/WarningOutline'\nimport { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport interface FormFieldStateMessageProps extends FormFieldMessageProps {\n state: 'error' | 'alert' | 'success'\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldStateMessage = ({\n className,\n state,\n children,\n ref,\n ...others\n}: FormFieldStateMessageProps) => {\n const field = useFormField()\n\n if (field.state !== state) {\n return null\n }\n\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-state-message\"\n className={cx(\n 'gap-sm flex items-center',\n state === 'error' ? 'text-error' : 'text-on-surface/dim-1',\n className\n )}\n {...others}\n >\n {state === 'alert' && (\n <Icon size=\"sm\">\n <WarningOutline />\n </Icon>\n )}\n {state === 'error' && (\n <Icon size=\"sm\" intent=\"error\">\n <AlertOutline />\n </Icon>\n )}\n {state === 'success' && (\n <Icon size=\"sm\">\n <Check />\n </Icon>\n )}\n\n {children}\n </FormFieldMessage>\n )\n}\n\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useId } from 'react'\n\nimport { ID_PREFIX, useFormField } from './FormFieldContext'\n\nexport type FormFieldMessageProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldMessage = ({\n id: idProp,\n className,\n ref,\n ...others\n}: FormFieldMessageProps) => {\n const { onMessageIdAdd, onMessageIdRemove } = useFormField()\n const currentId = `${ID_PREFIX}-message-${useId()}`\n const id = idProp || currentId\n\n useEffect(() => {\n onMessageIdAdd(id)\n\n return () => {\n onMessageIdRemove(id)\n }\n }, [id, onMessageIdAdd, onMessageIdRemove])\n\n return (\n <span\n ref={ref}\n id={id}\n data-spark-component=\"form-field-message\"\n className={cx(className, 'text-caption')}\n {...others}\n />\n )\n}\n\nFormFieldMessage.displayName = 'FormField.Message'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldAlertMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldAlertMessage = ({ ref, ...props }: FormFieldAlertMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-alert-message\"\n state=\"alert\"\n {...props}\n />\n )\n}\n\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useState } from 'react'\n\nimport { FormFieldMessage } from './FormFieldMessage'\n\nexport type FormFieldCharactersCountProps = ComponentPropsWithoutRef<'span'> & {\n /**\n * This description is for the screen reader, read when the input is focused.\n */\n description?: string\n /**\n * The live announcement is for the screen read after a delay once the input value changes.\n */\n liveAnnouncement?: ({ remainingChars }: { remainingChars: number }) => string\n /**\n * Current value for the input this component belongs to.\n */\n value?: string\n /**\n * Maximum numeric value to be displayed.\n */\n maxLength: number\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldCharactersCount = ({\n className,\n value = '',\n maxLength,\n description,\n liveAnnouncement,\n ref,\n ...others\n}: FormFieldCharactersCountProps) => {\n const [throttledValue, setThrottledValue] = useState(value)\n\n /**\n * The value is throttled to avoid spamming the aria-live region (and consequently the screen reader).\n */\n useEffect(() => {\n const timeoutId = setTimeout(() => {\n setThrottledValue(value)\n }, 1000)\n\n return () => clearTimeout(timeoutId)\n }, [value])\n\n return (\n <span className=\"ml-auto self-end\">\n {description && (\n <FormFieldMessage className=\"default:sr-only\">{description}</FormFieldMessage>\n )}\n <span\n ref={ref}\n aria-hidden\n data-spark-component=\"form-field-characters-count\"\n className={cx(className, 'text-caption', 'text-neutral')}\n {...others}\n >\n {`${value.length}/${maxLength}`}\n </span>\n\n {liveAnnouncement && (\n <span className=\"sr-only\" aria-live=\"polite\">\n {liveAnnouncement({ remainingChars: maxLength - throttledValue.length })}\n </span>\n )}\n </span>\n )\n}\n\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n","import { ReactNode, useContext } from 'react'\n\nimport { FormFieldContext, FormFieldContextState } from './FormFieldContext'\n\ntype State = Partial<\n Pick<\n FormFieldContextState,\n | 'id'\n | 'name'\n | 'description'\n | 'labelId'\n | 'disabled'\n | 'readOnly'\n | 'state'\n | 'isInvalid'\n | 'isRequired'\n >\n>\n\nexport interface FormFieldControlProps {\n children: (state: State) => ReactNode\n}\n\nexport const useFormFieldControl = () => {\n const { id, name, description, disabled, readOnly, state, labelId, isInvalid, isRequired } =\n useContext(FormFieldContext) || {}\n\n return {\n id,\n name,\n description,\n disabled,\n readOnly,\n state,\n labelId,\n isInvalid,\n isRequired,\n } as State\n}\n\nexport const FormFieldControl = ({ children }: FormFieldControlProps) => {\n const props = useFormFieldControl()\n\n return <>{children(props)}</>\n}\n\nFormFieldControl.displayName = 'FormField.Control'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldErrorMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldErrorMessage = ({ ref, ...props }: FormFieldErrorMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-error-message\"\n state=\"error\"\n {...props}\n />\n )\n}\n\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport type FormFieldHelperMessageProps = FormFieldMessageProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldHelperMessage = ({\n className,\n ref,\n ...others\n}: FormFieldHelperMessageProps) => {\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-helper-message\"\n className={cx('text-on-surface/dim-1', className)}\n {...others}\n />\n )\n}\n\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, Ref } from 'react'\n\nimport { Label, LabelProps } from '../label'\nimport { Slottable } from '../slot'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\n\nexport interface FormFieldLabelProps extends LabelProps {\n /**\n * Element shown when the input is required inside the label.\n */\n requiredIndicator?: ReactNode\n ref?: Ref<HTMLLabelElement>\n}\n\nexport const FormFieldLabel = ({\n htmlFor: htmlForProp,\n className,\n children,\n requiredIndicator = <FormFieldRequiredIndicator />,\n asChild,\n ref,\n ...others\n}: FormFieldLabelProps) => {\n const control = useFormField()\n\n const { disabled, labelId, isRequired } = control\n const htmlFor = asChild ? undefined : htmlForProp || control.id\n\n return (\n <Label\n ref={ref}\n id={labelId}\n data-spark-component=\"form-field-label\"\n htmlFor={htmlFor}\n className={cx(className, disabled ? 'text-on-surface/dim-3 pointer-events-none' : undefined)}\n asChild={asChild}\n {...others}\n >\n <>\n <Slottable>{children}</Slottable>\n {isRequired && requiredIndicator}\n </>\n </Label>\n )\n}\n\nFormFieldLabel.displayName = 'FormField.Label'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Label, LabelRequiredIndicatorProps } from '../label'\n\nexport type FormFieldRequiredIndicatorProps = LabelRequiredIndicatorProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldRequiredIndicator = ({\n className,\n ref,\n ...props\n}: FormFieldRequiredIndicatorProps) => {\n return <Label.RequiredIndicator ref={ref} className={cx('ml-sm', className)} {...props} />\n}\n\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldSuccessMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldSuccessMessage = ({ ref, ...props }: FormFieldSuccessMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-success-message\"\n state=\"success\"\n {...props}\n />\n )\n}\n\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\n","import { FormField as Root } from './FormField'\nimport { FormFieldAlertMessage } from './FormFieldAlertMessage'\nimport { FormFieldCharactersCount } from './FormFieldCharactersCount'\nimport { FormFieldControl } from './FormFieldControl'\nimport { FormFieldErrorMessage } from './FormFieldErrorMessage'\nimport { FormFieldHelperMessage } from './FormFieldHelperMessage'\nimport { FormFieldLabel } from './FormFieldLabel'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\nimport { FormFieldStateMessage } from './FormFieldStateMessage'\nimport { FormFieldSuccessMessage } from './FormFieldSuccessMessage'\n\nexport const FormField: typeof Root & {\n Label: typeof FormFieldLabel\n Control: typeof FormFieldControl\n StateMessage: typeof FormFieldStateMessage\n SuccessMessage: typeof FormFieldSuccessMessage\n AlertMessage: typeof FormFieldAlertMessage\n ErrorMessage: typeof FormFieldErrorMessage\n HelperMessage: typeof FormFieldHelperMessage\n RequiredIndicator: typeof FormFieldRequiredIndicator\n CharactersCount: typeof FormFieldCharactersCount\n} = Object.assign(Root, {\n Label: FormFieldLabel,\n Control: FormFieldControl,\n StateMessage: FormFieldStateMessage,\n SuccessMessage: FormFieldSuccessMessage,\n AlertMessage: FormFieldAlertMessage,\n ErrorMessage: FormFieldErrorMessage,\n HelperMessage: FormFieldHelperMessage,\n RequiredIndicator: FormFieldRequiredIndicator,\n CharactersCount: FormFieldCharactersCount,\n})\n\nFormField.displayName = 'FormField'\nFormFieldLabel.displayName = 'FormField.Label'\nFormFieldControl.displayName = 'FormField.Control'\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n\nexport { type FormFieldProps } from './FormField'\nexport { type FormFieldStateMessageProps } from './FormFieldStateMessage'\nexport { type FormFieldControl, useFormFieldControl } from './FormFieldControl'\nexport { type FormFieldHelperMessageProps } from './FormFieldHelperMessage'\nexport { type FormFieldSuccessMessageProps } from './FormFieldSuccessMessage'\nexport { type FormFieldAlertMessageProps } from './FormFieldAlertMessage'\nexport { type FormFieldErrorMessageProps } from './FormFieldErrorMessage'\nexport { type FormFieldLabelProps } from './FormFieldLabel'\nexport { type FormFieldRequiredIndicatorProps } from './FormFieldRequiredIndicator'\nexport { type FormFieldCharactersCountProps } from './FormFieldCharactersCount'\n"],"mappings":"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","names":["useId","jsx","useId","cx","cx","useId","jsx","useId","cx","jsx","cx","jsx","cx","useEffect","useState","jsx","jsxs","useState","useEffect","cx","useContext","jsx","useContext","jsx","cx","jsx","cx","cx","cx","jsx","cx","Fragment","jsx","jsxs","cx","jsx","FormField"]}
1
+ {"version":3,"sources":["../../src/form-field/FormField.tsx","../../src/form-field/FormFieldContext.tsx","../../src/form-field/FormFieldProvider.tsx","../../src/form-field/FormFieldStateMessage.tsx","../../src/form-field/FormFieldMessage.tsx","../../src/form-field/FormFieldAlertMessage.tsx","../../src/form-field/FormFieldCharactersCount.tsx","../../src/form-field/FormFieldControl.tsx","../../src/form-field/FormFieldErrorMessage.tsx","../../src/form-field/FormFieldHelperMessage.tsx","../../src/form-field/FormFieldLabel.tsx","../../src/form-field/FormFieldRequiredIndicator.tsx","../../src/form-field/FormFieldSuccessMessage.tsx","../../src/form-field/index.ts"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useId } from 'react'\n\nimport { Slot } from '../slot'\nimport { FormFieldContextState, ID_PREFIX } from './FormFieldContext'\nimport { FormFieldProvider } from './FormFieldProvider'\n\nexport interface FormFieldProps\n extends ComponentPropsWithoutRef<'div'>,\n Pick<FormFieldContextState, 'name' | 'state' | 'isRequired'> {\n /**\n * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n */\n asChild?: boolean\n /**\n * When `true`, prevents the user from interacting.\n */\n disabled?: boolean\n /**\n * Sets the component as interactive or not.\n */\n readOnly?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const FormField = ({\n className,\n disabled = false,\n readOnly = false,\n name,\n state,\n isRequired = false,\n asChild = false,\n ref,\n ...others\n}: FormFieldProps) => {\n const id = `${ID_PREFIX}-${useId()}`\n const Component = asChild ? Slot : 'div'\n\n return (\n <FormFieldProvider\n id={id}\n name={name}\n isRequired={isRequired}\n disabled={disabled}\n readOnly={readOnly}\n state={state}\n >\n <Component\n ref={ref}\n data-spark-component=\"form-field\"\n className={cx(className, 'gap-sm flex flex-col')}\n {...others}\n />\n </FormFieldProvider>\n )\n}\n\nFormField.displayName = 'FormField'\n","import { createContext, useContext } from 'react'\n\nexport interface FormFieldContextState {\n /**\n * Generated id for the input component.\n */\n id: string\n /**\n * Generated id for the label component.\n */\n labelId?: string\n /**\n * The name of the input. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * A set of ids separated by a space used to describe the input component given by a set of messages.\n */\n description?: string\n /**\n * Disables the field and its associated input\n */\n disabled?: boolean\n /**\n * Marks the field and its associated input as read only\n */\n readOnly?: boolean\n /**\n * The validation state of the input.\n */\n state?: 'error' | 'success' | 'alert'\n /**\n * If true, the form field will be invalid.\n */\n isInvalid?: boolean\n /**\n * If true, the form field will be required.\n */\n isRequired?: boolean\n /**\n * Callback used to store a descriptive message.\n */\n onMessageIdAdd: (id: string) => void\n /**\n * Callback used to remove a descriptive message.\n */\n onMessageIdRemove: (id: string) => void\n}\n\nexport const FormFieldContext = createContext<FormFieldContextState | null>(null)\n\nexport const ID_PREFIX = ':form-field'\n\nexport const useFormField = () => {\n const context = useContext(FormFieldContext)\n\n if (!context) {\n throw Error('useFormField must be used within a FormField provider')\n }\n\n return context\n}\n","import { ReactNode, useCallback, useId, useMemo, useState } from 'react'\n\nimport { FormFieldContext, FormFieldContextState, ID_PREFIX } from './FormFieldContext'\n\nexport interface FormFieldProviderProps\n extends Pick<\n FormFieldContextState,\n 'id' | 'name' | 'disabled' | 'readOnly' | 'state' | 'isRequired'\n > {\n children: ReactNode\n}\n\nexport const FormFieldProvider = ({\n id,\n name,\n disabled = false,\n readOnly = false,\n state,\n isRequired,\n children,\n}: FormFieldProviderProps) => {\n const labelId = `${ID_PREFIX}-label-${useId()}`\n const [messageIds, setMessageIds] = useState<string[]>([])\n const description = messageIds.length > 0 ? messageIds.join(' ') : undefined\n\n const handleMessageIdAdd = useCallback((msgId: string) => {\n setMessageIds(ids => [...ids, msgId])\n }, [])\n\n const handleMessageIdRemove = useCallback((msgId: string) => {\n setMessageIds(ids => ids.filter(current => current !== msgId))\n }, [])\n\n const value = useMemo(() => {\n const isInvalid = state === 'error'\n\n return {\n id,\n labelId,\n name,\n disabled,\n readOnly,\n state,\n isRequired,\n isInvalid,\n description,\n onMessageIdAdd: handleMessageIdAdd,\n onMessageIdRemove: handleMessageIdRemove,\n }\n }, [\n id,\n labelId,\n name,\n disabled,\n readOnly,\n description,\n state,\n isRequired,\n handleMessageIdAdd,\n handleMessageIdRemove,\n ])\n\n return <FormFieldContext.Provider value={value}>{children}</FormFieldContext.Provider>\n}\n\nFormFieldProvider.displayName = 'FormFieldProvider'\n","import { AlertOutline } from '@spark-ui/icons/AlertOutline'\nimport { Check } from '@spark-ui/icons/Check'\nimport { WarningOutline } from '@spark-ui/icons/WarningOutline'\nimport { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport interface FormFieldStateMessageProps extends FormFieldMessageProps {\n state: 'error' | 'alert' | 'success'\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldStateMessage = ({\n className,\n state,\n children,\n ref,\n ...others\n}: FormFieldStateMessageProps) => {\n const field = useFormField()\n\n if (field.state !== state) {\n return null\n }\n\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-state-message\"\n className={cx(\n 'gap-sm flex items-center',\n state === 'error' ? 'text-error' : 'text-on-surface/dim-1',\n className\n )}\n {...others}\n >\n {state === 'alert' && (\n <Icon size=\"sm\">\n <WarningOutline />\n </Icon>\n )}\n {state === 'error' && (\n <Icon size=\"sm\" intent=\"error\">\n <AlertOutline />\n </Icon>\n )}\n {state === 'success' && (\n <Icon size=\"sm\">\n <Check />\n </Icon>\n )}\n\n {children}\n </FormFieldMessage>\n )\n}\n\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useId } from 'react'\n\nimport { ID_PREFIX, useFormField } from './FormFieldContext'\n\nexport type FormFieldMessageProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldMessage = ({\n id: idProp,\n className,\n ref,\n ...others\n}: FormFieldMessageProps) => {\n const { onMessageIdAdd, onMessageIdRemove } = useFormField()\n const currentId = `${ID_PREFIX}-message-${useId()}`\n const id = idProp || currentId\n\n useEffect(() => {\n onMessageIdAdd(id)\n\n return () => {\n onMessageIdRemove(id)\n }\n }, [id, onMessageIdAdd, onMessageIdRemove])\n\n return (\n <span\n ref={ref}\n id={id}\n data-spark-component=\"form-field-message\"\n className={cx(className, 'text-caption')}\n {...others}\n />\n )\n}\n\nFormFieldMessage.displayName = 'FormField.Message'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldAlertMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldAlertMessage = ({ ref, ...props }: FormFieldAlertMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-alert-message\"\n state=\"alert\"\n {...props}\n />\n )\n}\n\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref, useEffect, useState } from 'react'\n\nimport { FormFieldMessage } from './FormFieldMessage'\n\nexport type FormFieldCharactersCountProps = ComponentPropsWithoutRef<'span'> & {\n /**\n * This description is for the screen reader, read when the input is focused.\n */\n description?: string\n /**\n * The live announcement is for the screen read after a delay once the input value changes.\n */\n liveAnnouncement?: ({ remainingChars }: { remainingChars: number }) => string\n /**\n * Current value for the input this component belongs to.\n */\n value?: string\n /**\n * Maximum numeric value to be displayed.\n */\n maxLength: number\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldCharactersCount = ({\n className,\n value = '',\n maxLength,\n description,\n liveAnnouncement,\n ref,\n ...others\n}: FormFieldCharactersCountProps) => {\n const [throttledValue, setThrottledValue] = useState(value)\n\n /**\n * The value is throttled to avoid spamming the aria-live region (and consequently the screen reader).\n */\n useEffect(() => {\n const timeoutId = setTimeout(() => {\n setThrottledValue(value)\n }, 1000)\n\n return () => clearTimeout(timeoutId)\n }, [value])\n\n return (\n <span className=\"ml-auto self-start\">\n {description && (\n <FormFieldMessage className=\"default:sr-only\">{description}</FormFieldMessage>\n )}\n <span\n ref={ref}\n aria-hidden\n data-spark-component=\"form-field-characters-count\"\n className={cx(className, 'text-caption', 'text-neutral')}\n {...others}\n >\n {`${value.length}/${maxLength}`}\n </span>\n\n {liveAnnouncement && (\n <span className=\"sr-only\" aria-live=\"polite\">\n {liveAnnouncement({ remainingChars: maxLength - throttledValue.length })}\n </span>\n )}\n </span>\n )\n}\n\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n","import { ReactNode, useContext } from 'react'\n\nimport { FormFieldContext, FormFieldContextState } from './FormFieldContext'\n\ntype State = Partial<\n Pick<\n FormFieldContextState,\n | 'id'\n | 'name'\n | 'description'\n | 'labelId'\n | 'disabled'\n | 'readOnly'\n | 'state'\n | 'isInvalid'\n | 'isRequired'\n >\n>\n\nexport interface FormFieldControlProps {\n children: (state: State) => ReactNode\n}\n\nexport const useFormFieldControl = () => {\n const { id, name, description, disabled, readOnly, state, labelId, isInvalid, isRequired } =\n useContext(FormFieldContext) || {}\n\n return {\n id,\n name,\n description,\n disabled,\n readOnly,\n state,\n labelId,\n isInvalid,\n isRequired,\n } as State\n}\n\nexport const FormFieldControl = ({ children }: FormFieldControlProps) => {\n const props = useFormFieldControl()\n\n return <>{children(props)}</>\n}\n\nFormFieldControl.displayName = 'FormField.Control'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldErrorMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldErrorMessage = ({ ref, ...props }: FormFieldErrorMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-error-message\"\n state=\"error\"\n {...props}\n />\n )\n}\n\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { FormFieldMessage, FormFieldMessageProps } from './FormFieldMessage'\n\nexport type FormFieldHelperMessageProps = FormFieldMessageProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldHelperMessage = ({\n className,\n ref,\n ...others\n}: FormFieldHelperMessageProps) => {\n return (\n <FormFieldMessage\n ref={ref}\n data-spark-component=\"form-field-helper-message\"\n className={cx('text-on-surface/dim-1', className)}\n {...others}\n />\n )\n}\n\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, Ref } from 'react'\n\nimport { Label, LabelProps } from '../label'\nimport { Slottable } from '../slot'\nimport { useFormField } from './FormFieldContext'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\n\nexport interface FormFieldLabelProps extends LabelProps {\n /**\n * Element shown when the input is required inside the label.\n */\n requiredIndicator?: ReactNode\n ref?: Ref<HTMLLabelElement>\n}\n\nexport const FormFieldLabel = ({\n htmlFor: htmlForProp,\n className,\n children,\n requiredIndicator = <FormFieldRequiredIndicator />,\n asChild,\n ref,\n ...others\n}: FormFieldLabelProps) => {\n const control = useFormField()\n\n const { disabled, labelId, isRequired } = control\n const htmlFor = asChild ? undefined : htmlForProp || control.id\n\n return (\n <Label\n ref={ref}\n id={labelId}\n data-spark-component=\"form-field-label\"\n htmlFor={htmlFor}\n className={cx(className, disabled ? 'text-on-surface/dim-3 pointer-events-none' : undefined)}\n asChild={asChild}\n {...others}\n >\n <>\n <Slottable>{children}</Slottable>\n {isRequired && requiredIndicator}\n </>\n </Label>\n )\n}\n\nFormFieldLabel.displayName = 'FormField.Label'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { Label, LabelRequiredIndicatorProps } from '../label'\n\nexport type FormFieldRequiredIndicatorProps = LabelRequiredIndicatorProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldRequiredIndicator = ({\n className,\n ref,\n ...props\n}: FormFieldRequiredIndicatorProps) => {\n return <Label.RequiredIndicator ref={ref} className={cx('ml-sm', className)} {...props} />\n}\n\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\n","import { Ref } from 'react'\n\nimport { FormFieldStateMessage, FormFieldStateMessageProps } from './FormFieldStateMessage'\n\nexport type FormFieldSuccessMessageProps = Omit<FormFieldStateMessageProps, 'state'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const FormFieldSuccessMessage = ({ ref, ...props }: FormFieldSuccessMessageProps) => {\n return (\n <FormFieldStateMessage\n ref={ref}\n data-spark-component=\"form-field-success-message\"\n state=\"success\"\n {...props}\n />\n )\n}\n\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\n","import { FormField as Root } from './FormField'\nimport { FormFieldAlertMessage } from './FormFieldAlertMessage'\nimport { FormFieldCharactersCount } from './FormFieldCharactersCount'\nimport { FormFieldControl } from './FormFieldControl'\nimport { FormFieldErrorMessage } from './FormFieldErrorMessage'\nimport { FormFieldHelperMessage } from './FormFieldHelperMessage'\nimport { FormFieldLabel } from './FormFieldLabel'\nimport { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'\nimport { FormFieldStateMessage } from './FormFieldStateMessage'\nimport { FormFieldSuccessMessage } from './FormFieldSuccessMessage'\n\nexport const FormField: typeof Root & {\n Label: typeof FormFieldLabel\n Control: typeof FormFieldControl\n StateMessage: typeof FormFieldStateMessage\n SuccessMessage: typeof FormFieldSuccessMessage\n AlertMessage: typeof FormFieldAlertMessage\n ErrorMessage: typeof FormFieldErrorMessage\n HelperMessage: typeof FormFieldHelperMessage\n RequiredIndicator: typeof FormFieldRequiredIndicator\n CharactersCount: typeof FormFieldCharactersCount\n} = Object.assign(Root, {\n Label: FormFieldLabel,\n Control: FormFieldControl,\n StateMessage: FormFieldStateMessage,\n SuccessMessage: FormFieldSuccessMessage,\n AlertMessage: FormFieldAlertMessage,\n ErrorMessage: FormFieldErrorMessage,\n HelperMessage: FormFieldHelperMessage,\n RequiredIndicator: FormFieldRequiredIndicator,\n CharactersCount: FormFieldCharactersCount,\n})\n\nFormField.displayName = 'FormField'\nFormFieldLabel.displayName = 'FormField.Label'\nFormFieldControl.displayName = 'FormField.Control'\nFormFieldStateMessage.displayName = 'FormField.StateMessage'\nFormFieldSuccessMessage.displayName = 'FormField.SuccessMessage'\nFormFieldAlertMessage.displayName = 'FormField.AlertMessage'\nFormFieldErrorMessage.displayName = 'FormField.ErrorMessage'\nFormFieldHelperMessage.displayName = 'FormField.HelperMessage'\nFormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'\nFormFieldCharactersCount.displayName = 'FormField.CharactersCount'\n\nexport { type FormFieldProps } from './FormField'\nexport { type FormFieldStateMessageProps } from './FormFieldStateMessage'\nexport { type FormFieldControl, useFormFieldControl } from './FormFieldControl'\nexport { type FormFieldHelperMessageProps } from './FormFieldHelperMessage'\nexport { type FormFieldSuccessMessageProps } from './FormFieldSuccessMessage'\nexport { type FormFieldAlertMessageProps } from './FormFieldAlertMessage'\nexport { type FormFieldErrorMessageProps } from './FormFieldErrorMessage'\nexport { type FormFieldLabelProps } from './FormFieldLabel'\nexport { type FormFieldRequiredIndicatorProps } from './FormFieldRequiredIndicator'\nexport { type FormFieldCharactersCountProps } from './FormFieldCharactersCount'\n"],"mappings":"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","names":["useId","jsx","useId","cx","cx","useId","jsx","useId","cx","jsx","cx","jsx","cx","useEffect","useState","jsx","jsxs","useState","useEffect","cx","useContext","jsx","useContext","jsx","cx","jsx","cx","cx","cx","jsx","cx","Fragment","jsx","jsxs","cx","jsx","FormField"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-ui/components",
3
- "version": "10.11.13",
3
+ "version": "10.11.14",
4
4
  "license": "MIT",
5
5
  "description": "Spark (Leboncoin design system) components.",
6
6
  "exports": {
@@ -53,9 +53,9 @@
53
53
  "@react-aria/toast": "^3.0.0-beta.18",
54
54
  "@react-stately/numberfield": "3.9.11",
55
55
  "@react-stately/toast": "^3.0.0-beta.7",
56
- "@spark-ui/hooks": "^10.11.13",
57
- "@spark-ui/icons": "^10.11.13",
58
- "@spark-ui/internal-utils": "^10.11.13",
56
+ "@spark-ui/hooks": "^10.11.14",
57
+ "@spark-ui/icons": "^10.11.14",
58
+ "@spark-ui/internal-utils": "^10.11.14",
59
59
  "@zag-js/pagination": "1.14.0",
60
60
  "@zag-js/react": "1.14.0",
61
61
  "class-variance-authority": "0.7.1",
@@ -82,5 +82,5 @@
82
82
  "url": "https://github.com/leboncoin/spark-web/issues?q=is%3Aopen+label%3A%22Component%3A+button%22"
83
83
  },
84
84
  "homepage": "https://sparkui.vercel.app",
85
- "gitHead": "07ad5d7ce91b5ef16bcd9a004bdc6767620f4c5d"
85
+ "gitHead": "158102a6210c915299bc43c814f758ae801b4328"
86
86
  }