npm - @atom-learning/components - Versions diffs - 5.8.0 → 6.0.0-beta.2 - Mend

@atom-learning/components 5.8.0 → 6.0.0-beta.2

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.

Files changed (113) hide show

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

@@ -4,7 +4,7 @@ import { NavigatorActions } from '../../types';
 import { Override } from '../../utilities';
 import type { TOptionalTooltipWrapperProps } from '../../utilities/optional-tooltip-wrapper';
 declare const StyledButton: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<"button", {
-    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+    theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "xs" | "sm" | "md" | "lg" | undefined;
     isRounded?: boolean | "true" | undefined;

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

@@ -1,2 +1,2 @@
-import u from"invariant";import*as n from"react";import{styled as w}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{disabledStyle as k}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as D}from"../../utilities/uri/index.js";import{Icon as m}from"../icon/Icon.js";import{ActionIconSizeMap as v}from"./ActionIcon.constants.js";import{OptionalTooltipWrapper as z}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const o=(r,a,i,e)=>({theme:r,appearance:"simple",css:{bg:"transparent",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),t=(r,a,i,e)=>({theme:r,appearance:"solid",css:{bg:a,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:i,color:"white"},"&:not(:disabled):active":{bg:e}}}),p=(r,a,i,e)=>({theme:r,appearance:"outline",css:{border:"1px solid",borderColor:"currentColor",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),M=w("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$0",boxSizing:"border-box",cursor:"pointer",display:"flex",flexShrink:0,justifyContent:"center",p:"unset",transition:"all 100ms ease-out","&[disabled]":k,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:[o("neutral","$grey700","$primary900","$primary1000"),o("primary","$primary800","$primary900","$primary1000"),o("primaryDark","$primary1000","$primary1100","$primary1200"),o("success","$success","$successMid","$successDark"),o("warning","$warning","$warningMid","$warningDark"),o("danger","$danger","$dangerMid","$dangerDark"),t("primary","$primary800","$primary900","$primary1000"),t("primaryDark","$primary1000","$primary1100","$primary1200"),t("success","$success","$successMid","$successDark"),t("warning","$warning","$warningMid","$warningDark"),t("danger","$danger","$dangerMid","$dangerDark"),p("primary","$primary800","$primary900","$primary1000"),p("primaryDark","$primary1000","$primary1100","$primary1200"),p("success","$success","$successMid","$successDark"),p("warning","$warning","$warningMid","$warningDark"),p("danger","$danger","$dangerMid","$dangerDark")]}),d=n.forwardRef(({children:r,theme:a="primary",appearance:i="simple",size:e="sm",label:$,href:l,disabled:c,hasTooltip:g=!0,tooltipSide:b,...h},f)=>{const y=`A single ${m.displayName} component is permitted as a child of ${d.displayName}`;return u(n.Children.count(r)===1,y),n.createElement(z,{hasTooltip:g,label:$,tooltipSide:b},n.createElement(M,{...l?{as:"a",href:c?null:l,onClick:void 0,"aria-disabled":!!c}:{type:"button"},...D(l),...h,"aria-label":$,theme:a,appearance:i,size:e,ref:f,disabled:c},n.Children.map(r,s=>{if(!n.isValidElement(s))throw new Error(y);return u(s.type===m,`Children of type ${s==null?void 0:s.type} aren't permitted. Only an ${m.displayName} component is allowed in ${d.displayName}`),n.cloneElement(s,{size:v[e],css:{...s.props.css?s.props.css:{}}})})))});d.displayName="ActionIcon";export{d as ActionIcon};
+import u from"invariant";import*as n from"react";import{styled as w}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{disabledStyle as k}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as D}from"../../utilities/uri/index.js";import{Icon as m}from"../icon/Icon.js";import{ActionIconSizeMap as v}from"./ActionIcon.constants.js";import{OptionalTooltipWrapper as z}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const o=(r,a,i,e)=>({theme:r,appearance:"simple",css:{bg:"transparent",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),t=(r,a,i,e)=>({theme:r,appearance:"solid",css:{bg:a,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:i,color:"white"},"&:not(:disabled):active":{bg:e}}}),p=(r,a,i,e)=>({theme:r,appearance:"outline",css:{border:"1px solid",borderColor:"currentColor",color:a,"&:not(:disabled):hover, &:not(:disabled):focus":{color:i},"&:not(:disabled):active":{color:e}}}),M=w("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$1",boxSizing:"border-box",cursor:"pointer",display:"flex",flexShrink:0,justifyContent:"center",p:"unset",transition:"all 100ms ease-out","&[disabled]":k,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:[o("neutral","$grey700","$primary900","$primary1000"),o("primary","$primary800","$primary900","$primary1000"),o("primaryDark","$primary1000","$primary1100","$primary1200"),o("success","$success","$successMid","$successDark"),o("warning","$warning","$warningMid","$warningDark"),o("danger","$danger","$dangerMid","$dangerDark"),t("primary","$primary800","$primary900","$primary1000"),t("primaryDark","$primary1000","$primary1100","$primary1200"),t("success","$success","$successMid","$successDark"),t("warning","$warning","$warningMid","$warningDark"),t("danger","$danger","$dangerMid","$dangerDark"),p("primary","$primary800","$primary900","$primary1000"),p("primaryDark","$primary1000","$primary1100","$primary1200"),p("success","$success","$successMid","$successDark"),p("warning","$warning","$warningMid","$warningDark"),p("danger","$danger","$dangerMid","$dangerDark")]}),d=n.forwardRef(({children:r,theme:a="primary",appearance:i="simple",size:e="sm",label:$,href:l,disabled:c,hasTooltip:g=!0,tooltipSide:b,...h},f)=>{const y=`A single ${m.displayName} component is permitted as a child of ${d.displayName}`;return u(n.Children.count(r)===1,y),n.createElement(z,{hasTooltip:g,label:$,tooltipSide:b},n.createElement(M,{...l?{as:"a",href:c?null:l,onClick:void 0,"aria-disabled":!!c}:{type:"button"},...D(l),...h,"aria-label":$,theme:a,appearance:i,size:e,ref:f,disabled:c},n.Children.map(r,s=>{if(!n.isValidElement(s))throw new Error(y);return u(s.type===m,`Children of type ${s==null?void 0:s.type} aren't permitted. Only an ${m.displayName} component is allowed in ${d.displayName}`),n.cloneElement(s,{size:v[e],css:{...s.props.css?s.props.css:{}}})})))});d.displayName="ActionIcon";export{d as ActionIcon};
 //# sourceMappingURL=ActionIcon.js.map

package/dist/components/action-icon/ActionIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import type { VariantProps } from '@atom-learning/stitches-react'\nimport invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst getSimpleVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'simple',\n css: {\n bg: 'transparent',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst getSolidVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'solid',\n css: {\n bg: base,\n color: 'white',\n '&:not(:disabled):hover, &:not(:disabled):focus': {\n bg: interact,\n color: 'white'\n },\n '&:not(:disabled):active': { bg: active }\n }\n})\n\nconst getOutlineVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'outline',\n css: {\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst StyledButton = styled('button', {\n alignItems: 'center',\n appearance: 'none',\n bg: 'white',\n border: 'unset',\n borderRadius: '$0',\n boxSizing: 'border-box',\n cursor: 'pointer',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n p: 'unset',\n transition: 'all 100ms ease-out',\n '&[disabled]': disabledStyle,\n variants: {\n theme: {\n neutral: {},\n primary: {},\n success: {},\n warning: {},\n danger: {}\n },\n appearance: {\n simple: {},\n outline: {},\n solid: {}\n },\n size: {\n xs: { size: '$2' },\n sm: { size: '$3' },\n md: { size: '$4' },\n lg: { size: '$5' }\n },\n isRounded: {\n true: {\n borderRadius: '$round'\n }\n }\n },\n\n // prettier-ignore\n compoundVariants: [\n getSimpleVariant('neutral', '$grey700', '$primary900', '$primary1000'),\n getSimpleVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSimpleVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSimpleVariant('success', '$success', '$successMid', '$successDark'),\n getSimpleVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSimpleVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getSolidVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSolidVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSolidVariant('success', '$success', '$successMid', '$successDark'),\n getSolidVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSolidVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getOutlineVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getOutlineVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getOutlineVariant('success', '$success', '$successMid', '$successDark'),\n getOutlineVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getOutlineVariant('danger', '$danger', '$dangerMid', '$dangerDark')\n ]\n})\n\ntype ActionIconProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: string \| React.ReactNode\n children: React.ReactNode\n label: string\n } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n NavigatorActions\n>\n\nexport const ActionIcon: React.ForwardRefExoticComponent<ActionIconProps> =\n React.forwardRef(\n (\n {\n children,\n theme = 'primary',\n appearance = 'simple',\n size = 'sm',\n label,\n href,\n disabled,\n hasTooltip = true,\n tooltipSide,\n ...remainingProps\n },\n ref\n ) => {\n const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`\n\n invariant(React.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE)\n\n const optionalLinkProps = href\n ? ({\n as: 'a',\n href: disabled ? null : href,\n onClick: undefined,\n 'aria-disabled': !!disabled\n } as const)\n : ({ type: 'button' } as const)\n\n return (\n <OptionalTooltipWrapper\n hasTooltip={hasTooltip}\n label={label}\n tooltipSide={tooltipSide}\n >\n <StyledButton\n {...optionalLinkProps}\n {...getExternalAnchorProps(href)}\n {...remainingProps}\n aria-label={label}\n theme={theme}\n appearance={appearance}\n size={size}\n ref={ref}\n disabled={disabled}\n >\n {React.Children.map(children, (child) => {\n // TS needs this check for any following code to access child.type\n // even with optional chaining\n if (!React.isValidElement(child)) {\n throw new Error(INVALID_CHILDREN_MESSAGE)\n }\n\n invariant(\n child.type === Icon,\n `Children of type ${child?.type} aren't permitted. Only an ${Icon.displayName} component is allowed in ${ActionIcon.displayName}`\n )\n\n return React.cloneElement(\n child as React.ReactElement<React.ComponentProps<typeof Icon>>,\n {\n size: ActionIconSizeMap[size as string],\n css: { ...(child.props.css ? child.props.css : {}) }\n }\n )\n })}\n </StyledButton>\n </OptionalTooltipWrapper>\n )\n }\n )\n\nActionIcon.displayName = 'ActionIcon'\n"],"names":["getSimpleVariant","theme","base","interact","active","getSolidVariant","getOutlineVariant","StyledButton","styled","disabledStyle","ActionIcon","React","children","appearance","size","label","href","disabled","hasTooltip","tooltipSide","remainingProps","ref","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"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"}
1	+ {"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import type { VariantProps } from '@atom-learning/stitches-react'\nimport invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst getSimpleVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'simple',\n css: {\n bg: 'transparent',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst getSolidVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'solid',\n css: {\n bg: base,\n color: 'white',\n '&:not(:disabled):hover, &:not(:disabled):focus': {\n bg: interact,\n color: 'white'\n },\n '&:not(:disabled):active': { bg: active }\n }\n})\n\nconst getOutlineVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'outline',\n css: {\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&:not(:disabled):hover, &:not(:disabled):focus': { color: interact },\n '&:not(:disabled):active': { color: active }\n }\n})\n\nconst StyledButton = styled('button', {\n alignItems: 'center',\n appearance: 'none',\n bg: 'white',\n border: 'unset',\n borderRadius: '$1',\n boxSizing: 'border-box',\n cursor: 'pointer',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n p: 'unset',\n transition: 'all 100ms ease-out',\n '&[disabled]': disabledStyle,\n variants: {\n theme: {\n neutral: {},\n primary: {},\n success: {},\n warning: {},\n danger: {}\n },\n appearance: {\n simple: {},\n outline: {},\n solid: {}\n },\n size: {\n xs: { size: '$2' },\n sm: { size: '$3' },\n md: { size: '$4' },\n lg: { size: '$5' }\n },\n isRounded: {\n true: {\n borderRadius: '$round'\n }\n }\n },\n\n // prettier-ignore\n compoundVariants: [\n getSimpleVariant('neutral', '$grey700', '$primary900', '$primary1000'),\n getSimpleVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSimpleVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSimpleVariant('success', '$success', '$successMid', '$successDark'),\n getSimpleVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSimpleVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getSolidVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getSolidVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getSolidVariant('success', '$success', '$successMid', '$successDark'),\n getSolidVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getSolidVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n\n getOutlineVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getOutlineVariant('primaryDark', '$primary1000', '$primary1100', '$primary1200'),\n getOutlineVariant('success', '$success', '$successMid', '$successDark'),\n getOutlineVariant('warning', '$warning', '$warningMid', '$warningDark'),\n getOutlineVariant('danger', '$danger', '$dangerMid', '$dangerDark')\n ]\n})\n\ntype ActionIconProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: string \| React.ReactNode\n children: React.ReactNode\n label: string\n } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n NavigatorActions\n>\n\nexport const ActionIcon: React.ForwardRefExoticComponent<ActionIconProps> =\n React.forwardRef(\n (\n {\n children,\n theme = 'primary',\n appearance = 'simple',\n size = 'sm',\n label,\n href,\n disabled,\n hasTooltip = true,\n tooltipSide,\n ...remainingProps\n },\n ref\n ) => {\n const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`\n\n invariant(React.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE)\n\n const optionalLinkProps = href\n ? ({\n as: 'a',\n href: disabled ? null : href,\n onClick: undefined,\n 'aria-disabled': !!disabled\n } as const)\n : ({ type: 'button' } as const)\n\n return (\n <OptionalTooltipWrapper\n hasTooltip={hasTooltip}\n label={label}\n tooltipSide={tooltipSide}\n >\n <StyledButton\n {...optionalLinkProps}\n {...getExternalAnchorProps(href)}\n {...remainingProps}\n aria-label={label}\n theme={theme}\n appearance={appearance}\n size={size}\n ref={ref}\n disabled={disabled}\n >\n {React.Children.map(children, (child) => {\n // TS needs this check for any following code to access child.type\n // even with optional chaining\n if (!React.isValidElement(child)) {\n throw new Error(INVALID_CHILDREN_MESSAGE)\n }\n\n invariant(\n child.type === Icon,\n `Children of type ${child?.type} aren't permitted. Only an ${Icon.displayName} component is allowed in ${ActionIcon.displayName}`\n )\n\n return React.cloneElement(\n child as React.ReactElement<React.ComponentProps<typeof Icon>>,\n {\n size: ActionIconSizeMap[size as string],\n css: { ...(child.props.css ? child.props.css : {}) }\n }\n )\n })}\n </StyledButton>\n </OptionalTooltipWrapper>\n )\n }\n )\n\nActionIcon.displayName = 'ActionIcon'\n"],"names":["getSimpleVariant","theme","base","interact","active","getSolidVariant","getOutlineVariant","StyledButton","styled","disabledStyle","ActionIcon","React","children","appearance","size","label","href","disabled","hasTooltip","tooltipSide","remainingProps","ref","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"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"}

package/dist/components/banner/BannerContainer.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as o from"react";import{ColorScheme as a}from"../../experiments/color-scheme/ColorScheme.js";import{styled as t}from"../../stitches.js";import{Dismissible as m}from"../dismissible/index.js";import{Flex as l}from"../flex/Flex.js";import{useBannerContext as d}from"./BannerContext.js";const c=t(l,{position:"relative",width:"100%",borderRadius:"$0",overflow:"hidden",color:"$foreground","--banner-heading-color":"$colors$foreground","--banner-text-color":"$colors$grey900",variants:{emphasis:{bold:{background:"$base11",color:"$foreground7plus","--banner-heading-color":"$colors$foreground7plus","--banner-text-color":"$colors$grey100"},subtle:{background:"$base3"},minimal:{background:"$base1"}},size:{sm:{},md:{}}}}),b=({colorScheme:e={},onDismiss:r,dismissed:s,...n})=>{const{emphasis:i}=d();return o.createElement(a,{...e,asChild:!0},o.createElement(m,{asChild:!0,onDismiss:r,dismissed:s},o.createElement(c,{role:"banner",emphasis:i,...n})))};export{b as BannerContainer};
+import*as o from"react";import{ColorScheme as a}from"../../experiments/color-scheme/ColorScheme.js";import{styled as t}from"../../stitches.js";import{Dismissible as m}from"../dismissible/index.js";import{Flex as l}from"../flex/Flex.js";import{useBannerContext as d}from"./BannerContext.js";const c=t(l,{position:"relative",width:"100%",borderRadius:"$3",overflow:"hidden",color:"$foreground","--banner-heading-color":"$colors$foreground","--banner-text-color":"$colors$grey900",variants:{emphasis:{bold:{background:"$base11",color:"$foreground7plus","--banner-heading-color":"$colors$foreground7plus","--banner-text-color":"$colors$grey100"},subtle:{background:"$base3"},minimal:{background:"$base1"}},size:{sm:{},md:{}}}}),b=({colorScheme:e={},onDismiss:r,dismissed:s,...n})=>{const{emphasis:i}=d();return o.createElement(a,{...e,asChild:!0},o.createElement(m,{asChild:!0,onDismiss:r,dismissed:s},o.createElement(c,{role:"banner",emphasis:i,...n})))};export{b as BannerContainer};
 //# sourceMappingURL=BannerContainer.js.map

package/dist/components/banner/BannerContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerContainer.js","sources":["../../../src/components/banner/BannerContainer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ColorScheme, TcolorScheme } from '~/experiments/color-scheme'\nimport { styled } from '~/stitches'\n\nimport { Dismissible } from '../dismissible'\nimport { Flex } from '../flex'\nimport { useBannerContext } from './BannerContext'\n\nconst StyledBannerContainer = styled(Flex, {\n position: 'relative',\n width: '100%',\n borderRadius: '$0',\n overflow: 'hidden',\n color: '$foreground',\n '--banner-heading-color': '$colors$foreground',\n '--banner-text-color': '$colors$grey900',\n variants: {\n emphasis: {\n bold: {\n background: '$base11',\n color: '$foreground7plus',\n '--banner-heading-color': '$colors$foreground7plus',\n '--banner-text-color': '$colors$grey100'\n },\n subtle: {\n background: '$base3'\n },\n minimal: {\n background: '$base1'\n }\n },\n size: {\n sm: {},\n md: {}\n }\n }\n})\n\nexport type TBannerContainerProps = React.ComponentProps<\n typeof StyledBannerContainer\n> & {\n colorScheme?: TcolorScheme\n} & React.ComponentProps<typeof Dismissible>\n\nexport const BannerContainer = ({\n colorScheme = {},\n onDismiss,\n dismissed,\n ...props\n}: TBannerContainerProps): JSX.Element => {\n const { emphasis } = useBannerContext()\n\n return (\n <ColorScheme {...colorScheme} asChild>\n <Dismissible asChild onDismiss={onDismiss} dismissed={dismissed}>\n <StyledBannerContainer role=\"banner\" emphasis={emphasis} {...props} />\n </Dismissible>\n </ColorScheme>\n )\n}\n"],"names":["StyledBannerContainer","styled","Flex","BannerContainer","colorScheme","onDismiss","dismissed","props","emphasis","useBannerContext","React","ColorScheme","Dismissible"],"mappings":"kSASA,MAAMA,EAAwBC,EAAOC,EAAM,CACzC,SAAU,WACV,MAAO,OACP,aAAc,KACd,SAAU,SACV,MAAO,cACP,yBAA0B,qBAC1B,sBAAuB,kBACvB,SAAU,CACR,SAAU,CACR,KAAM,CACJ,WAAY,UACZ,MAAO,mBACP,yBAA0B,0BAC1B,sBAAuB,iBACzB,EACA,OAAQ,CACN,WAAY,QACd,EACA,QAAS,CACP,WAAY,QACd,CACF,EACA,KAAM,CACJ,GAAI,GACJ,GAAI,CACN,CAAA,CACF,CACF,CAAC,EAQYC,EAAkB,CAAC,CAC9B,YAAAC,EAAc,CAAA,EACd,UAAAC,EACA,UAAAC,KACGC,CACL,IAA0C,CACxC,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAErB,EAAA,OACEC,EAAA,cAACC,EAAA,CAAa,GAAGP,EAAa,QAAO,EAAA,EACnCM,EAAA,cAACE,EAAA,CAAY,QAAO,GAAC,UAAWP,EAAW,UAAWC,CACpDI,EAAAA,EAAA,cAACV,EAAA,CAAsB,KAAK,SAAS,SAAUQ,EAAW,GAAGD,CAAO,CAAA,CACtE,CACF,CAEJ"}
1	+ {"version":3,"file":"BannerContainer.js","sources":["../../../src/components/banner/BannerContainer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ColorScheme, TcolorScheme } from '~/experiments/color-scheme'\nimport { styled } from '~/stitches'\n\nimport { Dismissible } from '../dismissible'\nimport { Flex } from '../flex'\nimport { useBannerContext } from './BannerContext'\n\nconst StyledBannerContainer = styled(Flex, {\n position: 'relative',\n width: '100%',\n borderRadius: '$3',\n overflow: 'hidden',\n color: '$foreground',\n '--banner-heading-color': '$colors$foreground',\n '--banner-text-color': '$colors$grey900',\n variants: {\n emphasis: {\n bold: {\n background: '$base11',\n color: '$foreground7plus',\n '--banner-heading-color': '$colors$foreground7plus',\n '--banner-text-color': '$colors$grey100'\n },\n subtle: {\n background: '$base3'\n },\n minimal: {\n background: '$base1'\n }\n },\n size: {\n sm: {},\n md: {}\n }\n }\n})\n\nexport type TBannerContainerProps = React.ComponentProps<\n typeof StyledBannerContainer\n> & {\n colorScheme?: TcolorScheme\n} & React.ComponentProps<typeof Dismissible>\n\nexport const BannerContainer = ({\n colorScheme = {},\n onDismiss,\n dismissed,\n ...props\n}: TBannerContainerProps): JSX.Element => {\n const { emphasis } = useBannerContext()\n\n return (\n <ColorScheme {...colorScheme} asChild>\n <Dismissible asChild onDismiss={onDismiss} dismissed={dismissed}>\n <StyledBannerContainer role=\"banner\" emphasis={emphasis} {...props} />\n </Dismissible>\n </ColorScheme>\n )\n}\n"],"names":["StyledBannerContainer","styled","Flex","BannerContainer","colorScheme","onDismiss","dismissed","props","emphasis","useBannerContext","React","ColorScheme","Dismissible"],"mappings":"kSASA,MAAMA,EAAwBC,EAAOC,EAAM,CACzC,SAAU,WACV,MAAO,OACP,aAAc,KACd,SAAU,SACV,MAAO,cACP,yBAA0B,qBAC1B,sBAAuB,kBACvB,SAAU,CACR,SAAU,CACR,KAAM,CACJ,WAAY,UACZ,MAAO,mBACP,yBAA0B,0BAC1B,sBAAuB,iBACzB,EACA,OAAQ,CACN,WAAY,QACd,EACA,QAAS,CACP,WAAY,QACd,CACF,EACA,KAAM,CACJ,GAAI,GACJ,GAAI,CACN,CAAA,CACF,CACF,CAAC,EAQYC,EAAkB,CAAC,CAC9B,YAAAC,EAAc,CAAA,EACd,UAAAC,EACA,UAAAC,KACGC,CACL,IAA0C,CACxC,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAErB,EAAA,OACEC,EAAA,cAACC,EAAA,CAAa,GAAGP,EAAa,QAAO,EAAA,EACnCM,EAAA,cAACE,EAAA,CAAY,QAAO,GAAC,UAAWP,EAAW,UAAWC,CACpDI,EAAAA,EAAA,cAACV,EAAA,CAAsB,KAAK,SAAS,SAAUQ,EAAW,GAAGD,CAAO,CAAA,CACtE,CACF,CAEJ"}

package/dist/components/banner/banner-regular/BannerRegular.d.ts CHANGED Viewed

@@ -1156,17 +1156,17 @@ export declare const BannerRegular: {
                     marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
                 };
             }> | undefined;
-            theme?: "success" | "danger" | "warning" | "primary" | "neutral" | ({
-                "@sm"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@md"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@lg"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@xl"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@reducedMotion"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@allowMotion"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@hover"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@initial"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+            theme?: "success" | "danger" | "warning" | "neutral" | "primary" | ({
+                "@sm"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@md"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@lg"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@xl"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@reducedMotion"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@allowMotion"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@hover"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@initial"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
             } & {
-                [x: string]: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+                [x: string]: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
             }) | undefined;
             prefix?: string | undefined;
             form?: string | undefined;
@@ -1176,7 +1176,6 @@ export declare const BannerRegular: {
             title?: string | undefined;
             ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
             key?: React.Key | null | undefined;
-            name?: string | undefined;
             defaultChecked?: boolean | undefined;
             defaultValue?: string | number | readonly string[] | undefined;
             suppressContentEditableWarning?: boolean | undefined;
@@ -1430,6 +1429,7 @@ export declare const BannerRegular: {
             onTransitionEnd?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
             onTransitionEndCapture?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
             as?: string | React.ReactNode;
+            name?: string | undefined;
             type?: "submit" | "reset" | "button" | undefined;
             disabled?: boolean | undefined;
             formAction?: string | undefined;

package/dist/components/banner/banner-regular/BannerRegularDismiss.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import * as React from 'react';
 declare const StyledDismiss: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
 }, "appearance" | "size" | "css" | "theme" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+    theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "xs" | "sm" | "md" | "lg" | undefined;
     isRounded?: boolean | "true" | undefined;
@@ -376,8 +376,8 @@ declare const StyledDismiss: import("@atom-learning/stitches-react/types/styled-
             marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
         };
     }> | undefined;
-}, "appearance" | "size" | "theme" | "label" | "children" | "as" | "hasTooltip" | "tooltipSide" | "isRounded" | keyof import("../../../types").NavigatorActions> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+}, "appearance" | "size" | "theme" | "label" | "children" | "as" | keyof import("../../../types").NavigatorActions | "hasTooltip" | "tooltipSide" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
+    theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "xs" | "sm" | "md" | "lg" | undefined;
     isRounded?: boolean | "true" | undefined;

