@atom-learning/components 1.14.2 → 1.16.1

package/CHANGELOG.md

@@ -1,11 +1,9 @@
-## [1.14.2](https://github.com/Atom-Learning/components/compare/v1.14.1...v1.14.2) (2022-06-09)
+## [1.16.1](https://github.com/Atom-Learning/components/compare/v1.16.0...v1.16.1) (2022-06-22)
 
 
 ### Bug Fixes
 
-* add Portal to AlertDialog.Content ([012690f](https://github.com/Atom-Learning/components/commit/012690fe4521cb9bd21d0f97f492c13e407eb100))
-* alertdialog z-index ([4e0d1c4](https://github.com/Atom-Learning/components/commit/4e0d1c422e7f82a35a1a7622a985a770bcb61684))
-* alertdialog z-index ([60a6d91](https://github.com/Atom-Learning/components/commit/60a6d91bee7b12a8ffb9f74f2aee808cb3ee1628))
+* tab triggerlist uppercase ([9856bb7](https://github.com/Atom-Learning/components/commit/9856bb75486e6f9582b0d2a93ba0c7594066a1f3))
 
 # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
 

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

@@ -267,7 +267,7 @@ declare const GridContainer: import("@stitches/react/types/styled-component").St
     };
 }>>;
 declare type GridProps = React.ComponentProps<typeof GridContainer> & {
-    minItemSize: string;
+    minItemSize?: string;
     maxItemSize?: string;
 };
 export declare const Grid: React.FC<GridProps>;

package/dist/components/grid/Grid.js

@@ -1 +1 @@
-import{createElement as s}from"react";import{theme as m,styled as o}from"../../stitches.js";const d=Object.keys(m.space).reduce((a,e)=>({...a,[e]:{gap:`$space$${e}`}}),{}),c=o("div",{display:"grid",variants:{gap:d}}),t=({css:a,gap:e=2,minItemSize:r,maxItemSize:i="1fr",...p})=>s(c,{css:{...a,gridTemplateColumns:`repeat(auto-fit, minmax(${r}, ${i}))`},gap:e,...p});t.displayName="Grid";export{t as Grid};
+import{createElement as i}from"react";import{theme as o,styled as d}from"../../stitches.js";const c=Object.keys(o.space).reduce((e,a)=>({...e,[a]:{gap:`$space$${a}`}}),{}),m=d("div",{display:"grid",variants:{gap:c}}),t=({css:e,gap:a=2,minItemSize:r,maxItemSize:p="1fr",...s})=>i(m,{css:{...r&&{gridTemplateColumns:`repeat(auto-fit, minmax(${r}, ${p}))`},...e},gap:a,...s});t.displayName="Grid";export{t as Grid};

package/dist/components/table/TableBody.d.ts

@@ -1,4 +1,7 @@
-export declare const TableBody: import("@stitches/react/types/styled-component").StyledComponent<"tbody", {}, {
+import * as React from 'react';
+declare const StyledTableBody: import("@stitches/react/types/styled-component").StyledComponent<"tbody", {
+    striped?: boolean | "true" | "false" | undefined;
+}, {
     sm: string;
     md: string;
     lg: string;
@@ -263,3 +266,6 @@ export declare const TableBody: import("@stitches/react/types/styled-component")
         };
     };
 }>>;
+declare type TableBodyProps = React.ComponentProps<typeof StyledTableBody>;
+export declare const TableBody: React.FC<TableBodyProps>;
+export {};

package/dist/components/table/TableBody.js

@@ -1 +1 @@
-import{styled as d}from"../../stitches.js";const o=d("tbody",{});o.displayName="TableBody";export{o as TableBody};
+import{styled as d}from"../../stitches.js";import{createElement as l}from"react";import{TableRow as r}from"./TableRow.js";const a=d("tbody",{variants:{striped:{true:{[`${r}`]:{"&:nth-child(odd)":{bg:"white"},"&:nth-child(even)":{bg:"$tonal50"}}},false:{bg:"white"}}}}),e=({striped:t=!0,...o})=>l(a,{striped:t,...o});e.displayName="TableBody";export{e as TableBody};

package/dist/components/table/TableCell.js

@@ -1 +1 @@
-import{styled as t}from"../../stitches.js";const l=t("td",{borderBottom:"1px solid $tonal100",boxSizing:"border-box",color:"$tonal400",fontFamily:"$body",lineHeight:1.5,p:"$2 $3",textAlign:"left",verticalAlign:"middle","&:first-child":{fontWeight:"bold"},"tr:nth-child(odd) &":{bg:"white"},"tr:nth-child(even) &":{bg:"$tonal50"}});l.displayName="TableCell";export{l as TableCell};
+import{styled as o}from"../../stitches.js";const l=o("td",{borderBottom:"1px solid $tonal100",boxSizing:"border-box",color:"$tonal400",fontFamily:"$body",lineHeight:1.5,p:"$2 $3",textAlign:"left",verticalAlign:"middle","&:first-child":{fontWeight:"bold"}});l.displayName="TableCell";export{l as TableCell};

package/dist/components/table/TableHeader.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 declare const StyledTableHeader: import("@stitches/react/types/styled-component").StyledComponent<"thead", {
-    theme?: "primary" | "primaryDark" | undefined;
+    theme?: "primary" | "primaryDark" | "light" | undefined;
 }, {
     sm: string;
     md: string;

package/dist/components/table/TableHeader.js

@@ -1 +1 @@
-import t from"react";import{styled as i}from"../../stitches.js";import{TableHeaderCell as r}from"./TableHeaderCell.js";const l=i("thead",{variants:{theme:{primary:{[`${r}`]:{bg:"$primary"}},primaryDark:{[`${r}`]:{bg:"$primaryDark"}}}}}),e=({theme:a="primaryDark",...m})=>t.createElement(l,{theme:a,...m});e.displayName="TableHeader";export{e as TableHeader};
+import l from"react";import{styled as m}from"../../stitches.js";import{TableHeaderCell as r}from"./TableHeaderCell.js";const o=m("thead",{variants:{theme:{primary:{[`${r}`]:{bg:"$primary"}},primaryDark:{[`${r}`]:{bg:"$primaryDark"}},light:{[`${r}`]:{bg:"$tonal50",color:"$tonal600"}}}}}),a=({theme:e="primaryDark",...t})=>l.createElement(o,{theme:e,...t});a.displayName="TableHeader";export{a as TableHeader};

package/dist/components/tabs/TabsTriggerList.js

@@ -1 +1 @@
-import{ChevronLeft as B,ChevronRight as P}from"@atom-learning/icons";import{List as F}from"@radix-ui/react-tabs";import{opacify as L}from"color2k";import o,{useRef as M,useState as h,useCallback as X,useEffect as W}from"react";import{debounce as _}from"throttle-debounce";import{ActionIcon as j}from"../action-icon/ActionIcon.js";import{Flex as q}from"../flex/Flex.js";import{Icon as y}from"../icon/Icon.js";import{theme as G,styled as E}from"../../stitches.js";import{TabTrigger as k}from"./TabTrigger.js";import{passPropsToChildren as x}from"./utils.js";const H=L("white",-.2),J=L(G.colors.primaryDark.value,-.2),T=E(j,{position:"absolute",transition:"all 125ms",variants:{theme:{light:{bg:`${H} !important`},dark:{bg:`${J} !important`,color:"currentColor !important"}},visible:{true:{opacity:1,visibility:"visible",pointerEvents:"all"},false:{opacity:0,visibility:"hidden",pointerEvents:"none"}}}}),C=E(F,{flexShrink:0,display:"flex",width:"100%",overflowX:"auto","&::-webkit-scrollbar":{display:"none"},scrollbarWidth:"none",variants:{theme:{light:{borderBottom:"1px solid $tonal300"},dark:{bg:"$primaryDark",borderBottom:"1px solid $tonal200"}},appearance:{uppercase:{textTransform:"uppercase"}}}}),K=({children:d,theme:l,appearance:p,enableTabScrolling:z,scrollPercentage:R=10,...u})=>{const n=M(null),[g,c]=h(!1),[v,a]=h(!1),[$,A]=h(),b=X(t=>{const e=n.current;if(e){const{scrollWidth:i,scrollLeft:s,offsetWidth:f}=e,w=Math.round(i*(R/100));let m=s;if(t==="right"){const r=s+w;m=r+f<=i?r:i-f}else{const r=s-w;m=r>0?r:0}e.scroll({left:m,behavior:"smooth"}),setTimeout(()=>{const{scrollWidth:r,scrollLeft:S,offsetWidth:D}=e,I=r-(S+D);S===0?(c(!1),a(!0)):I<5?(a(!1),c(!0)):(c(!0),a(!0))},500)}},[]);return W(()=>{const t=_(500,()=>{A(window.innerWidth)});return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[]),W(()=>{var t;const e=n.current;if(e){const{offsetWidth:i,scrollWidth:s}=e,f=s>i;(t=e.scroll)==null||t.call(e,{left:0}),c(!1),a(f)}},[$]),g||v||z?o.createElement(q,{css:{position:"relative"}},o.createElement(T,{size:"xl",label:"Scroll Left",theme:l,onClick:()=>b("left"),visible:g,css:{left:0}},o.createElement(y,{is:B,size:"lg"})),o.createElement(C,{...u,ref:n,appearance:p,theme:l},x(d,{theme:l},[k])),o.createElement(T,{size:"xl",label:"Scroll right",theme:l,onClick:()=>b("right"),visible:v,css:{right:0}},o.createElement(y,{is:P,size:"lg"}))):o.createElement(C,{theme:l,...u,appearance:p,ref:n},x(d,{theme:l},[k]))};export{K as TriggerListWrapper};
+import{ChevronLeft as B,ChevronRight as P}from"@atom-learning/icons";import{List as F}from"@radix-ui/react-tabs";import{opacify as L}from"color2k";import o,{useRef as M,useState as h,useCallback as X,useEffect as W}from"react";import{debounce as _}from"throttle-debounce";import{ActionIcon as j}from"../action-icon/ActionIcon.js";import{Flex as q}from"../flex/Flex.js";import{Icon as y}from"../icon/Icon.js";import{theme as G,styled as E}from"../../stitches.js";import{TabTrigger as k}from"./TabTrigger.js";import{passPropsToChildren as x}from"./utils.js";const H=L("white",-.2),J=L(G.colors.primaryDark.value,-.2),T=E(j,{position:"absolute",transition:"all 125ms",variants:{theme:{light:{bg:`${H} !important`},dark:{bg:`${J} !important`,color:"currentColor !important"}},visible:{true:{opacity:1,visibility:"visible",pointerEvents:"all"},false:{opacity:0,visibility:"hidden",pointerEvents:"none"}}}}),C=E(F,{flexShrink:0,display:"flex",width:"100%",overflowX:"auto","&::-webkit-scrollbar":{display:"none"},scrollbarWidth:"none",variants:{theme:{light:{borderBottom:"1px solid $tonal300"},dark:{bg:"$primaryDark",borderBottom:"1px solid $tonal200"}},appearance:{uppercase:{"& button":{textTransform:"uppercase"}}}}}),K=({children:d,theme:l,appearance:p,enableTabScrolling:z,scrollPercentage:R=10,...u})=>{const n=M(null),[g,c]=h(!1),[b,a]=h(!1),[$,A]=h(),v=X(t=>{const e=n.current;if(e){const{scrollWidth:i,scrollLeft:s,offsetWidth:f}=e,w=Math.round(i*(R/100));let m=s;if(t==="right"){const r=s+w;m=r+f<=i?r:i-f}else{const r=s-w;m=r>0?r:0}e.scroll({left:m,behavior:"smooth"}),setTimeout(()=>{const{scrollWidth:r,scrollLeft:S,offsetWidth:D}=e,I=r-(S+D);S===0?(c(!1),a(!0)):I<5?(a(!1),c(!0)):(c(!0),a(!0))},500)}},[]);return W(()=>{const t=_(500,()=>{A(window.innerWidth)});return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[]),W(()=>{var t;const e=n.current;if(e){const{offsetWidth:i,scrollWidth:s}=e,f=s>i;(t=e.scroll)==null||t.call(e,{left:0}),c(!1),a(f)}},[$]),g||b||z?o.createElement(q,{css:{position:"relative"}},o.createElement(T,{size:"xl",label:"Scroll Left",theme:l,onClick:()=>v("left"),visible:g,css:{left:0}},o.createElement(y,{is:B,size:"lg"})),o.createElement(C,{...u,ref:n,appearance:p,theme:l},x(d,{theme:l},[k])),o.createElement(T,{size:"xl",label:"Scroll right",theme:l,onClick:()=>v("right"),visible:b,css:{right:0}},o.createElement(y,{is:P,size:"lg"}))):o.createElement(C,{theme:l,...u,appearance:p,ref:n},x(d,{theme:l},[k]))};export{K as TriggerListWrapper};