@atom-learning/components 2.58.0 → 2.58.1

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 CHANGED
@@ -1,9 +1,10 @@
1
- # [2.58.0](https://github.com/Atom-Learning/components/compare/v2.57.0...v2.58.0) (2023-06-07)
1
+ ## [2.58.1](https://github.com/Atom-Learning/components/compare/v2.58.0...v2.58.1) (2023-06-08)
2
2
 
3
3
 
4
- ### Features
4
+ ### Bug Fixes
5
5
 
6
- * make Dot positioning CSS a bit cleaner ([7f21e20](https://github.com/Atom-Learning/components/commit/7f21e20ad4bce3aef9350d06a9161c750154c5cc))
6
+ * section message content vertical alignment ([cf9dcf1](https://github.com/Atom-Learning/components/commit/cf9dcf12abcf0d83e59aa5109b0af11b858e1ded))
7
+ * section message page codeblocks formatting ([3c04545](https://github.com/Atom-Learning/components/commit/3c04545c7da50a721394440df400413d5d71baf5))
7
8
 
8
9
  # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
9
10
 
@@ -1,2 +1,2 @@
1
- import{TooltipProvider as m}from"@radix-ui/react-tooltip";import t from"react";import{styled as s}from"../../stitches.js";import{Dismissible as a}from"../dismissible/index.js";import{Stack as l}from"../stack/Stack.js";import{SectionMessageProvider as g,useSectionMessageContext as p}from"./SectionMessageContext.js";import{SectionMessageDescription as f}from"./SectionMessageDescription.js";import{SectionMessageDismiss as h}from"./SectionMessageDismiss.js";import{SectionMessageIcon as u}from"./SectionMessageIcon.js";import{SectionMessageContent as $,SectionMessageActions as d}from"./SectionMessageLayout.js";import{SectionMessageTitle as b}from"./SectionMessageTitle.js";const D=s(a,{position:"relative",borderRadius:"$0",display:"flex",p:"$4",border:"1px solid white",variants:{theme:{success:{bg:"$successLight",color:"$successDark"},warning:{bg:"$warningLight",color:"$warningText"},error:{bg:"$dangerLight",color:"$dangerDark"},neutral:{bg:"$grey100",color:"$grey1000"},info:{bg:"$blue100",color:"$blue1000"}},hasIcon:{true:{pl:"$6"}},hasDismiss:{true:{pr:"$7"}}}}),S=s(l,{flexGrow:1,justifyContent:"space-between !important"}),M=({children:o,...r})=>{const{theme:i,hasIcon:n,hasDismiss:c}=p();return t.createElement(D,{...r,theme:i,hasIcon:n,hasDismiss:c},t.createElement(S,{gap:3},o))},e=({theme:o="info",...r})=>t.createElement(m,null,t.createElement(g,{theme:o},t.createElement(M,{...r})));e.Title=b,e.Description=f,e.Icon=u,e.Dismiss=h,e.Content=$,e.Actions=d;export{e as SectionMessage};
1
+ import{TooltipProvider as m}from"@radix-ui/react-tooltip";import t from"react";import{styled as s}from"../../stitches.js";import{Dismissible as a}from"../dismissible/index.js";import{Stack as l}from"../stack/Stack.js";import{SectionMessageProvider as g,useSectionMessageContext as p}from"./SectionMessageContext.js";import{SectionMessageDescription as f}from"./SectionMessageDescription.js";import{SectionMessageDismiss as h}from"./SectionMessageDismiss.js";import{SectionMessageIcon as $}from"./SectionMessageIcon.js";import{SectionMessageContent as u,SectionMessageActions as d}from"./SectionMessageLayout.js";import{SectionMessageTitle as b}from"./SectionMessageTitle.js";const D=s(a,{position:"relative",borderRadius:"$0",display:"flex",minHeight:"$5",p:"$4",border:"1px solid white",variants:{theme:{success:{bg:"$successLight",color:"$successDark"},warning:{bg:"$warningLight",color:"$warningText"},error:{bg:"$dangerLight",color:"$dangerDark"},neutral:{bg:"$grey100",color:"$grey1000"},info:{bg:"$blue100",color:"$blue1000"}},hasIcon:{true:{pl:"$6"}},hasDismiss:{true:{pr:"$7"}}}}),S=s(l,{flexGrow:1,justifyContent:"space-between !important"}),M=({children:o,...r})=>{const{theme:i,hasIcon:n,hasDismiss:c}=p();return t.createElement(D,{...r,theme:i,hasIcon:n,hasDismiss:c},t.createElement(S,{gap:3},o))},e=({theme:o="info",...r})=>t.createElement(m,null,t.createElement(g,{theme:o},t.createElement(M,{...r})));e.Title=b,e.Description=f,e.Icon=$,e.Dismiss=h,e.Content=u,e.Actions=d;export{e as SectionMessage};
2
2
  //# sourceMappingURL=SectionMessage.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SectionMessage.js","sources":["../../../src/components/section-message/SectionMessage.tsx"],"sourcesContent":["import { TooltipProvider } from '@radix-ui/react-tooltip'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Dismissible } from '../dismissible'\nimport { Stack } from '../stack'\nimport {\n SectionMessageProvider,\n useSectionMessageContext\n} from './SectionMessageContext'\nimport { SectionMessageDescription } from './SectionMessageDescription'\nimport { SectionMessageDismiss } from './SectionMessageDismiss'\nimport { SectionMessageIcon } from './SectionMessageIcon'\nimport {\n SectionMessageActions,\n SectionMessageContent\n} from './SectionMessageLayout'\nimport { SectionMessageTitle } from './SectionMessageTitle'\n\nconst StyledSectionMessage = styled(Dismissible, {\n position: 'relative',\n borderRadius: '$0',\n display: 'flex',\n p: '$4',\n border: '1px solid white',\n variants: {\n theme: {\n success: {\n bg: '$successLight',\n color: '$successDark'\n },\n warning: {\n bg: '$warningLight',\n color: '$warningText'\n },\n error: {\n bg: '$dangerLight',\n color: '$dangerDark'\n },\n neutral: {\n bg: '$grey100',\n color: '$grey1000'\n },\n info: {\n bg: '$blue100',\n color: '$blue1000'\n }\n },\n hasIcon: {\n true: {\n pl: '$6'\n }\n },\n hasDismiss: {\n true: {\n pr: '$7'\n }\n }\n }\n})\n\nconst StyledStack = styled(Stack, {\n flexGrow: 1,\n justifyContent: 'space-between !important'\n})\n\nconst SectionMessageRoot = ({\n children,\n ...rest\n}: React.ComponentProps<typeof StyledSectionMessage>): JSX.Element => {\n const { theme, hasIcon, hasDismiss } = useSectionMessageContext()\n\n return (\n <StyledSectionMessage\n {...rest}\n theme={theme}\n hasIcon={hasIcon}\n hasDismiss={hasDismiss}\n >\n <StyledStack gap={3}>{children}</StyledStack>\n </StyledSectionMessage>\n )\n}\n\nexport type SectionMessageTheme =\n | 'success'\n | 'warning'\n | 'error'\n | 'neutral'\n | 'info'\n\nexport interface SectionMessageProps\n extends React.ComponentProps<typeof SectionMessageRoot> {\n theme?: SectionMessageTheme\n}\n\nexport const SectionMessage = ({\n theme = 'info',\n ...rest\n}: SectionMessageProps): JSX.Element => {\n return (\n <TooltipProvider>\n <SectionMessageProvider theme={theme}>\n <SectionMessageRoot {...rest} />\n </SectionMessageProvider>\n </TooltipProvider>\n )\n}\n\nSectionMessage.Title = SectionMessageTitle\nSectionMessage.Description = SectionMessageDescription\nSectionMessage.Icon = SectionMessageIcon\nSectionMessage.Dismiss = SectionMessageDismiss\nSectionMessage.Content = SectionMessageContent\nSectionMessage.Actions = SectionMessageActions\n"],"names":["StyledSectionMessage","styled","Dismissible","StyledStack","Stack","SectionMessageRoot","children","rest","theme","hasIcon","hasDismiss","useSectionMessageContext","React","SectionMessage","TooltipProvider","SectionMessageProvider","SectionMessageTitle","SectionMessageDescription","SectionMessageIcon","SectionMessageDismiss","SectionMessageContent","SectionMessageActions"],"mappings":"mqBAoBA,MAAMA,EAAuBC,EAAOC,EAAa,CAC/C,SAAU,WACV,aAAc,KACd,QAAS,OACT,EAAG,KACH,OAAQ,kBACR,SAAU,CACR,MAAO,CACL,QAAS,CACP,GAAI,gBACJ,MAAO,cACT,EACA,QAAS,CACP,GAAI,gBACJ,MAAO,cACT,EACA,MAAO,CACL,GAAI,eACJ,MAAO,aACT,EACA,QAAS,CACP,GAAI,WACJ,MAAO,WACT,EACA,KAAM,CACJ,GAAI,WACJ,MAAO,WACT,CACF,EACA,QAAS,CACP,KAAM,CACJ,GAAI,IACN,CACF,EACA,WAAY,CACV,KAAM,CACJ,GAAI,IACN,CACF,CACF,CACF,CAAC,EAEKC,EAAcF,EAAOG,EAAO,CAChC,SAAU,EACV,eAAgB,0BAClB,CAAC,EAEKC,EAAqB,CAAC,CAC1B,SAAAC,KACGC,CACL,IAAsE,CACpE,KAAM,CAAE,MAAAC,EAAO,QAAAC,EAAS,WAAAC,CAAW,EAAIC,EAAyB,EAEhE,OACEC,EAAA,cAACZ,EAAA,CACE,GAAGO,EACJ,MAAOC,EACP,QAASC,EACT,WAAYC,CAEZE,EAAAA,EAAA,cAACT,EAAA,CAAY,IAAK,CAAIG,EAAAA,CAAS,CACjC,CAEJ,EAcaO,EAAiB,CAAC,CAC7B,MAAAL,EAAQ,UACLD,CACL,IAEIK,EAAA,cAACE,EAAA,KACCF,EAAA,cAACG,EAAA,CAAuB,MAAOP,GAC7BI,EAAA,cAACP,EAAA,CAAoB,GAAGE,CAAAA,CAAM,CAChC,CACF,EAIJM,EAAe,MAAQG,EACvBH,EAAe,YAAcI,EAC7BJ,EAAe,KAAOK,EACtBL,EAAe,QAAUM,EACzBN,EAAe,QAAUO,EACzBP,EAAe,QAAUQ"}
1
+ {"version":3,"file":"SectionMessage.js","sources":["../../../src/components/section-message/SectionMessage.tsx"],"sourcesContent":["import { TooltipProvider } from '@radix-ui/react-tooltip'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Dismissible } from '../dismissible'\nimport { Stack } from '../stack'\nimport {\n SectionMessageProvider,\n useSectionMessageContext\n} from './SectionMessageContext'\nimport { SectionMessageDescription } from './SectionMessageDescription'\nimport { SectionMessageDismiss } from './SectionMessageDismiss'\nimport { SectionMessageIcon } from './SectionMessageIcon'\nimport {\n SectionMessageActions,\n SectionMessageContent\n} from './SectionMessageLayout'\nimport { SectionMessageTitle } from './SectionMessageTitle'\n\nconst StyledSectionMessage = styled(Dismissible, {\n position: 'relative',\n borderRadius: '$0',\n display: 'flex',\n minHeight: '$5',\n p: '$4',\n border: '1px solid white',\n variants: {\n theme: {\n success: {\n bg: '$successLight',\n color: '$successDark'\n },\n warning: {\n bg: '$warningLight',\n color: '$warningText'\n },\n error: {\n bg: '$dangerLight',\n color: '$dangerDark'\n },\n neutral: {\n bg: '$grey100',\n color: '$grey1000'\n },\n info: {\n bg: '$blue100',\n color: '$blue1000'\n }\n },\n hasIcon: {\n true: {\n pl: '$6'\n }\n },\n hasDismiss: {\n true: {\n pr: '$7'\n }\n }\n }\n})\n\nconst StyledStack = styled(Stack, {\n flexGrow: 1,\n justifyContent: 'space-between !important'\n})\n\nconst SectionMessageRoot = ({\n children,\n ...rest\n}: React.ComponentProps<typeof StyledSectionMessage>): JSX.Element => {\n const { theme, hasIcon, hasDismiss } = useSectionMessageContext()\n\n return (\n <StyledSectionMessage\n {...rest}\n theme={theme}\n hasIcon={hasIcon}\n hasDismiss={hasDismiss}\n >\n <StyledStack gap={3}>{children}</StyledStack>\n </StyledSectionMessage>\n )\n}\n\nexport type SectionMessageTheme =\n | 'success'\n | 'warning'\n | 'error'\n | 'neutral'\n | 'info'\n\nexport interface SectionMessageProps\n extends React.ComponentProps<typeof SectionMessageRoot> {\n theme?: SectionMessageTheme\n}\n\nexport const SectionMessage = ({\n theme = 'info',\n ...rest\n}: SectionMessageProps): JSX.Element => {\n return (\n <TooltipProvider>\n <SectionMessageProvider theme={theme}>\n <SectionMessageRoot {...rest} />\n </SectionMessageProvider>\n </TooltipProvider>\n )\n}\n\nSectionMessage.Title = SectionMessageTitle\nSectionMessage.Description = SectionMessageDescription\nSectionMessage.Icon = SectionMessageIcon\nSectionMessage.Dismiss = SectionMessageDismiss\nSectionMessage.Content = SectionMessageContent\nSectionMessage.Actions = SectionMessageActions\n"],"names":["StyledSectionMessage","styled","Dismissible","StyledStack","Stack","SectionMessageRoot","children","rest","theme","hasIcon","hasDismiss","useSectionMessageContext","React","SectionMessage","TooltipProvider","SectionMessageProvider","SectionMessageTitle","SectionMessageDescription","SectionMessageIcon","SectionMessageDismiss","SectionMessageContent","SectionMessageActions"],"mappings":"mqBAoBA,MAAMA,EAAuBC,EAAOC,EAAa,CAC/C,SAAU,WACV,aAAc,KACd,QAAS,OACT,UAAW,KACX,EAAG,KACH,OAAQ,kBACR,SAAU,CACR,MAAO,CACL,QAAS,CACP,GAAI,gBACJ,MAAO,cACT,EACA,QAAS,CACP,GAAI,gBACJ,MAAO,cACT,EACA,MAAO,CACL,GAAI,eACJ,MAAO,aACT,EACA,QAAS,CACP,GAAI,WACJ,MAAO,WACT,EACA,KAAM,CACJ,GAAI,WACJ,MAAO,WACT,CACF,EACA,QAAS,CACP,KAAM,CACJ,GAAI,IACN,CACF,EACA,WAAY,CACV,KAAM,CACJ,GAAI,IACN,CACF,CACF,CACF,CAAC,EAEKC,EAAcF,EAAOG,EAAO,CAChC,SAAU,EACV,eAAgB,0BAClB,CAAC,EAEKC,EAAqB,CAAC,CAC1B,SAAAC,KACGC,CACL,IAAsE,CACpE,KAAM,CAAE,MAAAC,EAAO,QAAAC,EAAS,WAAAC,CAAW,EAAIC,EAAAA,EAEvC,OACEC,EAAA,cAACZ,EAAA,CACE,GAAGO,EACJ,MAAOC,EACP,QAASC,EACT,WAAYC,CAAAA,EAEZE,EAAA,cAACT,EAAA,CAAY,IAAK,CAAIG,EAAAA,CAAS,CACjC,CAEJ,EAcaO,EAAiB,CAAC,CAC7B,MAAAL,EAAQ,UACLD,CACL,IAEIK,EAAA,cAACE,EAAA,KACCF,EAAA,cAACG,EAAA,CAAuB,MAAOP,GAC7BI,EAAA,cAACP,EAAA,CAAoB,GAAGE,CAAAA,CAAM,CAChC,CACF,EAIJM,EAAe,MAAQG,EACvBH,EAAe,YAAcI,EAC7BJ,EAAe,KAAOK,EACtBL,EAAe,QAAUM,EACzBN,EAAe,QAAUO,EACzBP,EAAe,QAAUQ"}
@@ -1,2 +1,2 @@
1
- import r from"react";import{Box as s}from"../box/Box.js";import{Stack as o}from"../stack/Stack.js";const a=({css:e,...t})=>r.createElement(s,{css:{maxWidth:"100%",flexShrink:0,...e},...t}),c=({css:e,...t})=>r.createElement(s,{css:{maxWidth:"100%",flexShrink:0,...e}},r.createElement(o,{wrap:"wrap",gap:3,...t}));export{c as SectionMessageActions,a as SectionMessageContent};
1
+ import s from"react";import{Box as o}from"../box/Box.js";import{Stack as r}from"../stack/Stack.js";const a=({css:e,...t})=>s.createElement(o,{css:{maxWidth:"100%",flexShrink:0,["& > *:not(:last-child)"]:{mb:"$2"},...e},...t}),c=({css:e,...t})=>s.createElement(o,{css:{maxWidth:"100%",flexShrink:0,...e}},s.createElement(r,{wrap:"wrap",gap:3,...t}));export{c as SectionMessageActions,a as SectionMessageContent};
2
2
  //# sourceMappingURL=SectionMessageLayout.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SectionMessageLayout.js","sources":["../../../src/components/section-message/SectionMessageLayout.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Box } from '../box'\nimport { Stack } from '../stack'\n\nexport const SectionMessageContent = ({\n css,\n ...rest\n}: React.ComponentProps<typeof Box>): JSX.Element => (\n <Box css={{ maxWidth: '100%', flexShrink: 0, ...css }} {...rest} />\n)\n\nexport const SectionMessageActions = ({\n css,\n ...rest\n}: React.ComponentProps<typeof Stack>): JSX.Element => (\n <Box css={{ maxWidth: '100%', flexShrink: 0, ...css }}>\n <Stack wrap=\"wrap\" gap={3} {...rest} />\n </Box>\n)\n"],"names":["SectionMessageContent","css","rest","React","Box","SectionMessageActions","Stack"],"mappings":"mGAKa,MAAAA,EAAwB,CAAC,CACpC,IAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAI,IAAK,CAAE,SAAU,OAAQ,WAAY,EAAG,GAAGH,CAAI,EAAI,GAAGC,CAAM,CAAA,EAGtDG,EAAwB,CAAC,CACpC,IAAAJ,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAI,IAAK,CAAE,SAAU,OAAQ,WAAY,EAAG,GAAGH,CAAI,CAClDE,EAAAA,EAAA,cAACG,EAAA,CAAM,KAAK,OAAO,IAAK,EAAI,GAAGJ,EAAM,CACvC"}
1
+ {"version":3,"file":"SectionMessageLayout.js","sources":["../../../src/components/section-message/SectionMessageLayout.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Box } from '../box'\nimport { Stack } from '../stack'\n\nexport const SectionMessageContent = ({\n css,\n ...rest\n}: React.ComponentProps<typeof Box>): JSX.Element => (\n <Box\n css={{\n maxWidth: '100%',\n flexShrink: 0,\n ['& > *:not(:last-child)']: { mb: '$2' },\n ...css\n }}\n {...rest}\n />\n)\n\nexport const SectionMessageActions = ({\n css,\n ...rest\n}: React.ComponentProps<typeof Stack>): JSX.Element => (\n <Box css={{ maxWidth: '100%', flexShrink: 0, ...css }}>\n <Stack wrap=\"wrap\" gap={3} {...rest} />\n </Box>\n)\n"],"names":["SectionMessageContent","css","rest","React","Box","SectionMessageActions","Stack"],"mappings":"mGAKO,MAAMA,EAAwB,CAAC,CACpC,IAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CACC,IAAK,CACH,SAAU,OACV,WAAY,EACZ,CAAC,0BAA2B,CAAE,GAAI,IAAK,EACvC,GAAGH,CACL,EACC,GAAGC,CAAAA,CACN,EAGWG,EAAwB,CAAC,CACpC,IAAAJ,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAI,IAAK,CAAE,SAAU,OAAQ,WAAY,EAAG,GAAGH,CAAI,GAClDE,EAAA,cAACG,EAAA,CAAM,KAAK,OAAO,IAAK,EAAI,GAAGJ,EAAM,CACvC"}
@@ -1,2 +1,2 @@
1
- import o from"react";import{Text as s}from"../text/Text.js";const m=({css:e,...t})=>o.createElement(s,{css:{fontWeight:600,mb:"$2",...e},size:"md",...t});export{m as SectionMessageTitle};
1
+ import o from"react";import{Text as s}from"../text/Text.js";const i=({css:e,...t})=>o.createElement(s,{css:{fontWeight:600,...e},size:"md",...t});export{i as SectionMessageTitle};
2
2
  //# sourceMappingURL=SectionMessageTitle.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SectionMessageTitle.js","sources":["../../../src/components/section-message/SectionMessageTitle.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '../text'\n\nexport const SectionMessageTitle = ({\n css,\n ...rest\n}: React.ComponentProps<typeof Text>): JSX.Element => (\n <Text\n css={{\n fontWeight: 600,\n mb: '$2',\n ...css\n }}\n size=\"md\"\n {...rest}\n />\n)\n"],"names":["SectionMessageTitle","css","rest","React","Text"],"mappings":"4DAIa,MAAAA,EAAsB,CAAC,CAClC,IAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CACC,IAAK,CACH,WAAY,IACZ,GAAI,KACJ,GAAGH,CACL,EACA,KAAK,KACJ,GAAGC,CACN,CAAA"}
1
+ {"version":3,"file":"SectionMessageTitle.js","sources":["../../../src/components/section-message/SectionMessageTitle.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '../text'\n\nexport const SectionMessageTitle = ({\n css,\n ...rest\n}: React.ComponentProps<typeof Text>): JSX.Element => (\n <Text\n css={{\n fontWeight: 600,\n ...css\n }}\n size=\"md\"\n {...rest}\n />\n)\n"],"names":["SectionMessageTitle","css","rest","React","Text"],"mappings":"4DAIa,MAAAA,EAAsB,CAAC,CAClC,IAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CACC,IAAK,CACH,WAAY,IACZ,GAAGH,CACL,EACA,KAAK,KACJ,GAAGC,CACN,CAAA"}