@proyecto-viviana/ui 0.6.2 → 0.8.0-rc.0

package/dist/_chunk/numberfield.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"numberfield.jsx","names":[],"sources":["../../src/icon/ui-icons/Add.tsx","../../src/numberfield/index.tsx"],"sourcesContent":["/*\n * Auto-generated from the shipped @react-spectrum/s2 dist assets (SVGO-\n * optimized — pixel parity requires the shipped path data, not the raw\n * vendored .svg sources). Variants absent from the dist (Arrow, Gripper)\n * fall back to the vendored sources.\n * Do not edit by hand.\n */\n\nimport { type JSX } from \"solid-js\";\nimport { createUIIcon } from \"../spectrum-icon\";\n\nexport type AddProps = JSX.SvgSVGAttributes<SVGSVGElement> & {\n  size?: \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\";\n};\n\nfunction Add_XSSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"8\"\n      height=\"8\"\n      viewBox=\"0 0 8 8\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M6.625 3.078H4.922V1.375a.922.922 0 0 0-1.844 0v1.703H1.375a.922.922 0 0 0 0 1.844h1.703v1.703a.922.922 0 0 0 1.844 0V4.922h1.703a.922.922 0 0 0 0-1.844\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_SSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"8\"\n      height=\"8\"\n      viewBox=\"0 0 8 8\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7 3.04H4.96V1a.96.96 0 1 0-1.92 0v2.04H1a.96.96 0 1 0 0 1.92h2.04V7a.96.96 0 1 0 1.92 0V4.96H7a.96.96 0 1 0 0-1.92\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_MSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M8.5 4H6V1.5a1 1 0 1 0-2 0V4H1.5a1 1 0 1 0 0 2H4v2.5a1 1 0 1 0 2 0V6h2.5a1 1 0 1 0 0-2\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_LSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.021 4.959h-2.98v-2.98a1.04 1.04 0 1 0-2.082 0v2.98h-2.98a1.04 1.04 0 1 0 0 2.082h2.98v2.98a1.04 1.04 0 1 0 2.082 0v-2.98h2.98a1.04 1.04 0 1 0 0-2.082\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_XLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.61 4.915H7.085V1.39a1.084 1.084 0 1 0-2.17 0v3.525H1.39a1.084 1.084 0 1 0 0 2.17h3.525v3.525a1.084 1.084 0 1 0 2.17 0V7.085h3.525a1.084 1.084 0 1 0 0-2.17\"\n      />\n    </svg>\n  );\n}\n\nconst Add_XS = createUIIcon(Add_XSSvg);\nconst Add_S = createUIIcon(Add_SSvg);\nconst Add_M = createUIIcon(Add_MSvg);\nconst Add_L = createUIIcon(Add_LSvg);\nconst Add_XL = createUIIcon(Add_XLSvg);\n\nexport default function Add(props: AddProps): JSX.Element {\n  const { size = \"M\", class: className, width: _width, height: _height, ...rest } = props;\n  switch (size) {\n    case \"XS\":\n      return <Add_XS {...rest} class={className} />;\n    case \"S\":\n      return <Add_S {...rest} class={className} />;\n    case \"M\":\n      return <Add_M {...rest} class={className} />;\n    case \"L\":\n      return <Add_L {...rest} class={className} />;\n    case \"XL\":\n      return <Add_XL {...rest} class={className} />;\n    default:\n      return <Add_M {...rest} class={className} />;\n  }\n}\n\nexport const AddIcon = Add;\n","// @ts-nocheck\nimport {\n  type JSX,\n  createContext,\n  createSignal,\n  createUniqueId,\n  mergeProps,\n  splitProps,\n  Show,\n  useContext,\n} from \"solid-js\";\nimport {\n  NumberField as HeadlessNumberField,\n  NumberFieldLabel as HeadlessNumberFieldLabel,\n  NumberFieldGroup as HeadlessNumberFieldGroup,\n  NumberFieldInput as HeadlessNumberFieldInput,\n  NumberFieldIncrementButton as HeadlessNumberFieldIncrementButton,\n  NumberFieldDecrementButton as HeadlessNumberFieldDecrementButton,\n  NumberFieldContext as HeadlessNumberFieldContext,\n  type NumberFieldProps as HeadlessNumberFieldProps,\n  type NumberFieldRenderProps,\n  type NumberFieldInputRenderProps,\n  type NumberFieldButtonRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { StyleString } from \"../style\";\nimport { baseColor, focusRing, fontRelative, space, style } from \"../style\" with { type: \"macro\" };\nimport {\n  control,\n  controlBorderRadius,\n  controlFont,\n  field,\n  fieldInput,\n  fieldLabel,\n  getAllowedOverrides,\n} from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport AlertTriangleIcon from \"../icon/s2wf-icons/AlertTriangleIcon\";\nimport AsteriskIcon from \"../icon/ui-icons/Asterisk\";\nimport AddIcon from \"../icon/ui-icons/Add\";\nimport DashIcon from \"../icon/ui-icons/Dash\";\nimport { FieldPrefix, PrefixInputProvider } from \"../field/prefix\";\nimport { useProviderProps } from \"../provider\";\nimport { getSlottedContextProps, type SpectrumContextValue } from \"../button/spectrum-context\";\n\nexport type NumberFieldSize = \"S\" | \"M\" | \"L\" | \"XL\";\ntype S2NumberFieldSize = NumberFieldSize;\nexport type NumberFieldLabelPosition = \"top\" | \"side\";\nexport type NumberFieldLabelAlign = \"start\" | \"end\";\nexport type NumberFieldNecessityIndicator = \"icon\" | \"label\";\n\nexport interface NumberFieldProps extends Omit<\n  HeadlessNumberFieldProps,\n  \"class\" | \"style\" | \"children\" | \"label\"\n> {\n  /** The size of the number field. */\n  size?: NumberFieldSize;\n  /** Spectrum-defined generated classes. */\n  styles?: StyleString;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n  /** Backward-compatible class alias. Prefer UNSAFE_className for S2 parity. */\n  class?: string;\n  /** Label text for the input. */\n  label?: JSX.Element;\n  /** Description text shown below the input. */\n  description?: JSX.Element;\n  /** Error message shown when invalid. */\n  errorMessage?: JSX.Element;\n  /** Whether to hide the stepper buttons. */\n  hideStepper?: boolean;\n  /** Position of the label relative to the input. */\n  labelPosition?: NumberFieldLabelPosition;\n  /** Text alignment for side labels. */\n  labelAlign?: NumberFieldLabelAlign;\n  /** Whether required fields show an icon or text label. */\n  necessityIndicator?: NumberFieldNecessityIndicator;\n  /** An icon or text rendered before the input. */\n  prefix?: JSX.Element;\n}\n\nexport const NumberFieldContext = createContext<SpectrumContextValue<NumberFieldProps>>(null);\n\ninterface NumberFieldStyleProps extends NumberFieldRenderProps {\n  size?: S2NumberFieldSize;\n  labelPosition?: NumberFieldLabelPosition;\n  labelAlign?: NumberFieldLabelAlign;\n  isFocusWithin?: boolean;\n  isStepperHidden?: boolean;\n  isInForm?: boolean;\n}\n\nconst numberFieldRoot = style<NumberFieldStyleProps>(\n  {\n    ...field(),\n  },\n  getAllowedOverrides(),\n);\n\nconst numberFieldLabelWrapper = style<NumberFieldStyleProps>({\n  gridArea: \"label\",\n  display: \"inline\",\n  textAlign: {\n    labelAlign: {\n      start: \"start\",\n      end: \"end\",\n    },\n  },\n  paddingBottom: {\n    labelPosition: {\n      top: \"--field-gap\",\n    },\n  },\n  contain: {\n    labelPosition: {\n      top: \"inline-size\",\n    },\n  },\n});\n\nconst numberFieldLabel = style<NumberFieldStyleProps>({\n  ...fieldLabel(),\n});\n\nconst numberFieldGroup = style<NumberFieldStyleProps>({\n  ...focusRing(),\n  ...control({ shape: \"default\", register: \"matte\" }),\n  ...fieldInput(),\n  paddingStart: \"edge-to-text\",\n  paddingEnd: {\n    default: 0,\n    isStepperHidden: \"edge-to-text\",\n  },\n  transition: \"default\",\n  borderColor: {\n    default: \"well-border\",\n    forcedColors: \"ButtonBorder\",\n    isInvalid: {\n      default: baseColor(\"negative\"),\n      forcedColors: \"Mark\",\n    },\n    isFocusWithin: {\n      default: \"gray-900\",\n      isInvalid: \"negative-1000\",\n      forcedColors: \"Highlight\",\n    },\n    isDisabled: {\n      default: \"disabled\",\n      forcedColors: \"GrayText\",\n    },\n  },\n  backgroundColor: {\n    default: \"well\",\n    forcedColors: \"Field\",\n  },\n  color: {\n    default: baseColor(\"neutral\"),\n    forcedColors: \"ButtonText\",\n    isDisabled: {\n      default: \"disabled\",\n      forcedColors: \"GrayText\",\n    },\n  },\n  cursor: {\n    default: \"text\",\n    isDisabled: \"default\",\n  },\n});\n\nconst numberFieldInput = style({\n  padding: 0,\n  backgroundColor: \"transparent\",\n  color: {\n    default: \"inherit\",\n    \"::placeholder\": {\n      default: \"gray-600\",\n      forcedColors: \"GrayText\",\n    },\n  },\n  fontFamily: \"inherit\",\n  fontSize: \"inherit\",\n  fontWeight: \"inherit\",\n  flexGrow: 1,\n  flexShrink: 1,\n  minWidth: 0,\n  width: \"full\",\n  outlineStyle: \"none\",\n  borderStyle: \"none\",\n  // Upstream S2 NumberField renders the shared `<Input>` from `Field.tsx`, whose style\n  // ends in `truncate: true` (→ overflow:hidden; text-overflow:ellipsis; white-space:nowrap)\n  // — NOT `textAlign: 'start'`. The hardcoded `textAlign` was a self-inflicted divergence\n  // that dropped truncation; reverted to `truncate` to match the shared Input byte-for-byte.\n  truncate: true,\n});\n\nconst stepperContainer = style<NumberFieldStyleProps>({\n  display: \"flex\",\n  flexDirection: \"row\",\n  gap: {\n    size: {\n      S: 8,\n      M: 4,\n      L: 8,\n      XL: 8,\n    },\n  },\n  marginEnd: {\n    size: {\n      S: 2,\n      M: 4,\n      L: space(6),\n      XL: space(6),\n    },\n  },\n});\n\nconst inputButton = style<\n  NumberFieldButtonRenderProps & { size?: S2NumberFieldSize; type: \"decrement\" | \"increment\" }\n>({\n  ...controlBorderRadius(\"sm\"),\n  display: \"flex\",\n  outlineStyle: \"none\",\n  textAlign: \"center\",\n  borderStyle: \"none\",\n  alignItems: \"center\",\n  justifyContent: \"center\",\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32,\n    },\n  },\n  height: \"auto\",\n  marginStart: {\n    default: \"text-to-control\",\n    type: {\n      increment: 0,\n    },\n  },\n  aspectRatio: \"square\",\n  flexShrink: 0,\n  minHeight: 0,\n  transition: {\n    default: \"default\",\n    forcedColors: \"none\",\n  },\n  backgroundColor: {\n    default: baseColor(\"gray-100\"),\n    isDisabled: \"disabled\",\n    forcedColors: {\n      default: \"ButtonText\",\n      isHovered: \"Highlight\",\n      isDisabled: \"GrayText\",\n    },\n  },\n  color: {\n    default: baseColor(\"neutral\"),\n    isDisabled: \"disabled\",\n    forcedColors: {\n      default: \"ButtonFace\",\n    },\n  },\n  cursor: \"default\",\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n});\n\nconst helpTextStyles = style<NumberFieldStyleProps>({\n  gridArea: \"helptext\",\n  display: \"flex\",\n  alignItems: \"baseline\",\n  gap: \"text-to-visual\",\n  // Faithful to upstream `helpTextStyles` (S2 Field.tsx) which uses `font: controlFont()`\n  // — the full font shorthand (family, size, weight, line-height), not a bare fontSize\n  // map. The prior fontSize-only map left family/weight/line-height to cascade, producing\n  // a subpixel help-text rendering divergence (D3) vs React. Mirrors green `textFieldInput`\n  // helpTextStyles.\n  font: controlFont(),\n  color: {\n    default: \"neutral-subdued\",\n    isInvalid: {\n      default: \"negative\",\n      forcedColors: \"Mark\",\n    },\n    isDisabled: {\n      default: \"disabled\",\n      forcedColors: \"GrayText\",\n    },\n  },\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n  contain: \"inline-size\",\n  paddingTop: \"--field-gap\",\n  cursor: {\n    default: \"text\",\n    isDisabled: \"default\",\n  },\n});\n\nconst fieldErrorIcon = style({\n  size: fontRelative(20),\n  marginStart: \"text-to-visual\",\n  marginEnd: fontRelative(-2),\n  flexShrink: 0,\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: {\n      default: \"negative\",\n      forcedColors: \"Mark\",\n    },\n  },\n});\n\nconst requiredIcon = style({\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n});\n\nconst noWrap = style({\n  whiteSpace: \"nowrap\",\n});\n\n// Upstream S2 renders help text via the shared `<HelpText>`, whose description is a\n// `<Text slot=\"description\">` (a `<span>`), NOT a `<p>`: a `<p>` carries the UA\n// `margin` the hand-roll then had to zero out (see `helpTextStyles` — upstream's has\n// none), and an implicit `paragraph` role that a `<span>` does not. Reverted to match.\nfunction NumberFieldDescription(props: {\n  class?: string;\n  children?: JSX.Element;\n}): JSX.Element | null {\n  const context = useContext(HeadlessNumberFieldContext);\n  if (!context?.descriptionProps) return null;\n  const descriptionProps = () => {\n    const { ref: _ref, ...rest } = context.descriptionProps as Record<string, unknown>;\n    return rest;\n  };\n\n  return (\n    <span {...descriptionProps()} slot=\"description\" class={props.class}>\n      {props.children}\n    </span>\n  );\n}\n\n// Upstream S2's `<HelpText>` renders the error message via `<FieldError>` →\n// `<Text slot=\"errorMessage\">` (a `<span>`), not a `<p>`.\nfunction NumberFieldError(props: { class?: string; children?: JSX.Element }): JSX.Element | null {\n  const context = useContext(HeadlessNumberFieldContext);\n  if (!context?.errorMessageProps) return null;\n  const errorMessageProps = () => {\n    const { ref: _ref, ...rest } = context.errorMessageProps as Record<string, unknown>;\n    return rest;\n  };\n\n  return (\n    <span {...errorMessageProps()} slot=\"errorMessage\" class={props.class}>\n      {props.children}\n    </span>\n  );\n}\n\nfunction normalizeNumberFieldSize(size: NumberFieldSize | undefined): S2NumberFieldSize {\n  return size ?? \"M\";\n}\n\nfunction focusFieldInput(event: Event & { currentTarget: HTMLDivElement }) {\n  const target = event.target as Element | null;\n\n  if (target?.closest(\"button,input,textarea,[role='button']\")) {\n    return;\n  }\n\n  event.preventDefault();\n  event.currentTarget.querySelector<HTMLElement>(\"input\")?.focus();\n}\n\nfunction requiredIconStyle(size: S2NumberFieldSize): JSX.CSSProperties {\n  const pixelSize = size === \"L\" || size === \"XL\" ? 10 : 8;\n  return {\n    width: `${pixelSize}px`,\n    height: `${pixelSize}px`,\n  };\n}\n\nfunction buttonPressScaleStyle(\n  element: HTMLDivElement | undefined,\n  renderProps: NumberFieldButtonRenderProps,\n): JSX.CSSProperties {\n  const pressStyle = { \"will-change\": \"transform\" } as JSX.CSSProperties;\n\n  if (renderProps.isPressed && element) {\n    const { width, height } = element.getBoundingClientRect();\n    pressStyle.transform = `perspective(${Math.max(height, width / 3, 24)}px) translate3d(0, 0, -2px)`;\n  }\n\n  return pressStyle;\n}\n\n/**\n * NumberFields allow users to input number values with a keyboard or increment/decrement with step buttons.\n */\nexport function NumberField(props: NumberFieldProps): JSX.Element {\n  const providerProps = useProviderProps(props);\n  const contextProps = getSlottedContextProps(useContext(NumberFieldContext), props.slot);\n  const mergedProps = mergeProps(providerProps, contextProps ?? {}, props);\n  const [local, headlessProps] = splitProps(mergedProps, [\n    \"size\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"class\",\n    \"label\",\n    \"placeholder\",\n    \"description\",\n    \"errorMessage\",\n    \"hideStepper\",\n    \"onInput\",\n    \"labelPosition\",\n    \"labelAlign\",\n    \"necessityIndicator\",\n    \"prefix\",\n  ]);\n  const prefixId = createUniqueId();\n  const size = () => normalizeNumberFieldSize(local.size);\n  const labelPosition = () => local.labelPosition ?? \"top\";\n  const labelAlign = () => local.labelAlign ?? \"start\";\n  const necessityIndicator = () => local.necessityIndicator ?? \"icon\";\n  const [isFocusWithin, setIsFocusWithin] = createSignal(false);\n\n  let decrementButtonElement: HTMLDivElement | undefined;\n  let incrementButtonElement: HTMLDivElement | undefined;\n\n  // Match upstream's root style INVOCATION args exactly: S2 `NumberField.tsx` passes\n  // only `{ isInForm: !!formContext, labelPosition, size }` to `style(field(), …)(…)`\n  // — NOT the render-prop bag. `isDisabled`/`isFocused`/… are threaded DOWN to the\n  // FieldGroup/label/help text, not applied to the field grid. The grid's `field()` has\n  // no such conditions today, but spreading `…renderProps` here would silently light any\n  // future one; keep the arg set faithful (same lesson as SearchField's root-color fix).\n  const rootClassName = (_renderProps: NumberFieldRenderProps) =>\n    [\n      local.UNSAFE_className,\n      local.class,\n      numberFieldRoot(\n        {\n          size: size(),\n          labelPosition: labelPosition(),\n          isInForm: false,\n        },\n        local.styles,\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  const labelWrapperClass = () =>\n    numberFieldLabelWrapper({\n      size: size(),\n      labelPosition: labelPosition(),\n      labelAlign: labelAlign(),\n    });\n\n  const labelClass = (renderProps: NumberFieldRenderProps) =>\n    numberFieldLabel({\n      ...renderProps,\n      size: size(),\n      labelPosition: labelPosition(),\n    });\n\n  const groupClass = (renderProps: NumberFieldRenderProps) =>\n    numberFieldGroup({\n      ...renderProps,\n      size: size(),\n      isFocusWithin: isFocusWithin(),\n      isStepperHidden: local.hideStepper,\n    });\n\n  const stepperClass = () => stepperContainer({ size: size() });\n\n  const inputClass = (_renderProps: NumberFieldInputRenderProps) => numberFieldInput;\n\n  const buttonClass =\n    (type: \"decrement\" | \"increment\") => (renderProps: NumberFieldButtonRenderProps) =>\n      inputButton({\n        ...renderProps,\n        size: size(),\n        type,\n      });\n\n  const helpClass = (renderProps: NumberFieldRenderProps, isInvalid: boolean) =>\n    helpTextStyles({\n      ...renderProps,\n      size: size(),\n      isInvalid,\n    });\n\n  return (\n    <HeadlessNumberField\n      {...headlessProps}\n      label={local.label}\n      description={local.description}\n      errorMessage={local.errorMessage}\n      class={rootClassName}\n      style={local.UNSAFE_style}\n      children={(renderProps: NumberFieldRenderProps) => (\n        <>\n          <Show when={local.label}>\n            <div class={labelWrapperClass()}>\n              <HeadlessNumberFieldLabel class={labelClass(renderProps)}>\n                {local.label}\n                <Show when={renderProps.isRequired || necessityIndicator() === \"label\"}>\n                  <span class={noWrap}>\n                    &nbsp;\n                    <Show\n                      when={necessityIndicator() === \"label\"}\n                      fallback={\n                        <AsteriskIcon\n                          aria-hidden=\"true\"\n                          size=\"XS\"\n                          class={requiredIcon}\n                          style={requiredIconStyle(size())}\n                        />\n                      }\n                    >\n                      (required)\n                    </Show>\n                  </span>\n                </Show>\n              </HeadlessNumberFieldLabel>\n            </div>\n          </Show>\n\n          <HeadlessNumberFieldGroup\n            class={groupClass(renderProps)}\n            onPointerDown={(event) => {\n              if (event.pointerType === \"mouse\") {\n                focusFieldInput(event);\n              }\n            }}\n            onTouchEnd={focusFieldInput}\n            onFocusIn={() => setIsFocusWithin(true)}\n            onFocusOut={(event) => {\n              if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n                setIsFocusWithin(false);\n              }\n            }}\n            data-focused={isFocusWithin() ? \"true\" : undefined}\n            data-disabled={renderProps.isDisabled ? \"true\" : undefined}\n            data-invalid={renderProps.isInvalid ? \"true\" : undefined}\n          >\n            <Show\n              when={local.prefix}\n              fallback={\n                <HeadlessNumberFieldInput\n                  class={inputClass}\n                  placeholder={local.placeholder}\n                  onInput={local.onInput}\n                />\n              }\n            >\n              <FieldPrefix id={prefixId}>{local.prefix}</FieldPrefix>\n              <PrefixInputProvider context={HeadlessNumberFieldContext} prefixId={prefixId}>\n                <HeadlessNumberFieldInput\n                  class={inputClass}\n                  placeholder={local.placeholder}\n                  onInput={local.onInput}\n                />\n              </PrefixInputProvider>\n            </Show>\n            <Show when={renderProps.isInvalid}>\n              <AlertTriangleIcon aria-hidden=\"true\" styles={fieldErrorIcon} />\n            </Show>\n            <Show when={!local.hideStepper}>\n              <div class={stepperClass()}>\n                <HeadlessNumberFieldDecrementButton\n                  ref={decrementButtonElement}\n                  class={buttonClass(\"decrement\")}\n                  style={(buttonRenderProps: NumberFieldButtonRenderProps) =>\n                    buttonPressScaleStyle(decrementButtonElement, buttonRenderProps)\n                  }\n                >\n                  <DashIcon size={size()} class={iconStyles} />\n                </HeadlessNumberFieldDecrementButton>\n                <HeadlessNumberFieldIncrementButton\n                  ref={incrementButtonElement}\n                  class={buttonClass(\"increment\")}\n                  style={(buttonRenderProps: NumberFieldButtonRenderProps) =>\n                    buttonPressScaleStyle(incrementButtonElement, buttonRenderProps)\n                  }\n                >\n                  <AddIcon size={size()} class={iconStyles} />\n                </HeadlessNumberFieldIncrementButton>\n              </div>\n            </Show>\n          </HeadlessNumberFieldGroup>\n\n          <Show when={local.description && !renderProps.isInvalid}>\n            <NumberFieldDescription class={helpClass(renderProps, false)}>\n              {local.description}\n            </NumberFieldDescription>\n          </Show>\n          <Show when={local.errorMessage && renderProps.isInvalid}>\n            <NumberFieldError class={helpClass(renderProps, true)}>\n              {local.errorMessage}\n            </NumberFieldError>\n          </Show>\n        </>\n      )}\n    />\n  );\n}\n\nexport type { NumberFieldState } from \"@proyecto-viviana/solid-stately\";\n"],"mappings":"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"}
+{"version":3,"file":"numberfield.jsx","names":[],"sources":["../../src/icon/ui-icons/Add.tsx","../../src/numberfield/index.tsx"],"sourcesContent":["/*\n * Auto-generated from the pinned @react-spectrum/s2 icon inventory.\n * Do not edit by hand.\n */\n// Generator input: react-spectrum/packages/@react-spectrum/s2/ui-icons/Add.tsx\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize50.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize50.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize75.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize75.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize100.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize100.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize200.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize200.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize300.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_AddSize300.cjs\n\nimport type { JSX } from \"@solidjs/web\";\nimport { createUIIcon } from \"../spectrum-icon\";\nimport { style } from \"../../style\" with { type: \"macro\" };\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\n\nconst styles = style({\n  width: {\n    size: {\n      M: 10,\n      L: 12,\n      XL: 12,\n      XS: 8,\n      S: 8,\n    },\n  },\n  height: {\n    size: {\n      M: 10,\n      L: 12,\n      XL: 12,\n      XS: 8,\n      S: 8,\n    },\n  },\n});\n\nexport type AddProps = JSX.SvgSVGAttributes<SVGSVGElement> & {\n  size?: \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\";\n};\n\nfunction Add_XSSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"8\"\n      height=\"8\"\n      viewBox=\"0 0 8 8\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M6.625 3.078H4.922V1.375a.922.922 0 0 0-1.844 0v1.703H1.375a.922.922 0 0 0 0 1.844h1.703v1.703a.922.922 0 0 0 1.844 0V4.922h1.703a.922.922 0 0 0 0-1.844\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_SSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"8\"\n      height=\"8\"\n      viewBox=\"0 0 8 8\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7 3.04H4.96V1a.96.96 0 1 0-1.92 0v2.04H1a.96.96 0 1 0 0 1.92h2.04V7a.96.96 0 1 0 1.92 0V4.96H7a.96.96 0 1 0 0-1.92\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_MSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M8.5 4H6V1.5a1 1 0 1 0-2 0V4H1.5a1 1 0 1 0 0 2H4v2.5a1 1 0 1 0 2 0V6h2.5a1 1 0 1 0 0-2\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_LSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.021 4.959h-2.98v-2.98a1.04 1.04 0 1 0-2.082 0v2.98h-2.98a1.04 1.04 0 1 0 0 2.082h2.98v2.98a1.04 1.04 0 1 0 2.082 0v-2.98h2.98a1.04 1.04 0 1 0 0-2.082\"\n      />\n    </svg>\n  );\n}\n\nfunction Add_XLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.61 4.915H7.085V1.39a1.084 1.084 0 1 0-2.17 0v3.525H1.39a1.084 1.084 0 1 0 0 2.17h3.525v3.525a1.084 1.084 0 1 0 2.17 0V7.085h3.525a1.084 1.084 0 1 0 0-2.17\"\n      />\n    </svg>\n  );\n}\n\nconst Add_XS = createUIIcon(Add_XSSvg);\nconst Add_S = createUIIcon(Add_SSvg);\nconst Add_M = createUIIcon(Add_MSvg);\nconst Add_L = createUIIcon(Add_LSvg);\nconst Add_XL = createUIIcon(Add_XLSvg);\n\nexport default function Add(props: AddProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"size\", \"class\", \"width\", \"height\"]);\n  const size = local.size ?? \"M\";\n  const mergedClass = () => `${local.class ?? \"\"}${styles({ size })}`;\n  switch (size) {\n    case \"XS\":\n      return <Add_XS {...rest} class={mergedClass()} />;\n    case \"S\":\n      return <Add_S {...rest} class={mergedClass()} />;\n    case \"M\":\n      return <Add_M {...rest} class={mergedClass()} />;\n    case \"L\":\n      return <Add_L {...rest} class={mergedClass()} />;\n    case \"XL\":\n      return <Add_XL {...rest} class={mergedClass()} />;\n    default:\n      return <Add_M {...rest} class={mergedClass()} />;\n  }\n}\n\nexport const AddIcon = Add;\n","// @ts-nocheck\n\n/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/NumberField.tsx\n\n// Port of packages/@react-spectrum/s2/src/NumberField.tsx.\n\nimport { createContext, createSignal, createUniqueId, Show, useContext } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n  NumberField as HeadlessNumberField,\n  NumberFieldLabel as HeadlessNumberFieldLabel,\n  NumberFieldGroup as HeadlessNumberFieldGroup,\n  NumberFieldInput as HeadlessNumberFieldInput,\n  NumberFieldIncrementButton as HeadlessNumberFieldIncrementButton,\n  NumberFieldDecrementButton as HeadlessNumberFieldDecrementButton,\n  NumberFieldContext as HeadlessNumberFieldContext,\n  type NumberFieldProps as HeadlessNumberFieldProps,\n  type NumberFieldRenderProps,\n  type NumberFieldInputRenderProps,\n  type NumberFieldButtonRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { StyleString } from \"../style\";\nimport { baseColor, focusRing, fontRelative, space, style } from \"../style\" with { type: \"macro\" };\nimport {\n  control,\n  controlBorderRadius,\n  field,\n  fieldInput,\n  fieldLabel,\n  getAllowedOverrides,\n} from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport AlertTriangleIcon from \"../icon/s2wf-icons/AlertTriangleIcon\";\nimport AsteriskIcon from \"../icon/ui-icons/Asterisk\";\nimport { mergeProps, createStringFormatter } from \"@proyecto-viviana/solidaria\";\nimport { s2IntlStrings } from \"../intl\";\nimport AddIcon from \"../icon/ui-icons/Add\";\nimport DashIcon from \"../icon/ui-icons/Dash\";\nimport { FieldPrefix, PrefixInputProvider } from \"../field/prefix\";\nimport { useProviderProps } from \"../provider\";\nimport { getSlottedContextProps, type SpectrumContextValue } from \"../button/spectrum-context\";\nimport { HelpText } from \"../form/HelpText\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\n\nexport type NumberFieldSize = \"S\" | \"M\" | \"L\" | \"XL\";\ntype S2NumberFieldSize = NumberFieldSize;\nexport type NumberFieldLabelPosition = \"top\" | \"side\";\nexport type NumberFieldLabelAlign = \"start\" | \"end\";\nexport type NumberFieldNecessityIndicator = \"icon\" | \"label\";\n\nexport interface NumberFieldProps extends Omit<\n  HeadlessNumberFieldProps,\n  \"class\" | \"style\" | \"children\" | \"label\"\n> {\n  /** The size of the number field. */\n  size?: NumberFieldSize;\n  /** Spectrum-defined generated classes. */\n  styles?: StyleString;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n  /** Backward-compatible class alias. Prefer UNSAFE_className for S2 parity. */\n  class?: string;\n  /** Label text for the input. */\n  label?: JSX.Element;\n  /** Description text shown below the input. */\n  description?: JSX.Element;\n  /** Error message shown when invalid. */\n  errorMessage?: JSX.Element;\n  /** Whether to hide the stepper buttons. */\n  hideStepper?: boolean;\n  /** Position of the label relative to the input. */\n  labelPosition?: NumberFieldLabelPosition;\n  /** Text alignment for side labels. */\n  labelAlign?: NumberFieldLabelAlign;\n  /** Whether required fields show an icon or text label. */\n  necessityIndicator?: NumberFieldNecessityIndicator;\n  /** An icon or text rendered before the input. */\n  prefix?: JSX.Element;\n}\n\nexport const NumberFieldContext = createContext<SpectrumContextValue<NumberFieldProps>>(null);\n\ninterface NumberFieldStyleProps extends NumberFieldRenderProps {\n  size?: S2NumberFieldSize;\n  labelPosition?: NumberFieldLabelPosition;\n  labelAlign?: NumberFieldLabelAlign;\n  isFocusWithin?: boolean;\n  isStepperHidden?: boolean;\n  isInForm?: boolean;\n}\n\nconst numberFieldRoot = style<NumberFieldStyleProps>(\n  {\n    ...field(),\n  },\n  getAllowedOverrides(),\n);\n\nconst numberFieldLabelWrapper = style<NumberFieldStyleProps>({\n  gridArea: \"label\",\n  display: \"inline\",\n  textAlign: {\n    labelAlign: {\n      start: \"start\",\n      end: \"end\",\n    },\n  },\n  paddingBottom: {\n    labelPosition: {\n      top: \"--field-gap\",\n    },\n  },\n  contain: {\n    labelPosition: {\n      top: \"inline-size\",\n    },\n  },\n});\n\nconst numberFieldLabel = style<NumberFieldStyleProps>({\n  ...fieldLabel(),\n});\n\nconst numberFieldGroup = style<NumberFieldStyleProps>({\n  ...focusRing(),\n  ...control({ shape: \"default\", register: \"matte\" }),\n  ...fieldInput(),\n  paddingStart: \"edge-to-text\",\n  paddingEnd: {\n    default: 0,\n    isStepperHidden: \"edge-to-text\",\n  },\n  transition: \"default\",\n  borderColor: {\n    default: \"well-border\",\n    forcedColors: \"ButtonBorder\",\n    isInvalid: {\n      default: baseColor(\"negative\"),\n      forcedColors: \"Mark\",\n    },\n    isFocusWithin: {\n      /* Viviana UI v2 (Glasselated): cyan/blue is the register's STRUCTURE colour, so a\n       * focused well rims in `--border-focus` instead of S2's near-black `gray-900`.\n       * Recolour only — the ring, its width and every other state stay as they were. */\n      default: \"[var(--border-focus)]\",\n      isInvalid: \"negative-1000\",\n      forcedColors: \"Highlight\",\n    },\n    isDisabled: {\n      default: \"disabled\",\n      forcedColors: \"GrayText\",\n    },\n  },\n  backgroundColor: {\n    default: \"well\",\n    forcedColors: \"Field\",\n  },\n  color: {\n    default: baseColor(\"neutral\"),\n    forcedColors: \"ButtonText\",\n    isDisabled: {\n      default: \"disabled\",\n      forcedColors: \"GrayText\",\n    },\n  },\n  cursor: {\n    default: \"text\",\n    isDisabled: \"default\",\n  },\n});\n\nconst numberFieldInput = style({\n  padding: 0,\n  backgroundColor: \"transparent\",\n  color: {\n    default: \"inherit\",\n    \"::placeholder\": {\n      /* Register dim ink: placeholder copy is the well's quietest text. */\n      default: \"[var(--terminal-dim)]\",\n      forcedColors: \"GrayText\",\n    },\n  },\n  fontFamily: \"inherit\",\n  fontSize: \"inherit\",\n  fontWeight: \"inherit\",\n  flexGrow: 1,\n  flexShrink: 1,\n  minWidth: 0,\n  width: \"full\",\n  outlineStyle: \"none\",\n  borderStyle: \"none\",\n  // Upstream S2 NumberField renders the shared `<Input>` from `Field.tsx`, whose style\n  // ends in `truncate: true` (→ overflow:hidden; text-overflow:ellipsis; white-space:nowrap)\n  // — NOT `textAlign: 'start'`. The hardcoded `textAlign` was a self-inflicted divergence\n  // that dropped truncation; reverted to `truncate` to match the shared Input byte-for-byte.\n  truncate: true,\n});\n\nconst stepperContainer = style<NumberFieldStyleProps>({\n  display: \"flex\",\n  flexDirection: \"row\",\n  gap: {\n    size: {\n      S: 8,\n      M: 4,\n      L: 8,\n      XL: 8,\n    },\n  },\n  marginEnd: {\n    size: {\n      S: 2,\n      M: 4,\n      L: space(6),\n      XL: space(6),\n    },\n  },\n});\n\nconst inputButton = style<\n  NumberFieldButtonRenderProps & { size?: S2NumberFieldSize; type: \"decrement\" | \"increment\" }\n>({\n  ...controlBorderRadius(\"sm\"),\n  display: \"flex\",\n  outlineStyle: \"none\",\n  textAlign: \"center\",\n  borderStyle: \"none\",\n  alignItems: \"center\",\n  justifyContent: \"center\",\n  width: {\n    size: {\n      S: 16,\n      M: 20,\n      L: 24,\n      XL: 32,\n    },\n  },\n  height: \"auto\",\n  marginStart: {\n    default: \"text-to-control\",\n    type: {\n      increment: 0,\n    },\n  },\n  aspectRatio: \"square\",\n  flexShrink: 0,\n  minHeight: 0,\n  transition: {\n    default: \"default\",\n    forcedColors: \"none\",\n  },\n  backgroundColor: {\n    default: baseColor(\"gray-100\"),\n    isDisabled: \"disabled\",\n    forcedColors: {\n      default: \"ButtonText\",\n      isHovered: \"Highlight\",\n      isDisabled: \"GrayText\",\n    },\n  },\n  color: {\n    default: baseColor(\"neutral\"),\n    isDisabled: \"disabled\",\n    forcedColors: {\n      default: \"ButtonFace\",\n    },\n  },\n  cursor: \"default\",\n});\n\nconst iconStyles = style({\n  flexShrink: 0,\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n});\n\nconst fieldErrorIcon = style({\n  size: \"1lh\",\n  marginStart: \"text-to-visual\",\n  marginEnd: fontRelative(-2),\n  flexShrink: 0,\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: {\n      default: \"negative-1000\",\n      forcedColors: \"Mark\",\n    },\n  },\n});\n\nconst requiredIcon = style({\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n});\n\nconst noWrap = style({\n  whiteSpace: \"nowrap\",\n});\n\nfunction normalizeNumberFieldSize(size: NumberFieldSize | undefined): S2NumberFieldSize {\n  return size ?? \"M\";\n}\n\nfunction focusFieldInput(event: Event & { currentTarget: HTMLDivElement }) {\n  const target = event.target as Element | null;\n\n  if (target?.closest(\"button,input,textarea,[role='button']\")) {\n    return;\n  }\n\n  event.preventDefault();\n  event.currentTarget.querySelector<HTMLElement>(\"input\")?.focus();\n}\n\nfunction requiredIconStyle(size: S2NumberFieldSize): JSX.CSSProperties {\n  const pixelSize = size === \"L\" || size === \"XL\" ? 10 : 8;\n  return {\n    width: `${pixelSize}px`,\n    height: `${pixelSize}px`,\n  };\n}\n\nfunction buttonPressScaleStyle(\n  element: HTMLDivElement | undefined,\n  renderProps: NumberFieldButtonRenderProps,\n): JSX.CSSProperties {\n  const pressStyle = { \"will-change\": \"transform\" } as JSX.CSSProperties;\n\n  if (renderProps.isPressed && element) {\n    const { width, height } = element.getBoundingClientRect();\n    pressStyle.transform = `perspective(${Math.max(height, width / 3, 24)}px) translate3d(0, 0, -2px)`;\n  }\n\n  return pressStyle;\n}\n\n/**\n * NumberFields allow users to input number values with a keyboard or increment/decrement with step buttons.\n */\nexport function NumberField(props: NumberFieldProps): JSX.Element {\n  const providerProps = useProviderProps(props);\n  const [flags] = splitProps(providerProps, [\n    \"isQuiet\",\n    \"isEmphasized\",\n    \"isDisabled\",\n    \"isRequired\",\n    \"isReadOnly\",\n    \"validationState\",\n  ]);\n  const contextProps = getSlottedContextProps(useContext(NumberFieldContext), props.slot);\n  const mergedProps = mergeProps(flags, contextProps ?? {}, props);\n  const [local, headlessProps] = splitProps(mergedProps, [\n    \"size\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"class\",\n    \"label\",\n    \"placeholder\",\n    \"description\",\n    \"errorMessage\",\n    \"hideStepper\",\n    \"onInput\",\n    \"labelPosition\",\n    \"labelAlign\",\n    \"necessityIndicator\",\n    \"prefix\",\n  ]);\n  const prefixId = createUniqueId();\n  const size = () => normalizeNumberFieldSize(local.size);\n  const labelPosition = () => local.labelPosition ?? \"top\";\n  const labelAlign = () => local.labelAlign ?? \"start\";\n  const necessityIndicator = () => local.necessityIndicator ?? \"icon\";\n  const stringFormatter = createStringFormatter(s2IntlStrings, \"@react-spectrum/s2\");\n  const [isFocusWithin, setIsFocusWithin] = createSignal(false);\n\n  let decrementButtonElement: HTMLDivElement | undefined;\n  let incrementButtonElement: HTMLDivElement | undefined;\n\n  // Match upstream's root style INVOCATION args exactly: S2 `NumberField.tsx` passes\n  // only `{ isInForm: !!formContext, labelPosition, size }` to `style(field(), …)(…)`\n  // — NOT the render-prop bag. `isDisabled`/`isFocused`/… are threaded DOWN to the\n  // FieldGroup/label/help text, not applied to the field grid. The grid's `field()` has\n  // no such conditions today, but spreading `…renderProps` here would silently light any\n  // future one; keep the arg set faithful (same lesson as SearchField's root-color fix).\n  const rootClassName = (_renderProps: NumberFieldRenderProps) =>\n    [\n      local.UNSAFE_className,\n      local.class,\n      numberFieldRoot(\n        {\n          size: size(),\n          labelPosition: labelPosition(),\n          isInForm: false,\n        },\n        local.styles,\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  const labelWrapperClass = () =>\n    numberFieldLabelWrapper({\n      size: size(),\n      labelPosition: labelPosition(),\n      labelAlign: labelAlign(),\n    });\n\n  const labelClass = (renderProps: NumberFieldRenderProps) =>\n    numberFieldLabel({\n      ...renderProps,\n      size: size(),\n      labelPosition: labelPosition(),\n    });\n\n  const groupClass = (renderProps: NumberFieldRenderProps) =>\n    numberFieldGroup({\n      ...renderProps,\n      size: size(),\n      isFocusWithin: isFocusWithin(),\n      isStepperHidden: local.hideStepper,\n    });\n\n  const stepperClass = () => stepperContainer({ size: size() });\n\n  const inputClass = (_renderProps: NumberFieldInputRenderProps) => numberFieldInput;\n\n  const buttonClass =\n    (type: \"decrement\" | \"increment\") => (renderProps: NumberFieldButtonRenderProps) =>\n      inputButton({\n        ...renderProps,\n        size: size(),\n        type,\n      });\n\n  return (\n    <HeadlessNumberField\n      {...headlessProps}\n      label={local.label}\n      description={local.description}\n      errorMessage={local.errorMessage}\n      class={rootClassName}\n      style={local.UNSAFE_style}\n      children={(renderProps: NumberFieldRenderProps) => (\n        <>\n          <Show when={local.label}>\n            <div class={labelWrapperClass()}>\n              <HeadlessNumberFieldLabel class={labelClass(renderProps)}>\n                {local.label}\n                <Show when={renderProps.isRequired || necessityIndicator() === \"label\"}>\n                  <span class={noWrap}>\n                    &nbsp;\n                    <Show\n                      when={necessityIndicator() === \"label\"}\n                      fallback={\n                        <AsteriskIcon\n                          aria-hidden=\"true\"\n                          size=\"XS\"\n                          class={requiredIcon}\n                          style={requiredIconStyle(size())}\n                        />\n                      }\n                    >\n                      {stringFormatter().format(\n                        renderProps.isRequired ? \"label.(required)\" : \"label.(optional)\",\n                      )}\n                    </Show>\n                  </span>\n                </Show>\n              </HeadlessNumberFieldLabel>\n            </div>\n          </Show>\n\n          <HeadlessNumberFieldGroup\n            class={groupClass(renderProps)}\n            onPointerDown={(event) => {\n              if (event.pointerType === \"mouse\") {\n                focusFieldInput(event);\n              }\n            }}\n            onTouchEnd={focusFieldInput}\n            onFocusIn={() => setIsFocusWithin(true)}\n            onFocusOut={(event) => {\n              if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n                setIsFocusWithin(false);\n              }\n            }}\n            data-focused={isFocusWithin() ? \"true\" : undefined}\n            data-disabled={renderProps.isDisabled ? \"true\" : undefined}\n            data-invalid={renderProps.isInvalid ? \"true\" : undefined}\n          >\n            <Show\n              when={local.prefix}\n              fallback={\n                <HeadlessNumberFieldInput\n                  class={inputClass}\n                  placeholder={local.placeholder}\n                  onInput={local.onInput}\n                />\n              }\n            >\n              <FieldPrefix id={prefixId}>{local.prefix}</FieldPrefix>\n              <PrefixInputProvider context={HeadlessNumberFieldContext} prefixId={prefixId}>\n                <HeadlessNumberFieldInput\n                  class={inputClass}\n                  placeholder={local.placeholder}\n                  onInput={local.onInput}\n                />\n              </PrefixInputProvider>\n            </Show>\n            <Show when={renderProps.isInvalid}>\n              <AlertTriangleIcon aria-hidden=\"true\" styles={fieldErrorIcon} />\n            </Show>\n            <Show when={!local.hideStepper}>\n              <div class={stepperClass()}>\n                <HeadlessNumberFieldDecrementButton\n                  ref={decrementButtonElement}\n                  class={buttonClass(\"decrement\")}\n                  style={(buttonRenderProps: NumberFieldButtonRenderProps) =>\n                    buttonPressScaleStyle(decrementButtonElement, buttonRenderProps)\n                  }\n                >\n                  <DashIcon size={size()} class={iconStyles} />\n                </HeadlessNumberFieldDecrementButton>\n                <HeadlessNumberFieldIncrementButton\n                  ref={incrementButtonElement}\n                  class={buttonClass(\"increment\")}\n                  style={(buttonRenderProps: NumberFieldButtonRenderProps) =>\n                    buttonPressScaleStyle(incrementButtonElement, buttonRenderProps)\n                  }\n                >\n                  <AddIcon size={size()} class={iconStyles} />\n                </HeadlessNumberFieldIncrementButton>\n              </div>\n            </Show>\n          </HeadlessNumberFieldGroup>\n\n          <HelpText\n            size={size()}\n            isDisabled={renderProps.isDisabled}\n            isInvalid={renderProps.isInvalid}\n            description={local.description}\n          >\n            {local.errorMessage}\n          </HelpText>\n        </>\n      )}\n    />\n  );\n}\n\nexport type { NumberFieldState } from \"@proyecto-viviana/solid-stately\";\n"],"mappings":"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"}

