@atom-learning/components 5.4.0 → 5.4.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.
- package/CHANGELOG.md +2 -13
- package/dist/components/badge/Badge.js +1 -1
- package/dist/components/badge/Badge.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControl.d.ts +2 -370
- package/dist/components/segmented-control/SegmentedControl.types.d.ts +1 -0
- package/dist/components/segmented-control/SegmentedControlBadge.js +1 -1
- package/dist/components/segmented-control/SegmentedControlBadge.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlContext.d.ts +3 -5
- package/dist/components/segmented-control/SegmentedControlContext.js +1 -1
- package/dist/components/segmented-control/SegmentedControlContext.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlDescription.js +1 -1
- package/dist/components/segmented-control/SegmentedControlDescription.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlHeading.js +1 -1
- package/dist/components/segmented-control/SegmentedControlHeading.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlIcon.js +1 -1
- package/dist/components/segmented-control/SegmentedControlIcon.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlItem.js +1 -1
- package/dist/components/segmented-control/SegmentedControlItem.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlItemList.d.ts +1 -2
- package/dist/components/segmented-control/SegmentedControlItemList.js +1 -1
- package/dist/components/segmented-control/SegmentedControlItemList.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlRoot.d.ts +2 -2
- package/dist/components/segmented-control/SegmentedControlRoot.js +1 -1
- package/dist/components/segmented-control/SegmentedControlRoot.js.map +1 -1
- package/dist/docgen.json +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,20 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
## [5.4.2](https://github.com/Atom-Learning/components/compare/v5.4.1...v5.4.2) (2025-08-06)
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
### Bug Fixes
|
|
5
5
|
|
|
6
|
-
*
|
|
7
|
-
* added build lib step before building docs ([c4f7856](https://github.com/Atom-Learning/components/commit/c4f7856c1ddcdf561296d00cc584c76fa328c13f))
|
|
8
|
-
* fixing order of tasks in release ([f6a315f](https://github.com/Atom-Learning/components/commit/f6a315f9a6dc033342ed4d9c5ba3f9fc6c9b4b10))
|
|
9
|
-
* made types explicit in the badge variant list constants ([b48fc64](https://github.com/Atom-Learning/components/commit/b48fc6477c190d2d4da3efd201ccb06803b938e3))
|
|
10
|
-
* make themes and emphasis types explicit ([a1d9256](https://github.com/Atom-Learning/components/commit/a1d92563c1e4f11550b622ad23fdbecdda36bd45))
|
|
11
|
-
* run build steps from root directory ([9c9f000](https://github.com/Atom-Learning/components/commit/9c9f000ff57e1ca38f9e8a7605060cf5ad5780f1))
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
### Features
|
|
15
|
-
|
|
16
|
-
* accordion arrow position ([d6daf56](https://github.com/Atom-Learning/components/commit/d6daf564fd73d70392be514a8e15b0d03de01f79))
|
|
17
|
-
* added build step to release, and build docs to ci test ([a2e52cd](https://github.com/Atom-Learning/components/commit/a2e52cdffc865cd118f9e48d0458e265925fa356))
|
|
6
|
+
* segmented control defaultValue incorrect ([3bc63be](https://github.com/Atom-Learning/components/commit/3bc63bee6b8bb6119b80482b6e807d514ef03d6f))
|
|
18
7
|
|
|
19
8
|
# [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
|
|
20
9
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import*as e from"react";import{Flex as x}from"../flex/Flex.js";import{Icon as $}from"../icon/Icon.js";import{styled as k}from"../../stitches.js";import{useCallbackRefState as v}from"../../utilities/hooks/useCallbackRef.js";import{BadgeContext as y,BadgeProvider as B}from"./Badge.context.js";import{BadgeIcon as a}from"./BadgeIcon.js";import{BadgeText as n}from"./BadgeText.js";import{colorSchemes as C,badgeSemanticNames as w}from"./stitches.badge.colorscheme.config.js";import{OptionalTooltipWrapper as O}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const S=k(x,{justifyContent:"center",alignItems:"center",borderRadius:"$0",minWidth:0,border:"1px solid #FFFFFF",fontFamily:"$body","& > *:not(:last-child)":{mr:"$1"},variants:{emphasis:{white:{color:"$textOnWhite",background:"white"},subtle:{color:"$textSubtle",background:"$backgroundSubtle"},bold:{color:"$textBold",background:"$backgroundBold"}},size:{xs:{px:"$1"},sm:{px:"$1",py:"$0"},md:{px:"$2",py:"$1"}},isClickable:{true:{cursor:"pointer"}},highlighted:{true:{}}},compoundVariants:[{isClickable:!0,emphasis:"white",css:{"&:hover":{color:"$textOnWhite",background:"color-mix(in srgb, $textOnWhite, transparent 92%)"}}},{isClickable:!0,emphasis:"subtle",css:{"&:hover":{color:"$textSubtleHover",background:"$backgroundSubtleHover"}}},{isClickable:!0,emphasis:"bold",css:{"&:hover":{color:"$textBold",background:"$backgroundBoldHover"}}},{emphasis:"white",highlighted:!0,css:{color:"$textOnWhite",background:"color-mix(in srgb, $textOnWhite, transparent 92%)"}},{emphasis:"subtle",highlighted:!0,css:{color:"$textSubtleHover",background:"$backgroundSubtleHover"}},{emphasis:"bold",highlighted:!0,css:{color:"$textBold",background:"$backgroundBoldHover"}}]}),F=e.forwardRef(({theme:r="info",emphasis:s="subtle",children:i,...o},d)=>{const{size:m,overflow:b,isOverflowing:p}=e.useContext(y),[l,u]=v();e.useImperativeHandle(d,()=>l);const h=l==null?void 0:l.textContent,g=w.includes(r),f=Object.keys(o).includes("onClick")||Object.keys(o).includes("href");return e.createElement(O,{hasTooltip:b==="ellipsis"&&p,label:h},e.createElement(S,{role:"status",emphasis:s,size:m,...o,className:C[r],ref:u,isClickable:f&&!g},e.Children.map(i,t=>typeof t=="string"||typeof t=="number"?e.createElement(n,null,t):e.isValidElement(t)&&t.type===$?e.createElement(a,{...t.props}):t)))}),c=e.forwardRef(({size:r="sm",overflow:s="wrap",...i},o)=>e.createElement(B,{size:r,overflow:s},e.createElement(F,{...i,ref:o}))),E=Object.assign(c,{Icon:a,Text:n});c.displayName="Badge";export{E as Badge};
|
|
2
2
|
//# sourceMappingURL=Badge.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/stitches'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\n\nimport { BadgeContext, BadgeProvider } from './Badge.context'\nimport { BadgeIcon } from './BadgeIcon'\nimport { BadgeText } from './BadgeText'\nimport {\n badgeSemanticNames,\n colorSchemes as badgeColorSchemes\n} from './stitches.badge.colorscheme.config'\n\nconst StyledBadge = styled(Flex, {\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: '$0',\n minWidth: 0,\n border: '1px solid #FFFFFF',\n fontFamily: '$body',\n '& > *:not(:last-child)': {\n mr: '$1'\n },\n variants: {\n emphasis: {\n white: {\n color: '$textOnWhite',\n background: 'white'\n },\n subtle: {\n color: '$textSubtle',\n background: '$backgroundSubtle'\n },\n bold: {\n color: '$textBold',\n background: '$backgroundBold'\n }\n },\n size: {\n xs: {\n px: '$1'\n },\n sm: {\n px: '$1',\n py: '$0'\n },\n md: {\n px: '$2',\n py: '$1'\n }\n },\n\n isClickable: {\n true: {\n cursor: 'pointer'\n }\n },\n highlighted: {\n true: {}\n }\n },\n compoundVariants: [\n {\n isClickable: true,\n emphasis: 'white',\n css: {\n '&:hover': {\n color: '$textOnWhite',\n background: 'color-mix(in srgb, $textOnWhite, transparent 92%)'\n }\n }\n },\n {\n isClickable: true,\n emphasis: 'subtle',\n css: {\n '&:hover': {\n color: '$textSubtleHover',\n background: '$backgroundSubtleHover'\n }\n }\n },\n {\n isClickable: true,\n emphasis: 'bold',\n css: {\n '&:hover': {\n color: '$textBold',\n background: '$backgroundBoldHover'\n }\n }\n },\n {\n emphasis: 'white',\n highlighted: true,\n css: {\n color: '$textOnWhite',\n background: 'color-mix(in srgb, $textOnWhite, transparent 92%)'\n }\n },\n {\n emphasis: 'subtle',\n highlighted: true,\n css: {\n color: '$textSubtleHover',\n background: '$backgroundSubtleHover'\n }\n },\n {\n emphasis: 'bold',\n highlighted: true,\n css: {\n color: '$textBold',\n background: '$backgroundBoldHover'\n }\n }\n ]\n})\n\nexport type TBadgeProps = React.ComponentProps<typeof StyledBadge> & {\n theme?: keyof typeof badgeColorSchemes\n overflow?: React.ComponentProps<typeof BadgeText>['overflow']\n}\n\ntype TBadgeInnerProps = Omit<TBadgeProps, 'size' | 'overflow'>\n\nconst BadgeInner: React.ForwardRefExoticComponent<TBadgeInnerProps> =\n React.forwardRef(\n ({ theme = 'info', emphasis = 'subtle', children, ...rest }, ref) => {\n const { size, overflow, isOverflowing } = React.useContext(BadgeContext)\n const [badgeElRef, setBadgeElRef] = useCallbackRefState()\n React.useImperativeHandle(ref, () => badgeElRef as HTMLDivElement)\n\n const label = badgeElRef?.textContent\n\n const isInfoOnly = badgeSemanticNames.includes(theme)\n\n const isClickable =\n Object.keys(rest).includes('onClick') ||\n Object.keys(rest).includes('href')\n\n
|
|
1
|
+
{"version":3,"file":"Badge.js","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/stitches'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\n\nimport { BadgeContext, BadgeProvider } from './Badge.context'\nimport { BadgeIcon } from './BadgeIcon'\nimport { BadgeText } from './BadgeText'\nimport {\n badgeSemanticNames,\n colorSchemes as badgeColorSchemes\n} from './stitches.badge.colorscheme.config'\n\nconst StyledBadge = styled(Flex, {\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: '$0',\n minWidth: 0,\n border: '1px solid #FFFFFF',\n fontFamily: '$body',\n '& > *:not(:last-child)': {\n mr: '$1'\n },\n variants: {\n emphasis: {\n white: {\n color: '$textOnWhite',\n background: 'white'\n },\n subtle: {\n color: '$textSubtle',\n background: '$backgroundSubtle'\n },\n bold: {\n color: '$textBold',\n background: '$backgroundBold'\n }\n },\n size: {\n xs: {\n px: '$1'\n },\n sm: {\n px: '$1',\n py: '$0'\n },\n md: {\n px: '$2',\n py: '$1'\n }\n },\n\n isClickable: {\n true: {\n cursor: 'pointer'\n }\n },\n highlighted: {\n true: {}\n }\n },\n compoundVariants: [\n {\n isClickable: true,\n emphasis: 'white',\n css: {\n '&:hover': {\n color: '$textOnWhite',\n background: 'color-mix(in srgb, $textOnWhite, transparent 92%)'\n }\n }\n },\n {\n isClickable: true,\n emphasis: 'subtle',\n css: {\n '&:hover': {\n color: '$textSubtleHover',\n background: '$backgroundSubtleHover'\n }\n }\n },\n {\n isClickable: true,\n emphasis: 'bold',\n css: {\n '&:hover': {\n color: '$textBold',\n background: '$backgroundBoldHover'\n }\n }\n },\n {\n emphasis: 'white',\n highlighted: true,\n css: {\n color: '$textOnWhite',\n background: 'color-mix(in srgb, $textOnWhite, transparent 92%)'\n }\n },\n {\n emphasis: 'subtle',\n highlighted: true,\n css: {\n color: '$textSubtleHover',\n background: '$backgroundSubtleHover'\n }\n },\n {\n emphasis: 'bold',\n highlighted: true,\n css: {\n color: '$textBold',\n background: '$backgroundBoldHover'\n }\n }\n ]\n})\n\nexport type TBadgeProps = React.ComponentProps<typeof StyledBadge> & {\n theme?: keyof typeof badgeColorSchemes\n overflow?: React.ComponentProps<typeof BadgeText>['overflow']\n}\n\ntype TBadgeInnerProps = Omit<TBadgeProps, 'size' | 'overflow'>\n\nconst BadgeInner: React.ForwardRefExoticComponent<TBadgeInnerProps> =\n React.forwardRef(\n ({ theme = 'info', emphasis = 'subtle', children, ...rest }, ref) => {\n const { size, overflow, isOverflowing } = React.useContext(BadgeContext)\n const [badgeElRef, setBadgeElRef] = useCallbackRefState()\n React.useImperativeHandle(ref, () => badgeElRef as HTMLDivElement)\n\n const label = badgeElRef?.textContent\n\n const isInfoOnly = badgeSemanticNames.includes(theme)\n\n const isClickable =\n Object.keys(rest).includes('onClick') ||\n Object.keys(rest).includes('href')\n\n return (\n <OptionalTooltipWrapper\n hasTooltip={overflow === 'ellipsis' && isOverflowing}\n label={label}\n >\n <StyledBadge\n role=\"status\"\n emphasis={emphasis}\n size={size}\n {...rest}\n className={badgeColorSchemes[theme]}\n ref={setBadgeElRef}\n isClickable={isClickable && !isInfoOnly}\n >\n {React.Children.map(children, (child) => {\n if (typeof child === 'string' || typeof child === 'number') {\n return <BadgeText>{child}</BadgeText>\n }\n if (React.isValidElement(child) && child.type === Icon) {\n return <BadgeIcon {...child.props} />\n }\n return child\n })}\n </StyledBadge>\n </OptionalTooltipWrapper>\n )\n }\n )\n\nconst BadgeComponent: React.ForwardRefExoticComponent<TBadgeProps> =\n React.forwardRef(({ size = 'sm', overflow = 'wrap', ...rest }, ref) => {\n return (\n <BadgeProvider size={size} overflow={overflow}>\n <BadgeInner {...rest} ref={ref} />\n </BadgeProvider>\n )\n })\n\nexport const Badge = Object.assign(BadgeComponent, {\n Icon: BadgeIcon,\n Text: BadgeText\n})\n\nBadgeComponent.displayName = 'Badge'\n"],"names":["StyledBadge","styled","Flex","BadgeInner","React","theme","emphasis","children","rest","ref","size","overflow","isOverflowing","BadgeContext","badgeElRef","setBadgeElRef","useCallbackRefState","label","isInfoOnly","badgeSemanticNames","isClickable","OptionalTooltipWrapper","badgeColorSchemes","child","BadgeText","Icon","BadgeIcon","BadgeComponent","BadgeProvider","Badge"],"mappings":"okBAiBA,MAAMA,EAAcC,EAAOC,EAAM,CAC/B,eAAgB,SAChB,WAAY,SACZ,aAAc,KACd,SAAU,EACV,OAAQ,oBACR,WAAY,QACZ,yBAA0B,CACxB,GAAI,IACN,EACA,SAAU,CACR,SAAU,CACR,MAAO,CACL,MAAO,eACP,WAAY,OACd,EACA,OAAQ,CACN,MAAO,cACP,WAAY,mBACd,EACA,KAAM,CACJ,MAAO,YACP,WAAY,iBACd,CACF,EACA,KAAM,CACJ,GAAI,CACF,GAAI,IACN,EACA,GAAI,CACF,GAAI,KACJ,GAAI,IACN,EACA,GAAI,CACF,GAAI,KACJ,GAAI,IACN,CACF,EAEA,YAAa,CACX,KAAM,CACJ,OAAQ,SACV,CACF,EACA,YAAa,CACX,KAAM,CACR,CAAA,CACF,EACA,iBAAkB,CAChB,CACE,YAAa,GACb,SAAU,QACV,IAAK,CACH,UAAW,CACT,MAAO,eACP,WAAY,mDACd,CACF,CACF,EACA,CACE,YAAa,GACb,SAAU,SACV,IAAK,CACH,UAAW,CACT,MAAO,mBACP,WAAY,wBACd,CACF,CACF,EACA,CACE,YAAa,GACb,SAAU,OACV,IAAK,CACH,UAAW,CACT,MAAO,YACP,WAAY,sBACd,CACF,CACF,EACA,CACE,SAAU,QACV,YAAa,GACb,IAAK,CACH,MAAO,eACP,WAAY,mDACd,CACF,EACA,CACE,SAAU,SACV,YAAa,GACb,IAAK,CACH,MAAO,mBACP,WAAY,wBACd,CACF,EACA,CACE,SAAU,OACV,YAAa,GACb,IAAK,CACH,MAAO,YACP,WAAY,sBACd,CACF,CACF,CACF,CAAC,EASKC,EACJC,EAAM,WACJ,CAAC,CAAE,MAAAC,EAAQ,OAAQ,SAAAC,EAAW,SAAU,SAAAC,KAAaC,CAAK,EAAGC,IAAQ,CACnE,KAAM,CAAE,KAAAC,EAAM,SAAAC,EAAU,cAAAC,CAAc,EAAIR,EAAM,WAAWS,CAAY,EACjE,CAACC,EAAYC,CAAa,EAAIC,EAAoB,EACxDZ,EAAM,oBAAoBK,EAAK,IAAMK,CAA4B,EAEjE,MAAMG,EAAQH,GAAA,YAAAA,EAAY,YAEpBI,EAAaC,EAAmB,SAASd,CAAK,EAE9Ce,EACJ,OAAO,KAAKZ,CAAI,EAAE,SAAS,SAAS,GACpC,OAAO,KAAKA,CAAI,EAAE,SAAS,MAAM,EAEnC,OACEJ,EAAA,cAACiB,EAAA,CACC,WAAYV,IAAa,YAAcC,EACvC,MAAOK,CAEPb,EAAAA,EAAA,cAACJ,EAAA,CACC,KAAK,SACL,SAAUM,EACV,KAAMI,EACL,GAAGF,EACJ,UAAWc,EAAkBjB,GAC7B,IAAKU,EACL,YAAaK,GAAe,CAACF,GAE5Bd,EAAM,SAAS,IAAIG,EAAWgB,GACzB,OAAOA,GAAU,UAAY,OAAOA,GAAU,SACzCnB,EAAA,cAACoB,EAAA,KAAWD,CAAM,EAEvBnB,EAAM,eAAemB,CAAK,GAAKA,EAAM,OAASE,EACzCrB,EAAA,cAACsB,EAAA,CAAW,GAAGH,EAAM,KAAA,CAAO,EAE9BA,CACR,CACH,CACF,CAEJ,CACF,EAEII,EACJvB,EAAM,WAAW,CAAC,CAAE,KAAAM,EAAO,KAAM,SAAAC,EAAW,UAAWH,CAAK,EAAGC,IAE3DL,EAAA,cAACwB,EAAA,CAAc,KAAMlB,EAAM,SAAUC,CAAAA,EACnCP,EAAA,cAACD,EAAA,CAAY,GAAGK,EAAM,IAAKC,CAAK,CAAA,CAClC,CAEH,EAEUoB,EAAQ,OAAO,OAAOF,EAAgB,CACjD,KAAMD,EACN,KAAMF,CACR,CAAC,EAEDG,EAAe,YAAc"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const SegmentedControl: {
|
|
2
|
-
Root: ({ size,
|
|
2
|
+
Root: ({ size, theme, defaultValue, children, ...props }: import("react").PropsWithChildren<import("./SegmentedControlRoot").SegmentedControlRootProps>) => import("react").JSX.Element;
|
|
3
3
|
Item: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-tabs").TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "css"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{}, {
|
|
4
4
|
sm: string;
|
|
5
5
|
md: string;
|
|
@@ -2582,373 +2582,5 @@ export declare const SegmentedControl: {
|
|
|
2582
2582
|
};
|
|
2583
2583
|
}>>;
|
|
2584
2584
|
Badge: ({ css, ...props }: Omit<import("react").ComponentProps<typeof import("..").Badge>, "size">) => JSX.Element;
|
|
2585
|
-
ItemList:
|
|
2586
|
-
({ children, colorScheme, ...rest }: import("react").ComponentProps<import("@atom-learning/stitches-react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsListProps & import("react").RefAttributes<HTMLDivElement>>, {}, {
|
|
2587
|
-
sm: string;
|
|
2588
|
-
md: string;
|
|
2589
|
-
lg: string;
|
|
2590
|
-
xl: string;
|
|
2591
|
-
reducedMotion: string;
|
|
2592
|
-
allowMotion: string;
|
|
2593
|
-
hover: string;
|
|
2594
|
-
}, import("@atom-learning/stitches-react/types/css-util").CSS<{
|
|
2595
|
-
sm: string;
|
|
2596
|
-
md: string;
|
|
2597
|
-
lg: string;
|
|
2598
|
-
xl: string;
|
|
2599
|
-
reducedMotion: string;
|
|
2600
|
-
allowMotion: string;
|
|
2601
|
-
hover: string;
|
|
2602
|
-
}, {
|
|
2603
|
-
colors: {
|
|
2604
|
-
textBold: string;
|
|
2605
|
-
textRegular: string;
|
|
2606
|
-
textSubtle: string;
|
|
2607
|
-
textMinimal: string;
|
|
2608
|
-
background: string;
|
|
2609
|
-
backgroundAccent: string;
|
|
2610
|
-
grey100: string;
|
|
2611
|
-
grey200: string;
|
|
2612
|
-
grey300: string;
|
|
2613
|
-
grey400: string;
|
|
2614
|
-
grey500: string;
|
|
2615
|
-
grey600: string;
|
|
2616
|
-
grey700: string;
|
|
2617
|
-
grey800: string;
|
|
2618
|
-
grey900: string;
|
|
2619
|
-
grey1000: string;
|
|
2620
|
-
grey1100: string;
|
|
2621
|
-
grey1200: string;
|
|
2622
|
-
blue100: string;
|
|
2623
|
-
blue200: string;
|
|
2624
|
-
blue300: string;
|
|
2625
|
-
blue400: string;
|
|
2626
|
-
blue500: string;
|
|
2627
|
-
blue600: string;
|
|
2628
|
-
blue700: string;
|
|
2629
|
-
blue800: string;
|
|
2630
|
-
blue900: string;
|
|
2631
|
-
blue1000: string;
|
|
2632
|
-
blue1100: string;
|
|
2633
|
-
blue1200: string;
|
|
2634
|
-
pink100: string;
|
|
2635
|
-
pink200: string;
|
|
2636
|
-
pink300: string;
|
|
2637
|
-
pink400: string;
|
|
2638
|
-
pink500: string;
|
|
2639
|
-
pink600: string;
|
|
2640
|
-
pink700: string;
|
|
2641
|
-
pink800: string;
|
|
2642
|
-
pink900: string;
|
|
2643
|
-
pink1000: string;
|
|
2644
|
-
pink1100: string;
|
|
2645
|
-
pink1200: string;
|
|
2646
|
-
purple100: string;
|
|
2647
|
-
purple200: string;
|
|
2648
|
-
purple300: string;
|
|
2649
|
-
purple400: string;
|
|
2650
|
-
purple500: string;
|
|
2651
|
-
purple600: string;
|
|
2652
|
-
purple700: string;
|
|
2653
|
-
purple800: string;
|
|
2654
|
-
purple900: string;
|
|
2655
|
-
purple1000: string;
|
|
2656
|
-
purple1100: string;
|
|
2657
|
-
purple1200: string;
|
|
2658
|
-
cyan100: string;
|
|
2659
|
-
cyan200: string;
|
|
2660
|
-
cyan300: string;
|
|
2661
|
-
cyan400: string;
|
|
2662
|
-
cyan500: string;
|
|
2663
|
-
cyan600: string;
|
|
2664
|
-
cyan700: string;
|
|
2665
|
-
cyan800: string;
|
|
2666
|
-
cyan900: string;
|
|
2667
|
-
cyan1000: string;
|
|
2668
|
-
cyan1100: string;
|
|
2669
|
-
cyan1200: string;
|
|
2670
|
-
green100: string;
|
|
2671
|
-
green200: string;
|
|
2672
|
-
green300: string;
|
|
2673
|
-
green400: string;
|
|
2674
|
-
green500: string;
|
|
2675
|
-
green600: string;
|
|
2676
|
-
green700: string;
|
|
2677
|
-
green800: string;
|
|
2678
|
-
green900: string;
|
|
2679
|
-
green1000: string;
|
|
2680
|
-
green1100: string;
|
|
2681
|
-
green1200: string;
|
|
2682
|
-
magenta100: string;
|
|
2683
|
-
magenta200: string;
|
|
2684
|
-
magenta300: string;
|
|
2685
|
-
magenta400: string;
|
|
2686
|
-
magenta500: string;
|
|
2687
|
-
magenta600: string;
|
|
2688
|
-
magenta700: string;
|
|
2689
|
-
magenta800: string;
|
|
2690
|
-
magenta900: string;
|
|
2691
|
-
magenta1000: string;
|
|
2692
|
-
magenta1100: string;
|
|
2693
|
-
magenta1200: string;
|
|
2694
|
-
red100: string;
|
|
2695
|
-
red200: string;
|
|
2696
|
-
red300: string;
|
|
2697
|
-
red400: string;
|
|
2698
|
-
red500: string;
|
|
2699
|
-
red600: string;
|
|
2700
|
-
red700: string;
|
|
2701
|
-
red800: string;
|
|
2702
|
-
red900: string;
|
|
2703
|
-
red1000: string;
|
|
2704
|
-
red1100: string;
|
|
2705
|
-
red1200: string;
|
|
2706
|
-
teal100: string;
|
|
2707
|
-
teal200: string;
|
|
2708
|
-
teal300: string;
|
|
2709
|
-
teal400: string;
|
|
2710
|
-
teal500: string;
|
|
2711
|
-
teal600: string;
|
|
2712
|
-
teal700: string;
|
|
2713
|
-
teal800: string;
|
|
2714
|
-
teal900: string;
|
|
2715
|
-
teal1000: string;
|
|
2716
|
-
teal1100: string;
|
|
2717
|
-
teal1200: string;
|
|
2718
|
-
orange100: string;
|
|
2719
|
-
orange200: string;
|
|
2720
|
-
orange300: string;
|
|
2721
|
-
orange400: string;
|
|
2722
|
-
orange500: string;
|
|
2723
|
-
orange600: string;
|
|
2724
|
-
orange700: string;
|
|
2725
|
-
orange800: string;
|
|
2726
|
-
orange900: string;
|
|
2727
|
-
orange1000: string;
|
|
2728
|
-
orange1100: string;
|
|
2729
|
-
orange1200: string;
|
|
2730
|
-
yellow100: string;
|
|
2731
|
-
yellow200: string;
|
|
2732
|
-
yellow300: string;
|
|
2733
|
-
yellow400: string;
|
|
2734
|
-
yellow500: string;
|
|
2735
|
-
yellow600: string;
|
|
2736
|
-
yellow700: string;
|
|
2737
|
-
yellow800: string;
|
|
2738
|
-
yellow900: string;
|
|
2739
|
-
yellow1000: string;
|
|
2740
|
-
yellow1100: string;
|
|
2741
|
-
yellow1200: string;
|
|
2742
|
-
lime100: string;
|
|
2743
|
-
lime200: string;
|
|
2744
|
-
lime300: string;
|
|
2745
|
-
lime400: string;
|
|
2746
|
-
lime500: string;
|
|
2747
|
-
lime600: string;
|
|
2748
|
-
lime700: string;
|
|
2749
|
-
lime800: string;
|
|
2750
|
-
lime900: string;
|
|
2751
|
-
lime1000: string;
|
|
2752
|
-
lime1100: string;
|
|
2753
|
-
lime1200: string;
|
|
2754
|
-
lapis100: string;
|
|
2755
|
-
lapis200: string;
|
|
2756
|
-
lapis300: string;
|
|
2757
|
-
lapis400: string;
|
|
2758
|
-
lapis500: string;
|
|
2759
|
-
lapis600: string;
|
|
2760
|
-
lapis700: string;
|
|
2761
|
-
lapis800: string;
|
|
2762
|
-
lapis900: string;
|
|
2763
|
-
lapis1000: string;
|
|
2764
|
-
lapis1100: string;
|
|
2765
|
-
lapis1200: string;
|
|
2766
|
-
maroon100: string;
|
|
2767
|
-
maroon200: string;
|
|
2768
|
-
maroon300: string;
|
|
2769
|
-
maroon400: string;
|
|
2770
|
-
maroon500: string;
|
|
2771
|
-
maroon600: string;
|
|
2772
|
-
maroon700: string;
|
|
2773
|
-
maroon800: string;
|
|
2774
|
-
maroon900: string;
|
|
2775
|
-
maroon1000: string;
|
|
2776
|
-
maroon1100: string;
|
|
2777
|
-
maroon1200: string;
|
|
2778
|
-
marsh100: string;
|
|
2779
|
-
marsh200: string;
|
|
2780
|
-
marsh300: string;
|
|
2781
|
-
marsh400: string;
|
|
2782
|
-
marsh500: string;
|
|
2783
|
-
marsh600: string;
|
|
2784
|
-
marsh700: string;
|
|
2785
|
-
marsh800: string;
|
|
2786
|
-
marsh900: string;
|
|
2787
|
-
marsh1000: string;
|
|
2788
|
-
marsh1100: string;
|
|
2789
|
-
marsh1200: string;
|
|
2790
|
-
alpha100: string;
|
|
2791
|
-
alpha150: string;
|
|
2792
|
-
alpha200: string;
|
|
2793
|
-
alpha250: string;
|
|
2794
|
-
alpha600: string;
|
|
2795
|
-
infoLight: string;
|
|
2796
|
-
info: string;
|
|
2797
|
-
infoMid: string;
|
|
2798
|
-
infoDark: string;
|
|
2799
|
-
successLight: string;
|
|
2800
|
-
success: string;
|
|
2801
|
-
successMid: string;
|
|
2802
|
-
successDark: string;
|
|
2803
|
-
dangerLight: string;
|
|
2804
|
-
danger: string;
|
|
2805
|
-
dangerMid: string;
|
|
2806
|
-
dangerDark: string;
|
|
2807
|
-
warningLight: string;
|
|
2808
|
-
warning: string;
|
|
2809
|
-
warningMid: string;
|
|
2810
|
-
warningDark: string;
|
|
2811
|
-
warningText: string;
|
|
2812
|
-
subjectEnglish: string;
|
|
2813
|
-
subjectMaths: string;
|
|
2814
|
-
subjectScience: string;
|
|
2815
|
-
subjectVerbalReasoning: string;
|
|
2816
|
-
subjectNonVerbalReasoning: string;
|
|
2817
|
-
subjectCreativeWriting: string;
|
|
2818
|
-
subjectExamSkills: string;
|
|
2819
|
-
glBlueLight: string;
|
|
2820
|
-
glBluePrimary: string;
|
|
2821
|
-
glBlueDark: string;
|
|
2822
|
-
primary100: string;
|
|
2823
|
-
primary200: string;
|
|
2824
|
-
primary300: string;
|
|
2825
|
-
primary400: string;
|
|
2826
|
-
primary500: string;
|
|
2827
|
-
primary600: string;
|
|
2828
|
-
primary700: string;
|
|
2829
|
-
primary800: string;
|
|
2830
|
-
primary900: string;
|
|
2831
|
-
primary1000: string;
|
|
2832
|
-
primary1100: string;
|
|
2833
|
-
primary1200: string;
|
|
2834
|
-
};
|
|
2835
|
-
space: {
|
|
2836
|
-
"0": string;
|
|
2837
|
-
"1": string;
|
|
2838
|
-
"2": string;
|
|
2839
|
-
"3": string;
|
|
2840
|
-
"4": string;
|
|
2841
|
-
"5": string;
|
|
2842
|
-
"6": string;
|
|
2843
|
-
"7": string;
|
|
2844
|
-
"8": string;
|
|
2845
|
-
"9": string;
|
|
2846
|
-
"24": string;
|
|
2847
|
-
};
|
|
2848
|
-
fontSizes: {
|
|
2849
|
-
xs: string;
|
|
2850
|
-
sm: string;
|
|
2851
|
-
md: string;
|
|
2852
|
-
lg: string;
|
|
2853
|
-
xl: string;
|
|
2854
|
-
"2xl": string;
|
|
2855
|
-
"3xl": string;
|
|
2856
|
-
"4xl": string;
|
|
2857
|
-
};
|
|
2858
|
-
fonts: {
|
|
2859
|
-
sans: string;
|
|
2860
|
-
mono: string;
|
|
2861
|
-
display: string;
|
|
2862
|
-
body: string;
|
|
2863
|
-
};
|
|
2864
|
-
sizes: {
|
|
2865
|
-
"0": string;
|
|
2866
|
-
"1": string;
|
|
2867
|
-
"2": string;
|
|
2868
|
-
"3": string;
|
|
2869
|
-
"4": string;
|
|
2870
|
-
"5": string;
|
|
2871
|
-
"6": string;
|
|
2872
|
-
"7": string;
|
|
2873
|
-
"8": string;
|
|
2874
|
-
};
|
|
2875
|
-
radii: {
|
|
2876
|
-
"0": string;
|
|
2877
|
-
"1": string;
|
|
2878
|
-
"2": string;
|
|
2879
|
-
"3": string;
|
|
2880
|
-
round: string;
|
|
2881
|
-
};
|
|
2882
|
-
shadows: {
|
|
2883
|
-
"0": string;
|
|
2884
|
-
"1": string;
|
|
2885
|
-
"2": string;
|
|
2886
|
-
"3": string;
|
|
2887
|
-
};
|
|
2888
|
-
ratios: {
|
|
2889
|
-
"16-9": string;
|
|
2890
|
-
"3-2": string;
|
|
2891
|
-
"4-3": string;
|
|
2892
|
-
"1-1": string;
|
|
2893
|
-
"3-4": string;
|
|
2894
|
-
};
|
|
2895
|
-
}, import("@atom-learning/stitches-react/types/config").DefaultThemeMap, {
|
|
2896
|
-
bg: (value: import("@atom-learning/stitches-react").PropertyValue<"background">) => {
|
|
2897
|
-
background: import("@atom-learning/stitches-react/types/css-util").WithPropertyValue<"background">;
|
|
2898
|
-
};
|
|
2899
|
-
size: (value: import("@atom-learning/stitches-react").ScaleValue<"size"> | number | string) => {
|
|
2900
|
-
height: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"size">;
|
|
2901
|
-
width: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"size">;
|
|
2902
|
-
};
|
|
2903
|
-
p: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2904
|
-
padding: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2905
|
-
};
|
|
2906
|
-
pt: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2907
|
-
paddingTop: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2908
|
-
};
|
|
2909
|
-
pr: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2910
|
-
paddingRight: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2911
|
-
};
|
|
2912
|
-
pb: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2913
|
-
paddingBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2914
|
-
};
|
|
2915
|
-
pl: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2916
|
-
paddingLeft: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2917
|
-
};
|
|
2918
|
-
px: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2919
|
-
paddingLeft: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2920
|
-
paddingRight: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2921
|
-
};
|
|
2922
|
-
py: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2923
|
-
paddingTop: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2924
|
-
paddingBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2925
|
-
};
|
|
2926
|
-
m: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2927
|
-
margin: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2928
|
-
};
|
|
2929
|
-
mt: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2930
|
-
marginTop: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2931
|
-
};
|
|
2932
|
-
mr: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2933
|
-
marginRight: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2934
|
-
};
|
|
2935
|
-
mb: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2936
|
-
marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2937
|
-
};
|
|
2938
|
-
ml: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2939
|
-
marginLeft: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2940
|
-
};
|
|
2941
|
-
mx: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2942
|
-
marginLeft: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2943
|
-
marginRight: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2944
|
-
};
|
|
2945
|
-
my: (value: import("@atom-learning/stitches-react").ScaleValue<"space"> | number | string) => {
|
|
2946
|
-
marginTop: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2947
|
-
marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
|
|
2948
|
-
};
|
|
2949
|
-
}>>> & {
|
|
2950
|
-
colorScheme?: import("../..").TcolorScheme;
|
|
2951
|
-
}): import("react").JSX.Element;
|
|
2952
|
-
displayName: string;
|
|
2953
|
-
}>) => JSX.Element;
|
|
2585
|
+
ItemList: import("react").FC<{}>;
|
|
2954
2586
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type SegmentedControlTheme = 'primary' | 'marsh';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as e from"react";import{Badge as r}from"../badge/Badge.js";import{SegmentedControlContext as s}from"./SegmentedControlContext.js";const m={sm:"xs",md:"xs",lg:"sm"},c=({css:o,...t})=>{const{size:n}=e.useContext(s);return e.createElement(r,{...t,css:{border:"none",...o,fontWeight:"normal"},size:m[n]})};export{c as SegmentedControlBadge};
|
|
2
2
|
//# sourceMappingURL=SegmentedControlBadge.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControlBadge.js","sources":["../../../src/components/segmented-control/SegmentedControlBadge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Badge } from '../badge'\nimport {
|
|
1
|
+
{"version":3,"file":"SegmentedControlBadge.js","sources":["../../../src/components/segmented-control/SegmentedControlBadge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Badge } from '../badge'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst badgeSizeMap = {\n sm: 'xs',\n md: 'xs',\n lg: 'sm'\n}\n\nexport const SegmentedControlBadge = ({\n css,\n ...props\n}: Omit<React.ComponentProps<typeof Badge>, 'size'>): JSX.Element => {\n const { size } = React.useContext(SegmentedControlContext)\n\n return (\n <Badge\n {...props}\n css={{ border: 'none', ...css, fontWeight: 'normal' }}\n size={badgeSizeMap[size as string]}\n />\n )\n}\n"],"names":["badgeSizeMap","SegmentedControlBadge","css","props","size","React","SegmentedControlContext","Badge"],"mappings":"yIAKA,MAAMA,EAAe,CACnB,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EAAwB,CAAC,CACpC,IAAAC,KACGC,CACL,IAAqE,CACnE,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OACED,EAAA,cAACE,EAAA,CACE,GAAGJ,EACJ,IAAK,CAAE,OAAQ,OAAQ,GAAGD,EAAK,WAAY,QAAS,EACpD,KAAMF,EAAaI,EAAAA,CACrB,CAEJ"}
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
import { Tabs } from '../tabs';
|
|
3
|
+
import type { SegmentedControlTheme } from './SegmentedControl.types';
|
|
2
4
|
import type { SegmentedControlRootProps } from './SegmentedControlRoot';
|
|
3
|
-
export
|
|
4
|
-
export interface SegmentedControlContextValue {
|
|
5
|
+
export interface SegmentedControlContextValue extends Pick<React.ComponentProps<typeof Tabs>, 'defaultValue' | 'value' | 'onValueChange'> {
|
|
5
6
|
size: SegmentedControlRootProps['size'];
|
|
6
7
|
theme: SegmentedControlTheme;
|
|
7
|
-
defaultValue: string;
|
|
8
8
|
}
|
|
9
9
|
export declare const SegmentedControlContext: React.Context<SegmentedControlContextValue>;
|
|
10
|
-
export declare const SegmentedControlProvider: ({ size, theme, defaultValue, children }: React.PropsWithChildren<SegmentedControlContextValue>) => JSX.Element;
|
|
11
|
-
export declare const useSegmentedControl: () => SegmentedControlContextValue;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as e from"react";const t=e.createContext({size:"md",theme:"primary",defaultValue:""
|
|
1
|
+
import*as e from"react";const t=e.createContext({size:"md",theme:"primary",defaultValue:"",value:"",onValueChange:()=>null});export{t as SegmentedControlContext};
|
|
2
2
|
//# sourceMappingURL=SegmentedControlContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControlContext.js","sources":["../../../src/components/segmented-control/SegmentedControlContext.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { SegmentedControlRootProps } from './SegmentedControlRoot'\n\nexport
|
|
1
|
+
{"version":3,"file":"SegmentedControlContext.js","sources":["../../../src/components/segmented-control/SegmentedControlContext.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Tabs } from '../tabs'\nimport type { SegmentedControlTheme } from './SegmentedControl.types'\nimport type { SegmentedControlRootProps } from './SegmentedControlRoot'\n\nexport interface SegmentedControlContextValue\n extends Pick<\n React.ComponentProps<typeof Tabs>,\n 'defaultValue' | 'value' | 'onValueChange'\n > {\n size: SegmentedControlRootProps['size']\n theme: SegmentedControlTheme\n}\n\nexport const SegmentedControlContext =\n React.createContext<SegmentedControlContextValue>({\n size: 'md',\n theme: 'primary',\n defaultValue: '',\n value: '',\n onValueChange: () => null\n })\n"],"names":["SegmentedControlContext","React"],"mappings":"wBAeO,MAAMA,EACXC,EAAM,cAA4C,CAChD,KAAM,KACN,MAAO,UACP,aAAc,GACd,MAAO,GACP,cAAe,IAAM,IACvB,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as t from"react";import{styled as n}from"../../stitches.js";import{Text as r}from"../text/Text.js";import{SegmentedControlContext as m}from"./SegmentedControlContext.js";const i=n(r,{fontFamily:"$body",color:"$textSubtle",fontWeight:400,variants:{size:{sm:{fontSize:"$xs"},md:{fontSize:"$sm"},lg:{fontSize:"$md"}}}}),s=e=>{const{size:o}=t.useContext(m);return t.createElement(i,{...e,size:o})};export{s as SegmentedControlDescription};
|
|
2
2
|
//# sourceMappingURL=SegmentedControlDescription.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControlDescription.js","sources":["../../../src/components/segmented-control/SegmentedControlDescription.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../stitches'\nimport { Text } from '../text'\nimport {
|
|
1
|
+
{"version":3,"file":"SegmentedControlDescription.js","sources":["../../../src/components/segmented-control/SegmentedControlDescription.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../stitches'\nimport { Text } from '../text'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledText = styled(Text, {\n fontFamily: '$body',\n color: '$textSubtle',\n fontWeight: 400,\n variants: {\n size: {\n sm: {\n fontSize: '$xs'\n },\n md: {\n fontSize: '$sm'\n },\n lg: {\n fontSize: '$md'\n }\n }\n }\n})\n\nexport const SegmentedControlDescription = (\n props: Omit<React.ComponentProps<typeof StyledText>, 'size'>\n): JSX.Element => {\n const { size } = React.useContext(SegmentedControlContext)\n\n return <StyledText {...props} size={size} />\n}\n"],"names":["StyledText","styled","Text","SegmentedControlDescription","props","size","React","SegmentedControlContext"],"mappings":"iLAMA,MAAMA,EAAaC,EAAOC,EAAM,CAC9B,WAAY,QACZ,MAAO,cACP,WAAY,IACZ,SAAU,CACR,KAAM,CACJ,GAAI,CACF,SAAU,KACZ,EACA,GAAI,CACF,SAAU,KACZ,EACA,GAAI,CACF,SAAU,KACZ,CACF,CACF,CACF,CAAC,EAEYC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACN,EAAA,CAAY,GAAGI,EAAO,KAAMC,EAAM,CAC5C"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as t from"react";import{styled as r}from"../../stitches.js";import{Text as n}from"../text/Text.js";import{SegmentedControlContext as m}from"./SegmentedControlContext.js";const i=r(n,{fontFamily:"$body",color:"$textRegular",variants:{size:{sm:{fontSize:"$sm"},md:{fontSize:"$md"},lg:{fontSize:"$lg"}}}}),s=e=>{const{size:o}=t.useContext(m);return t.createElement(i,{...e,size:o})};export{s as SegmentedControlHeading};
|
|
2
2
|
//# sourceMappingURL=SegmentedControlHeading.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControlHeading.js","sources":["../../../src/components/segmented-control/SegmentedControlHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../stitches'\nimport { Text } from '../text'\nimport {
|
|
1
|
+
{"version":3,"file":"SegmentedControlHeading.js","sources":["../../../src/components/segmented-control/SegmentedControlHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../stitches'\nimport { Text } from '../text'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledHeading = styled(Text, {\n fontFamily: '$body',\n color: '$textRegular',\n variants: {\n size: {\n sm: {\n fontSize: '$sm'\n },\n md: {\n fontSize: '$md'\n },\n lg: {\n fontSize: '$lg'\n }\n }\n }\n})\n\nexport const SegmentedControlHeading = (\n props: Omit<React.ComponentProps<typeof StyledHeading>, 'size'>\n): JSX.Element => {\n const { size } = React.useContext(SegmentedControlContext)\n\n return <StyledHeading {...props} size={size} />\n}\n"],"names":["StyledHeading","styled","Text","SegmentedControlHeading","props","size","React","SegmentedControlContext"],"mappings":"iLAMA,MAAMA,EAAgBC,EAAOC,EAAM,CACjC,WAAY,QACZ,MAAO,eACP,SAAU,CACR,KAAM,CACJ,GAAI,CACF,SAAU,KACZ,EACA,GAAI,CACF,SAAU,KACZ,EACA,GAAI,CACF,SAAU,KACZ,CACF,CACF,CACF,CAAC,EAEYC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACN,EAAA,CAAe,GAAGI,EAAO,KAAMC,EAAM,CAC/C"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as e from"react";import{Icon as m}from"../icon/Icon.js";import{SegmentedControlContext as n}from"./SegmentedControlContext.js";const r={sm:"sm",md:"md",lg:"md"},s=o=>{const{size:t}=e.useContext(n);return e.createElement(m,{...o,size:r[t]})};export{s as SegmentedControlIcon};
|
|
2
2
|
//# sourceMappingURL=SegmentedControlIcon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControlIcon.js","sources":["../../../src/components/segmented-control/SegmentedControlIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '../icon'\nimport {
|
|
1
|
+
{"version":3,"file":"SegmentedControlIcon.js","sources":["../../../src/components/segmented-control/SegmentedControlIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '../icon'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst sizeMap = {\n sm: 'sm',\n md: 'md',\n lg: 'md'\n}\n\nexport const SegmentedControlIcon = (\n props: Omit<React.ComponentProps<typeof Icon>, 'size'>\n): JSX.Element => {\n const { size } = React.useContext(SegmentedControlContext)\n\n return <Icon {...props} size={sizeMap[size as string]} />\n}\n"],"names":["sizeMap","SegmentedControlIcon","props","size","React","SegmentedControlContext","Icon"],"mappings":"sIAKA,MAAMA,EAAU,CACd,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACE,EAAA,CAAM,GAAGJ,EAAO,KAAMF,EAAQG,GAAiB,CACzD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as e from"react";import{styled as s}from"../../stitches.js";import{Tabs as d}from"../tabs/Tabs.js";import{
|
|
1
|
+
import*as e from"react";import{styled as s}from"../../stitches.js";import{Tabs as d}from"../tabs/Tabs.js";import{SegmentedControlContext as l}from"./SegmentedControlContext.js";const m=s(d.Trigger,{position:"relative",bg:"transparent",borderRadius:"$2",p:0,zIndex:2,minWidth:"140px",border:"2px solid transparent",variants:{theme:{primary:{"&[data-state=inactive]:hover":{bg:"$primary300"},"&:focus-visible":{borderColor:"$primary800"}},marsh:{"&[data-state=inactive]:hover":{bg:"$marsh300"},"&:focus-visible":{borderColor:"$marsh800"}}},size:{sm:{flex:"unset",p:"$4 $24",gap:"$3"},md:{flex:1,p:"$24 $4",gap:"$4"},lg:{flex:1,p:"$24 $4",gap:"$4"}}},"& > div":{display:"none"},"& > span":{display:"flex",flexDirection:"column",alignItems:"center"},"&[data-state=active]":{boxShadow:"none",border:"2px solid transparent",fontWeight:600,color:"$textBold","&:focus-visible":{boxShadow:"none",borderColor:"$primary800"}},"&[data-state=inactive]":{fontWeight:400,color:"$grey900"},"&[disabled]":{opacity:.3}}),t=e.forwardRef(({children:r,...o},a)=>{const{size:i,theme:n}=e.useContext(l);return e.createElement(m,{...o,theme:n,size:i,ref:a},r)});t.displayName="SegmentedControlItem";export{t as SegmentedControlItem};
|
|
2
2
|
//# sourceMappingURL=SegmentedControlItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControlItem.js","sources":["../../../src/components/segmented-control/SegmentedControlItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../stitches'\nimport { Tabs } from '../tabs'\nimport {
|
|
1
|
+
{"version":3,"file":"SegmentedControlItem.js","sources":["../../../src/components/segmented-control/SegmentedControlItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../stitches'\nimport { Tabs } from '../tabs'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledItem = styled(Tabs.Trigger, {\n position: 'relative',\n bg: 'transparent',\n borderRadius: '$2',\n p: 0,\n zIndex: 2,\n minWidth: '140px',\n border: '2px solid transparent',\n variants: {\n theme: {\n primary: {\n '&[data-state=inactive]:hover': {\n bg: '$primary300'\n },\n '&:focus-visible': {\n borderColor: '$primary800'\n }\n },\n marsh: {\n '&[data-state=inactive]:hover': {\n bg: '$marsh300'\n },\n '&:focus-visible': {\n borderColor: '$marsh800'\n }\n }\n },\n size: {\n sm: {\n flex: 'unset',\n p: '$4 $24',\n gap: '$3'\n },\n md: {\n flex: 1,\n p: '$24 $4',\n gap: '$4'\n },\n lg: {\n flex: 1,\n p: '$24 $4',\n gap: '$4'\n }\n }\n },\n '& > div': { display: 'none' },\n '& > span': {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center'\n },\n '&[data-state=active]': {\n boxShadow: 'none',\n border: '2px solid transparent',\n fontWeight: 600,\n color: '$textBold',\n '&:focus-visible': {\n boxShadow: 'none',\n borderColor: '$primary800'\n }\n },\n '&[data-state=inactive]': {\n fontWeight: 400,\n color: '$grey900'\n },\n '&[disabled]': {\n opacity: 0.3\n }\n})\n\nexport const SegmentedControlItem = React.forwardRef<\n HTMLButtonElement,\n Omit<React.ComponentProps<typeof StyledItem>, 'size'>\n>(({ children, ...props }, ref) => {\n const { size, theme } = React.useContext(SegmentedControlContext)\n\n return (\n <StyledItem {...props} theme={theme} size={size} ref={ref}>\n {children}\n </StyledItem>\n )\n})\n\nSegmentedControlItem.displayName = 'SegmentedControlItem'\n"],"names":["StyledItem","styled","Tabs","SegmentedControlItem","React","children","props","ref","size","theme","SegmentedControlContext"],"mappings":"iLAMA,MAAMA,EAAaC,EAAOC,EAAK,QAAS,CACtC,SAAU,WACV,GAAI,cACJ,aAAc,KACd,EAAG,EACH,OAAQ,EACR,SAAU,QACV,OAAQ,wBACR,SAAU,CACR,MAAO,CACL,QAAS,CACP,+BAAgC,CAC9B,GAAI,aACN,EACA,kBAAmB,CACjB,YAAa,aACf,CACF,EACA,MAAO,CACL,+BAAgC,CAC9B,GAAI,WACN,EACA,kBAAmB,CACjB,YAAa,WACf,CACF,CACF,EACA,KAAM,CACJ,GAAI,CACF,KAAM,QACN,EAAG,SACH,IAAK,IACP,EACA,GAAI,CACF,KAAM,EACN,EAAG,SACH,IAAK,IACP,EACA,GAAI,CACF,KAAM,EACN,EAAG,SACH,IAAK,IACP,CACF,CACF,EACA,UAAW,CAAE,QAAS,MAAO,EAC7B,WAAY,CACV,QAAS,OACT,cAAe,SACf,WAAY,QACd,EACA,uBAAwB,CACtB,UAAW,OACX,OAAQ,wBACR,WAAY,IACZ,MAAO,YACP,kBAAmB,CACjB,UAAW,OACX,YAAa,aACf,CACF,EACA,yBAA0B,CACxB,WAAY,IACZ,MAAO,UACT,EACA,cAAe,CACb,QAAS,EACX,CACF,CAAC,EAEYC,EAAuBC,EAAM,WAGxC,CAAC,CAAE,SAAAC,KAAaC,CAAM,EAAGC,IAAQ,CACjC,KAAM,CAAE,KAAAC,EAAM,MAAAC,CAAM,EAAIL,EAAM,WAAWM,CAAuB,EAEhE,OACEN,EAAA,cAACJ,EAAA,CAAY,GAAGM,EAAO,MAAOG,EAAO,KAAMD,EAAM,IAAKD,CACnDF,EAAAA,CACH,CAEJ,CAAC,EAEDF,EAAqB,YAAc"}
|