package/dist/components/banner/banner-regular/BannerRegularHeading.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as i from"react";import{styled as a}from"../../../stitches.js";import{Heading as o}from"../../heading/Heading.js";import{useBannerContext as m}from"../BannerContext.js";const t=a(o,{mb:"$4",color:"var(--banner-heading-color)",variants:{containerSize:{sm:{},md:{}},hasDismiss:{true:{}}},compoundVariants:[{containerSize:"sm",hasDismiss:!0,css:{mr:"$6"}}]}),s=e=>{const{size:n,hasDismiss:r}=m();return i.createElement(t,{size:"sm",containerSize:n,hasDismiss:r,...e})};s.displayName="BannerRegularHeading";export{s as BannerRegularHeading};
+import*as i from"react";import{styled as a}from"../../../stitches.js";import{Heading as o}from"../../heading/Heading.js";import{useBannerContext as m}from"../BannerContext.js";const t=a(o,{mb:"$4",color:"var(--banner-heading-color)",variants:{containerSize:{sm:{},md:{}},hasDismiss:{true:{}}},compoundVariants:[{containerSize:"sm",hasDismiss:!0,css:{mr:"$6"}}]}),s=e=>{const{size:n,hasDismiss:r}=m();return i.createElement(t,{size:"md",containerSize:n,hasDismiss:r,...e})};s.displayName="BannerRegularHeading";export{s as BannerRegularHeading};
 //# sourceMappingURL=BannerRegularHeading.js.map

