@proyecto-viviana/ui 0.5.0 → 0.6.0

package/dist/_chunk/numberfield.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"numberfield.js","names":["JSX","createUIIcon","AddProps","SvgSVGAttributes","SVGSVGElement","size","Add_XSSvg","props","Element","class","className","width","_width","height","_height","rest","_el$","_$getNextElement","_tmpl$","_$spread","_$mergeProps","_$runHydrationEvents","Add_SSvg","_el$2","_tmpl$2","Add_MSvg","_el$3","_tmpl$3","Add_LSvg","_el$4","_tmpl$4","Add_XLSvg","_el$5","_tmpl$5","Add_XS","Add_S","Add_M","Add_L","Add_XL","Add","_$createComponent","AddIcon"],"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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"}