@yamada-ui/react/dist/cjs/components/segmented-control/segmented-control.cjs.map

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

{"version":3,"file":"segmented-control.cjs","names":["createSlotComponent","segmentedControlStyle","useSegmentedControl","useValue","rest","SegmentedControlContext","SegmentedControlDescendantsContext","LayoutGroup","styled","useSegmentedControlItem","motion"],"sources":["../../../../src/components/segmented-control/segmented-control.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { SegmentedControlStyle } from \"./segmented-control.style\"\nimport type {\n  UseSegmentedControlItemProps,\n  UseSegmentedControlProps,\n} from \"./use-segmented-control\"\nimport { LayoutGroup } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { motion } from \"../motion\"\nimport { segmentedControlStyle } from \"./segmented-control.style\"\nimport {\n  SegmentedControlContext,\n  SegmentedControlDescendantsContext,\n  useSegmentedControl,\n  useSegmentedControlItem,\n} from \"./use-segmented-control\"\n\nexport interface SegmentedControlItem extends SegmentedControlItemProps {\n  label?: ReactNode\n}\n\ninterface ComponentContext\n  extends Pick<SegmentedControlRootProps, \"indicatorProps\" | \"itemProps\"> {}\n\nexport interface SegmentedControlRootProps<Y extends string = string>\n  extends Omit<HTMLStyledProps, \"defaultValue\" | \"onChange\">,\n    ThemeProps<SegmentedControlStyle>,\n    Omit<UseSegmentedControlProps<Y>, \"orientation\"> {\n  /**\n   * If provided, generate segmented control buttons but based on items.\n   *\n   * @default []\n   */\n  items?: SegmentedControlItem[]\n  /**\n   * Props for the indicator component.\n   */\n  indicatorProps?: SegmentedControlIndicatorProps\n  /**\n   * Props for the item component.\n   */\n  itemProps?: SegmentedControlItemProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: SegmentedControlPropsContext,\n  useComponentContext,\n  usePropsContext: useSegmentedControlPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<\n  SegmentedControlRootProps,\n  SegmentedControlStyle,\n  ComponentContext\n>(\"segmented-control\", segmentedControlStyle)\n\nexport { SegmentedControlPropsContext, useSegmentedControlPropsContext }\n\n/**\n * `SegmentedControl` is a component used for allowing users to select one option from multiple choices.\n *\n * @see https://yamada-ui.com/docs/components/segmented-control\n */\nexport const SegmentedControlRoot = withProvider(\n  ({\n    children,\n    items = [],\n    orientation: orientationProp,\n    indicatorProps,\n    itemProps,\n    ...rest\n  }) => {\n    const computedOrientation = useValue(orientationProp)\n    const {\n      id,\n      name,\n      descendants,\n      disabled,\n      orientation,\n      readOnly,\n      setValue,\n      value,\n      getRootProps,\n    } = useSegmentedControl({ orientation: computedOrientation, ...rest })\n    const cloneChildren = useMemo(() => {\n      if (children) {\n        return children\n      } else {\n        return items.map(({ label, ...rest }, index) => (\n          <SegmentedControlItem key={index} {...rest}>\n            {label}\n          </SegmentedControlItem>\n        ))\n      }\n    }, [children, items])\n    const context = useMemo(\n      () => ({ id, name, disabled, orientation, readOnly, setValue, value }),\n      [id, name, disabled, readOnly, orientation, setValue, value],\n    )\n    const componentContext = useMemo(\n      () => ({ indicatorProps, itemProps }),\n      [itemProps, indicatorProps],\n    )\n\n    return (\n      <SegmentedControlContext value={context}>\n        <ComponentContext value={componentContext}>\n          <SegmentedControlDescendantsContext value={descendants}>\n            <LayoutGroup id={id}>\n              <styled.div {...getRootProps()}>{cloneChildren}</styled.div>\n            </LayoutGroup>\n          </SegmentedControlDescendantsContext>\n        </ComponentContext>\n      </SegmentedControlContext>\n    )\n  },\n  \"root\",\n  { transferProps: [\"orientation\"] },\n)() as GenericsComponent<{\n  <Y extends string = string>(props: SegmentedControlRootProps<Y>): ReactElement\n}>\n\nexport interface SegmentedControlItemProps<Y extends string = string>\n  extends HTMLStyledProps<\"label\">,\n    UseSegmentedControlItemProps<Y> {\n  /**\n   * Props for the indicator component.\n   */\n  indicatorProps?: SegmentedControlIndicatorProps\n}\n\nexport const SegmentedControlItem = withContext<\n  \"label\",\n  SegmentedControlItemProps\n>(({ children, indicatorProps, ...rest }) => {\n  const { checked, getInputProps, getLabelProps } =\n    useSegmentedControlItem(rest)\n\n  return (\n    <styled.label {...getLabelProps()}>\n      <styled.input {...getInputProps()} />\n\n      <styled.span>{children}</styled.span>\n\n      {checked ? <SegmentedControlIndicator {...indicatorProps} /> : null}\n    </styled.label>\n  )\n}, \"item\")((props) => {\n  const { indicatorProps, itemProps } = useComponentContext()\n\n  return {\n    ...itemProps,\n    ...props,\n    indicatorProps: {\n      ...indicatorProps,\n      ...itemProps?.indicatorProps,\n      ...props.indicatorProps,\n    },\n  }\n}) as GenericsComponent<{\n  <Y extends string = string>(props: SegmentedControlItemProps<Y>): ReactElement\n}>\n\ninterface SegmentedControlIndicatorProps extends HTMLMotionProps {}\n\nconst SegmentedControlIndicator = withContext<\n  \"div\",\n  SegmentedControlIndicatorProps\n>(({ transition, ...props }) => {\n  return (\n    <motion.div\n      layoutDependency={false}\n      layoutId=\"indicator\"\n      transition={{ duration: 0.2, ...transition }}\n      {...props}\n    />\n  )\n}, \"indicator\")()\n"],"mappings":";;;;;;;;;;;;;;;;;;AAkDA,MAAM,EACJ,kBACA,cAAc,8BACd,qBACA,iBAAiB,iCACjB,aACA,iBACEA,6CAIF,qBAAqBC,sDAAsB;;;;;;AAS7C,MAAa,uBAAuB,cACjC,EACC,UACA,QAAQ,EAAE,EACV,aAAa,iBACb,gBACA,UACA,GAAG,WACC;CAEJ,MAAM,EACJ,IACA,MACA,aACA,UACA,aACA,UACA,UACA,OACA,iBACEC,kDAAoB;EAAE,aAXEC,uCAAS,gBAAgB;EAWO,GAAG;EAAM,CAAC;CACtE,MAAM,yCAA8B;AAClC,MAAI,SACF,QAAO;MAEP,QAAO,MAAM,KAAK,EAAE,MAAO,GAAGC,UAAQ,UACpC,2CAAC;GAAiC,GAAIA;aACnC;KADwB,MAEJ,CACvB;IAEH,CAAC,UAAU,MAAM,CAAC;AAUrB,QACE,2CAACC;EAAwB,iCATlB;GAAE;GAAI;GAAM;GAAU;GAAa;GAAU;GAAU;GAAO,GACrE;GAAC;GAAI;GAAM;GAAU;GAAU;GAAa;GAAU;GAAM,CAC7D;YAQG,2CAAC;GAAiB,iCANb;IAAE;IAAgB;IAAW,GACpC,CAAC,WAAW,eAAe,CAC5B;aAKK,2CAACC;IAAmC,OAAO;cACzC,2CAACC;KAAgB;eACf,2CAACC,uBAAO;MAAI,GAAI,cAAc;gBAAG;OAA2B;MAChD;KACqB;IACpB;GACK;GAG9B,QACA,EAAE,eAAe,CAAC,cAAc,EAAE,CACnC,EAAE;AAaH,MAAa,uBAAuB,aAGjC,EAAE,UAAU,eAAgB,GAAG,WAAW;CAC3C,MAAM,EAAE,SAAS,eAAe,kBAC9BC,sDAAwB,KAAK;AAE/B,QACE,4CAACD,uBAAO;EAAM,GAAI,eAAe;;GAC/B,2CAACA,uBAAO,SAAM,GAAI,eAAe,GAAI;GAErC,2CAACA,uBAAO,QAAM,WAAuB;GAEpC,UAAU,2CAAC,6BAA0B,GAAI,iBAAkB,GAAG;;GAClD;GAEhB,OAAO,EAAE,UAAU;CACpB,MAAM,EAAE,gBAAgB,cAAc,qBAAqB;AAE3D,QAAO;EACL,GAAG;EACH,GAAG;EACH,gBAAgB;GACd,GAAG;GACH,GAAG,WAAW;GACd,GAAG,MAAM;GACV;EACF;EACD;AAMF,MAAM,4BAA4B,aAG/B,EAAE,WAAY,GAAG,YAAY;AAC9B,QACE,2CAACE,yBAAO;EACN,kBAAkB;EAClB,UAAS;EACT,YAAY;GAAE,UAAU;GAAK,GAAG;GAAY;EAC5C,GAAI;GACJ;GAEH,YAAY,EAAE"}