package/dist/components/banner/banner-regular/BannerRegularHeading.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BannerRegularHeading.js","sources":["../../../../src/components/banner/banner-regular/BannerRegularHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Heading } from '../../heading'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledHeading = styled(Heading, {\n mb: '$4',\n color: 'var(--banner-heading-color)',\n variants: {\n containerSize: {\n sm: {},\n md: {}\n },\n hasDismiss: {\n true: {}\n }\n },\n compoundVariants: [\n {\n containerSize: 'sm',\n hasDismiss: true,\n css: {\n mr: '$6'\n }\n }\n ]\n})\n\nexport const BannerRegularHeading = (\n props: React.ComponentProps<typeof Heading>\n) => {\n const { size, hasDismiss } = useBannerContext()\n\n return (\n <StyledHeading\n size=\"sm\"\n containerSize={size}\n hasDismiss={hasDismiss}\n {...props}\n />\n )\n}\n\nBannerRegularHeading.displayName = 'BannerRegularHeading'\n"],"names":["StyledHeading","styled","Heading","BannerRegularHeading","props","size","hasDismiss","useBannerContext","React"],"mappings":"gLAOA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,GAAI,KACJ,MAAO,8BACP,SAAU,CACR,cAAe,CACb,GAAI,CACJ,EAAA,GAAI,EACN,EACA,WAAY,CACV,KAAM,CACR,CAAA,CACF,EACA,iBAAkB,CAChB,CACE,cAAe,KACf,WAAY,GACZ,IAAK,CACH,GAAI,IACN,CACF,CACF,CACF,CAAC,EAEYC,EACXC,GACG,CACH,KAAM,CAAE,KAAAC,EAAM,WAAAC,CAAW,EAAIC,EAAiB,EAE9C,OACEC,EAAA,cAACR,EAAA,CACC,KAAK,KACL,cAAeK,EACf,WAAYC,EACX,GAAGF,EACN,CAEJ,EAEAD,EAAqB,YAAc"}
1	+ {"version":3,"file":"BannerRegularHeading.js","sources":["../../../../src/components/banner/banner-regular/BannerRegularHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Heading } from '../../heading'\nimport { useBannerContext } from '../BannerContext'\n\nconst StyledHeading = styled(Heading, {\n mb: '$4',\n color: 'var(--banner-heading-color)',\n variants: {\n containerSize: {\n sm: {},\n md: {}\n },\n hasDismiss: {\n true: {}\n }\n },\n compoundVariants: [\n {\n containerSize: 'sm',\n hasDismiss: true,\n css: {\n mr: '$6'\n }\n }\n ]\n})\n\nexport const BannerRegularHeading = (\n props: React.ComponentProps<typeof Heading>\n) => {\n const { size, hasDismiss } = useBannerContext()\n\n return (\n <StyledHeading\n size=\"md\"\n containerSize={size}\n hasDismiss={hasDismiss}\n {...props}\n />\n )\n}\n\nBannerRegularHeading.displayName = 'BannerRegularHeading'\n"],"names":["StyledHeading","styled","Heading","BannerRegularHeading","props","size","hasDismiss","useBannerContext","React"],"mappings":"gLAOA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,GAAI,KACJ,MAAO,8BACP,SAAU,CACR,cAAe,CACb,GAAI,CACJ,EAAA,GAAI,EACN,EACA,WAAY,CACV,KAAM,CACR,CAAA,CACF,EACA,iBAAkB,CAChB,CACE,cAAe,KACf,WAAY,GACZ,IAAK,CACH,GAAI,IACN,CACF,CACF,CACF,CAAC,EAEYC,EACXC,GACG,CACH,KAAM,CAAE,KAAAC,EAAM,WAAAC,CAAW,EAAIC,EAAiB,EAE9C,OACEC,EAAA,cAACR,EAAA,CACC,KAAK,KACL,cAAeK,EACf,WAAYC,EACX,GAAGF,EACN,CAEJ,EAEAD,EAAqB,YAAc"}

package/dist/components/banner/banner-slim/BannerSlim.d.ts CHANGED Viewed

@@ -1153,17 +1153,17 @@ export declare const BannerSlim: {
                     marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
                 };
             }> | undefined;
