@atom-learning/components 2.32.3-beta.0 → 2.34.0

package/dist/components/top-bar/TopBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import React from 'react'\n\nimport { CSS, styled } from '~/stitches'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\ninterface TopBarSubComponents {\n  Brand: typeof TopBarBrand\n  BrandLogo: typeof TopBarBrandLogo\n  BrandName: typeof TopBarBrandName\n  ActionIcon: typeof TopBarActionIcon\n  Divider: typeof TopBarDivider\n}\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" css={{ height: '$2', bg: '$tonal100' }} />\n)\n\nconst StyledRoot = styled('div', {\n  bg: 'white',\n  position: 'sticky',\n  display: 'flex',\n  alignItems: 'center',\n  width: '100vw',\n  top: '0',\n  zIndex: 1,\n  borderBottom: '1px solid $tonal100',\n  transition: 'box-shadow .2s ease-out',\n  variants: {\n    hasScrolled: {\n      true: {\n        boxShadow: '0px 4px 4px -2px rgba(31, 31, 31, 0.1);'\n      }\n    },\n    size: {\n      md: {\n        height: '$6',\n        [`& ${TopBarBrandLogo}`]: {\n          '&[src$=\".svg\"]': {\n            height: 24,\n            width: 'auto'\n          }\n        }\n      },\n      lg: {\n        height: '$7',\n        [`& ${TopBarBrandLogo}`]: {\n          '&[src$=\".svg\"]': {\n            height: 32,\n            width: 'auto'\n          }\n        }\n      }\n    }\n  }\n})\n\nconst Container = styled(Flex, {\n  alignItems: 'center',\n  height: '$4',\n  mx: '$4',\n  width: '100%',\n  '@md': {\n    mx: '$5'\n  }\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ninterface TopBarProps extends StyledRootProps {\n  css?: CSS\n}\n\nexport const TopBar: React.FC<TopBarProps> & TopBarSubComponents = ({\n  size = 'md',\n  ...props\n}) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <StyledRoot hasScrolled={!!scrollPositionY} size={size}>\n      <Container {...props} />\n    </StyledRoot>\n  )\n}\n\nTopBar.Brand = TopBarBrand\nTopBar.BrandLogo = TopBarBrandLogo\nTopBar.BrandName = TopBarBrandName\nTopBar.ActionIcon = TopBarActionIcon\nTopBar.Divider = TopBarDivider\n\nTopBar.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","TopBarBrandLogo","Container","Flex","TopBar","size","props","scrollPositionY","useWindowScrollPosition","TopBarBrand","TopBarBrandName","TopBarActionIcon"],"mappings":"oYAkBA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,IAAK,CAAE,OAAQ,KAAM,GAAI,WAAY,CAAA,CAAG,EAGpEC,EAAaC,EAAO,MAAO,CAC/B,GAAI,QACJ,SAAU,SACV,QAAS,OACT,WAAY,SACZ,MAAO,QACP,IAAK,IACL,OAAQ,EACR,aAAc,sBACd,WAAY,0BACZ,SAAU,CACR,YAAa,CACX,KAAM,CACJ,UAAW,yCACb,CACF,EACA,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,CAAC,KAAKC,KAAoB,CACxB,iBAAkB,CAChB,OAAQ,GACR,MAAO,MACT,CACF,CACF,EACA,GAAI,CACF,OAAQ,KACR,CAAC,KAAKA,KAAoB,CACxB,iBAAkB,CAChB,OAAQ,GACR,MAAO,MACT,CACF,CACF,CACF,CACF,CACF,CAAC,EAEKC,EAAYF,EAAOG,EAAM,CAC7B,WAAY,SACZ,OAAQ,KACR,GAAI,KACJ,MAAO,OACP,MAAO,CACL,GAAI,IACN,CACF,CAAC,EAQYC,EAAsD,CAAC,CAClE,KAAAC,EAAO,QACJC,CACL,IAAM,CACJ,KAAM,CAAE,EAAGC,CAAgB,EAAIC,IAE/B,OACEX,EAAA,cAACE,EAAA,CAAW,YAAa,CAAC,CAACQ,EAAiB,KAAMF,GAChDR,EAAA,cAACK,EAAA,CAAW,GAAGI,EAAO,CACxB,CAEJ,EAEAF,EAAO,MAAQK,EACfL,EAAO,UAAYH,EACnBG,EAAO,UAAYM,EACnBN,EAAO,WAAaO,EACpBP,EAAO,QAAUR,EAEjBQ,EAAO,YAAc"}

