@yamada-ui/react/dist/cjs/components/alpha-slider/alpha-slider.cjs.map

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

{"version":3,"file":"alpha-slider.cjs","names":["createSlotComponent","alphaSliderStyle","useValue","checkersProps"],"sources":["../../../../src/components/alpha-slider/alpha-slider.tsx"],"sourcesContent":["\"use client\"\n\nimport type { WithoutThemeProps } from \"../../core\"\nimport type { AlphaSliderStyle } from \"./alpha-slider.style\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { alphaToHex, convertColor } from \"../../utils\"\nimport { checkersProps } from \"../color-swatch\"\nimport { HueSlider } from \"../hue-slider\"\nimport { alphaSliderStyle } from \"./alpha-slider.style\"\n\ninterface ComponentContext\n  extends Pick<\n    Required<AlphaSliderRootProps>,\n    \"color\" | \"max\" | \"min\" | \"orientation\"\n  > {}\n\nexport const getAriaValueText = (alpha: number) => `${alpha * 100}%`\n\nexport interface AlphaSliderRootProps\n  extends WithoutThemeProps<\n    Omit<\n      HueSlider.RootProps,\n      \"color\" | \"max\" | \"step\" | \"thumbProps\" | \"trackProps\"\n    >,\n    AlphaSliderStyle\n  > {\n  /**\n   * The color used for the slider.\n   */\n  color: string\n  /**\n   * The maximum allowed value of the slider. Cannot be less than min.\n   *\n   * @default 1\n   */\n  max?: number\n  /**\n   * The step in which increments or decrements have to be made.\n   *\n   * @default 0.01\n   */\n  step?: number\n  /**\n   * Props for the overlay element.\n   */\n  overlayProps?: AlphaSliderOverlayProps\n  /**\n   * Props for the thumb element.\n   */\n  thumbProps?: AlphaSliderThumbProps\n  /**\n   * Props for the track element.\n   */\n  trackProps?: AlphaSliderTrackProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: AlphaSliderPropsContext,\n  useComponentContext,\n  usePropsContext: useAlphaSliderPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<\n  AlphaSliderRootProps,\n  AlphaSliderStyle,\n  ComponentContext\n>(\"alpha-slider\", alphaSliderStyle)\n\nexport { AlphaSliderPropsContext, useAlphaSliderPropsContext }\n\n/**\n * `AlphaSlider` is a component used to allow the user to select color transparency.\n *\n * @see https://yamada-ui.com/docs/components/alpha-slider\n */\nexport const AlphaSliderRoot = withProvider<\"input\", AlphaSliderRootProps>(\n  ({\n    children,\n    color,\n    max = 1,\n    min = 0,\n    orientation: orientationProp = \"horizontal\",\n    overlayProps,\n    thumbProps,\n    trackProps,\n    ...rest\n  }) => {\n    const orientation = useValue(orientationProp)\n    const computedChildren = useMemo(() => {\n      if (children) return children\n\n      return (\n        <AlphaSliderTrack {...trackProps}>\n          <AlphaSliderThumb {...thumbProps} />\n\n          <AlphaSliderOverlay {...overlayProps} />\n        </AlphaSliderTrack>\n      )\n    }, [children, overlayProps, thumbProps, trackProps])\n    const context = useMemo(\n      () => ({ color, max, min, orientation }),\n      [color, min, max, orientation],\n    )\n\n    return (\n      <ComponentContext value={context}>\n        <HueSlider.Root max={max} min={min} orientation={orientation} {...rest}>\n          {computedChildren}\n        </HueSlider.Root>\n      </ComponentContext>\n    )\n  },\n  \"root\",\n)({ getAriaValueText, step: 0.01 })\n\nexport interface AlphaSliderOverlayProps extends HueSlider.OverlayProps {}\n\nexport const AlphaSliderOverlay = withContext<\"div\", AlphaSliderOverlayProps>(\n  HueSlider.Overlay,\n  \"overlay\",\n)(undefined, ({ layers, ...rest }) => {\n  const { color, max, min, orientation } = useComponentContext()\n\n  layers ??= [\n    checkersProps,\n    {\n      bgGradient: `linear(${[\n        orientation === \"horizontal\" ? \"to-r\" : \"to-t\",\n        convertColor(color)(\"hex\") + alphaToHex(min),\n        convertColor(color)(\"hex\") + alphaToHex(max),\n      ].join(\", \")})`,\n      boxShadow: \"inner\",\n    },\n  ]\n\n  return { layers, ...rest }\n})\n\nexport interface AlphaSliderTrackProps extends HueSlider.TrackProps {}\n\nexport const AlphaSliderTrack = withContext<\"div\", AlphaSliderTrackProps>(\n  HueSlider.Track,\n  \"track\",\n)()\n\nexport interface AlphaSliderThumbProps extends HueSlider.ThumbProps {}\n\nexport const AlphaSliderThumb = withContext<\"div\", AlphaSliderThumbProps>(\n  HueSlider.Thumb,\n  \"thumb\",\n)()\n"],"mappings":";;;;;;;;;;;;;;;;AAkBA,MAAa,oBAAoB,UAAkB,GAAG,QAAQ,IAAI;AAwClE,MAAM,EACJ,kBACA,cAAc,yBACd,qBACA,iBAAiB,4BACjB,aACA,iBACEA,6CAIF,gBAAgBC,4CAAiB;;;;;;AASnC,MAAa,kBAAkB,cAC5B,EACC,UACA,OACA,MAAM,GACN,MAAM,GACN,aAAa,kBAAkB,cAC/B,cACA,YACA,WACA,GAAG,WACC;CACJ,MAAM,cAAcC,uCAAS,gBAAgB;CAC7C,MAAM,4CAAiC;AACrC,MAAI,SAAU,QAAO;AAErB,SACE,4CAAC;GAAiB,GAAI;cACpB,2CAAC,oBAAiB,GAAI,aAAc,EAEpC,2CAAC,sBAAmB,GAAI,eAAgB;IACvB;IAEpB;EAAC;EAAU;EAAc;EAAY;EAAW,CAAC;AAMpD,QACE,2CAAC;EAAiB,iCALX;GAAE;GAAO;GAAK;GAAK;GAAa,GACvC;GAAC;GAAO;GAAK;GAAK;GAAY,CAC/B;YAIG;GAAqB;GAAU;GAAkB;GAAa,GAAI;aAC/D;IACc;GACA;GAGvB,OACD,CAAC;CAAE;CAAkB,MAAM;CAAM,CAAC;AAInC,MAAa,qBAAqB,iDAEhC,UACD,CAAC,SAAY,EAAE,OAAQ,GAAG,WAAW;CACpC,MAAM,EAAE,OAAO,KAAK,KAAK,gBAAgB,qBAAqB;AAE9D,YAAW,CACTC,oCACA;EACE,YAAY,UAAU;GACpB,gBAAgB,eAAe,SAAS;uDAC3B,MAAM,CAAC,MAAM,qDAAc,IAAI;uDAC/B,MAAM,CAAC,MAAM,qDAAc,IAAI;GAC7C,CAAC,KAAK,KAAK,CAAC;EACb,WAAW;EACZ,CACF;AAED,QAAO;EAAE;EAAQ,GAAG;EAAM;EAC1B;AAIF,MAAa,mBAAmB,+CAE9B,QACD,EAAE;AAIH,MAAa,mBAAmB,+CAE9B,QACD,EAAE"}