@atom-learning/components 8.1.1 → 8.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -16,7 +16,10 @@ var SegmentedControlRoot = ({ size, theme = "primary", defaultValue, children, v
|
|
|
16
16
|
const isControlled = value !== void 0;
|
|
17
17
|
const [internalValue, setInternalValue] = React$1.useState(defaultValue);
|
|
18
18
|
const currentValue = isControlled ? value : internalValue;
|
|
19
|
-
const handleValueChange =
|
|
19
|
+
const handleValueChange = React$1.useCallback((newValue) => {
|
|
20
|
+
if (!isControlled) setInternalValue(newValue);
|
|
21
|
+
onValueChange?.(newValue);
|
|
22
|
+
}, [isControlled, onValueChange]);
|
|
20
23
|
React$1.useEffect(() => {
|
|
21
24
|
if (!isControlled && defaultValue) setInternalValue(defaultValue);
|
|
22
25
|
}, [defaultValue, isControlled]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControlRoot.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Tabs } from '../tabs/Tabs'\nimport { SegmentedControlContext } from './SegmentedControl.context'\nimport type { SegmentedControlTheme } from './SegmentedControl.types'\n\nconst StyledSegmentedControlRoot = styled(\n Tabs,\n {\n base: ['[&>div]:border-none'],\n variants: {\n size: {\n sm: ['w-[unset]!'],\n md: [],\n lg: []\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\nexport interface SegmentedControlRootProps extends React.ComponentProps<\n typeof StyledSegmentedControlRoot\n> {\n theme?: SegmentedControlTheme\n}\n\nexport const SegmentedControlRoot = ({\n size,\n theme = 'primary',\n defaultValue,\n children,\n value,\n onValueChange,\n ...rest\n}: React.PropsWithChildren<SegmentedControlRootProps>) => {\n const isControlled = value !== undefined\n\n const [internalValue, setInternalValue] = React.useState(defaultValue)\n\n const currentValue = isControlled ? value : internalValue\n
|
|
1
|
+
{"version":3,"file":"SegmentedControlRoot.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Tabs } from '../tabs/Tabs'\nimport { SegmentedControlContext } from './SegmentedControl.context'\nimport type { SegmentedControlTheme } from './SegmentedControl.types'\n\nconst StyledSegmentedControlRoot = styled(\n Tabs,\n {\n base: ['[&>div]:border-none'],\n variants: {\n size: {\n sm: ['w-[unset]!'],\n md: [],\n lg: []\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\nexport interface SegmentedControlRootProps extends React.ComponentProps<\n typeof StyledSegmentedControlRoot\n> {\n theme?: SegmentedControlTheme\n}\n\nexport const SegmentedControlRoot = ({\n size,\n theme = 'primary',\n defaultValue,\n children,\n value,\n onValueChange,\n ...rest\n}: React.PropsWithChildren<SegmentedControlRootProps>) => {\n const isControlled = value !== undefined\n\n const [internalValue, setInternalValue] = React.useState(defaultValue)\n\n const currentValue = isControlled ? value : internalValue\n // Fire the consumer's `onValueChange` in BOTH modes; only own internal state\n // when uncontrolled. (Previously `isControlled ? onValueChange :\n // setInternalValue`, which silently dropped the consumer callback in\n // uncontrolled mode once `onValueChange` stopped leaking through `...rest`.)\n const handleValueChange = React.useCallback(\n (newValue: string) => {\n if (!isControlled) setInternalValue(newValue)\n onValueChange?.(newValue)\n },\n [isControlled, onValueChange]\n )\n\n React.useEffect(() => {\n if (!isControlled && defaultValue) {\n setInternalValue(defaultValue)\n }\n }, [defaultValue, isControlled])\n\n const contextValue = React.useMemo(\n () => ({\n size,\n theme,\n defaultValue,\n onValueChange: handleValueChange,\n value: currentValue\n }),\n [size, theme, defaultValue, handleValueChange, currentValue]\n )\n\n return (\n <SegmentedControlContext.Provider value={contextValue}>\n <StyledSegmentedControlRoot\n size={size}\n value={currentValue}\n onValueChange={handleValueChange}\n {...rest}\n >\n {children}\n </StyledSegmentedControlRoot>\n </SegmentedControlContext.Provider>\n )\n}\n"],"mappings":";;;;;;AAOA,IAAM,6BAA6B,OACjC,MACA;CACE,MAAM,CAAC,qBAAqB;CAC5B,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,YAAY;EACjB,IAAI,CAAC;EACL,IAAI,CAAC;CACP,EACF;AACF,GACA,EAAE,2BAA2B,KAAK,CACpC;AAQA,IAAa,wBAAwB,EACnC,MACA,QAAQ,WACR,cACA,UACA,OACA,eACA,GAAG,WACqD;CACxD,MAAM,eAAe,UAAU,KAAA;CAE/B,MAAM,CAAC,eAAe,oBAAoB,QAAM,SAAS,YAAY;CAErE,MAAM,eAAe,eAAe,QAAQ;CAK5C,MAAM,oBAAoB,QAAM,aAC7B,aAAqB;EACpB,IAAI,CAAC,cAAc,iBAAiB,QAAQ;EAC5C,gBAAgB,QAAQ;CAC1B,GACA,CAAC,cAAc,aAAa,CAC9B;CAEA,QAAM,gBAAgB;EACpB,IAAI,CAAC,gBAAgB,cACnB,iBAAiB,YAAY;CAEjC,GAAG,CAAC,cAAc,YAAY,CAAC;CAE/B,MAAM,eAAe,QAAM,eAClB;EACL;EACA;EACA;EACA,eAAe;EACf,OAAO;CACT,IACA;EAAC;EAAM;EAAO;EAAc;EAAmB;CAAY,CAC7D;CAEA,OACE,oBAAC,wBAAwB,UAAzB;EAAkC,OAAO;YACvC,oBAAC,4BAAD;GACQ;GACN,OAAO;GACP,eAAe;GACf,GAAI;GAEH;EACyB,CAAA;CACI,CAAA;AAEtC"}
|
package/dist/index.cjs.js
CHANGED
|
@@ -11004,7 +11004,10 @@ var SegmentedControlRoot = ({ size, theme = "primary", defaultValue, children, v
|
|
|
11004
11004
|
const isControlled = value !== void 0;
|
|
11005
11005
|
const [internalValue, setInternalValue] = react.useState(defaultValue);
|
|
11006
11006
|
const currentValue = isControlled ? value : internalValue;
|
|
11007
|
-
const handleValueChange =
|
|
11007
|
+
const handleValueChange = react.useCallback((newValue) => {
|
|
11008
|
+
if (!isControlled) setInternalValue(newValue);
|
|
11009
|
+
onValueChange?.(newValue);
|
|
11010
|
+
}, [isControlled, onValueChange]);
|
|
11008
11011
|
react.useEffect(() => {
|
|
11009
11012
|
if (!isControlled && defaultValue) setInternalValue(defaultValue);
|
|
11010
11013
|
}, [defaultValue, isControlled]);
|