package/dist/components/top-bar/TopBarActionIcon.js

@@ -1 +1,2 @@
 import e from"react";import{ActionIcon as m}from"../action-icon/ActionIcon.js";import{Icon as n}from"../icon/Icon.js";const c=e.forwardRef(({icon:o,...r},t)=>e.createElement(m,{size:"md",appearance:"simple",theme:"neutral",ref:t,...r},e.createElement(n,{is:o})));export{c as TopBarActionIcon};
+//# sourceMappingURL=TopBarActionIcon.js.map

package/dist/components/top-bar/TopBarActionIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBarActionIcon.js","sources":["../../../src/components/top-bar/TopBarActionIcon.tsx"],"sourcesContent":["import React from 'react'\n\nimport { ActionIcon } from '../action-icon'\nimport { Icon } from '../icon'\n\ntype TopBarActionIconProps = Omit<\n  React.ComponentProps<typeof ActionIcon>,\n  'size' | 'children'\n> & { icon: React.FC<React.SVGProps<SVGSVGElement>>; label: string }\n\nexport const TopBarActionIcon: React.ForwardRefExoticComponent<TopBarActionIconProps> =\n  React.forwardRef(({ icon, ...rest }, forwardedRef) => {\n    return (\n      <ActionIcon\n        size=\"md\"\n        appearance=\"simple\"\n        theme=\"neutral\"\n        ref={forwardedRef}\n        {...rest}\n      >\n        <Icon is={icon} />\n      </ActionIcon>\n    )\n  })\n"],"names":["TopBarActionIcon","React","icon","rest","forwardedRef","ActionIcon","Icon"],"mappings":"sHAUa,MAAAA,EACXC,EAAM,WAAW,CAAC,CAAE,KAAAC,KAASC,CAAK,EAAGC,IAEjCH,EAAA,cAACI,EAAA,CACC,KAAK,KACL,WAAW,SACX,MAAM,UACN,IAAKD,EACJ,GAAGD,CAAAA,EAEJF,EAAA,cAACK,EAAA,CAAK,GAAIJ,CAAAA,CAAM,CAClB,CAEH"}

package/dist/components/top-bar/TopBarBrand.js

@@ -1 +1,2 @@
 import n from"react";import{styled as o}from"../../stitches.js";import{Image as l}from"../image/Image.js";import{Text as m}from"../text/Text.js";const r=({src:t,alt:a="Atom Learning logo",css:e})=>n.createElement(l,{className:"topbar-brand-logo",src:t,alt:a,css:{mr:"$3",mb:"5px",...e}});r.toString=()=>".topbar-brand-logo";const c=o(m,{color:"$tonal400"}),s=o("a",{display:"flex",alignItems:"center",textDecoration:"none",color:"$tonal400","&:hover, &:focus":{textDecoration:"none"}});export{s as TopBarBrand,r as TopBarBrandLogo,c as TopBarBrandName};
+//# sourceMappingURL=TopBarBrand.js.map

package/dist/components/top-bar/TopBarBrand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBarBrand.js","sources":["../../../src/components/top-bar/TopBarBrand.tsx"],"sourcesContent":["import React from 'react'\n\nimport { CSS, styled } from '~/stitches'\n\nimport { Image } from '../image'\nimport { Text } from '../text'\n\ntype TopBarBrandLogoProps = {\n  src: string\n  alt?: string\n  css?: CSS\n}\n\nexport const TopBarBrandLogo = ({\n  src,\n  alt = 'Atom Learning logo',\n  css\n}: TopBarBrandLogoProps): JSX.Element => {\n  return (\n    <Image\n      className=\"topbar-brand-logo\"\n      src={src}\n      alt={alt}\n      css={{\n        mr: '$3',\n        mb: '5px',\n        ...css\n      }}\n    />\n  )\n}\n\nTopBarBrandLogo.toString = () => '.topbar-brand-logo'\n\nexport const TopBarBrandName = styled(Text, {\n  color: '$tonal400'\n})\n\nexport const TopBarBrand = styled('a', {\n  display: 'flex',\n  alignItems: 'center',\n  textDecoration: 'none',\n  color: '$tonal400',\n  '&:hover, &:focus': { textDecoration: 'none' }\n})\n"],"names":["TopBarBrandLogo","src","alt","css","React","Image","TopBarBrandName","styled","Text","TopBarBrand"],"mappings":"iJAaO,MAAMA,EAAkB,CAAC,CAC9B,IAAAC,EACA,IAAAC,EAAM,qBACN,IAAAC,CACF,IAEIC,EAAA,cAACC,EAAA,CACC,UAAU,oBACV,IAAKJ,EACL,IAAKC,EACL,IAAK,CACH,GAAI,KACJ,GAAI,MACJ,GAAGC,CACL,CAAA,CACF,EAIJH,EAAgB,SAAW,IAAM,2BAEpBM,EAAkBC,EAAOC,EAAM,CAC1C,MAAO,WACT,CAAC,EAEYC,EAAcF,EAAO,IAAK,CACrC,QAAS,OACT,WAAY,SACZ,eAAgB,OAChB,MAAO,YACP,mBAAoB,CAAE,eAAgB,MAAO,CAC/C,CAAC"}

package/dist/components/video/Video.js

@@ -1 +1,2 @@
-import*as e from"react";import m from"react-player/vimeo";import{Box as p}from"../box/Box.js";import{styled as a}from"../../stitches.js";import{CSSWrapper as l}from"../../utilities/css-wrapper/CSSWrapper.js";const f=a(m,{}),o=e.forwardRef(({id:r,ratio:t=9/16,css:i,...s},d)=>e.createElement(l,{css:i},e.createElement(p,{css:{borderRadius:"$0",position:"relative",paddingTop:`${t*100}%`,overflow:"hidden",height:0,width:"100%"}},e.createElement(f,{...s,role:"figure",url:`https://player.vimeo.com/video/${r}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:d}))));o.displayName="Video";export{o as Video};
+import*as e from"react";import m from"react-player/vimeo";import{Box as p}from"../box/Box.js";import{styled as a}from"../../stitches.js";import{CSSWrapper as l}from"../../utilities/css-wrapper/CSSWrapper.js";const f=a(m,{}),o=e.forwardRef(({id:t,ratio:r=9/16,css:i,...s},d)=>e.createElement(l,{css:i},e.createElement(p,{css:{borderRadius:"$0",position:"relative",paddingTop:`${r*100}%`,overflow:"hidden",height:0,width:"100%"}},e.createElement(f,{...s,role:"figure",url:`https://player.vimeo.com/video/${t}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:d}))));o.displayName="Video";export{o as Video};
+//# sourceMappingURL=Video.js.map

package/dist/components/video/Video.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Video.js","sources":["../../../src/components/video/Video.tsx"],"sourcesContent":["import * as React from 'react'\n// Note: Only loading vimeo to reduce the bundle size  https://www.npmjs.com/package/react-player\nimport ReactPlayer from 'react-player/vimeo'\n\nimport { Box } from '~/components/box'\nimport { CSS, styled } from '~/stitches'\nimport { CSSWrapper } from '~/utilities/css-wrapper'\nimport { Override } from '~/utilities/types'\n\nconst StyledVideo = styled(ReactPlayer, {})\n\ntype VideoProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledVideo>,\n  {\n    id: string\n    ratio?: number\n    css?: CSS\n  }\n>\n\nexport const Video = React.forwardRef<typeof StyledVideo, VideoProps>(\n  ({ id, ratio = 9 / 16, css, ...remainingProps }, ref) => (\n    <CSSWrapper css={css}>\n      <Box\n        css={{\n          borderRadius: '$0',\n          position: 'relative',\n          paddingTop: `${ratio * 100}%`,\n          overflow: 'hidden',\n          height: 0,\n          width: '100%'\n        }}\n      >\n        <StyledVideo\n          {...remainingProps}\n          role=\"figure\"\n          url={`https://player.vimeo.com/video/${id}`}\n          height=\"100%\"\n          width=\"100%\"\n          css={{ position: 'absolute', top: 0, left: 0 }}\n          ref={ref}\n        />\n      </Box>\n    </CSSWrapper>\n  )\n)\n\nVideo.displayName = 'Video'\n"],"names":["StyledVideo","styled","ReactPlayer","Video","React","id","ratio","css","remainingProps","ref","CSSWrapper","Box"],"mappings":"gNASA,MAAMA,EAAcC,EAAOC,EAAa,CAAA,CAAE,EAW7BC,EAAQC,EAAM,WACzB,CAAC,CAAE,GAAAC,EAAI,MAAAC,EAAQ,EAAI,GAAI,IAAAC,KAAQC,CAAe,EAAGC,IAC/CL,EAAA,cAACM,EAAA,CAAW,IAAKH,CAAAA,EACfH,EAAA,cAACO,EAAA,CACC,IAAK,CACH,aAAc,KACd,SAAU,WACV,WAAY,GAAGL,EAAQ,OACvB,SAAU,SACV,OAAQ,EACR,MAAO,MACT,CAAA,EAEAF,EAAA,cAACJ,EAAA,CACE,GAAGQ,EACJ,KAAK,SACL,IAAK,kCAAkCH,IACvC,OAAO,OACP,MAAM,OACN,IAAK,CAAE,SAAU,WAAY,IAAK,EAAG,KAAM,CAAE,EAC7C,IAAKI,CAAAA,CACP,CACF,CACF,CAEJ,EAEAN,EAAM,YAAc"}

package/dist/constants/zIndices.js

@@ -1 +1,2 @@
 const _=2147483647,D=1147483646,I=10,O=10,s=10;export{D as DIALOG_Z_INDEX,I as DROPDOWN_Z_INDEX,_ as MAX_Z_INDEX,s as POPOVER_Z_INDEX,O as TOOLTIP_Z_INDEX};
+//# sourceMappingURL=zIndices.js.map

package/dist/constants/zIndices.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zIndices.js","sources":["../../src/constants/zIndices.ts"],"sourcesContent":["const MAX_Z_INDEX = 2147483647\nconst DIALOG_Z_INDEX = 1147483646\nconst DROPDOWN_Z_INDEX = 10\nconst TOOLTIP_Z_INDEX = 10\nconst POPOVER_Z_INDEX = 10\n\nexport {\n  MAX_Z_INDEX,\n  DIALOG_Z_INDEX,\n  DROPDOWN_Z_INDEX,\n  POPOVER_Z_INDEX,\n  TOOLTIP_Z_INDEX\n}\n"],"names":["MAX_Z_INDEX","DIALOG_Z_INDEX","DROPDOWN_Z_INDEX","TOOLTIP_Z_INDEX","POPOVER_Z_INDEX"],"mappings":"AAAA,MAAMA,EAAc,WACdC,EAAiB,WACjBC,EAAmB,GACnBC,EAAkB,GAClBC,EAAkB"}