@atom-learning/components 1.24.2 → 2.1.0

package/CHANGELOG.md

@@ -1,9 +1,9 @@
-## [1.24.2](https://github.com/Atom-Learning/components/compare/v1.24.1...v1.24.2) (2022-09-06)
+# [2.1.0](https://github.com/Atom-Learning/components/compare/v2.0.0...v2.1.0) (2022-09-09)
 
 
-### Bug Fixes
+### Features
 
-* add checkbox indeterminate state example ([a40eeab](https://github.com/Atom-Learning/components/commit/a40eeab88752e4a3bb0bb01f0244c2474b11fed2))
+* inline message ([e973432](https://github.com/Atom-Learning/components/commit/e97343211f5ed65a53d3b82bba5157b3854161a5))
 
 # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
 

package/dist/components/accordion/Accordion.d.ts

@@ -62,6 +62,7 @@ declare const StyledRoot: import("@stitches/react/types/styled-component").Style
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/accordion/AccordionContent.d.ts

@@ -59,6 +59,7 @@ declare const StyledContent: import("@stitches/react/types/styled-component").St
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/accordion/AccordionItem.d.ts

@@ -59,6 +59,7 @@ declare const StyledItem: import("@stitches/react/types/styled-component").Style
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/accordion/AccordionTrigger.d.ts

@@ -61,6 +61,7 @@ declare const StyledTrigger: import("@stitches/react/types/styled-component").St
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/action-icon/ActionIcon.constants.d.ts

@@ -0,0 +1,6 @@
+export declare const ActionIconSizeMap: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+};

package/dist/components/action-icon/ActionIcon.constants.js

@@ -0,0 +1 @@
+const m={xs:"sm",sm:"sm",md:"md",lg:"lg"};export{m as ActionIconSizeMap};

package/dist/components/action-icon/ActionIcon.d.ts

@@ -5,7 +5,7 @@ import { Override } from '../../utilities';
 declare const StyledButton: import("@stitches/react/types/styled-component").StyledComponent<"button", {
     theme?: "primary" | "success" | "danger" | "warning" | "neutral" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
-    size?: "md" | "lg" | "xl" | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | undefined;
     isRounded?: boolean | "true" | undefined;
 }, {
     sm: string;
@@ -67,6 +67,7 @@ declare const StyledButton: import("@stitches/react/types/styled-component").Sty
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/action-icon/ActionIcon.js

@@ -1 +1 @@
-import{darken as i}from"color2k";import g from"invariant";import*as n from"react";import{styled as D,theme as o}from"../../stitches.js";import{Icon as m}from"../icon/Icon.js";const c=(e,r,a)=>({bg:"transparent",color:e,"&:not(:disabled):hover, &:not(:disabled):focus":{color:r},"&:not(:disabled):active":{color:a},"&[disabled]":{color:"$tonal400",cursor:"not-allowed"}}),l=(e,r,a)=>({bg:e,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:r,color:"white"},"&:not(:disabled):active":{bg:a},"&[disabled]":{bg:"$tonal100",color:"$tonal400",cursor:"not-allowed"}}),p=(e,r,a)=>({border:"1px solid",borderColor:"currentColor",color:e,"&:not(:disabled):hover, &:not(:disabled):focus":{color:r},"&:not(:disabled):active":{color:a},"&[disabled]":{borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),w=D("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$0",boxSizing:"border-box",cursor:"pointer",display:"flex",justifyContent:"center",p:"unset",transition:"all 100ms ease-out",variants:{theme:{neutral:{},primary:{},success:{},warning:{},danger:{}},appearance:{simple:{},outline:{},solid:{}},size:{md:{size:"$3"},lg:{size:"$4"},xl:{size:"$5"}},isRounded:{true:{borderRadius:"$round"}}},compoundVariants:[{theme:"neutral",appearance:"simple",css:c("$tonal300","$primaryMid","$primaryDark")},{theme:"primary",appearance:"simple",css:c("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"simple",css:c("$primaryDark",i(o.colors.primaryDark.value,.1),i(o.colors.primaryDark.value,.15))},{theme:"success",appearance:"simple",css:c("$success","$successMid","$successDark")},{theme:"warning",appearance:"simple",css:c("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"simple",css:c("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"solid",css:l("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"solid",css:l("$primaryDark",i(o.colors.primaryDark.value,.1),i(o.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:l("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:l("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"solid",css:l("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"outline",css:p("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"outline",css:p("$primaryDark",i(o.colors.primaryDark.value,.1),i(o.colors.primaryDark.value,.15))},{theme:"success",appearance:"outline",css:p("$success","$successMid","$successDark")},{theme:"warning",appearance:"outline",css:p("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"outline",css:p("$danger","$dangerMid","$dangerDark")}]}),t=n.forwardRef(({children:e,theme:r="primary",appearance:a="simple",size:u="md",label:h,href:$,disabled:d,...b},k)=>{const y=`A single ${m.displayName} component is permitted as a child of ${t.displayName}`;return g(n.Children.count(e)===1,y),n.createElement(w,{...b,...$?{as:"a",href:d?null:$,onClick:void 0,"aria-disabled":!!d}:{type:"button"},"aria-label":h,theme:r,appearance:a,size:u,ref:k,disabled:d},n.Children.map(e,s=>{if(!n.isValidElement(s))throw new Error(y);return g(s.type===m,`Children of type ${s==null?void 0:s.type} aren't permitted. Only an ${m.displayName} component is allowed in ${t.displayName}`),n.cloneElement(s,{css:{size:["lg","xl"].includes(u)?20:16,...s.props.css?s.props.css:{}}})}))});t.displayName="ActionIcon";export{t as ActionIcon};
+import{darken as i}from"color2k";import g from"invariant";import*as o from"react";import{styled as D,theme as n}from"../../stitches.js";import{ActionIconSizeMap as w}from"./ActionIcon.constants.js";import{Icon as m}from"../icon/Icon.js";const c=(e,r,a)=>({bg:"transparent",color:e,"&:not(:disabled):hover, &:not(:disabled):focus":{color:r},"&:not(:disabled):active":{color:a},"&[disabled]":{color:"$tonal400",cursor:"not-allowed"}}),l=(e,r,a)=>({bg:e,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:r,color:"white"},"&:not(:disabled):active":{bg:a},"&[disabled]":{bg:"$tonal100",color:"$tonal400",cursor:"not-allowed"}}),p=(e,r,a)=>({border:"1px solid",borderColor:"currentColor",color:e,"&:not(:disabled):hover, &:not(:disabled):focus":{color:r},"&:not(:disabled):active":{color:a},"&[disabled]":{borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),f=D("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$0",boxSizing:"border-box",cursor:"pointer",display:"flex",justifyContent:"center",p:"unset",transition:"all 100ms ease-out",variants:{theme:{neutral:{},primary:{},success:{},warning:{},danger:{}},appearance:{simple:{},outline:{},solid:{}},size:{xs:{size:"$2"},sm:{size:"$3"},md:{size:"$4"},lg:{size:"$5"}},isRounded:{true:{borderRadius:"$round"}}},compoundVariants:[{theme:"neutral",appearance:"simple",css:c("$tonal300","$primaryMid","$primaryDark")},{theme:"primary",appearance:"simple",css:c("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"simple",css:c("$primaryDark",i(n.colors.primaryDark.value,.1),i(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"simple",css:c("$success","$successMid","$successDark")},{theme:"warning",appearance:"simple",css:c("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"simple",css:c("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"solid",css:l("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"solid",css:l("$primaryDark",i(n.colors.primaryDark.value,.1),i(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:l("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:l("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"solid",css:l("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"outline",css:p("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"outline",css:p("$primaryDark",i(n.colors.primaryDark.value,.1),i(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"outline",css:p("$success","$successMid","$successDark")},{theme:"warning",appearance:"outline",css:p("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"outline",css:p("$danger","$dangerMid","$dangerDark")}]}),t=o.forwardRef(({children:e,theme:r="primary",appearance:a="simple",size:$="sm",label:b,href:u,disabled:d,...h},k)=>{const y=`A single ${m.displayName} component is permitted as a child of ${t.displayName}`;return g(o.Children.count(e)===1,y),o.createElement(f,{...h,...u?{as:"a",href:d?null:u,onClick:void 0,"aria-disabled":!!d}:{type:"button"},"aria-label":b,theme:r,appearance:a,size:$,ref:k,disabled:d},o.Children.map(e,s=>{if(!o.isValidElement(s))throw new Error(y);return g(s.type===m,`Children of type ${s==null?void 0:s.type} aren't permitted. Only an ${m.displayName} component is allowed in ${t.displayName}`),o.cloneElement(s,{size:w[$],css:{...s.props.css?s.props.css:{}}})}))});t.displayName="ActionIcon";export{t as ActionIcon};

package/dist/components/alert-dialog/AlertDialog.d.ts

@@ -61,6 +61,7 @@ declare const StyledAlertDialog: import("@stitches/react/types/styled-component"
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/alert-dialog/AlertDialogContent.d.ts

@@ -61,6 +61,7 @@ declare const StyledAlertDialogContent: import("@stitches/react/types/styled-com
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/badge/Badge.d.ts

@@ -59,6 +59,7 @@ declare const StyledBadge: import("@stitches/react/types/styled-component").Styl
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;
@@ -326,6 +327,7 @@ declare const StyledBadge: import("@stitches/react/types/styled-component").Styl
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/box/Box.d.ts

@@ -58,6 +58,7 @@ export declare const Box: import("@stitches/react/types/styled-component").Style
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/button/Button.d.ts

@@ -69,6 +69,7 @@ export declare const StyledButton: import("@stitches/react/types/styled-componen
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/calendar/Calendar.js

@@ -1 +1 @@
-import{ChevronLeft as q,ChevronRight as H}from"@atom-learning/icons";import{useDayzed as J}from"dayzed";import*as e from"react";import{ActionIcon as x}from"../action-icon/ActionIcon.js";import{Box as h}from"../box/Box.js";import{Flex as C}from"../flex/Flex.js";import{Icon as Y}from"../icon/Icon.js";import{Text as K}from"../text/Text.js";import{Button as w}from"../button/Button.js";import{styled as F}from"../../stitches.js";import{monthNamesShort as Q,weekdayNamesShort as V,DEFAULT_LABELS as X}from"./constants.js";import{Day as Z}from"./Day.js";const g=F("div",{display:"grid",gridTemplateColumns:"repeat(7, 1fr)",gridGap:"$1 $2"}),ee=F(w,{color:"$tonal600",p:"$3",width:"$6",variants:{selected:{false:{color:"$tonal600 !important",fontWeight:"400","&:hover":{bg:"$tonal100 !important",color:"$tonal600 !important"},"&[disabled]":{bg:"white !important"}}}}}),te=(i,c)=>{const u=i.slice(0,c);return i.slice(c).concat(u)},S=({css:i,refDateSelected:c,refDateToday:u,firstDayOfWeek:f=0,monthNames:N=Q,weekdayNames:T=V,labels:y=X,date:o=new Date,minDate:l,maxDate:s,setYear:A,...L})=>{const[a,E]=e.useState(!1),[m,k]=e.useState(o==null?void 0:o.getFullYear()),O=t=>{const r=o;r.setFullYear(t),A(r),E(!1)},W=l&&m-16<=l.getFullYear(),z=s&&m>=s.getFullYear(),B=Array.from({length:16},(t,r)=>{const n=m-r;return s&&n>s.getFullYear()||l&&n<l.getFullYear()?0:n}),{calendars:d,getBackProps:I,getForwardProps:M,getDateProps:G}=J({firstDayOfWeek:f,showOutsideDays:!0,date:o,minDate:l,maxDate:s,...L});return d.length?e.createElement(h,{css:{position:"relative",width:"min-content",mt:"-$1",...i}},e.createElement(C,{css:{position:"absolute",top:0,right:"-$1"}},e.createElement(x,{label:y[a?"previousYear":"previous"],theme:"neutral",size:"lg",...!a&&I({calendars:d}),...a&&{onClick:()=>k(m-16)},disabled:a&&W},e.createElement(Y,{is:q})),e.createElement(x,{label:y[a?"nextYear":"next"],theme:"neutral",size:"lg",...!a&&M({calendars:d}),...a&&{onClick:()=>k(m+16)},disabled:a&&z},e.createElement(Y,{is:H}))),a&&e.createElement(g,{css:{gridTemplateColumns:"repeat(4, 1fr)",pt:"$7",direction:"rtl",gridGap:"$3 $1"}},B.map((t,r)=>{const n=t===o.getFullYear();return t?e.createElement(ee,{key:`${t}${r}`,theme:n?"primary":"neutral",isRounded:!0,onClick:()=>O(t),selected:n},t):e.createElement(h,{key:r,css:{width:"$6",height:"$4"}})})),!a&&d.map(({month:t,year:r,weeks:n})=>e.createElement(h,{key:`${t}${r}`},e.createElement(C,{css:{height:"$4",alignItems:"center",mb:"$4"}},e.createElement(w,{theme:"neutral",css:{px:"0",color:"$tonal600"},onClick:()=>E(!0)},N[t]," ",r)),e.createElement(g,{css:{mb:"$3"}},te(T,f).map(p=>e.createElement(K,{as:"span",size:"sm",key:`${t}${r}${p}`,css:{fontWeight:600,textAlign:"center"}},p))),e.createElement(g,null,n.map((p,P)=>p.map(($,R)=>{const D=`${t}${r}${P}${R}`;if(!$)return e.createElement("div",{key:D});const{date:j,selected:b,today:v,prevMonth:U,nextMonth:_}=$;return e.createElement(Z,{isOutsideMonth:U||_,isSelected:b,isToday:v,key:D,ref:b?c:v?u:null,...G({dateObj:$}),type:"button"},j.getDate())})))))):null};S.displayName="Calendar";export{S as Calendar};
+import{ChevronLeft as q,ChevronRight as H}from"@atom-learning/icons";import{useDayzed as J}from"dayzed";import*as e from"react";import{ActionIcon as x}from"../action-icon/ActionIcon.js";import{Box as h}from"../box/Box.js";import{Flex as C}from"../flex/Flex.js";import{Icon as Y}from"../icon/Icon.js";import{Text as K}from"../text/Text.js";import{Button as w}from"../button/Button.js";import{styled as F}from"../../stitches.js";import{monthNamesShort as Q,weekdayNamesShort as V,DEFAULT_LABELS as X}from"./constants.js";import{Day as Z}from"./Day.js";const g=F("div",{display:"grid",gridTemplateColumns:"repeat(7, 1fr)",gridGap:"$1 $2"}),ee=F(w,{color:"$tonal600",p:"$3",width:"$6",variants:{selected:{false:{color:"$tonal600 !important",fontWeight:"400","&:hover":{bg:"$tonal100 !important",color:"$tonal600 !important"},"&[disabled]":{bg:"white !important"}}}}}),te=(i,c)=>{const u=i.slice(0,c);return i.slice(c).concat(u)},S=({css:i,refDateSelected:c,refDateToday:u,firstDayOfWeek:f=0,monthNames:N=Q,weekdayNames:T=V,labels:y=X,date:o=new Date,minDate:l,maxDate:s,setYear:A,...L})=>{const[a,E]=e.useState(!1),[m,k]=e.useState(o==null?void 0:o.getFullYear()),O=t=>{const r=o;r.setFullYear(t),A(r),E(!1)},W=l&&m-16<=l.getFullYear(),z=s&&m>=s.getFullYear(),B=Array.from({length:16},(t,r)=>{const n=m-r;return s&&n>s.getFullYear()||l&&n<l.getFullYear()?0:n}),{calendars:d,getBackProps:I,getForwardProps:M,getDateProps:G}=J({firstDayOfWeek:f,showOutsideDays:!0,date:o,minDate:l,maxDate:s,...L});return d.length?e.createElement(h,{css:{position:"relative",width:"min-content",mt:"-$1",...i}},e.createElement(C,{css:{position:"absolute",top:0,right:"-$1"}},e.createElement(x,{label:y[a?"previousYear":"previous"],theme:"neutral",size:"md",...!a&&I({calendars:d}),...a&&{onClick:()=>k(m-16)},disabled:a&&W},e.createElement(Y,{is:q})),e.createElement(x,{label:y[a?"nextYear":"next"],theme:"neutral",size:"md",...!a&&M({calendars:d}),...a&&{onClick:()=>k(m+16)},disabled:a&&z},e.createElement(Y,{is:H}))),a&&e.createElement(g,{css:{gridTemplateColumns:"repeat(4, 1fr)",pt:"$7",direction:"rtl",gridGap:"$3 $1"}},B.map((t,r)=>{const n=t===o.getFullYear();return t?e.createElement(ee,{key:`${t}${r}`,theme:n?"primary":"neutral",isRounded:!0,onClick:()=>O(t),selected:n},t):e.createElement(h,{key:r,css:{width:"$6",height:"$4"}})})),!a&&d.map(({month:t,year:r,weeks:n})=>e.createElement(h,{key:`${t}${r}`},e.createElement(C,{css:{height:"$4",alignItems:"center",mb:"$4"}},e.createElement(w,{theme:"neutral",css:{px:"0",color:"$tonal600"},onClick:()=>E(!0)},N[t]," ",r)),e.createElement(g,{css:{mb:"$3"}},te(T,f).map(p=>e.createElement(K,{as:"span",size:"sm",key:`${t}${r}${p}`,css:{fontWeight:600,textAlign:"center"}},p))),e.createElement(g,null,n.map((p,P)=>p.map(($,R)=>{const D=`${t}${r}${P}${R}`;if(!$)return e.createElement("div",{key:D});const{date:j,selected:b,today:v,prevMonth:U,nextMonth:_}=$;return e.createElement(Z,{isOutsideMonth:U||_,isSelected:b,isToday:v,key:D,ref:b?c:v?u:null,...G({dateObj:$}),type:"button"},j.getDate())})))))):null};S.displayName="Calendar";export{S as Calendar};

package/dist/components/calendar/Day.d.ts

@@ -62,6 +62,7 @@ export declare const Day: import("@stitches/react/types/styled-component").Style
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/carousel/CarouselPagination.d.ts

@@ -59,6 +59,7 @@ export declare const CarouselPagination: import("@stitches/react/types/styled-co
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/carousel/CarouselSlide.d.ts

@@ -59,6 +59,7 @@ declare const StyledSlide: import("@stitches/react/types/styled-component").Styl
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/carousel/CarouselSlider.d.ts

@@ -61,6 +61,7 @@ export declare const CarouselSlider: import("@stitches/react/types/styled-compon
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/checkbox/Checkbox.d.ts

@@ -62,6 +62,7 @@ declare const StyledCheckbox: import("@stitches/react/types/styled-component").S
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/combobox/Combobox.d.ts

@@ -64,6 +64,7 @@ declare const StyledCombobox: import("@stitches/react/types/styled-component").S
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/combobox/ComboboxInput.d.ts

@@ -60,6 +60,7 @@ export declare const ComboboxInput: import("@stitches/react/types/styled-compone
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/combobox/ComboboxList.d.ts

@@ -58,6 +58,7 @@ export declare const ComboboxList: import("@stitches/react/types/styled-componen
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/combobox/ComboboxOption.d.ts

@@ -58,6 +58,7 @@ export declare const ComboboxOption: import("@stitches/react/types/styled-compon
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/combobox/ComboboxPopover.d.ts

@@ -58,6 +58,7 @@ export declare const ComboboxPopover: import("@stitches/react/types/styled-compo
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/date-input/DateInput.js

@@ -1 +1 @@
-import{CalendarEvent as I}from"@atom-learning/icons";import*as e from"react";import{ActionIcon as L}from"../action-icon/ActionIcon.js";import{Box as N}from"../box/Box.js";import{Calendar as O}from"../calendar/Calendar.js";import{DEFAULT_LABELS as S}from"../calendar/constants.js";import{Icon as k}from"../icon/Icon.js";import{Input as x}from"../input/Input.js";import{Popover as m}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as R}from"./constants.js";import{useDate as B}from"./use-date.js";const D=e.forwardRef(({initialDate:E,dateFormat:g=R,firstDayOfWeek:h=1,disabled:s,monthNames:b,weekdayNames:v,size:l="md",labels:y,revalidate:o,onChange:n,minDate:C,maxDate:w,...A},z)=>{const{date:a,dateString:T,setDate:r}=B(E,g),i={...S,...y},[F,d]=e.useState(!1),f=e.useRef(null),c=e.useRef(null);return e.useEffect(()=>{n==null||n(a)},[a,n]),e.createElement(N,{css:{position:"relative"}},e.createElement(x,{name:"date",disabled:s,size:l,...A,onChange:t=>r(t.target.value,!0),value:T,ref:z}),e.createElement(m,{modal:!0,open:F,onOpenChange:d},e.createElement(m.Trigger,{asChild:!0},e.createElement(L,{css:{position:"absolute",top:0,right:0},disabled:s,label:i.open,size:l==="sm"?"md":"lg",theme:"neutral"},e.createElement(k,{size:"sm",is:I}))),e.createElement(m.Content,{css:{pr:"$sizes$2"},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var p,u;t.preventDefault(),a?(p=c.current)==null||p.focus():(u=f.current)==null||u.focus()}},e.createElement(O,{date:a||new Date,selected:a,onDateSelected:async t=>{d(!1),await r(t.date,!1),o&&o()},setYear:async t=>{await r(t,!1),o&&o()},minDate:C,maxDate:w,refDateToday:f,refDateSelected:c,firstDayOfWeek:h,monthNames:b,weekdayNames:v,labels:i}))))});D.displayName="DateInput";export{D as DateInput};
+import{CalendarEvent as N}from"@atom-learning/icons";import*as e from"react";import{ActionIcon as O}from"../action-icon/ActionIcon.js";import{Box as S}from"../box/Box.js";import{Calendar as k}from"../calendar/Calendar.js";import{DEFAULT_LABELS as x}from"../calendar/constants.js";import{Icon as z}from"../icon/Icon.js";import{Input as L}from"../input/Input.js";import{Popover as m}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as R}from"./constants.js";import{useDate as B}from"./use-date.js";const D=e.forwardRef(({initialDate:E,dateFormat:g=R,firstDayOfWeek:h=1,disabled:s,monthNames:C,weekdayNames:b,size:l="md",labels:v,revalidate:o,onChange:n,minDate:y,maxDate:w,...A},T)=>{const{date:a,dateString:F,setDate:r}=B(E,g),i={...x,...v},[I,d]=e.useState(!1),f=e.useRef(null),c=e.useRef(null);return e.useEffect(()=>{n==null||n(a)},[a,n]),e.createElement(S,{css:{position:"relative"}},e.createElement(L,{name:"date",disabled:s,size:l,...A,onChange:t=>r(t.target.value,!0),value:F,ref:T}),e.createElement(m,{modal:!0,open:I,onOpenChange:d},e.createElement(m.Trigger,{asChild:!0},e.createElement(O,{css:{position:"absolute",top:"0",right:"0"},disabled:s,label:i.open,size:l,theme:"neutral"},e.createElement(z,{is:N}))),e.createElement(m.Content,{css:{pr:"$sizes$2"},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var p,u;t.preventDefault(),a?(p=c.current)==null||p.focus():(u=f.current)==null||u.focus()}},e.createElement(k,{date:a||new Date,selected:a,onDateSelected:async t=>{d(!1),await r(t.date,!1),o&&o()},setYear:async t=>{await r(t,!1),o&&o()},minDate:y,maxDate:w,refDateToday:f,refDateSelected:c,firstDayOfWeek:h,monthNames:C,weekdayNames:b,labels:i}))))});D.displayName="DateInput";export{D as DateInput};

package/dist/components/dialog/Dialog.d.ts

@@ -63,6 +63,7 @@ declare const StyledDialog: import("@stitches/react/types/styled-component").Sty
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dialog/DialogBackground.d.ts

@@ -58,6 +58,7 @@ export declare const DialogBackground: import("@stitches/react/types/styled-comp
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;
@@ -322,6 +323,7 @@ export declare const DialogBackground: import("@stitches/react/types/styled-comp
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dialog/DialogClose.d.ts

@@ -59,6 +59,7 @@ export declare const DialogClose: import("@stitches/react/types/styled-component
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dialog/DialogContent.d.ts

@@ -61,6 +61,7 @@ declare const StyledDialogContent: import("@stitches/react/types/styled-componen
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dialog/DialogContent.js

@@ -1 +1 @@
-import{Close as h}from"@atom-learning/icons";import{Overlay as x,Content as b,Portal as g,Close as w}from"@radix-ui/react-dialog";import*as o from"react";import{DIALOG_Z_INDEX as r}from"../../constants/dialog.js";import{keyframes as n,styled as l}from"../../stitches.js";import{ActionIcon as v}from"../action-icon/ActionIcon.js";import{Icon as $}from"../icon/Icon.js";import{DialogBackground as s}from"./DialogBackground.js";import{fadeIn as z,fadeOut as C}from"../../utilities/style/keyframe-animations.js";const e="translate3d(-50%, -50%, 0)",m="translate3d(-50%, 50vh, 0)",d="modal_overlay",D=n({"0%":{transform:m},"100%":{transform:e}}),I=n({"0%":{transform:e},"100%":{transform:m}}),y=l(x,{backgroundColor:"$alpha600",inset:0,position:"fixed",overflowY:"auto",zIndex:r,"@allowMotion":{'&[data-state="open"]':{animation:`${z} 250ms ease-out`},'&[data-state="closed"]':{animation:`${C} 550ms ease-out`}}}),E=l(b,{bg:"white",borderRadius:"$1",boxShadow:"$3",boxSizing:"border-box",left:"50%",maxWidth:"90vw",maxHeight:"90vh",overflowY:"auto",p:"$5",position:"fixed",top:"50%",transform:e,zIndex:r,"&:focus":{outline:"none"},"@allowMotion":{'&[data-state="open"]':{animation:`${D} 550ms cubic-bezier(0.22, 1, 0.36, 1)`},'&[data-state="closed"]':{animation:`${I} 550ms cubic-bezier(0.22, 1, 0.36, 1)`}},variants:{size:{xs:{width:"380px"},sm:{width:"480px"},md:{width:"600px"},lg:{width:"800px"},xl:{width:"1100px"}}}}),O=({size:p="sm",children:a,closeDialogText:f="Close dialog",showCloseButton:c=!0,...u})=>o.createElement(g,null,o.createElement(y,{id:d},o.Children.map(a,t=>(t==null?void 0:t.type)===s&&t),o.createElement(E,{size:p,"aria-label":"Dialog",onPointerDownOutside:t=>{const i=t.target;(i==null?void 0:i.id)!==d&&t.preventDefault()},...u},c&&o.createElement(v,{as:w,css:{position:"absolute",right:"$4",top:"$4"},label:f,size:"lg",theme:"neutral"},o.createElement($,{is:h})),o.Children.map(a,t=>(t==null?void 0:t.type)!==s&&t))));export{O as DialogContent};
+import{Close as h}from"@atom-learning/icons";import{Overlay as x,Content as b,Portal as w,Close as g}from"@radix-ui/react-dialog";import*as o from"react";import{DIALOG_Z_INDEX as r}from"../../constants/dialog.js";import{keyframes as n,styled as l}from"../../stitches.js";import{ActionIcon as v}from"../action-icon/ActionIcon.js";import{Icon as $}from"../icon/Icon.js";import{DialogBackground as s}from"./DialogBackground.js";import{fadeIn as z,fadeOut as C}from"../../utilities/style/keyframe-animations.js";const e="translate3d(-50%, -50%, 0)",m="translate3d(-50%, 50vh, 0)",d="modal_overlay",D=n({"0%":{transform:m},"100%":{transform:e}}),I=n({"0%":{transform:e},"100%":{transform:m}}),y=l(x,{backgroundColor:"$alpha600",inset:0,position:"fixed",overflowY:"auto",zIndex:r,"@allowMotion":{'&[data-state="open"]':{animation:`${z} 250ms ease-out`},'&[data-state="closed"]':{animation:`${C} 550ms ease-out`}}}),E=l(b,{bg:"white",borderRadius:"$1",boxShadow:"$3",boxSizing:"border-box",left:"50%",maxWidth:"90vw",maxHeight:"90vh",overflowY:"auto",p:"$5",position:"fixed",top:"50%",transform:e,zIndex:r,"&:focus":{outline:"none"},"@allowMotion":{'&[data-state="open"]':{animation:`${D} 550ms cubic-bezier(0.22, 1, 0.36, 1)`},'&[data-state="closed"]':{animation:`${I} 550ms cubic-bezier(0.22, 1, 0.36, 1)`}},variants:{size:{xs:{width:"380px"},sm:{width:"480px"},md:{width:"600px"},lg:{width:"800px"},xl:{width:"1100px"}}}}),O=({size:p="sm",children:a,closeDialogText:f="Close dialog",showCloseButton:c=!0,...u})=>o.createElement(w,null,o.createElement(y,{id:d},o.Children.map(a,t=>(t==null?void 0:t.type)===s&&t),o.createElement(E,{size:p,"aria-label":"Dialog",onPointerDownOutside:t=>{const i=t.target;(i==null?void 0:i.id)!==d&&t.preventDefault()},...u},c&&o.createElement(v,{as:g,css:{position:"absolute",right:"$4",top:"$4"},label:f,size:"md",theme:"neutral"},o.createElement($,{is:h})),o.Children.map(a,t=>(t==null?void 0:t.type)!==s&&t))));export{O as DialogContent};

package/dist/components/divider/Divider.d.ts

@@ -61,6 +61,7 @@ export declare const StyledDivider: import("@stitches/react/types/styled-compone
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dropdown-menu/DropdownMenu.d.ts

@@ -64,6 +64,7 @@ declare const Root: import("@stitches/react/types/styled-component").StyledCompo
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dropdown-menu/DropdownMenuContent.d.ts

@@ -59,6 +59,7 @@ export declare const DropdownMenuContent: import("@stitches/react/types/styled-c
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dropdown-menu/DropdownMenuItem.d.ts

@@ -92,6 +92,7 @@ export declare const DropdownMenuItem: import("@stitches/react/types/styled-comp
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dropdown-menu/DropdownMenuSeparator.d.ts

@@ -59,6 +59,7 @@ export declare const DropdownMenuSeparator: import("@stitches/react/types/styled
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/dropdown-menu/DropdownMenuTrigger.d.ts

@@ -59,6 +59,7 @@ export declare const DropdownMenuTrigger: import("@stitches/react/types/styled-c
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/empty-state/EmptyState.d.ts

@@ -62,6 +62,7 @@ declare const EmptyStateContainer: import("@stitches/react/types/styled-componen
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;
@@ -328,6 +329,7 @@ declare const EmptyStateContainer: import("@stitches/react/types/styled-componen
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/empty-state/EmptyStateBody.d.ts

@@ -64,6 +64,7 @@ export declare const EmptyStateBody: import("@stitches/react/types/styled-compon
             warning: any;
             warningMid: any;
             warningDark: any;
+            warningText: any;
             subjectEnglish: any;
             subjectMaths: any;
             subjectScience: any;
@@ -333,6 +334,7 @@ export declare const EmptyStateBody: import("@stitches/react/types/styled-compon
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/empty-state/EmptyStateImage.d.ts

@@ -62,6 +62,7 @@ export declare const EmptyStateImage: import("@stitches/react/types/styled-compo
             warning: any;
             warningMid: any;
             warningDark: any;
+            warningText: any;
             subjectEnglish: any;
             subjectMaths: any;
             subjectScience: any;
@@ -331,6 +332,7 @@ export declare const EmptyStateImage: import("@stitches/react/types/styled-compo
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/empty-state/EmptyStateTitle.d.ts

@@ -60,6 +60,7 @@ export declare const EmptyStateTitle: import("@stitches/react/types/styled-compo
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/field-wrapper/FieldWrapper.js

@@ -1 +1 @@
-import*as e from"react";import{Box as p}from"../box/Box.js";import{Flex as c}from"../flex/Flex.js";import{Label as d}from"../label/Label.js";import{Link as f}from"../link/Link.js";import{ValidationError as E}from"../validation-error/ValidationError.js";import{Description as b}from"./FieldDescription.js";const o=({css:i,children:l,error:t,fieldId:s,label:a,prompt:r,description:m,required:n})=>e.createElement(p,{css:i},e.createElement(c,{css:{justifyContent:"space-between",alignItems:"center",mb:"$3"}},e.createElement(d,{htmlFor:s,required:n},a),r&&e.createElement(f,{href:r.link,size:"sm"},r.label)),m&&e.createElement(b,{css:{mb:"$3"}},m),l,t&&e.createElement(E,{css:{mt:"$2"}},t));o.displayName="FieldWrapper";export{o as FieldWrapper};
+import*as e from"react";import{Box as a}from"../box/Box.js";import{Flex as c}from"../flex/Flex.js";import{Label as f}from"../label/Label.js";import{Link as d}from"../link/Link.js";import{InlineMessage as b}from"../inline-message/InlineMessage.js";import{Description as E}from"./FieldDescription.js";const i=({css:o,children:l,error:t,fieldId:s,label:n,prompt:r,description:m,required:p})=>e.createElement(a,{css:o},e.createElement(c,{css:{justifyContent:"space-between",alignItems:"center",mb:"$3"}},e.createElement(f,{htmlFor:s,required:p},n),r&&e.createElement(d,{href:r.link,size:"sm"},r.label)),m&&e.createElement(E,{css:{mb:"$3"}},m),l,t&&e.createElement(b,{css:{mt:"$2"}},t));i.displayName="FieldWrapper";export{i as FieldWrapper};

package/dist/components/field-wrapper/InlineFieldWrapper.js

@@ -1 +1 @@
-import*as e from"react";import{Box as m}from"../box/Box.js";import{Checkbox as d}from"../checkbox/Checkbox.js";import{Label as $}from"../label/Label.js";import{RadioButton as f}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{ValidationError as E}from"../validation-error/ValidationError.js";import{Description as u}from"./FieldDescription.js";const l=({align:n="start",children:a,css:s,description:i,direction:t="row",error:o,label:p,required:c})=>e.createElement(m,{css:s},e.createElement($,{align:n,direction:t,required:c,type:"inline"},e.Children.map(a,r=>e.createElement(m,{css:{[t==="reverse"?"ml":"mr"]:"$3",...((r==null?void 0:r.type)===d||(r==null?void 0:r.type)===f)&&{transform:"translateY($space$1)"}}},r)),p),o&&e.createElement(E,{css:{mt:"$2"}},o),i&&e.createElement(u,{css:{mt:"$2",[t==="reverse"?"mr":"ml"]:"calc($space$3 + $sizes$1)"}},i));l.displayName="InlineFieldWrapper";export{l as InlineFieldWrapper};
+import*as e from"react";import{Box as o}from"../box/Box.js";import{Checkbox as d}from"../checkbox/Checkbox.js";import{Label as $}from"../label/Label.js";import{RadioButton as f}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{InlineMessage as u}from"../inline-message/InlineMessage.js";import{Description as E}from"./FieldDescription.js";const l=({align:n="start",children:a,css:s,description:i,direction:t="row",error:m,label:p,required:c})=>e.createElement(o,{css:s},e.createElement($,{align:n,direction:t,required:c,type:"inline"},e.Children.map(a,r=>e.createElement(o,{css:{[t==="reverse"?"ml":"mr"]:"$3",...((r==null?void 0:r.type)===d||(r==null?void 0:r.type)===f)&&{transform:"translateY($space$1)"}}},r)),p),m&&e.createElement(u,{css:{mt:"$2"}},m),i&&e.createElement(E,{css:{mt:"$2",[t==="reverse"?"mr":"ml"]:"calc($space$3 + $sizes$1)"}},i));l.displayName="InlineFieldWrapper";export{l as InlineFieldWrapper};

package/dist/components/flex/Flex.d.ts

@@ -58,6 +58,7 @@ export declare const Flex: import("@stitches/react/types/styled-component").Styl
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/form/Form.d.ts

@@ -60,6 +60,7 @@ declare const StyledForm: import("@stitches/react/types/styled-component").Style
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/grid/Grid.d.ts

@@ -61,6 +61,7 @@ declare const GridContainer: import("@stitches/react/types/styled-component").St
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/heading/Heading.d.ts

@@ -62,6 +62,7 @@ export declare const StyledHeading: import("@stitches/react/types/styled-compone
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/icon/Icon.d.ts

@@ -62,6 +62,7 @@ export declare const StyledIcon: import("@stitches/react/types/styled-component"
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/image/Image.d.ts

@@ -60,6 +60,7 @@ export declare const StyledImage: import("@stitches/react/types/styled-component
         warning: any;
         warningMid: any;
         warningDark: any;
+        warningText: any;
         subjectEnglish: any;
         subjectMaths: any;
         subjectScience: any;

package/dist/components/index.d.ts

@@ -22,6 +22,7 @@ export { Grid } from './grid';
 export { Heading } from './heading';
 export { Icon } from './icon';
 export { Image } from './image';
+export { InlineMessage } from './inline-message';
 export { Input } from './input';
 export { FileInput } from './file-input';
 export { InputField } from './input-field';
@@ -55,5 +56,4 @@ export { TextareaField } from './textarea-field';
 export { ToastProvider, toast } from './toast';
 export { ToggleGroup } from './toggle-group';
 export { Tooltip } from './tooltip';
-export { ValidationError } from './validation-error';
 export { Video } from './video';

package/dist/components/inline-message/InlineMessage.config.d.ts

@@ -0,0 +1,5 @@
+import * as React from "react";
+import { InlineMessageTheme } from "./InlineMessage.types";
+import type { CSS } from '../../stitches';
+export declare const INLINE_MESSAGE_THEMES: Record<InlineMessageTheme, CSS>;
+export declare const INLINE_MESSAGE_ICONS: Record<InlineMessageTheme, React.FC<React.SVGProps<SVGSVGElement>>>;

package/dist/components/inline-message/InlineMessage.config.js

@@ -0,0 +1 @@
+import{OkCircle as o,Danger as n,Info as r,Error as c}from"@atom-learning/icons";const e={success:{color:"$success"},warning:{color:"$warningText","& svg":{color:"$warningDark"}},info:{color:"$primary"},neutral:{color:"$tonal400"},error:{color:"$danger"}},a={success:o,warning:n,info:r,neutral:r,error:c};export{a as INLINE_MESSAGE_ICONS,e as INLINE_MESSAGE_THEMES};