UNPKG

@lobehub/ui

Version:

Lobe UI is an open-source UI component library for building AIGC web apps

github.com/lobehub/lobe-ui

lobehub/lobe-ui

1 lines • 3.88 kB
1
{"version":3,"file":"ToggleGroup.mjs","names":["useControlledState"],"sources":["../../../src/base-ui/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { useMemo } from 'react';\nimport useControlledState from 'use-merge-value';\n\nimport {\n ToggleGroupItem,\n ToggleGroupItemIcon,\n ToggleGroupItemLabel,\n ToggleGroupRoot,\n} from './atoms';\nimport type { ToggleGroupOption, ToggleGroupProps } from './type';\n\nconst normalizeOption = <Value extends string>(\n option: ToggleGroupOption<Value> | Value,\n): ToggleGroupOption<Value> => (typeof option === 'string' ? { value: option } : option);\n\nconst ToggleGroup = <Value extends string = string>({\n className,\n classNames,\n defaultValue,\n disabled = false,\n onChange,\n options,\n ref,\n size = 'middle',\n style,\n styles: customStyles,\n value,\n variant = 'outlined',\n}: ToggleGroupProps<Value>) => {\n const [innerValue, setInnerValue] = useControlledState<Value | undefined>(defaultValue, {\n defaultValue,\n onChange: (next) => {\n if (next != null) onChange?.(next);\n },\n value,\n });\n\n const normalizedOptions = useMemo(\n () => (options ?? []).map((o) => normalizeOption<Value>(o)),\n [options],\n );\n\n const groupValue = useMemo<Value[]>(() => (innerValue != null ? [innerValue] : []), [innerValue]);\n\n return (\n <ToggleGroupRoot<Value>\n className={cx(classNames?.root, className)}\n disabled={disabled}\n ref={ref}\n style={{ ...style, ...customStyles?.root }}\n value={groupValue}\n variant={variant}\n onValueChange={(next) => {\n const picked = next[0];\n if (picked != null) setInnerValue(picked);\n }}\n >\n {normalizedOptions.map((opt) => (\n <ToggleGroupItem<Value>\n aria-label={typeof opt.label === 'string' ? opt.label : opt.title}\n className={cx(classNames?.item, opt.className)}\n disabled={disabled || opt.disabled}\n key={opt.value}\n size={size}\n style={customStyles?.item}\n title={opt.title}\n value={opt.value}\n variant={variant}\n >\n {opt.icon != null && (\n <ToggleGroupItemIcon className={classNames?.itemIcon} style={customStyles?.itemIcon}>\n {opt.icon}\n </ToggleGroupItemIcon>\n )}\n {opt.label != null && (\n <ToggleGroupItemLabel className={classNames?.itemLabel} style={customStyles?.itemLabel}>\n {opt.label}\n </ToggleGroupItemLabel>\n )}\n </ToggleGroupItem>\n ))}\n </ToggleGroupRoot>\n );\n};\n\nToggleGroup.displayName = 'ToggleGroup';\n\nexport default ToggleGroup;\n"],"mappings":";;;;;;;AAcA,MAAM,mBACJ,WAC8B,OAAO,WAAW,WAAW,EAAE,OAAO,OAAO,IAAI;AAEjF,MAAM,eAA8C,EAClD,WACA,YACA,cACA,WAAW,OACX,UACA,SACA,KACA,OAAO,UACP,OACA,QAAQ,cACR,OACA,UAAU,iBACmB;CAC7B,MAAM,CAAC,YAAY,iBAAiBA,cAAsC,cAAc;EACtF;EACA,WAAW,SAAS;GAClB,IAAI,QAAQ,MAAM,WAAW,IAAI;EACnC;EACA;CACF,CAAC;CAED,MAAM,oBAAoB,eACjB,WAAW,CAAC,EAAA,CAAG,KAAK,MAAM,gBAAuB,CAAC,CAAC,GAC1D,CAAC,OAAO,CACV;CAEA,MAAM,aAAa,cAAwB,cAAc,OAAO,CAAC,UAAU,IAAI,CAAC,GAAI,CAAC,UAAU,CAAC;CAEhG,OACE,oBAAC,iBAAD;EACE,WAAW,GAAG,YAAY,MAAM,SAAS;EAC/B;EACL;EACL,OAAO;GAAE,GAAG;GAAO,GAAG,cAAc;EAAK;EACzC,OAAO;EACE;EACT,gBAAgB,SAAS;GACvB,MAAM,SAAS,KAAK;GACpB,IAAI,UAAU,MAAM,cAAc,MAAM;EAC1C;EAEC,UAAA,kBAAkB,KAAK,QACtB,qBAAC,iBAAD;GACE,cAAY,OAAO,IAAI,UAAU,WAAW,IAAI,QAAQ,IAAI;GAC5D,WAAW,GAAG,YAAY,MAAM,IAAI,SAAS;GAC7C,UAAU,YAAY,IAAI;GAEpB;GACN,OAAO,cAAc;GACrB,OAAO,IAAI;GACX,OAAO,IAAI;GACF;GATX,UAAA,CAWG,IAAI,QAAQ,QACX,oBAAC,qBAAD;IAAqB,WAAW,YAAY;IAAU,OAAO,cAAc;IACxE,UAAA,IAAI;GACc,CAAA,GAEtB,IAAI,SAAS,QACZ,oBAAC,sBAAD;IAAsB,WAAW,YAAY;IAAW,OAAO,cAAc;IAC1E,UAAA,IAAI;GACe,CAAA,CAET;EAjBV,GAAA,IAAI,KAiBM,CAClB;CACc,CAAA;AAErB;AAEA,YAAY,cAAc"}