@atom-learning/components 4.1.2 → 4.1.4
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/dist/components/chip-toggle-group/ChipToggleGroupItem.js +1 -1
- package/dist/components/chip-toggle-group/ChipToggleGroupItem.js.map +1 -1
- package/dist/components/keyboard-shortcut/KeyboardShortcut.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 +2 -2
- package/CHANGELOG.md +0 -207
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Ok as s}from"@atom-learning/icons";import*as a from"@radix-ui/react-toggle-group";import*as o from"react";import{Chip as e}from"../chip/Chip.js";import"../chip/ChipGroup.js";import{Icon as p}from"../icon/Icon.js";import{styled as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as n}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";const i=t(p,{display:"none"}),c=t.withConfig({shouldForwardStitchesProp:r=>["as"].includes(r)})(e,{"&:not([disabled])":{cursor:"pointer","&:hover":{bg:"$grey200",color:"$grey1000",borderColor:"currentColor"},"&:focus-visible":{...n()},'&[data-state="on"]':{"&:hover":{bg:"white",color:"$primary1000"}}},'&[data-state="off"]':{color:"$grey800",bg:"
|
|
1
|
+
import{Ok as s}from"@atom-learning/icons";import*as a from"@radix-ui/react-toggle-group";import*as o from"react";import{Chip as e}from"../chip/Chip.js";import"../chip/ChipGroup.js";import{Icon as p}from"../icon/Icon.js";import{styled as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as n}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";const i=t(p,{display:"none"}),c=t.withConfig({shouldForwardStitchesProp:r=>["as"].includes(r)})(e,{"&:not([disabled])":{cursor:"pointer","&:hover":{bg:"$grey200",color:"$grey1000",borderColor:"currentColor"},"&:focus-visible":{...n()},'&[data-state="on"]':{"&:hover":{bg:"white",color:"$primary1000"}}},'&[data-state="off"]':{color:"$grey800",bg:"white",borderColor:"$grey600"},'&[data-state="on"]':{[`& ${i}`]:{display:"block"}}}),d=({size:r="md",children:m,...l})=>o.createElement(a.Item,{...l,asChild:!0},o.createElement(c,{as:"button"},o.createElement(i,{is:s,size:r==="lg"?"md":"sm"}),o.createElement(e.Content,null,m)));export{d as ChipToggleGroupItem};
|
|
2
2
|
//# sourceMappingURL=ChipToggleGroupItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChipToggleGroupItem.js","sources":["../../../src/components/chip-toggle-group/ChipToggleGroupItem.tsx"],"sourcesContent":["import { Ok } from '@atom-learning/icons'\nimport * as ToggleGroup from '@radix-ui/react-toggle-group'\nimport * as React from 'react'\n\nimport { Chip } from '~/components/chip'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/stitches'\nimport { focusVisibleStyleBlock } from '~/utilities'\n\nconst StyledChipToggleIcon = styled(Icon, {\n display: 'none'\n})\n\nconst StyledChipToggleGroupItem = styled.withConfig({\n shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Chip, {\n '&:not([disabled])': {\n cursor: 'pointer',\n '&:hover': {\n bg: '$grey200',\n color: '$grey1000',\n borderColor: 'currentColor'\n },\n '&:focus-visible': {\n ...focusVisibleStyleBlock()\n },\n '&[data-state=\"on\"]': {\n '&:hover': {\n bg: 'white',\n color: '$primary1000'\n }\n }\n },\n '&[data-state=\"off\"]': {\n color: '$grey800',\n bg: '
|
|
1
|
+
{"version":3,"file":"ChipToggleGroupItem.js","sources":["../../../src/components/chip-toggle-group/ChipToggleGroupItem.tsx"],"sourcesContent":["import { Ok } from '@atom-learning/icons'\nimport * as ToggleGroup from '@radix-ui/react-toggle-group'\nimport * as React from 'react'\n\nimport { Chip } from '~/components/chip'\nimport { Icon } from '~/components/icon'\nimport { styled } from '~/stitches'\nimport { focusVisibleStyleBlock } from '~/utilities'\n\nconst StyledChipToggleIcon = styled(Icon, {\n display: 'none'\n})\n\nconst StyledChipToggleGroupItem = styled.withConfig({\n shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Chip, {\n '&:not([disabled])': {\n cursor: 'pointer',\n '&:hover': {\n bg: '$grey200',\n color: '$grey1000',\n borderColor: 'currentColor'\n },\n '&:focus-visible': {\n ...focusVisibleStyleBlock()\n },\n '&[data-state=\"on\"]': {\n '&:hover': {\n bg: 'white',\n color: '$primary1000'\n }\n }\n },\n '&[data-state=\"off\"]': {\n color: '$grey800',\n bg: 'white',\n borderColor: '$grey600'\n },\n '&[data-state=\"on\"]': {\n [`& ${StyledChipToggleIcon}`]: {\n display: 'block'\n }\n }\n})\n\ntype TChipToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> &\n React.ComponentProps<typeof StyledChipToggleGroupItem>\n\nexport const ChipToggleGroupItem = ({\n size = 'md',\n children,\n ...rest\n}: TChipToggleGroupItem) => {\n return (\n <ToggleGroup.Item {...rest} asChild>\n <StyledChipToggleGroupItem as=\"button\">\n <StyledChipToggleIcon is={Ok} size={size === 'lg' ? 'md' : 'sm'} />\n <Chip.Content>{children}</Chip.Content>\n </StyledChipToggleGroupItem>\n </ToggleGroup.Item>\n )\n}\n"],"names":["StyledChipToggleIcon","styled","Icon","StyledChipToggleGroupItem","propName","Chip","focusVisibleStyleBlock","ChipToggleGroupItem","size","children","rest","React","ToggleGroup","Ok"],"mappings":"2hBASA,MAAMA,EAAuBC,EAAOC,EAAM,CACxC,QAAS,MACX,CAAC,EAEKC,EAA4BF,EAAO,WAAW,CAClD,0BAA4BG,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAAM,CACP,oBAAqB,CACnB,OAAQ,UACR,UAAW,CACT,GAAI,WACJ,MAAO,YACP,YAAa,cACf,EACA,kBAAmB,CACjB,GAAGC,GACL,EACA,qBAAsB,CACpB,UAAW,CACT,GAAI,QACJ,MAAO,cACT,CACF,CACF,EACA,sBAAuB,CACrB,MAAO,WACP,GAAI,QACJ,YAAa,UACf,EACA,qBAAsB,CACpB,CAAC,KAAKN,KAAyB,CAC7B,QAAS,OACX,CACF,CACF,CAAC,EAKYO,EAAsB,CAAC,CAClC,KAAAC,EAAO,KACP,SAAAC,KACGC,CACL,IAEIC,EAAA,cAACC,EAAY,KAAZ,CAAkB,GAAGF,EAAM,QAAO,EAAA,EACjCC,EAAA,cAACR,EAAA,CAA0B,GAAG,UAC5BQ,EAAA,cAACX,EAAA,CAAqB,GAAIa,EAAI,KAAML,IAAS,KAAO,KAAO,IAAA,CAAM,EACjEG,EAAA,cAACN,EAAK,QAAL,KAAcI,CAAS,CAC1B,CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyboardShortcut.js","sources":["../../../src/components/keyboard-shortcut/KeyboardShortcut.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\n\nimport { Box } from '../box'\nimport { Text } from '../text'\n\nconst StyledSlot = styled(Slot)\n\ntype KeyboardEventWindowOrElement =\n | KeyboardEvent\n | React.KeyboardEvent<HTMLDivElement>\ntype ShortcutConfig = Partial<KeyboardEvent
|
|
1
|
+
{"version":3,"file":"KeyboardShortcut.js","sources":["../../../src/components/keyboard-shortcut/KeyboardShortcut.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\n\nimport { Box } from '../box'\nimport { Text } from '../text'\n\nconst StyledSlot = styled(Slot)\n\ntype KeyboardEventWindowOrElement =\n | KeyboardEvent\n | React.KeyboardEvent<HTMLDivElement>\ntype ShortcutConfig = Partial<KeyboardEvent>\n\ntype KeyboardShortcutProps = React.ComponentProps<typeof Box> & {\n asChild?: boolean\n config: {\n shortcut: ShortcutConfig\n action: ({\n event,\n shortcut\n }: {\n event: KeyboardEvent | React.KeyboardEvent<HTMLDivElement>\n shortcut: ShortcutConfig\n }) => void\n }[]\n targetWindow?: boolean\n onKeyDown?: (e: KeyboardEventWindowOrElement) => void\n}\n\nexport const KeyboardShortcut: React.ForwardRefExoticComponent<KeyboardShortcutProps> =\n React.forwardRef(\n ({ asChild, config, targetWindow = false, onKeyDown, ...rest }, ref) => {\n const [targetElRef, setTargetElRef] = useCallbackRefState()\n React.useImperativeHandle(ref, () => targetElRef as HTMLDivElement)\n\n const handleOnKeydown = React.useCallback(\n (e: KeyboardEventWindowOrElement) => {\n config.forEach(({ shortcut, action }) => {\n if (\n Object.entries(shortcut).every(([key, value]) => e[key] === value)\n )\n action({ event: e, shortcut })\n })\n onKeyDown?.(e)\n },\n [config, onKeyDown]\n )\n\n React.useEffect(() => {\n if (targetWindow) window.addEventListener('keydown', handleOnKeydown)\n\n return () => {\n window.removeEventListener('keydown', handleOnKeydown)\n }\n }, [targetWindow, handleOnKeydown])\n\n const Component = asChild ? StyledSlot : Box\n\n return (\n <Component\n onKeyDown={targetWindow ? undefined : handleOnKeydown}\n ref={setTargetElRef}\n {...rest}\n />\n )\n }\n )\n\nKeyboardShortcut.displayName = 'KeyboardShortcut'\n\nconst StyledKeyboardShortcutIndicator = styled.withConfig({\n shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Text, {\n bg: '$grey100',\n color: '$textSubtle',\n px: '$2',\n py: '$0',\n minWidth: '$2',\n minHeight: '$2',\n fontWeight: 400,\n display: 'inline-flex',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: '$1',\n flexShrink: 0\n})\n\ntype KeyboardShortcutIndicatorProps = React.ComponentProps<\n typeof StyledKeyboardShortcutIndicator\n>\n\nexport const KeyboardShortcutIndicator = (\n props: KeyboardShortcutIndicatorProps\n) => {\n return <StyledKeyboardShortcutIndicator size=\"sm\" as=\"kbd\" {...props} />\n}\n\nKeyboardShortcutIndicator.displayName = 'KeyboardShortcut'\n"],"names":["StyledSlot","styled","Slot","KeyboardShortcut","React","asChild","config","targetWindow","onKeyDown","rest","ref","targetElRef","setTargetElRef","useCallbackRefState","handleOnKeydown","e","shortcut","action","key","value","Box","StyledKeyboardShortcutIndicator","propName","Text","KeyboardShortcutIndicator","props"],"mappings":"wQASA,MAAMA,EAAaC,EAAOC,CAAI,EAuBjBC,EACXC,EAAM,WACJ,CAAC,CAAE,QAAAC,EAAS,OAAAC,EAAQ,aAAAC,EAAe,GAAO,UAAAC,KAAcC,CAAK,EAAGC,IAAQ,CACtE,KAAM,CAACC,EAAaC,CAAc,EAAIC,IACtCT,EAAM,oBAAoBM,EAAK,IAAMC,CAA6B,EAElE,MAAMG,EAAkBV,EAAM,YAC3BW,GAAoC,CACnCT,EAAO,QAAQ,CAAC,CAAE,SAAAU,EAAU,OAAAC,CAAO,IAAM,CAErC,OAAO,QAAQD,CAAQ,EAAE,MAAM,CAAC,CAACE,EAAKC,CAAK,IAAMJ,EAAEG,KAASC,CAAK,GAEjEF,EAAO,CAAE,MAAOF,EAAG,SAAAC,CAAS,CAAC,CACjC,CAAC,EACDR,GAAA,MAAAA,EAAYO,CAAAA,CACd,EACA,CAACT,EAAQE,CAAS,CACpB,EAEA,OAAAJ,EAAM,UAAU,KACVG,GAAc,OAAO,iBAAiB,UAAWO,CAAe,EAE7D,IAAM,CACX,OAAO,oBAAoB,UAAWA,CAAe,CACvD,GACC,CAACP,EAAcO,CAAe,CAAC,EAKhCV,EAAA,cAHgBC,EAAUL,EAAaoB,EAGtC,CACC,UAAWb,EAAe,OAAYO,EACtC,IAAKF,EACJ,GAAGH,CACN,CAAA,CAEJ,CACF,EAEFN,EAAiB,YAAc,mBAE/B,MAAMkB,EAAkCpB,EAAO,WAAW,CACxD,0BAA4BqB,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAAM,CACP,GAAI,WACJ,MAAO,cACP,GAAI,KACJ,GAAI,KACJ,SAAU,KACV,UAAW,KACX,WAAY,IACZ,QAAS,cACT,eAAgB,SAChB,WAAY,SACZ,aAAc,KACd,WAAY,CACd,CAAC,EAMYC,EACXC,GAEOrB,EAAA,cAACiB,EAAA,CAAgC,KAAK,KAAK,GAAG,MAAO,GAAGI,CAAAA,CAAO,EAGxED,EAA0B,YAAc"}
|