-            theme?: "success" | "danger" | "warning" | "primary" | "neutral" | ({
-                "@sm"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@md"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@lg"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@xl"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@reducedMotion"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@allowMotion"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@hover"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
-                "@initial"?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+            theme?: "success" | "danger" | "warning" | "neutral" | "primary" | ({
+                "@sm"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@md"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@lg"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@xl"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@reducedMotion"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@allowMotion"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@hover"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
+                "@initial"?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
             } & {
-                [x: string]: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+                [x: string]: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
             }) | undefined;
             prefix?: string | undefined;
             form?: string | undefined;
@@ -1173,7 +1173,6 @@ export declare const BannerSlim: {
             title?: string | undefined;
             ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
             key?: React.Key | null | undefined;
-            name?: string | undefined;
             defaultChecked?: boolean | undefined;
             defaultValue?: string | number | readonly string[] | undefined;
             suppressContentEditableWarning?: boolean | undefined;
@@ -1427,6 +1426,7 @@ export declare const BannerSlim: {
             onTransitionEnd?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
             onTransitionEndCapture?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
             as?: string | React.ReactNode;
+            name?: string | undefined;
             type?: "submit" | "reset" | "button" | undefined;
             disabled?: boolean | undefined;
             formAction?: string | undefined;
@@ -1435,6 +1435,18 @@ export declare const BannerSlim: {
             formNoValidate?: boolean | undefined;
             formTarget?: string | undefined;
             value?: string | readonly string[] | number | undefined;
+            emphasis?: "bold" | ({
+                "@sm"?: "bold" | undefined;
+                "@md"?: "bold" | undefined;
+                "@lg"?: "bold" | undefined;
+                "@xl"?: "bold" | undefined;
+                "@reducedMotion"?: "bold" | undefined;
+                "@allowMotion"?: "bold" | undefined;
+                "@hover"?: "bold" | undefined;
+                "@initial"?: "bold" | undefined;
+            } & {
+                [x: string]: "bold" | undefined;
+            }) | undefined;
             hasTooltip?: boolean | undefined;
             tooltipSide?: React.ComponentProps<({ children, side, sideOffset, size, ...remainingProps }: Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size" | "css"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
                 size?: "sm" | "md" | "lg" | undefined;
@@ -1821,18 +1833,6 @@ export declare const BannerSlim: {
             } & {
                 [x: string]: boolean | "true" | undefined;
             }) | undefined;
-            emphasis?: "bold" | ({
-                "@sm"?: "bold" | undefined;
-                "@md"?: "bold" | undefined;
-                "@lg"?: "bold" | undefined;
-                "@xl"?: "bold" | undefined;
-                "@reducedMotion"?: "bold" | undefined;
-                "@allowMotion"?: "bold" | undefined;
-                "@hover"?: "bold" | undefined;
-                "@initial"?: "bold" | undefined;
-            } & {
-                [x: string]: "bold" | undefined;
-            }) | undefined;
             containerSize?: "sm" | "md" | ({
                 "@sm"?: "sm" | "md" | undefined;
                 "@md"?: "sm" | "md" | undefined;

package/dist/components/banner/banner-slim/BannerSlimDismiss.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import * as React from 'react';
 declare const StyledDismiss: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
 }, "appearance" | "size" | "css" | "theme" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+    theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "xs" | "sm" | "md" | "lg" | undefined;
     isRounded?: boolean | "true" | undefined;
@@ -376,8 +376,8 @@ declare const StyledDismiss: import("@atom-learning/stitches-react/types/styled-
             marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
         };
     }> | undefined;
-}, "appearance" | "size" | "theme" | "label" | "children" | "as" | "hasTooltip" | "tooltipSide" | "isRounded" | keyof import("../../../types").NavigatorActions> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
+}, "appearance" | "size" | "theme" | "label" | "children" | "as" | keyof import("../../../types").NavigatorActions | "hasTooltip" | "tooltipSide" | "isRounded"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
+    theme?: "success" | "danger" | "warning" | "neutral" | "primary" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "xs" | "sm" | "md" | "lg" | undefined;
     isRounded?: boolean | "true" | undefined;

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

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { NavigatorActions } from '../../types';
 import { Override } from '../../utilities';
 export declare const StyledButton: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<"button", {
-    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | "secondary" | undefined;
+    theme?: "success" | "danger" | "warning" | "neutral" | "primary" | "secondary" | undefined;
     appearance?: "outline" | "solid" | undefined;
     size?: "sm" | "md" | "lg" | "xl" | undefined;
     isLoading?: boolean | "true" | undefined;

package/dist/components/button/Button.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{opacify as s}from"color2k";import*as a from"react";import{StyledIcon as d}from"../icon/Icon.js";import{Loader as u}from"../loader/Loader.js";import{styled as c}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"../../utilities/style/keyframe-animations.js";import{disabledStyle as l}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as y}from"../../utilities/uri/index.js";const p=(e,r,i,t)=>({theme:e,appearance:"outline",css:{border:"1px solid",borderColor:"currentColor",color:r,"&[disabled]":l,"&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:i},"&:not([disabled]):active":{color:t}}}),n=(e,r,i,t,o="white")=>({theme:e,appearance:"solid",css:{bg:r,color:o,"&[disabled]":l,"&:not([disabled]):hover, &:not([disabled]):focus":{bg:i,color:o},"&:not([disabled]):active":{bg:t}}}),$=c("button",{alignItems:"center",bg:"unset",border:"unset",borderRadius:"$0",cursor:"pointer",display:"flex",fontFamily:"$body",fontWeight:600,justifyContent:"center",p:"unset",textDecoration:"none",transition:"all 100ms ease-out",whiteSpace:"nowrap",width:"max-content","&[disabled]":l,variants:{theme:{primary:{},secondary:{},success:{},warning:{},danger:{},neutral:{}},appearance:{solid:{},outline:{}},size:{sm:{fontSize:"$sm",lineHeight:1.53,height:"$3",px:"$4",gap:"$2",[`& ${d}`]:{size:16}},md:{fontSize:"$md",lineHeight:1.5,height:"$4",px:"$5",gap:"$3",[`& ${d}`]:{size:20}},lg:{fontSize:"$lg",lineHeight:1.5,height:"$5",px:"$5",gap:"$3",[`& ${d}`]:{size:22}},xl:{fontSize:"$lg",lineHeight:1.5,height:"$6",px:"$5",gap:"$3",[`& ${d}`]:{size:22}}},isLoading:{true:{cursor:"not-allowed",opacity:.6,pointerEvents:"none"}},fullWidth:{true:{width:"100%"},false:{width:"max-content"}}},compoundVariants:[n("primary","$primary800","$primary900","$primary1000"),n("secondary","$primary1000","$primary1100","$primary1200"),n("success","$success","$successMid","$successDark"),n("warning","$warning","$warningMid","$warningDark","$grey900"),n("danger","$danger","$dangerMid","$dangerDark"),n("neutral","white",s("white",-.1),s("white",-.25),"$primary800"),p("primary","$primary800","$primary900","$primary1000"),p("secondary","$primary1000","$primary1100","$primary1200"),p("neutral","white",s("white",-.2),s("white",-.35))],defaultVariants:{appearance:"solid",size:"md",theme:"primary"}}),f=c("span",{alignItems:"center",display:"flex",justifyContent:"center",visibility:"hidden",variants:{size:{sm:{gap:"$2"},md:{gap:"$3"},lg:{gap:"$3"},xl:{gap:"$3"}}},defaultVariants:{size:"md"}}),b=({size:e,children:r})=>a.createElement(a.Fragment,null,a.createElement(u,{css:{position:"absolute"}}),a.createElement(f,{size:e},r)),g=a.forwardRef(({children:e,as:r,href:i,isLoading:t=!1,onClick:o,...m},h)=>a.createElement($,{as:r||(i?"a":void 0),href:i,isLoading:t,onClick:t?void 0:o,type:i?void 0:"button",...m,...y(i),ref:h},t?a.createElement(b,{size:m.size},e):e));g.displayName="Button";export{g as Button,$ as StyledButton};
+import{opacify as s}from"color2k";import*as a from"react";import{StyledIcon as d}from"../icon/Icon.js";import{Loader as u}from"../loader/Loader.js";import{styled as c}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"../../utilities/style/keyframe-animations.js";import{disabledStyle as l}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as y}from"../../utilities/uri/index.js";const p=(e,r,i,t)=>({theme:e,appearance:"outline",css:{border:"1px solid",borderColor:"currentColor",color:r,"&[disabled]":l,"&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:i},"&:not([disabled]):active":{color:t}}}),n=(e,r,i,t,o="white")=>({theme:e,appearance:"solid",css:{bg:r,color:o,"&[disabled]":l,"&:not([disabled]):hover, &:not([disabled]):focus":{bg:i,color:o},"&:not([disabled]):active":{bg:t}}}),$=c("button",{alignItems:"center",bg:"unset",border:"unset",borderRadius:"$1",cursor:"pointer",display:"flex",fontFamily:"$body",fontWeight:600,justifyContent:"center",p:"unset",textDecoration:"none",transition:"all 100ms ease-out",whiteSpace:"nowrap",width:"max-content","&[disabled]":l,variants:{theme:{primary:{},secondary:{},success:{},warning:{},danger:{},neutral:{}},appearance:{solid:{},outline:{}},size:{sm:{fontSize:"$sm",lineHeight:1.53,height:"$3",px:"$4",gap:"$2",[`& ${d}`]:{size:16}},md:{fontSize:"$md",lineHeight:1.5,height:"$4",px:"$5",gap:"$3",[`& ${d}`]:{size:20}},lg:{fontSize:"$lg",lineHeight:1.5,height:"$5",px:"$5",gap:"$3",[`& ${d}`]:{size:22}},xl:{fontSize:"$lg",lineHeight:1.5,height:"$6",px:"$5",gap:"$3",[`& ${d}`]:{size:22}}},isLoading:{true:{cursor:"not-allowed",opacity:.6,pointerEvents:"none"}},fullWidth:{true:{width:"100%"},false:{width:"max-content"}}},compoundVariants:[n("primary","$primary800","$primary900","$primary1000"),n("secondary","$primary1000","$primary1100","$primary1200"),n("success","$success","$successMid","$successDark"),n("warning","$warning","$warningMid","$warningDark","$grey900"),n("danger","$danger","$dangerMid","$dangerDark"),n("neutral","white",s("white",-.1),s("white",-.25),"$primary800"),p("primary","$primary800","$primary900","$primary1000"),p("secondary","$primary1000","$primary1100","$primary1200"),p("neutral","white",s("white",-.2),s("white",-.35))],defaultVariants:{appearance:"solid",size:"md",theme:"primary"}}),f=c("span",{alignItems:"center",display:"flex",justifyContent:"center",visibility:"hidden",variants:{size:{sm:{gap:"$2"},md:{gap:"$3"},lg:{gap:"$3"},xl:{gap:"$3"}}},defaultVariants:{size:"md"}}),b=({size:e,children:r})=>a.createElement(a.Fragment,null,a.createElement(u,{css:{position:"absolute"}}),a.createElement(f,{size:e},r)),g=a.forwardRef(({children:e,as:r,href:i,isLoading:t=!1,onClick:o,...m},h)=>a.createElement($,{as:r||(i?"a":void 0),href:i,isLoading:t,onClick:t?void 0:o,type:i?void 0:"button",...m,...y(i),ref:h},t?a.createElement(b,{size:m.size},e):e));g.displayName="Button";export{g as Button,$ as StyledButton};
 //# sourceMappingURL=Button.js.map

package/dist/components/button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import type { VariantProps } from '@atom-learning/stitches-react'\nimport { opacify } from 'color2k'\nimport * as React from 'react'\n\nimport { StyledIcon } from '~/components/icon'\nimport { Loader } from '~/components/loader'\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nconst getButtonOutlineVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'outline',\n css: {\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&[disabled]': disabledStyle,\n '&:not([disabled]):hover, &:not([disabled]):focus': {\n textDecoration: 'none',\n color: interact\n },\n '&:not([disabled]):active': { color: active }\n }\n})\n\nconst getButtonSolidVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string,\n text = 'white'\n) => ({\n theme,\n appearance: 'solid',\n css: {\n bg: base,\n color: text,\n '&[disabled]': disabledStyle,\n '&:not([disabled]):hover, &:not([disabled]):focus': {\n bg: interact,\n color: text\n },\n '&:not([disabled]):active': { bg: active }\n }\n})\n\nexport const StyledButton = styled('button', {\n alignItems: 'center',\n bg: 'unset',\n border: 'unset',\n borderRadius: '$0',\n cursor: 'pointer',\n display: 'flex',\n fontFamily: '$body',\n fontWeight: 600,\n justifyContent: 'center',\n p: 'unset',\n textDecoration: 'none',\n transition: 'all 100ms ease-out',\n whiteSpace: 'nowrap',\n width: 'max-content',\n '&[disabled]': disabledStyle,\n variants: {\n theme: {\n primary: {},\n secondary: {},\n success: {},\n warning: {},\n danger: {},\n neutral: {}\n },\n appearance: {\n solid: {},\n outline: {}\n },\n size: {\n sm: {\n fontSize: '$sm',\n lineHeight: 1.53,\n height: '$3',\n px: '$4',\n gap: '$2',\n [`& ${StyledIcon}`]: { size: 16 }\n },\n md: {\n fontSize: '$md',\n lineHeight: 1.5,\n height: '$4',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 20 }\n },\n lg: {\n fontSize: '$lg',\n lineHeight: 1.5,\n height: '$5',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 22 }\n },\n xl: {\n fontSize: '$lg',\n lineHeight: 1.5,\n height: '$6',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 22 }\n }\n },\n isLoading: {\n true: {\n cursor: 'not-allowed',\n opacity: 0.6,\n pointerEvents: 'none'\n }\n },\n fullWidth: {\n true: { width: '100%' },\n false: { width: 'max-content' }\n }\n },\n\n // prettier-ignore\n compoundVariants: [\n getButtonSolidVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getButtonSolidVariant('secondary', '$primary1000', '$primary1100', '$primary1200'),\n getButtonSolidVariant('success', '$success', '$successMid', '$successDark'),\n getButtonSolidVariant('warning', '$warning', '$warningMid', '$warningDark', '$grey900'),\n getButtonSolidVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n getButtonSolidVariant('neutral', 'white', opacify('white', -0.1), opacify('white', -0.25), '$primary800'),\n getButtonOutlineVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getButtonOutlineVariant('secondary', '$primary1000', '$primary1100', '$primary1200'),\n getButtonOutlineVariant('neutral', 'white', opacify('white', -0.2), opacify('white', -0.35))\n ],\n\n defaultVariants: {\n appearance: 'solid',\n size: 'md',\n theme: 'primary'\n }\n})\n\nconst LoaderContentsWrapper = styled('span', {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'center',\n visibility: 'hidden',\n variants: {\n size: {\n sm: { gap: '$2' },\n md: { gap: '$3' },\n lg: { gap: '$3' },\n xl: { gap: '$3' }\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nconst WithLoader = ({\n size,\n children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n <>\n <Loader css={{ position: 'absolute' }} />\n <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n </>\n)\n\ntype ButtonProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: React.ComponentType \| React.ElementType\n children: React.ReactNode\n href?: string\n isLoading?: boolean\n } & NavigatorActions\n>\n\nexport const Button: React.ForwardRefExoticComponent<ButtonProps> =\n React.forwardRef(\n ({ children, as, href, isLoading = false, onClick, ...rest }, ref) => (\n <StyledButton\n as={as \|\| (href ? 'a' : undefined)}\n href={href}\n isLoading={isLoading}\n onClick={!isLoading ? onClick : undefined}\n type={!href ? 'button' : undefined}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref}\n >\n {isLoading ? (\n <WithLoader size={rest.size}>{children}</WithLoader>\n ) : (\n children\n )}\n </StyledButton>\n )\n )\n\nButton.displayName = 'Button'\n"],"names":["getButtonOutlineVariant","theme","base","interact","active","disabledStyle","getButtonSolidVariant","text","StyledButton","styled","StyledIcon","opacify","LoaderContentsWrapper","WithLoader","size","children","React","Loader","Button","as","href","isLoading","onClick","rest","ref","getExternalAnchorProps"],"mappings":"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"}
1	+ {"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import type { VariantProps } from '@atom-learning/stitches-react'\nimport { opacify } from 'color2k'\nimport * as React from 'react'\n\nimport { StyledIcon } from '~/components/icon'\nimport { Loader } from '~/components/loader'\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nconst getButtonOutlineVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string\n) => ({\n theme,\n appearance: 'outline',\n css: {\n border: '1px solid',\n borderColor: 'currentColor',\n color: base,\n '&[disabled]': disabledStyle,\n '&:not([disabled]):hover, &:not([disabled]):focus': {\n textDecoration: 'none',\n color: interact\n },\n '&:not([disabled]):active': { color: active }\n }\n})\n\nconst getButtonSolidVariant = (\n theme: string,\n base: string,\n interact: string,\n active: string,\n text = 'white'\n) => ({\n theme,\n appearance: 'solid',\n css: {\n bg: base,\n color: text,\n '&[disabled]': disabledStyle,\n '&:not([disabled]):hover, &:not([disabled]):focus': {\n bg: interact,\n color: text\n },\n '&:not([disabled]):active': { bg: active }\n }\n})\n\nexport const StyledButton = styled('button', {\n alignItems: 'center',\n bg: 'unset',\n border: 'unset',\n borderRadius: '$1',\n cursor: 'pointer',\n display: 'flex',\n fontFamily: '$body',\n fontWeight: 600,\n justifyContent: 'center',\n p: 'unset',\n textDecoration: 'none',\n transition: 'all 100ms ease-out',\n whiteSpace: 'nowrap',\n width: 'max-content',\n '&[disabled]': disabledStyle,\n variants: {\n theme: {\n primary: {},\n secondary: {},\n success: {},\n warning: {},\n danger: {},\n neutral: {}\n },\n appearance: {\n solid: {},\n outline: {}\n },\n size: {\n sm: {\n fontSize: '$sm',\n lineHeight: 1.53,\n height: '$3',\n px: '$4',\n gap: '$2',\n [`& ${StyledIcon}`]: { size: 16 }\n },\n md: {\n fontSize: '$md',\n lineHeight: 1.5,\n height: '$4',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 20 }\n },\n lg: {\n fontSize: '$lg',\n lineHeight: 1.5,\n height: '$5',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 22 }\n },\n xl: {\n fontSize: '$lg',\n lineHeight: 1.5,\n height: '$6',\n px: '$5',\n gap: '$3',\n [`& ${StyledIcon}`]: { size: 22 }\n }\n },\n isLoading: {\n true: {\n cursor: 'not-allowed',\n opacity: 0.6,\n pointerEvents: 'none'\n }\n },\n fullWidth: {\n true: { width: '100%' },\n false: { width: 'max-content' }\n }\n },\n\n // prettier-ignore\n compoundVariants: [\n getButtonSolidVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getButtonSolidVariant('secondary', '$primary1000', '$primary1100', '$primary1200'),\n getButtonSolidVariant('success', '$success', '$successMid', '$successDark'),\n getButtonSolidVariant('warning', '$warning', '$warningMid', '$warningDark', '$grey900'),\n getButtonSolidVariant('danger', '$danger', '$dangerMid', '$dangerDark'),\n getButtonSolidVariant('neutral', 'white', opacify('white', -0.1), opacify('white', -0.25), '$primary800'),\n getButtonOutlineVariant('primary', '$primary800', '$primary900', '$primary1000'),\n getButtonOutlineVariant('secondary', '$primary1000', '$primary1100', '$primary1200'),\n getButtonOutlineVariant('neutral', 'white', opacify('white', -0.2), opacify('white', -0.35))\n ],\n\n defaultVariants: {\n appearance: 'solid',\n size: 'md',\n theme: 'primary'\n }\n})\n\nconst LoaderContentsWrapper = styled('span', {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'center',\n visibility: 'hidden',\n variants: {\n size: {\n sm: { gap: '$2' },\n md: { gap: '$3' },\n lg: { gap: '$3' },\n xl: { gap: '$3' }\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nconst WithLoader = ({\n size,\n children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n <>\n <Loader css={{ position: 'absolute' }} />\n <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n </>\n)\n\ntype ButtonProps = Override<\n React.ComponentProps<typeof StyledButton>,\n VariantProps<typeof StyledButton> & {\n as?: React.ComponentType \| React.ElementType\n children: React.ReactNode\n href?: string\n isLoading?: boolean\n } & NavigatorActions\n>\n\nexport const Button: React.ForwardRefExoticComponent<ButtonProps> =\n React.forwardRef(\n ({ children, as, href, isLoading = false, onClick, ...rest }, ref) => (\n <StyledButton\n as={as \|\| (href ? 'a' : undefined)}\n href={href}\n isLoading={isLoading}\n onClick={!isLoading ? onClick : undefined}\n type={!href ? 'button' : undefined}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref}\n >\n {isLoading ? (\n <WithLoader size={rest.size}>{children}</WithLoader>\n ) : (\n children\n )}\n </StyledButton>\n )\n )\n\nButton.displayName = 'Button'\n"],"names":["getButtonOutlineVariant","theme","base","interact","active","disabledStyle","getButtonSolidVariant","text","StyledButton","styled","StyledIcon","opacify","LoaderContentsWrapper","WithLoader","size","children","React","Loader","Button","as","href","isLoading","onClick","rest","ref","getExternalAnchorProps"],"mappings":"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"}

package/dist/components/checkbox-field/CheckboxField.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as t from"react";import{useFormContext as F,useController as x}from"react-hook-form";import{Checkbox as b}from"../checkbox/Checkbox.js";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as v}from"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as E}from"../form/useFieldError.js";var g=(e=>(e.ON="on",e.OFF="off",e))(g||{});const m=({css:e,label:f,name:l,validation:r,description:s,defaultChecked:u=!1,checked:o,onCheckedChange:n,...p})=>{const{control:h}=F(),{error:a}=E(l),{field:{ref:C,onChange:i,value:c,name:k}}=x({name:l,control:h,rules:r,defaultValue:u});return t.useEffect(()=>{typeof o<"u"&&i(o)},[o]),t.createElement(v,{css:e,description:s,error:a,label:f,required:Boolean(r==null?void 0:r.required)},t.createElement(b,{ref:C,name:k,...p,onCheckedChange:d=>{i(d),n==null||n(d)},value:c?"on":"off",checked:c,...a&&{state:"error"}}))};m.displayName="CheckboxField";export{m as CheckboxField};
+import*as t from"react";import{useFormContext as F,useController as x}from"react-hook-form";import{Checkbox as b}from"../checkbox/Checkbox.js";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as v}from"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as E}from"../form/useFieldError.js";import"../form/useFormCustomContext.js";var g=(e=>(e.ON="on",e.OFF="off",e))(g||{});const m=({css:e,label:f,name:l,validation:r,description:s,defaultChecked:u=!1,checked:o,onCheckedChange:n,...p})=>{const{control:h}=F(),{error:a}=E(l),{field:{ref:C,onChange:i,value:c,name:k}}=x({name:l,control:h,rules:r,defaultValue:u});return t.useEffect(()=>{typeof o<"u"&&i(o)},[o]),t.createElement(v,{css:e,description:s,error:a,label:f,required:Boolean(r==null?void 0:r.required)},t.createElement(b,{ref:C,name:k,...p,onCheckedChange:d=>{i(d),n==null||n(d)},value:c?"on":"off",checked:c,...a&&{state:"error"}}))};m.displayName="CheckboxField";export{m as CheckboxField};
 //# sourceMappingURL=CheckboxField.js.map

package/dist/components/checkbox-field/CheckboxField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckboxField.js","sources":["../../../src/components/checkbox-field/CheckboxField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { Checkbox } from '~/components/checkbox'\nimport {\n FieldElementWrapperProps,\n InlineFieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\n\nenum CheckboxValue {\n ON = 'on',\n OFF = 'off'\n}\n\nexport const CheckboxField = ({\n css,\n label,\n name,\n validation,\n description,\n defaultChecked = false,\n checked,\n onCheckedChange,\n ...remainingProps\n}: React.ComponentProps<typeof Checkbox> & FieldElementWrapperProps) => {\n const { control } = useFormContext()\n const { error } = useFieldError(name)\n const {\n field: { ref, onChange, value: innerChecked, name: innerName }\n } = useController({\n name,\n control,\n rules: validation,\n defaultValue: defaultChecked\n })\n\n React.useEffect(() => {\n // Update the react-hook-form inner checked to match what is passed in.\n if (typeof checked !== 'undefined') onChange(checked)\n }, [checked])\n\n return (\n <InlineFieldWrapper\n css={css}\n description={description}\n error={error}\n label={label}\n required={Boolean(validation?.required)}\n >\n <Checkbox\n ref={ref}\n name={innerName}\n {...remainingProps}\n onCheckedChange={(newChecked) => {\n onChange(newChecked)\n onCheckedChange?.(newChecked)\n }}\n value={innerChecked ? CheckboxValue.ON : CheckboxValue.OFF}\n checked={innerChecked}\n {...(error && { state: 'error' })}\n />\n </InlineFieldWrapper>\n )\n}\n\nCheckboxField.displayName = 'CheckboxField'\n"],"names":["CheckboxValue","CheckboxField","css","label","name","validation","description","defaultChecked","checked","onCheckedChange","remainingProps","control","useFormContext","error","useFieldError","ref","onChange","innerChecked","innerName","useController","React","InlineFieldWrapper","Checkbox","newChecked"],"mappings":"~~qVAUA~~,IAAKA,OACHA,EAAA,GAAK,KACLA,EAAA,IAAM,MAFHA,IAAAA,GAAA,CAKE,CAAA,EAAA,MAAMC,EAAgB,CAAC,CAC5B,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,YAAAC,EACA,eAAAC,EAAiB,GACjB,QAAAC,EACA,gBAAAC,KACGC,CACL,IAAwE,CACtE,KAAM,CAAE,QAAAC,CAAQ,EAAIC,EAAe,EAC7B,CAAE,MAAAC,CAAM,EAAIC,EAAcV,CAAI,EAC9B,CACJ,MAAO,CAAE,IAAAW,EAAK,SAAAC,EAAU,MAAOC,EAAc,KAAMC,CAAU,CAC/D,EAAIC,EAAc,CAChB,KAAAf,EACA,QAAAO,EACA,MAAON,EACP,aAAcE,CAChB,CAAC,EAED,OAAAa,EAAM,UAAU,IAAM,CAEhB,OAAOZ,EAAY,KAAaQ,EAASR,CAAO,CACtD,EAAG,CAACA,CAAO,CAAC,EAGVY,EAAA,cAACC,EAAA,CACC,IAAKnB,EACL,YAAaI,EACb,MAAOO,EACP,MAAOV,EACP,SAAU,QAAQE,GAAA,KAAAA,OAAAA,EAAY,QAAQ,CAEtCe,EAAAA,EAAA,cAACE,EAAA,CACC,IAAKP,EACL,KAAMG,EACL,GAAGR,EACJ,gBAAkBa,GAAe,CAC/BP,EAASO,CAAU,EACnBd,GAAA,MAAAA,EAAkBc,EACpB,EACA,MAAON,EAAe,KAAmB,MACzC,QAASA,EACR,GAAIJ,GAAS,CAAE,MAAO,OAAQ,CAAA,CACjC,CACF,CAEJ,EAEAZ,EAAc,YAAc"}
1	+ {"version":3,"file":"CheckboxField.js","sources":["../../../src/components/checkbox-field/CheckboxField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { Checkbox } from '~/components/checkbox'\nimport {\n FieldElementWrapperProps,\n InlineFieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\n\nenum CheckboxValue {\n ON = 'on',\n OFF = 'off'\n}\n\nexport const CheckboxField = ({\n css,\n label,\n name,\n validation,\n description,\n defaultChecked = false,\n checked,\n onCheckedChange,\n ...remainingProps\n}: React.ComponentProps<typeof Checkbox> & FieldElementWrapperProps) => {\n const { control } = useFormContext()\n const { error } = useFieldError(name)\n const {\n field: { ref, onChange, value: innerChecked, name: innerName }\n } = useController({\n name,\n control,\n rules: validation,\n defaultValue: defaultChecked\n })\n\n React.useEffect(() => {\n // Update the react-hook-form inner checked to match what is passed in.\n if (typeof checked !== 'undefined') onChange(checked)\n }, [checked])\n\n return (\n <InlineFieldWrapper\n css={css}\n description={description}\n error={error}\n label={label}\n required={Boolean(validation?.required)}\n >\n <Checkbox\n ref={ref}\n name={innerName}\n {...remainingProps}\n onCheckedChange={(newChecked) => {\n onChange(newChecked)\n onCheckedChange?.(newChecked)\n }}\n value={innerChecked ? CheckboxValue.ON : CheckboxValue.OFF}\n checked={innerChecked}\n {...(error && { state: 'error' })}\n />\n </InlineFieldWrapper>\n )\n}\n\nCheckboxField.displayName = 'CheckboxField'\n"],"names":["CheckboxValue","CheckboxField","css","label","name","validation","description","defaultChecked","checked","onCheckedChange","remainingProps","control","useFormContext","error","useFieldError","ref","onChange","innerChecked","innerName","useController","React","InlineFieldWrapper","Checkbox","newChecked"],"mappings":"6XAUA,IAAKA,OACHA,EAAA,GAAK,KACLA,EAAA,IAAM,MAFHA,IAAAA,GAAA,CAKE,CAAA,EAAA,MAAMC,EAAgB,CAAC,CAC5B,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,YAAAC,EACA,eAAAC,EAAiB,GACjB,QAAAC,EACA,gBAAAC,KACGC,CACL,IAAwE,CACtE,KAAM,CAAE,QAAAC,CAAQ,EAAIC,EAAe,EAC7B,CAAE,MAAAC,CAAM,EAAIC,EAAcV,CAAI,EAC9B,CACJ,MAAO,CAAE,IAAAW,EAAK,SAAAC,EAAU,MAAOC,EAAc,KAAMC,CAAU,CAC/D,EAAIC,EAAc,CAChB,KAAAf,EACA,QAAAO,EACA,MAAON,EACP,aAAcE,CAChB,CAAC,EAED,OAAAa,EAAM,UAAU,IAAM,CAEhB,OAAOZ,EAAY,KAAaQ,EAASR,CAAO,CACtD,EAAG,CAACA,CAAO,CAAC,EAGVY,EAAA,cAACC,EAAA,CACC,IAAKnB,EACL,YAAaI,EACb,MAAOO,EACP,MAAOV,EACP,SAAU,QAAQE,GAAA,KAAAA,OAAAA,EAAY,QAAQ,CAEtCe,EAAAA,EAAA,cAACE,EAAA,CACC,IAAKP,EACL,KAAMG,EACL,GAAGR,EACJ,gBAAkBa,GAAe,CAC/BP,EAASO,CAAU,EACnBd,GAAA,MAAAA,EAAkBc,EACpB,EACA,MAAON,EAAe,KAAmB,MACzC,QAASA,EACR,GAAIJ,GAAS,CAAE,MAAO,OAAQ,CAAA,CACjC,CACF,CAEJ,EAEAZ,EAAc,YAAc"}

package/dist/components/checkbox-group/CheckboxGroup.d.ts CHANGED Viewed

@@ -768,7 +768,6 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         title?: string | undefined;
         ref?: React.Ref<HTMLButtonElement> | undefined;
         key?: React.Key | null | undefined;
-        name?: string | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
         suppressContentEditableWarning?: boolean | undefined;
         suppressHydrationWarning?: boolean | undefined;
@@ -1022,6 +1021,7 @@ export declare const CheckboxGroup: (({ checked, defaultChecked, onCheckedChange
         onAnimationIterationCapture?: React.AnimationEventHandler<HTMLButtonElement> | undefined;
         onTransitionEnd?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
         onTransitionEndCapture?: React.TransitionEventHandler<HTMLButtonElement> | undefined;
+        name?: string | undefined;
         type?: "submit" | "reset" | "button" | undefined;
         disabled?: boolean | undefined;
         formAction?: string | undefined;

package/dist/components/checkbox-tree/CheckboxTree.d.ts CHANGED Viewed

@@ -1718,7 +1718,6 @@ export declare const CheckboxTree: (({ checked, defaultChecked, onCheckedChange,
         title?: string | undefined;
         ref?: ((((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement>) & (((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement>)) | null | undefined;
         key?: React.Key | null | undefined;
-        name?: string | undefined;
         defaultChecked?: boolean | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
         suppressContentEditableWarning?: boolean | undefined;
@@ -1973,6 +1972,7 @@ export declare const CheckboxTree: (({ checked, defaultChecked, onCheckedChange,
         onAnimationIterationCapture?: (React.AnimationEventHandler<HTMLDivElement> & React.AnimationEventHandler<HTMLButtonElement>) | undefined;
         onTransitionEnd?: (React.TransitionEventHandler<HTMLDivElement> & React.TransitionEventHandler<HTMLButtonElement>) | undefined;
         onTransitionEndCapture?: (React.TransitionEventHandler<HTMLDivElement> & React.TransitionEventHandler<HTMLButtonElement>) | undefined;
+        name?: string | undefined;
         type?: "submit" | "reset" | "button" | undefined;
         disabled?: boolean | undefined;
         formAction?: string | undefined;
@@ -2439,7 +2439,6 @@ export declare const CheckboxTree: (({ checked, defaultChecked, onCheckedChange,
         title?: string | undefined;
         ref?: ((((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement>) & (((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement>)) | null | undefined;
         key?: React.Key | null | undefined;
-        name?: string | undefined;
         defaultChecked?: boolean | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
         suppressContentEditableWarning?: boolean | undefined;
@@ -2694,6 +2693,7 @@ export declare const CheckboxTree: (({ checked, defaultChecked, onCheckedChange,
         onAnimationIterationCapture?: (React.AnimationEventHandler<HTMLDivElement> & React.AnimationEventHandler<HTMLButtonElement>) | undefined;
         onTransitionEnd?: (React.TransitionEventHandler<HTMLDivElement> & React.TransitionEventHandler<HTMLButtonElement>) | undefined;
         onTransitionEndCapture?: (React.TransitionEventHandler<HTMLDivElement> & React.TransitionEventHandler<HTMLButtonElement>) | undefined;
+        name?: string | undefined;
         type?: "submit" | "reset" | "button" | undefined;
         disabled?: boolean | undefined;
         formAction?: string | undefined;

package/dist/components/create-password-field/CreatePasswordField.d.ts CHANGED Viewed

@@ -12,7 +12,7 @@ type CreatePasswordFieldProps = Override<React.ComponentProps<typeof PasswordInp
     messageDirection?: CSS['flexDirection'];
 }>;
 export declare const CreatePasswordField: {
-    ({ validate, defaultValidation, messageDirection, label, name, css, validation, ...remainingProps }: CreatePasswordFieldProps): React.JSX.Element;
+    ({ validate, defaultValidation, messageDirection, label, name, css, validation, appearance, ...remainingProps }: CreatePasswordFieldProps): React.JSX.Element;
     displayName: string;
 };
 export {};

package/dist/components/create-password-field/CreatePasswordField.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import j from"invariant";import*as a from"react";import{useFormContext as E}from"react-hook-form";import{throttle as k}from"throttle-debounce";import{Box as P}from"../box/Box.js";import{Flex as S}from"../flex/Flex.js";import{InlineMessage as B}from"../inline-message/InlineMessage.js";import{PasswordField as D}from"../password-field/PasswordField.js";const c=({validate:d,defaultValidation:u,messageDirection:p="row",label:f="Create a password",name:r="password",css:v,validation:b,...w})=>{var s;const{formState:l}=E(),[i,n]=a.useState(!1),[C,m]=a.useState(u),g=l.touched[r],F=((s=l.errors[r])==null?void 0:s.type)==="validate",o=a.useCallback(async e=>{const t=await d(e);return t?(j(typeof t=="object","The validate function must return an object"),m(t),Object.values(t).every(h=>h)):!1},[m]),x=a.useCallback(k(500,o),[o]),y=(e,t)=>e?"success":t?"neutral":"error";return a.createElement(P,{css:v},a.createElement(D,{label:f,name:r,onChange:e=>x(e.target.value),onBlur:()=>n(!1),onFocus:()=>n(!0),validation:{...b,validate:o},...w}),(g||i||F)&&a.createElement(S,{css:{mt:"$2",gap:"$2",flexWrap:"wrap",flexDirection:p}},Object.entries(C).map(([e,t])=>a.createElement(B,{key:e,theme:y(t,i)},e))))};c.displayName="CreatePasswordField";export{c as CreatePasswordField};
+import E from"invariant";import*as a from"react";import{useFormContext as k}from"react-hook-form";import{throttle as B}from"throttle-debounce";import{Box as P}from"../box/Box.js";import{Flex as D}from"../flex/Flex.js";import{InlineMessage as I}from"../inline-message/InlineMessage.js";import{PasswordField as M}from"../password-field/PasswordField.js";const p=({validate:u,defaultValidation:f,messageDirection:v="row",label:b="Create a password",name:r="password",css:w,validation:y,appearance:C,...x})=>{var i;const{formState:o,control:n}=k(),[s,m]=a.useState(!1),[c,d]=a.useState(f),F=o.touched[r],g=((i=o.errors[r])==null?void 0:i.type)==="validate"||Object.values(c).every(e=>!e),l=a.useCallback(async e=>{const t=await u(e);return t?(E(typeof t=="object","The validate function must return an object"),d(t),Object.values(t).every(S=>S)):!1},[d]),h=a.useCallback(B(500,l),[l]),j=(e,t)=>e?"success":t?"neutral":"error",O=n.mode.isOnBlur&&(s||F)||n.mode.isOnSubmit&&(s||o.isSubmitted&&g);return a.createElement(P,{css:w},a.createElement(M,{label:b,name:r,onChange:e=>h(e.target.value),onBlur:()=>m(!1),onFocus:()=>m(!0),validation:{...y,validate:l},appearance:C,...x}),O&&a.createElement(D,{css:{mt:"$2",gap:"$2",flexWrap:"wrap",flexDirection:v}},Object.entries(c).map(([e,t])=>a.createElement(I,{key:e,theme:j(t,s)},e))))};p.displayName="CreatePasswordField";export{p as CreatePasswordField};
 //# sourceMappingURL=CreatePasswordField.js.map

package/dist/components/create-password-field/CreatePasswordField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CreatePasswordField.js","sources":["../../../src/components/create-password-field/CreatePasswordField.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { throttle } from 'throttle-debounce'\n\nimport type { CSS } from '~/stitches'\nimport { Override } from '~/utilities'\n\nimport { Box } from '../box'\nimport { FieldElementWrapperProps } from '../field-wrapper'\nimport { Flex } from '../flex'\nimport { InlineMessage } from '../inline-message'\nimport { PasswordField } from '../password-field'\nimport { PasswordInput } from '../password-input'\n\ntype ValidationResult = Record<string, boolean>\n\ntype CreatePasswordFieldProps = Override<\n React.ComponentProps<typeof PasswordInput> & FieldElementWrapperProps,\n {\n label?: string\n name?: string\n validate: (\n password: string\n ) => Promise<ValidationResult \| undefined> \| ValidationResult\n defaultValidation: ValidationResult\n messageDirection?: CSS['flexDirection']\n }\n>\n\nexport const CreatePasswordField = ({\n validate,\n defaultValidation,\n messageDirection = 'row',\n label = 'Create a password',\n name = 'password',\n css,\n validation,\n ...remainingProps\n}: CreatePasswordFieldProps) => {\n const { formState } = useFormContext()\n const [isFocused, setIsFocused] = React.useState<boolean>(false)\n const [validationResult, setValidationResult] =\n React.useState<ValidationResult>(defaultValidation)\n\n const touched = formState.touched[name]\n const error = formState.errors[name]?.type === 'validate'\n\n const validatePassword = React.useCallback(\n async (password: string) => {\n const result = await validate(password)\n\n if (result) {\n invariant(\n typeof result === 'object',\n 'The validate function must return an object'\n )\n\n setValidationResult(result)\n return Object.values(result).every((isValid) => isValid)\n }\n\n return false\n },\n [setValidationResult]\n )\n\n const handleChange = React.useCallback(throttle(500, validatePassword), [\n validatePassword\n ])\n\n const getMessageTheme = (result: boolean, isFocused: boolean) => {\n if (result) return 'success'\n\n return isFocused ? 'neutral' : 'error'\n }\n\n return (\n <Box css={css}>\n <PasswordField\n label={label}\n name={name}\n onChange={(e) => handleChange(e.target.value)}\n onBlur={() => setIsFocused(false)}\n onFocus={() => setIsFocused(true)}\n validation={{ ...validation, validate: validatePassword }}\n {...remainingProps}\n />\n {~~(touched~~ ~~\|\| isFocused \|\| error)~~ && (\n <Flex\n css={{\n mt: '$2',\n gap: '$2',\n flexWrap: 'wrap',\n flexDirection: messageDirection\n }}\n >\n {Object.entries(validationResult).map(([message, result]) => (\n <InlineMessage\n key={message}\n theme={getMessageTheme(result, isFocused)}\n >\n {message}\n </InlineMessage>\n ))}\n </Flex>\n )}\n </Box>\n )\n}\n\nCreatePasswordField.displayName = 'CreatePasswordField'\n"],"names":["CreatePasswordField","validate","defaultValidation","messageDirection","label","name","css","validation","remainingProps","_a","formState","useFormContext","isFocused","setIsFocused","React","validationResult","setValidationResult","touched","error","validatePassword","password","result","invariant","~~isValid","~~handleChange","throttle","getMessageTheme","Box","PasswordField","Flex","message","InlineMessage"],"mappings":"gWA8Ba,MAAAA,EAAsB,CAAC,CAClC,SAAAC,EACA,kBAAAC,EACA,iBAAAC,EAAmB,MACnB,MAAAC,EAAQ,oBACR,KAAAC,EAAO,WACP,IAAAC,EACA,WAAAC,KACGC,CACL,IAAgC,~~CAvChC~~,IAAAC,~~EAwCE~~,KAAM,CAAE,UAAAC,~~CAAU~~,EAAIC,~~EAAAA~~,~~EAChB~~,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzD,CAACC,EAAkBC,CAAmB,EAC1CF,EAAM,~~SAA2BZ~~,CAAiB,~~EAE9Ce~~,~~EAAUP~~,EAAU,~~QAAQL~~,~~GAC5Ba~~,~~IAAQT~~,EAAAC,EAAU,~~OAAOL~~,KAAjB,KAAA,~~OAAAI~~,EAAwB,QAAS,~~WAEzCU~~,~~EAAmBL~~,EAAM,YAC7B,~~MAAOM~~,GAAqB,CAC1B,MAAMC,EAAS,~~MAAMpB~~,~~EAASmB~~,CAAQ,EAEtC,OAAIC,GACFC,EACE,OAAOD,GAAW,SAClB,6CACF,~~EAEAL~~,~~EAAoBK~~,CAAM,EACnB,OAAO,OAAOA,CAAM,EAAE,~~MAAOE~~,GAAYA,CAAO,GAGlD,EACT,EACA,~~CAACP~~,CAAmB,CACtB,EAEMQ,EAAeV,EAAM,YAAYW,EAAS,~~IAAKN~~,CAAgB,EAAG,CACtEA,CACF,CAAC,~~EAEKO~~,EAAkB,~~CAACL~~,~~EAAiBT~~,~~IACpCS~~,EAAe,~~UAEZT~~,EAAY,UAAY,~~QAGjC~~,~~OACEE~~,EAAA,~~cAACa~~,EAAA,CAAI,~~IAAKrB~~,~~CAAAA~~,~~EACRQ~~,EAAA,~~cAACc~~,EAAA,CACC,~~MAAOxB~~,EACP,KAAMC,EACN,SAAW,~~GAAMmB~~,EAAa,EAAE,OAAO,KAAK,EAC5C,OAAQ,IAAMX,EAAa,EAAK,EAChC,QAAS,IAAMA,EAAa,EAAI,EAChC,WAAY,CAAE,~~GAAGN~~,EAAY,~~SAAUY~~,CAAiB,~~EACvD~~,~~GAAGX~~,CAAAA,CACN,~~GACES~~,~~GAAWL~~,~~GAAaM,IACxBJ,~~EAAA,~~cAACe~~,EAAA,CACC,IAAK,CACH,GAAI,KACJ,IAAK,KACL,SAAU,OACV,~~cAAe1B~~,CACjB,CAAA,EAEC,OAAO,~~QAAQY~~,CAAgB,EAAE,IAAI,CAAC,~~CAACe~~,EAAST,CAAM,~~IACrDP~~,EAAA,~~cAACiB~~,EAAA,CACC,IAAKD,EACL,~~MAAOJ~~,~~EAAgBL~~,~~EAAQT~~,CAAS,~~CAEvCkB~~,~~EAAAA~~,CACH,CACD,CACH,CAEJ,CAEJ,~~EAEA9B~~,EAAoB,YAAc"}
1	+ {"version":3,"file":"CreatePasswordField.js","sources":["../../../src/components/create-password-field/CreatePasswordField.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { throttle } from 'throttle-debounce'\n\nimport type { CSS } from '~/stitches'\nimport { Override } from '~/utilities'\n\nimport { Box } from '../box'\nimport { FieldElementWrapperProps } from '../field-wrapper'\nimport { Flex } from '../flex'\nimport { InlineMessage } from '../inline-message'\nimport { PasswordField } from '../password-field'\nimport { PasswordInput } from '../password-input'\n\ntype ValidationResult = Record<string, boolean>\n\ntype CreatePasswordFieldProps = Override<\n React.ComponentProps<typeof PasswordInput> & FieldElementWrapperProps,\n {\n label?: string\n name?: string\n validate: (\n password: string\n ) => Promise<ValidationResult \| undefined> \| ValidationResult\n defaultValidation: ValidationResult\n messageDirection?: CSS['flexDirection']\n }\n>\n\nexport const CreatePasswordField = ({\n validate,\n defaultValidation,\n messageDirection = 'row',\n label = 'Create a password',\n name = 'password',\n css,\n validation,\n appearance,\n ...remainingProps\n}: CreatePasswordFieldProps) => {\n const { formState, control } = useFormContext()\n const [isFocused, setIsFocused] = React.useState<boolean>(false)\n const [validationResult, setValidationResult] =\n React.useState<ValidationResult>(defaultValidation)\n\n const touched: boolean = formState.touched[name]\n const error =\n formState.errors[name]?.type === 'validate' \|\|\n Object.values(validationResult).every((isValid) => !isValid)\n\n const validatePassword = React.useCallback(\n async (password: string) => {\n const result = await validate(password)\n\n if (result) {\n invariant(\n typeof result === 'object',\n 'The validate function must return an object'\n )\n\n setValidationResult(result)\n return Object.values(result).every((isValid) => isValid)\n }\n\n return false\n },\n [setValidationResult]\n )\n\n const handleChange = React.useCallback(throttle(500, validatePassword), [\n validatePassword\n ])\n\n const getMessageTheme = (result: boolean, isFocused: boolean) => {\n if (result) return 'success'\n\n return isFocused ? 'neutral' : 'error'\n }\n\n const showValidation: boolean =\n (control.mode.isOnBlur && (isFocused \|\| touched)) \|\|\n (control.mode.isOnSubmit && (isFocused \|\| (formState.isSubmitted && error)))\n\n return (\n <Box css={css}>\n <PasswordField\n label={label}\n name={name}\n onChange={(e) => handleChange(e.target.value)}\n onBlur={() => setIsFocused(false)}\n onFocus={() => setIsFocused(true)}\n validation={{ ...validation, validate: validatePassword }}\n appearance={appearance}\n {...remainingProps}\n />\n {showValidation && (\n <Flex\n css={{\n mt: '$2',\n gap: '$2',\n flexWrap: 'wrap',\n flexDirection: messageDirection\n }}\n >\n {Object.entries(validationResult).map(([message, result]) => (\n <InlineMessage\n key={message}\n theme={getMessageTheme(result, isFocused)}\n >\n {message}\n </InlineMessage>\n ))}\n </Flex>\n )}\n </Box>\n )\n}\n\nCreatePasswordField.displayName = 'CreatePasswordField'\n"],"names":["CreatePasswordField","validate","defaultValidation","messageDirection","label","name","css","validation","appearance","remainingProps","_a","formState","control","useFormContext","isFocused","setIsFocused","React","validationResult","setValidationResult","touched","error","isValid","validatePassword","password","result","invariant","handleChange","throttle","getMessageTheme","showValidation","Box","PasswordField","Flex","message","InlineMessage"],"mappings":"gWA8Ba,MAAAA,EAAsB,CAAC,CAClC,SAAAC,EACA,kBAAAC,EACA,iBAAAC,EAAmB,MACnB,MAAAC,EAAQ,oBACR,KAAAC,EAAO,WACP,IAAAC,EACA,WAAAC,EACA,WAAAC,KACGC,CACL,IAAgC,CAxChC,IAAAC,EAyCE,KAAM,CAAE,UAAAC,EAAW,QAAAC,CAAQ,EAAIC,EAAe,EACxC,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzD,CAACC,EAAkBC,CAAmB,EAC1CF,EAAM,SAA2Bd,CAAiB,EAE9CiB,EAAmBR,EAAU,QAAQN,GACrCe,IACJV,EAAAC,EAAU,OAAON,KAAjB,KAAA,OAAAK,EAAwB,QAAS,YACjC,OAAO,OAAOO,CAAgB,EAAE,MAAOI,GAAY,CAACA,CAAO,EAEvDC,EAAmBN,EAAM,YAC7B,MAAOO,GAAqB,CAC1B,MAAMC,EAAS,MAAMvB,EAASsB,CAAQ,EAEtC,OAAIC,GACFC,EACE,OAAOD,GAAW,SAClB,6CACF,EAEAN,EAAoBM,CAAM,EACnB,OAAO,OAAOA,CAAM,EAAE,MAAOH,GAAYA,CAAO,GAGlD,EACT,EACA,CAACH,CAAmB,CACtB,EAEMQ,EAAeV,EAAM,YAAYW,EAAS,IAAKL,CAAgB,EAAG,CACtEA,CACF,CAAC,EAEKM,EAAkB,CAACJ,EAAiBV,IACpCU,EAAe,UAEZV,EAAY,UAAY,QAG3Be,EACHjB,EAAQ,KAAK,WAAaE,GAAaK,IACvCP,EAAQ,KAAK,aAAeE,GAAcH,EAAU,aAAeS,GAEtE,OACEJ,EAAA,cAACc,EAAA,CAAI,IAAKxB,CACRU,EAAAA,EAAA,cAACe,EAAA,CACC,MAAO3B,EACP,KAAMC,EACN,SAAW,GAAMqB,EAAa,EAAE,OAAO,KAAK,EAC5C,OAAQ,IAAMX,EAAa,EAAK,EAChC,QAAS,IAAMA,EAAa,EAAI,EAChC,WAAY,CAAE,GAAGR,EAAY,SAAUe,CAAiB,EACxD,WAAYd,EACX,GAAGC,CAAAA,CACN,EACCoB,GACCb,EAAA,cAACgB,EAAA,CACC,IAAK,CACH,GAAI,KACJ,IAAK,KACL,SAAU,OACV,cAAe7B,CACjB,CAAA,EAEC,OAAO,QAAQc,CAAgB,EAAE,IAAI,CAAC,CAACgB,EAAST,CAAM,IACrDR,EAAA,cAACkB,EAAA,CACC,IAAKD,EACL,MAAOL,EAAgBJ,EAAQV,CAAS,CAAA,EAEvCmB,CACH,CACD,CACH,CAEJ,CAEJ,EAEAjC,EAAoB,YAAc"}

package/dist/components/data-table/DataTable.d.ts CHANGED Viewed

@@ -1939,7 +1939,7 @@ export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defau
         size: import("react").ComponentProps<typeof import("..").Text>["size"];
         type?: "text" | "number" | "email" | "password" | "tel" | "url" | "search";
         as?: never;
-    }, "size" | "state"> & {
+    }, "appearance" | "size" | "state"> & {
         size?: "sm" | "md" | "lg" | "xl" | ({
             "@sm"?: "sm" | "md" | "lg" | "xl" | undefined;
             "@md"?: "sm" | "md" | "lg" | "xl" | undefined;
@@ -1964,6 +1964,18 @@ export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defau
         } & {
             [x: string]: "error" | undefined;
         }) | undefined;
+        appearance?: "standard" | "modern" | ({
+            "@sm"?: "standard" | "modern" | undefined;
+            "@md"?: "standard" | "modern" | undefined;
+            "@lg"?: "standard" | "modern" | undefined;
+            "@xl"?: "standard" | "modern" | undefined;
+            "@reducedMotion"?: "standard" | "modern" | undefined;
+            "@allowMotion"?: "standard" | "modern" | undefined;
+            "@hover"?: "standard" | "modern" | undefined;
+            "@initial"?: "standard" | "modern" | undefined;
+        } & {
+            [x: string]: "standard" | "modern" | undefined;
+        }) | undefined;
     } & {
         size?: "sm" | "md" | "lg";
         css?: import("../..").CSS;

package/dist/components/date-field/DateField.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@ import { DateInputProps } from '../../components/date-input';
 import { FieldElementWrapperProps } from '../../components/field-wrapper';
 type DateFieldProps = DateInputProps & FieldElementWrapperProps;
 export declare const DateField: {
-    ({ css, hideLabel, label, name, validation, prompt, description, ...remainingProps }: DateFieldProps): React.JSX.Element;
+    ({ css, hideLabel, label, name, validation, prompt, description, appearance, ...remainingProps }: DateFieldProps): React.JSX.Element;
     displayName: string;
 };
 export {};

package/dist/components/date-field/DateField.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as i from"react";import{useFormContext as u}from"react-hook-form";import{DateInput as F}from"../date-input/DateInput.js";import{FieldWrapper as b}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as g}from"../form/useFieldError.js";const a=({css:m,hideLabel:l,label:p,name:e,validation:r,prompt:d,description:n,...s})=>{const{register:t,trigger:c}=u(),{error:o}=g(e),f=r?t(r):t;return i.createElement(b,{css:m,description:n,error:o,fieldId:e,hideLabel:l,label:p,prompt:d,required:Boolean(r==null?void 0:r.required)},i.createElement(F,{id:e,name:e,ref:f,...o&&{state:"error"},...s,revalidate:c}))};a.displayName="DateField";export{a as DateField};
+import*as i from"react";import{useFormContext as F}from"react-hook-form";import{DateInput as b}from"../date-input/DateInput.js";import{FieldWrapper as g}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as v}from"../form/useFieldError.js";import"../form/useFormCustomContext.js";const p=({css:m,hideLabel:l,label:d,name:e,validation:r,prompt:n,description:s,appearance:t,...c})=>{const{register:o,trigger:f}=F(),{error:a}=v(e),u=r?o(r):o;return i.createElement(g,{css:m,description:s,error:a,fieldId:e,hideLabel:l,label:d,prompt:n,required:Boolean(r==null?void 0:r.required),appearance:t},i.createElement(b,{id:e,name:e,ref:u,appearance:t,...a&&{state:"error"},...c,revalidate:f}))};p.displayName="DateField";export{p as DateField};
 //# sourceMappingURL=DateField.js.map