package/dist/_chunk/{macro-4c350293382b43f3939cd4c2bbd6c7c1c18de5a45cd1a00695dffc1eba819d91.js → prefix.js}

@@ -1,13 +1,25 @@
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Field.tsx
 import { CenterBaseline } from "../icon/center-baseline.js";
 import { t as IconContext } from "./spectrum-icon.js";
-import { createComponent } from "solid-js/web";
+import { createComponent } from "@solidjs/web";
 import { useContext } from "solid-js";
 //#region src/field/prefix.tsx
 /**
 * Shared field `prefix` slot.
 *
-* Port of the `prefix` slot on upstream S2's `FieldGroup`
-* (`@react-spectrum/s2/src/Field.tsx`). Upstream centralizes the prefix in a
+* Based on packages/@react-spectrum/s2/src/Field.tsx.
+* Upstream centralizes the prefix in a
 * single shared `FieldGroup`; we compose a field group per component, so the
 * prefix is threaded into each field (TextField, ColorField, NumberField,
 * ComboBox) through these shared primitives instead.
@@ -15,16 +27,14 @@ import { useContext } from "solid-js";
 * Two pieces, matching upstream:
 *  - `FieldPrefix` renders the prefix node (text or icon) before the input with
 *    the upstream styling (`gray-600`, `flex-shrink: 0`, `margin-end:
-*    text-to-visual`, icon sized to `fontRelative(20)`).
+*    text-to-visual`, icon sized to `'1lh'`).
 *  - `PrefixInputProvider` associates the prefix with the input by appending the
 *    prefix's id to the input's `aria-labelledby`, mirroring upstream's
 *    `InputContext.Provider value={{...ctx, 'aria-labelledby': ...}}`.
-*/
-const prefixStyles = " pQKeKoe151 _va151 Ht151 Hsu151";
-const prefixIconContext = { styles: " ZuUmpre151 FuUmpre151 -_8sjo0b-t5ZbAob151" };
-/** Renders a field prefix node (text or icon) with the upstream prefix styling. */
-function FieldPrefix(props) {
-	return createComponent(IconContext.Provider, {
+*/ const prefixStyles = " pX85CBd17 _va17 Ht17 Hsu17";
+const prefixIconContext = { styles: " ZObNfn17 FObNfn17 -_8sjo0b-t5ZbAob17" };
+/** Renders a field prefix node (text or icon) with the upstream prefix styling. */ function FieldPrefix(props) {
+	return createComponent(IconContext, {
 		value: prefixIconContext,
 		get children() {
 			return createComponent(CenterBaseline, {
@@ -57,8 +67,7 @@ function appendLabelledBy(inputProps, prefixId) {
 * `prefixId` may carry several space-separated slot ids (prefix + suffix) and
 * may be a thunk — resolved on each `inputProps` access — so a field whose
 * adornments appear or disappear after mount keeps its `aria-labelledby` live.
-*/
-function withPrefixLabelledBy(context, prefixId, inputPropsIsFunction = false) {
+*/ function withPrefixLabelledBy(context, prefixId, inputPropsIsFunction = false) {
 	if (!context) return context;
 	const resolveId = () => typeof prefixId === "function" ? prefixId() : prefixId;
 	return new Proxy(context, { get(target, property, receiver) {
@@ -75,10 +84,9 @@ function withPrefixLabelledBy(context, prefixId, inputPropsIsFunction = false) {
 * Wraps a field input so its `aria-labelledby` is extended to include the prefix
 * id. Reads the nearest field context, augments only `inputProps`, and re-provides
 * the augmented value to the input.
-*/
-function PrefixInputProvider(props) {
+*/ function PrefixInputProvider(props) {
 	const value = withPrefixLabelledBy(useContext(props.context), () => props.prefixId, props.inputPropsIsFunction);
-	return createComponent(props.context.Provider, {
+	return createComponent(props.context, {
 		value,
 		get children() {
 			return props.children;
@@ -88,4 +96,4 @@ function PrefixInputProvider(props) {
 //#endregion
 export { PrefixInputProvider as n, FieldPrefix as t };
 
-//# sourceMappingURL=macro-4c350293382b43f3939cd4c2bbd6c7c1c18de5a45cd1a00695dffc1eba819d91.js.map
+//# sourceMappingURL=prefix.js.map

package/dist/_chunk/prefix.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prefix.js","names":[],"sources":["../../src/field/prefix.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Field.tsx\n\n/**\n * Shared field `prefix` slot.\n *\n * Based on packages/@react-spectrum/s2/src/Field.tsx.\n * Upstream centralizes the prefix in a\n * single shared `FieldGroup`; we compose a field group per component, so the\n * prefix is threaded into each field (TextField, ColorField, NumberField,\n * ComboBox) through these shared primitives instead.\n *\n * Two pieces, matching upstream:\n *  - `FieldPrefix` renders the prefix node (text or icon) before the input with\n *    the upstream styling (`gray-600`, `flex-shrink: 0`, `margin-end:\n *    text-to-visual`, icon sized to `'1lh'`).\n *  - `PrefixInputProvider` associates the prefix with the input by appending the\n *    prefix's id to the input's `aria-labelledby`, mirroring upstream's\n *    `InputContext.Provider value={{...ctx, 'aria-labelledby': ...}}`.\n */\nimport { useContext } from \"solid-js\";\nimport type { Context } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { CenterBaseline } from \"../icon/center-baseline\";\nimport { IconContext, type IconContextValue } from \"../icon\";\nimport { style } from \"../style\" with { type: \"macro\" };\n\nconst prefixStyles = style({\n  color: \"gray-600\",\n  flexShrink: 0,\n  marginEnd: \"text-to-visual\",\n});\n\nconst prefixIconStyles = style({\n  size: \"1lh\",\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n});\n\nconst prefixIconContext: IconContextValue = { styles: prefixIconStyles };\n\n/** Renders a field prefix node (text or icon) with the upstream prefix styling. */\nexport function FieldPrefix(props: { id: string; children: JSX.Element }): JSX.Element {\n  return (\n    <IconContext value={prefixIconContext}>\n      <CenterBaseline id={props.id} styles={prefixStyles}>\n        {props.children}\n      </CenterBaseline>\n    </IconContext>\n  );\n}\n\nfunction appendLabelledBy(\n  inputProps: Record<string, unknown> | undefined,\n  prefixId: string,\n): Record<string, unknown> {\n  const base = inputProps?.[\"aria-labelledby\"];\n  const labelledBy = typeof base === \"string\" && base.length > 0 ? `${base} ${prefixId}` : prefixId;\n  return { ...inputProps, \"aria-labelledby\": labelledBy };\n}\n\n/**\n * Returns a proxy over a field context that delegates every property to the\n * original value and overrides only `inputProps`, appending `prefixId` to its\n * `aria-labelledby`. The delegation keeps the underlying getters live, so the\n * input stays reactive. `inputPropsIsFunction` handles ComboBox's function-form\n * `inputProps` (Text/Color/NumberField expose it as an object).\n *\n * `prefixId` may carry several space-separated slot ids (prefix + suffix) and\n * may be a thunk — resolved on each `inputProps` access — so a field whose\n * adornments appear or disappear after mount keeps its `aria-labelledby` live.\n */\nexport function withPrefixLabelledBy<T extends object>(\n  context: T | null,\n  prefixId: string | (() => string),\n  inputPropsIsFunction = false,\n): T | null {\n  if (!context) {\n    return context;\n  }\n  const resolveId = () => (typeof prefixId === \"function\" ? prefixId() : prefixId);\n  return new Proxy(context, {\n    get(target, property, receiver) {\n      if (property === \"inputProps\") {\n        if (inputPropsIsFunction) {\n          return () => {\n            const inputProps = (\n              Reflect.get(target, property, target) as () => Record<string, unknown>\n            )();\n            return appendLabelledBy(inputProps, resolveId());\n          };\n        }\n        const inputProps = Reflect.get(target, property, target) as\n          | Record<string, unknown>\n          | undefined;\n        return appendLabelledBy(inputProps, resolveId());\n      }\n      return Reflect.get(target, property, receiver);\n    },\n  });\n}\n\n/**\n * Wraps a field input so its `aria-labelledby` is extended to include the prefix\n * id. Reads the nearest field context, augments only `inputProps`, and re-provides\n * the augmented value to the input.\n */\nexport function PrefixInputProvider<T extends object>(props: {\n  context: Context<T | null>;\n  prefixId: string;\n  inputPropsIsFunction?: boolean;\n  children: JSX.Element;\n}): JSX.Element {\n  const context = useContext(props.context);\n  // `props.prefixId` is read through a thunk so a caller passing a computed id\n  // set (prefix + suffix) stays live across adornment changes.\n  const value = withPrefixLabelledBy(context, () => props.prefixId, props.inputPropsIsFunction);\n  return <props.context value={value}>{props.children}</props.context>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCA,MAAM,eAAA;AAcN,MAAM,oBAAsC,EAAE,QAAQ,wCAAiB;oFAGvE,SAAgB,YAAY,OAAmD;CAC7E,OAAO,gBAAA,aAAA;EACQ,OAAO;EADf,IAAA,WAAA;GAEH,OAAA,gBAAA,gBAAA;IAAgB,IAAA,KAAA;KAAI,OAAA,MAAM;IAAE;IAAE,QAAQ;IAAtC,IAAA,WAAA;KACG,OAAA,MAAM;IACP;;EACF;;AAEN;AAEA,SAAS,iBACP,YACA,UACuB;CACvB,MAAM,OAAO,aAAa;CAC1B,MAAM,aAAa,OAAO,SAAS,YAAY,KAAK,SAAS,IAAI,GAAG,KAAK,GAAG,aAAa;CACzF,OAAO;EAAE,GAAG;EAAY,mBAAmB;CAAW;AACxD;;;;;;;;;;;GAaA,SAAgB,qBACd,SACA,UACA,uBAAuB,OACd;CACT,IAAI,CAAC,SACH,OAAO;CAET,MAAM,kBAAmB,OAAO,aAAa,aAAa,SAAA,IAAa;CACvE,OAAO,IAAI,MAAM,SAAS,EACxB,IAAI,QAAQ,UAAU,UAAQ;EAC5B,IAAI,aAAa,cAAc;GAC7B,IAAI,sBACF,aAAO;IAIL,OAAO,iBAFL,QAAQ,IAAI,QAAQ,UAAU,MAAA,CAAA,CAER,GAAY,UAAA,CAAA;GACtC;GAKF,OAAO,iBAHY,QAAQ,IAAI,QAAQ,UAAU,MAGzB,GAAY,UAAA,CAAA;EACtC;EACA,OAAO,QAAQ,IAAI,QAAQ,UAAU,QAAA;CACvC,EACF,CAAA;AACF;;;;;GAOA,SAAgB,oBAAsC,OAK9C;CAIN,MAAM,QAAQ,qBAHE,WAAW,MAAM,OAGE,SAAe,MAAM,UAAU,MAAM,oBAAoB;CAC5F,OAAA,gBAAA,MAAQ,SAAR;EAA6B;EAA7B,IAAA,WAAA;GAAqC,OAAA,MAAM;EAAiB;;AAC9D"}

package/dist/_chunk/prefix.jsx

@@ -1,3 +1,15 @@
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Field.tsx
 import { CenterBaseline } from "../icon/center-baseline.jsx";
 import { t as IconContext } from "./spectrum-icon.jsx";
 import { useContext } from "solid-js";
@@ -5,8 +17,8 @@ import { useContext } from "solid-js";
 /**
 * Shared field `prefix` slot.
 *
-* Port of the `prefix` slot on upstream S2's `FieldGroup`
-* (`@react-spectrum/s2/src/Field.tsx`). Upstream centralizes the prefix in a
+* Based on packages/@react-spectrum/s2/src/Field.tsx.
+* Upstream centralizes the prefix in a
 * single shared `FieldGroup`; we compose a field group per component, so the
 * prefix is threaded into each field (TextField, ColorField, NumberField,
 * ComboBox) through these shared primitives instead.
@@ -14,18 +26,18 @@ import { useContext } from "solid-js";
 * Two pieces, matching upstream:
 *  - `FieldPrefix` renders the prefix node (text or icon) before the input with
 *    the upstream styling (`gray-600`, `flex-shrink: 0`, `margin-end:
-*    text-to-visual`, icon sized to `fontRelative(20)`).
+*    text-to-visual`, icon sized to `'1lh'`).
 *  - `PrefixInputProvider` associates the prefix with the input by appending the
 *    prefix's id to the input's `aria-labelledby`, mirroring upstream's
 *    `InputContext.Provider value={{...ctx, 'aria-labelledby': ...}}`.
-*/ const prefixStyles = " pQKeKoe151 _va151 Ht151 Hsu151";
-const prefixIconContext = { styles: " ZuUmpre151 FuUmpre151 -_8sjo0b-t5ZbAob151" };
+*/ const prefixStyles = " pX85CBd17 _va17 Ht17 Hsu17";
+const prefixIconContext = { styles: " ZObNfn17 FObNfn17 -_8sjo0b-t5ZbAob17" };
 /** Renders a field prefix node (text or icon) with the upstream prefix styling. */ function FieldPrefix(props) {
-	return <IconContext.Provider value={prefixIconContext}>
+	return <IconContext value={prefixIconContext}>
       <CenterBaseline id={props.id} styles={prefixStyles}>
         {props.children}
       </CenterBaseline>
-    </IconContext.Provider>;
+    </IconContext>;
 }
 function appendLabelledBy(inputProps, prefixId) {
 	const base = inputProps?.["aria-labelledby"];
@@ -64,7 +76,7 @@ function appendLabelledBy(inputProps, prefixId) {
 * the augmented value to the input.
 */ function PrefixInputProvider(props) {
 	const value = withPrefixLabelledBy(useContext(props.context), () => props.prefixId, props.inputPropsIsFunction);
-	return <props.context.Provider value={value}>{props.children}</props.context.Provider>;
+	return <props.context value={value}>{props.children}</props.context>;
 }
 //#endregion
 export { PrefixInputProvider as n, FieldPrefix as t };

package/dist/_chunk/prefix.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"prefix.jsx","names":[],"sources":["../../src/field/prefix.tsx"],"sourcesContent":["/**\n * Shared field `prefix` slot.\n *\n * Port of the `prefix` slot on upstream S2's `FieldGroup`\n * (`@react-spectrum/s2/src/Field.tsx`). Upstream centralizes the prefix in a\n * single shared `FieldGroup`; we compose a field group per component, so the\n * prefix is threaded into each field (TextField, ColorField, NumberField,\n * ComboBox) through these shared primitives instead.\n *\n * Two pieces, matching upstream:\n *  - `FieldPrefix` renders the prefix node (text or icon) before the input with\n *    the upstream styling (`gray-600`, `flex-shrink: 0`, `margin-end:\n *    text-to-visual`, icon sized to `fontRelative(20)`).\n *  - `PrefixInputProvider` associates the prefix with the input by appending the\n *    prefix's id to the input's `aria-labelledby`, mirroring upstream's\n *    `InputContext.Provider value={{...ctx, 'aria-labelledby': ...}}`.\n */\nimport { type Context, type JSX, useContext } from \"solid-js\";\nimport { CenterBaseline } from \"../icon/center-baseline\";\nimport { IconContext, type IconContextValue } from \"../icon\";\nimport { fontRelative, style } from \"../style\" with { type: \"macro\" };\n\nconst prefixStyles = style({\n  color: \"gray-600\",\n  flexShrink: 0,\n  marginEnd: \"text-to-visual\",\n});\n\nconst prefixIconStyles = style({\n  size: fontRelative(20),\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n});\n\nconst prefixIconContext: IconContextValue = { styles: prefixIconStyles };\n\n/** Renders a field prefix node (text or icon) with the upstream prefix styling. */\nexport function FieldPrefix(props: { id: string; children: JSX.Element }): JSX.Element {\n  return (\n    <IconContext.Provider value={prefixIconContext}>\n      <CenterBaseline id={props.id} styles={prefixStyles}>\n        {props.children}\n      </CenterBaseline>\n    </IconContext.Provider>\n  );\n}\n\nfunction appendLabelledBy(\n  inputProps: Record<string, unknown> | undefined,\n  prefixId: string,\n): Record<string, unknown> {\n  const base = inputProps?.[\"aria-labelledby\"];\n  const labelledBy = typeof base === \"string\" && base.length > 0 ? `${base} ${prefixId}` : prefixId;\n  return { ...inputProps, \"aria-labelledby\": labelledBy };\n}\n\n/**\n * Returns a proxy over a field context that delegates every property to the\n * original value and overrides only `inputProps`, appending `prefixId` to its\n * `aria-labelledby`. The delegation keeps the underlying getters live, so the\n * input stays reactive. `inputPropsIsFunction` handles ComboBox's function-form\n * `inputProps` (Text/Color/NumberField expose it as an object).\n *\n * `prefixId` may carry several space-separated slot ids (prefix + suffix) and\n * may be a thunk — resolved on each `inputProps` access — so a field whose\n * adornments appear or disappear after mount keeps its `aria-labelledby` live.\n */\nexport function withPrefixLabelledBy<T extends object>(\n  context: T | null,\n  prefixId: string | (() => string),\n  inputPropsIsFunction = false,\n): T | null {\n  if (!context) {\n    return context;\n  }\n  const resolveId = () => (typeof prefixId === \"function\" ? prefixId() : prefixId);\n  return new Proxy(context, {\n    get(target, property, receiver) {\n      if (property === \"inputProps\") {\n        if (inputPropsIsFunction) {\n          return () => {\n            const inputProps = (\n              Reflect.get(target, property, target) as () => Record<string, unknown>\n            )();\n            return appendLabelledBy(inputProps, resolveId());\n          };\n        }\n        const inputProps = Reflect.get(target, property, target) as\n          | Record<string, unknown>\n          | undefined;\n        return appendLabelledBy(inputProps, resolveId());\n      }\n      return Reflect.get(target, property, receiver);\n    },\n  });\n}\n\n/**\n * Wraps a field input so its `aria-labelledby` is extended to include the prefix\n * id. Reads the nearest field context, augments only `inputProps`, and re-provides\n * the augmented value to the input.\n */\nexport function PrefixInputProvider<T extends object>(props: {\n  context: Context<T | null>;\n  prefixId: string;\n  inputPropsIsFunction?: boolean;\n  children: JSX.Element;\n}): JSX.Element {\n  const context = useContext(props.context);\n  // `props.prefixId` is read through a thunk so a caller passing a computed id\n  // set (prefix + suffix) stays live across adornment changes.\n  const value = withPrefixLabelledBy(context, () => props.prefixId, props.inputPropsIsFunction);\n  return <props.context.Provider value={value}>{props.children}</props.context.Provider>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;GAmBA,MAAM,eAAe;4BAGrB,QAAM,6CACN;oFACe,SAAA,YAAA,OAAA;CAIf,OAAM,CAAA,YAAmB,SAAM,OAAA,mBAAA;MACzB,CAAC,eAAc,IAAG,MAAA,IAAA,QAAA,cAAA;SACnB,MAAA,SAAc;MACf,EAAI,eAAQ;IACZ,EAAA,YAAQ;AACZ;AACA,SAAE,iBAAA,YAAA,UAAA;;CAEF,MAAM,aAAiB,OAAE,SAAA,YAAqB,KAAQ,SAAA,IAAA,GAAkB,KAAA,GAAA,aAAA;;EAEpE,GAAO;EACJ,mBAAoB;CACzB;AACF;;;;;;;;;;;GAWG,SAAe,qBAAS,SAAA,UAAA,uBAAA,OAAA;CACzB,IAAM,CAAA,SACA,OAAA;CAER,MAAA,kBAAA,OAAA,aAAA,aAAA,SAAA,IAAA;6BAEE,IAAA,QAAA,UAAA,UAAA;EACU,IAAC,aAAa,cAAc;GAC5B,IAAM,sBACE,aAAM;IAEJ,OAAM,iBADF,QAAsB,IAAQ,QAAQ,UAAG,MAAS,EACpB,GAAA,UAAO,CAAA;GAC9D;GAGa,OAAS,iBADS,QAAM,IAAA,QAAY,UAAc,MAClB,GAAM,UAAU,CAAA;EAC5D;EACK,OAAS,QAAA,IAAA,QAAuB,UAAQ,QAAO;CACpD,EACA,CAAA;AACF;;;;;GAKE,SAAkB,oBAAsC,OAK1C;CAIZ,MAAM,QAAQ,qBAHA,WAAa,MAAA,OAGK,SAAY,MAAU,UAAE,MAAA,oBAAA;CACxD,OAAO,CAAA,MAAA,QAAA,SAAA,OAAA,QAAA,MAAA,SAAA,EAAA,MAAA,QAAA;AACX"}
+{"version":3,"file":"prefix.jsx","names":[],"sources":["../../src/field/prefix.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Field.tsx\n\n/**\n * Shared field `prefix` slot.\n *\n * Based on packages/@react-spectrum/s2/src/Field.tsx.\n * Upstream centralizes the prefix in a\n * single shared `FieldGroup`; we compose a field group per component, so the\n * prefix is threaded into each field (TextField, ColorField, NumberField,\n * ComboBox) through these shared primitives instead.\n *\n * Two pieces, matching upstream:\n *  - `FieldPrefix` renders the prefix node (text or icon) before the input with\n *    the upstream styling (`gray-600`, `flex-shrink: 0`, `margin-end:\n *    text-to-visual`, icon sized to `'1lh'`).\n *  - `PrefixInputProvider` associates the prefix with the input by appending the\n *    prefix's id to the input's `aria-labelledby`, mirroring upstream's\n *    `InputContext.Provider value={{...ctx, 'aria-labelledby': ...}}`.\n */\nimport { useContext } from \"solid-js\";\nimport type { Context } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { CenterBaseline } from \"../icon/center-baseline\";\nimport { IconContext, type IconContextValue } from \"../icon\";\nimport { style } from \"../style\" with { type: \"macro\" };\n\nconst prefixStyles = style({\n  color: \"gray-600\",\n  flexShrink: 0,\n  marginEnd: \"text-to-visual\",\n});\n\nconst prefixIconStyles = style({\n  size: \"1lh\",\n  \"--iconPrimary\": {\n    type: \"fill\",\n    value: \"currentColor\",\n  },\n});\n\nconst prefixIconContext: IconContextValue = { styles: prefixIconStyles };\n\n/** Renders a field prefix node (text or icon) with the upstream prefix styling. */\nexport function FieldPrefix(props: { id: string; children: JSX.Element }): JSX.Element {\n  return (\n    <IconContext value={prefixIconContext}>\n      <CenterBaseline id={props.id} styles={prefixStyles}>\n        {props.children}\n      </CenterBaseline>\n    </IconContext>\n  );\n}\n\nfunction appendLabelledBy(\n  inputProps: Record<string, unknown> | undefined,\n  prefixId: string,\n): Record<string, unknown> {\n  const base = inputProps?.[\"aria-labelledby\"];\n  const labelledBy = typeof base === \"string\" && base.length > 0 ? `${base} ${prefixId}` : prefixId;\n  return { ...inputProps, \"aria-labelledby\": labelledBy };\n}\n\n/**\n * Returns a proxy over a field context that delegates every property to the\n * original value and overrides only `inputProps`, appending `prefixId` to its\n * `aria-labelledby`. The delegation keeps the underlying getters live, so the\n * input stays reactive. `inputPropsIsFunction` handles ComboBox's function-form\n * `inputProps` (Text/Color/NumberField expose it as an object).\n *\n * `prefixId` may carry several space-separated slot ids (prefix + suffix) and\n * may be a thunk — resolved on each `inputProps` access — so a field whose\n * adornments appear or disappear after mount keeps its `aria-labelledby` live.\n */\nexport function withPrefixLabelledBy<T extends object>(\n  context: T | null,\n  prefixId: string | (() => string),\n  inputPropsIsFunction = false,\n): T | null {\n  if (!context) {\n    return context;\n  }\n  const resolveId = () => (typeof prefixId === \"function\" ? prefixId() : prefixId);\n  return new Proxy(context, {\n    get(target, property, receiver) {\n      if (property === \"inputProps\") {\n        if (inputPropsIsFunction) {\n          return () => {\n            const inputProps = (\n              Reflect.get(target, property, target) as () => Record<string, unknown>\n            )();\n            return appendLabelledBy(inputProps, resolveId());\n          };\n        }\n        const inputProps = Reflect.get(target, property, target) as\n          | Record<string, unknown>\n          | undefined;\n        return appendLabelledBy(inputProps, resolveId());\n      }\n      return Reflect.get(target, property, receiver);\n    },\n  });\n}\n\n/**\n * Wraps a field input so its `aria-labelledby` is extended to include the prefix\n * id. Reads the nearest field context, augments only `inputProps`, and re-provides\n * the augmented value to the input.\n */\nexport function PrefixInputProvider<T extends object>(props: {\n  context: Context<T | null>;\n  prefixId: string;\n  inputPropsIsFunction?: boolean;\n  children: JSX.Element;\n}): JSX.Element {\n  const context = useContext(props.context);\n  // `props.prefixId` is read through a thunk so a caller passing a computed id\n  // set (prefix + suffix) stays live across adornment changes.\n  const value = withPrefixLabelledBy(context, () => props.prefixId, props.inputPropsIsFunction);\n  return <props.context value={value}>{props.children}</props.context>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCA,MAAM,eAAA;AAcN,MAAM,oBAAsC,EAAE,QAAQ,wCAAiB;oFAGvE,SAAgB,YAAY,OAAmD;CAC7E,OAAO,CACJ,YAAY,OAAO,mBAAmB;MACrC,CAAC,eAAe,IAAI,MAAM,IAAI,QAAQ,cAAc;SACjD,MAAM,SAAS;MAClB,EAAE,eAAe;IACnB,EAAE;AAEN;AAEA,SAAS,iBACP,YACA,UACuB;CACvB,MAAM,OAAO,aAAa;CAC1B,MAAM,aAAa,OAAO,SAAS,YAAY,KAAK,SAAS,IAAI,GAAG,KAAK,GAAG,aAAa;CACzF,OAAO;EAAE,GAAG;EAAY,mBAAmB;CAAW;AACxD;;;;;;;;;;;GAaA,SAAgB,qBACd,SACA,UACA,uBAAuB,OACd;CACT,IAAI,CAAC,SACH,OAAO;CAET,MAAM,kBAAmB,OAAO,aAAa,aAAa,SAAA,IAAa;CACvE,OAAO,IAAI,MAAM,SAAS,EACxB,IAAI,QAAQ,UAAU,UAAQ;EAC5B,IAAI,aAAa,cAAc;GAC7B,IAAI,sBACF,aAAO;IAIL,OAAO,iBAFL,QAAQ,IAAI,QAAQ,UAAU,MAAA,CAAA,CAER,GAAY,UAAA,CAAA;GACtC;GAKF,OAAO,iBAHY,QAAQ,IAAI,QAAQ,UAAU,MAGzB,GAAY,UAAA,CAAA;EACtC;EACA,OAAO,QAAQ,IAAI,QAAQ,UAAU,QAAA;CACvC,EACF,CAAA;AACF;;;;;GAOA,SAAgB,oBAAsC,OAK9C;CAIN,MAAM,QAAQ,qBAHE,WAAW,MAAM,OAGE,SAAe,MAAM,UAAU,MAAM,oBAAoB;CAC5F,OAAA,CAAQ,MAAM,QAAQ,OAAO,QAAQ,MAAM,SAAQ,EAAG,MAAM;AAC9D"}