@atom-learning/components 3.27.0-beta.3 → 3.27.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/action-icon/ActionIcon.js +1 -1
- package/dist/components/action-icon/ActionIcon.js.map +1 -1
- package/dist/components/banner/banner-regular/BannerRegular.d.ts +1 -0
- package/dist/components/banner/banner-regular/BannerRegularActions.js +1 -1
- package/dist/components/banner/banner-slim/BannerSlim.d.ts +1 -0
- package/dist/components/button/Button.js +1 -1
- package/dist/components/button/Button.js.map +1 -1
- package/dist/components/create-password-field/CreatePasswordField.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenu.d.ts +2 -1
- package/dist/components/dropdown-menu/DropdownMenuLinkItem.d.ts +2 -1
- package/dist/components/dropdown-menu/DropdownMenuLinkItem.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenuLinkItem.js.map +1 -1
- package/dist/components/form/Form.js +1 -1
- package/dist/components/link/Link.js +1 -1
- package/dist/components/link/Link.js.map +1 -1
- package/dist/components/navigation/NavigationMenuLink.js +1 -1
- package/dist/components/navigation/NavigationMenuLink.js.map +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVertical.d.ts +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.d.ts +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js.map +1 -1
- package/dist/components/side-bar/SideBar.d.ts +1 -1
- package/dist/components/side-bar/SideBarComponents.d.ts +1 -1
- package/dist/components/side-bar/SideBarComponents.js +1 -1
- package/dist/components/side-bar/SideBarComponents.js.map +1 -1
- package/dist/components/stepper/Stepper.js +1 -1
- package/dist/components/tile-interactive/TileInteractive.js +1 -1
- package/dist/components/tile-interactive/TileInteractive.js.map +1 -1
- package/dist/components/top-bar/TopBar.d.ts +1 -1
- package/dist/components/top-bar/TopBarBrand.d.ts +1 -1
- package/dist/components/top-bar/TopBarBrand.js +1 -1
- package/dist/components/top-bar/TopBarBrand.js.map +1 -1
- package/dist/context/router/index.d.ts +2 -1
- package/dist/context/router/index.js +1 -1
- package/dist/context/router/index.js.map +1 -1
- package/dist/docgen.json +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/types/navigatorActions.types.d.ts +1 -0
- package/dist/utilities/uri/index.d.ts +1 -0
- package/dist/utilities/uri/index.js +1 -1
- package/dist/utilities/uri/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import g from"invariant";import*as n from"react";import{useRouter as D}from"../../context/router/index.js";import{styled as z}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 M}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as v}from"../../utilities/uri/index.js";import{Icon as c}from"../icon/Icon.js";import{ActionIconSizeMap as x}from"./ActionIcon.constants.js";import{OptionalTooltipWrapper as C}from"../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";const s=(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}}}),E=z("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]":M,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:[s("neutral","$tonal300","$primary900","$primary1000"),s("primary","$primary800","$primary900","$primary1000"),s("primaryDark","$primary1000","$primary1100","$primary1200"),s("success","$success","$successMid","$successDark"),s("warning","$warning","$warningMid","$warningDark"),s("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")]}),l=n.forwardRef(({children:r,theme:a="primary",appearance:i="simple",size:e="sm",label:$,href:d,target:y,disabled:m,hasTooltip:b=!0,tooltipSide:h,...f},w)=>{const{RouterLink:k}=D({href:d,target:y}),u=`A single ${c.displayName} component is permitted as a child of ${l.displayName}`;return g(n.Children.count(r)===1,u),n.createElement(C,{hasTooltip:b,label:$,tooltipSide:h},n.createElement(E,{...d?{as:k,href:m?null:d,target:y,onClick:void 0,"aria-disabled":!!m}:{type:"button"},...v(d),...f,"aria-label":$,theme:a,appearance:i,size:e,ref:w,disabled:m},n.Children.map(r,o=>{if(!n.isValidElement(o))throw new Error(u);return g(o.type===c,`Children of type ${o==null?void 0:o.type} aren't permitted. Only an ${c.displayName} component is allowed in ${l.displayName}`),n.cloneElement(o,{size:x[e],css:{...o.props.css?o.props.css:{}}})})))});l.displayName="ActionIcon";export{l as ActionIcon};
|
|
2
2
|
//# sourceMappingURL=ActionIcon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import type { VariantProps } from '@stitches/react'\nimport invariant from 'invariant'\nimport * as React from 'react'\n\nimport { useRouter } from '~/context/router'\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', '$tonal300', '$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 { RouterLink } = useRouter({ href })\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: RouterLink,\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(child, {\n size: ActionIconSizeMap[size as string],\n css: { ...(child.props.css ? child.props.css : {}) }\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","RouterLink","useRouter","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"4qBAeA,MAAMA,EAAmB,CACvBC,EACAC,EACAC,EACAC,KACI,CACJ,MAAAH,EACA,WAAY,SACZ,IAAK,CACH,GAAI,cACJ,MAAOC,EACP,iDAAkD,CAAE,MAAOC,CAAS,EACpE,0BAA2B,CAAE,MAAOC,CAAO,CAC7C,CACF,GAEMC,EAAkB,CACtBJ,EACAC,EACAC,EACAC,KACI,CACJ,MAAAH,EACA,WAAY,QACZ,IAAK,CACH,GAAIC,EACJ,MAAO,QACP,iDAAkD,CAChD,GAAIC,EACJ,MAAO,OACT,EACA,0BAA2B,CAAE,GAAIC,CAAO,CAC1C,CACF,GAEME,EAAoB,CACxBL,EACAC,EACAC,EACAC,KACI,CACJ,MAAAH,EACA,WAAY,UACZ,IAAK,CACH,OAAQ,YACR,YAAa,eACb,MAAOC,EACP,iDAAkD,CAAE,MAAOC,CAAS,EACpE,0BAA2B,CAAE,MAAOC,CAAO,CAC7C,CACF,GAEMG,EAAeC,EAAO,SAAU,CACpC,WAAY,SACZ,WAAY,OACZ,GAAI,QACJ,OAAQ,QACR,aAAc,KACd,UAAW,aACX,OAAQ,UACR,QAAS,OACT,WAAY,EACZ,eAAgB,SAChB,EAAG,QACH,WAAY,qBACZ,cAAeC,EACf,SAAU,CACR,MAAO,CACL,QAAS,
|
|
1
|
+
{"version":3,"file":"ActionIcon.js","sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import type { VariantProps } from '@stitches/react'\nimport invariant from 'invariant'\nimport * as React from 'react'\n\nimport { useRouter } from '~/context/router'\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', '$tonal300', '$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 target,\n disabled,\n hasTooltip = true,\n tooltipSide,\n ...remainingProps\n },\n ref\n ) => {\n const { RouterLink } = useRouter({ href, target })\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: RouterLink,\n href: disabled ? null : href,\n target,\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(child, {\n size: ActionIconSizeMap[size as string],\n css: { ...(child.props.css ? child.props.css : {}) }\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","target","disabled","hasTooltip","tooltipSide","remainingProps","ref","RouterLink","useRouter","INVALID_CHILDREN_MESSAGE","Icon","invariant","OptionalTooltipWrapper","getExternalAnchorProps","child","ActionIconSizeMap"],"mappings":"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"}
|
|
@@ -3073,6 +3073,7 @@ export declare const BannerRegular: {
|
|
|
3073
3073
|
ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
|
|
3074
3074
|
key?: React.Key | null | undefined;
|
|
3075
3075
|
name?: string | undefined;
|
|
3076
|
+
target?: string | undefined;
|
|
3076
3077
|
defaultChecked?: boolean | undefined;
|
|
3077
3078
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
3078
3079
|
suppressContentEditableWarning?: boolean | undefined;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import a from"invariant";import*as n from"react";import{overrideStitchesVariantValue as m}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Flex as
|
|
1
|
+
import a from"invariant";import*as n from"react";import{overrideStitchesVariantValue as m}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Flex as y}from"../../flex/Flex.js";import{useBannerContext as f}from"../BannerContext.js";import{BannerRegularButton as t}from"./BannerRegularButton.js";const l=2,h={sm:2,md:4},N={sm:"column",md:"row"},r=({children:i,...s})=>{const{size:o}=f(),p=n.useMemo(()=>m(o,e=>h[e]),[o]),d=n.useMemo(()=>m(o,e=>N[e]),[o]);return a(n.Children.count(i)<=l,`A maximum of ${l} ${t.displayName} component(s) are permitted as children of ${r.displayName}`),n.createElement(y,{gap:p,direction:d,...s},n.Children.map(i,(e,c)=>{if(e==null)return e;if(!n.isValidElement(e))throw new Error(`Child passed to ${r.displayName} is not a valid element`);a(e.type===t,`Children of type ${e==null?void 0:e.type} aren't permitted. Only an ${t.displayName} component is allowed in ${r.displayName}`);const u={appearance:c>0?"outline":void 0};return n.cloneElement(e,u)}))};r.displayName="BannerRegularActions";export{r as BannerRegularActions};
|
|
2
2
|
//# sourceMappingURL=BannerRegularActions.js.map
|
|
@@ -2319,6 +2319,7 @@ export declare const BannerSlim: {
|
|
|
2319
2319
|
ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
|
|
2320
2320
|
key?: React.Key | null | undefined;
|
|
2321
2321
|
name?: string | undefined;
|
|
2322
|
+
target?: string | undefined;
|
|
2322
2323
|
defaultChecked?: boolean | undefined;
|
|
2323
2324
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
2324
2325
|
suppressContentEditableWarning?: boolean | undefined;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{opacify as s}from"color2k";import*as
|
|
1
|
+
import{opacify as s}from"color2k";import*as i from"react";import{StyledIcon as l}from"../icon/Icon.js";import{Loader as f}from"../loader/Loader.js";import{useRouter as b}from"../../context/router/index.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 d}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as w}from"../../utilities/uri/index.js";const p=(r,t,e,a)=>({theme:r,appearance:"outline",css:{border:"1px solid",borderColor:"currentColor",color:t,"&[disabled]":d,"&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:e},"&:not([disabled]):active":{color:a}}}),n=(r,t,e,a,o="white")=>({theme:r,appearance:"solid",css:{bg:t,color:o,"&[disabled]":d,"&:not([disabled]):hover, &:not([disabled]):focus":{bg:e,color:o},"&:not([disabled]):active":{bg:a}}}),$=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]":d,variants:{theme:{primary:{},secondary:{},success:{},warning:{},danger:{},neutral:{}},appearance:{solid:{},outline:{}},size:{sm:{fontSize:"$sm",lineHeight:1.53,height:"$3",px:"$4",gap:"$2",[`& ${l}`]:{size:16}},md:{fontSize:"$md",lineHeight:1.5,height:"$4",px:"$5",gap:"$3",[`& ${l}`]:{size:20}},lg:{fontSize:"$lg",lineHeight:1.5,height:"$5",px:"$5",gap:"$3",[`& ${l}`]:{size:22}},xl:{fontSize:"$lg",lineHeight:1.5,height:"$6",px:"$5",gap:"$3",[`& ${l}`]:{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","$tonal500"),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"}}),z=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"}}),x=({size:r,children:t})=>i.createElement(i.Fragment,null,i.createElement(f,{css:{position:"absolute"}}),i.createElement(z,{size:r},t)),g=i.forwardRef(({children:r,as:t,href:e,target:a,isLoading:o=!1,onClick:u,...m},h)=>{const{RouterLink:y}=b({href:e,target:a});return i.createElement($,{as:t||(e?y:void 0),href:e,isLoading:o,onClick:o?void 0:u,type:e?void 0:"button",target:a,...m,...w(e),ref:h},o?i.createElement(x,{size:m.size},r):r)});g.displayName="Button";export{g as Button,$ as StyledButton};
|
|
2
2
|
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import type { VariantProps } from '@stitches/react'\nimport { opacify } from 'color2k'\nimport * as React from 'react'\n\nimport { StyledIcon } from '~/components/icon'\nimport { Loader } from '~/components/loader'\nimport { useRouter } from '~/context/router'\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', '$tonal500'),\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 const { RouterLink } = useRouter({ href })\n const component = as || (href ? RouterLink : undefined)\n\n return (\n <StyledButton\n as={component}\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 )\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","RouterLink","useRouter","getExternalAnchorProps"],"mappings":"8iBAYA,MAAMA,EAA0B,CAC9BC,EACAC,EACAC,EACAC,KACI,CACJ,MAAAH,EACA,WAAY,UACZ,IAAK,CACH,OAAQ,YACR,YAAa,eACb,MAAOC,EACP,cAAeG,EACf,mDAAoD,CAClD,eAAgB,OAChB,MAAOF,CACT,EACA,2BAA4B,CAAE,MAAOC,CAAO,CAC9C,CACF,GAEME,EAAwB,CAC5BL,EACAC,EACAC,EACAC,EACAG,EAAO,WACH,CACJ,MAAAN,EACA,WAAY,QACZ,IAAK,CACH,GAAIC,EACJ,MAAOK,EACP,cAAeF,EACf,mDAAoD,CAClD,GAAIF,EACJ,MAAOI,CACT,EACA,2BAA4B,CAAE,GAAIH,CAAO,CAC3C,CACF,GAEaI,EAAeC,EAAO,SAAU,CAC3C,WAAY,SACZ,GAAI,QACJ,OAAQ,QACR,aAAc,KACd,OAAQ,UACR,QAAS,OACT,WAAY,QACZ,WAAY,IACZ,eAAgB,SAChB,EAAG,QACH,eAAgB,OAChB,WAAY,qBACZ,WAAY,SACZ,MAAO,cACP,cAAeJ,EACf,SAAU,CACR,MAAO,CACL,QAAS,CAAA,EACT,UAAW,
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import type { VariantProps } from '@stitches/react'\nimport { opacify } from 'color2k'\nimport * as React from 'react'\n\nimport { StyledIcon } from '~/components/icon'\nimport { Loader } from '~/components/loader'\nimport { useRouter } from '~/context/router'\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', '$tonal500'),\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, target, isLoading = false, onClick, ...rest }, ref) => {\n const { RouterLink } = useRouter({ href, target })\n const component = as || (href ? RouterLink : undefined)\n\n return (\n <StyledButton\n as={component}\n href={href}\n isLoading={isLoading}\n onClick={!isLoading ? onClick : undefined}\n type={!href ? 'button' : undefined}\n target={target}\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 )\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","target","isLoading","onClick","rest","ref","RouterLink","useRouter","getExternalAnchorProps"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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),
|
|
1
|
+
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),y=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]),g=a.useCallback(k(500,o),[o]),x=(e,t)=>e?"success":t?"neutral":"error";return a.createElement(P,{css:v},a.createElement(D,{label:f,name:r,onChange:e=>g(e.target.value),onBlur:()=>n(!1),onFocus:()=>n(!0),validation:{...b,validate:o},...w}),(y||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:x(t,i)},e))))};c.displayName="CreatePasswordField";export{c as CreatePasswordField};
|
|
2
2
|
//# sourceMappingURL=CreatePasswordField.js.map
|
|
@@ -1100,7 +1100,7 @@ export declare const DropdownMenu: import("@stitches/react/types/styled-componen
|
|
|
1100
1100
|
marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
|
|
1101
1101
|
};
|
|
1102
1102
|
}>>;
|
|
1103
|
-
LinkItem: ({ children, href, ...props }: Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "css"> & import("@stitches/react/types/styled-component").TransformProps<{}, {
|
|
1103
|
+
LinkItem: ({ children, href, target, ...props }: Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "css"> & import("@stitches/react/types/styled-component").TransformProps<{}, {
|
|
1104
1104
|
sm: string;
|
|
1105
1105
|
md: string;
|
|
1106
1106
|
lg: string;
|
|
@@ -1470,6 +1470,7 @@ export declare const DropdownMenu: import("@stitches/react/types/styled-componen
|
|
|
1470
1470
|
}> | undefined;
|
|
1471
1471
|
} & {
|
|
1472
1472
|
href: string;
|
|
1473
|
+
target?: string | undefined;
|
|
1473
1474
|
}) => JSX.Element;
|
|
1474
1475
|
Portal: React.FC<import("@radix-ui/react-dropdown-menu").DropdownMenuPortalProps>;
|
|
1475
1476
|
Separator: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-dropdown-menu").DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>>, {}, {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownMenuItem } from './DropdownMenuItem';
|
|
3
|
-
export declare const DropdownMenuLinkItem: ({ children, href, ...props }: Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "css"> & import("@stitches/react/types/styled-component").TransformProps<{}, {
|
|
3
|
+
export declare const DropdownMenuLinkItem: ({ children, href, target, ...props }: Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "css"> & import("@stitches/react/types/styled-component").TransformProps<{}, {
|
|
4
4
|
sm: string;
|
|
5
5
|
md: string;
|
|
6
6
|
lg: string;
|
|
@@ -370,4 +370,5 @@ export declare const DropdownMenuLinkItem: ({ children, href, ...props }: Omit<i
|
|
|
370
370
|
}> | undefined;
|
|
371
371
|
} & {
|
|
372
372
|
href: string;
|
|
373
|
+
target?: string | undefined;
|
|
373
374
|
}) => JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import t from"react";import{useRouter as a}from"../../context/router/index.js";import{styled as i}from"../../stitches.js";import{getExternalAnchorProps as f}from"../../utilities/uri/index.js";import{DropdownMenuItem as p}from"./DropdownMenuItem.js";const c=i("a",{textDecoration:"none"}),l=({children:o,href:e,target:r,...n})=>{const{RouterLink:m}=a({href:e,target:r});return t.createElement(p,{...n,asChild:!0},t.createElement(c,{as:m,href:e,role:"menuitem",target:r,...f(e)},o))};export{l as DropdownMenuLinkItem};
|
|
2
2
|
//# sourceMappingURL=DropdownMenuLinkItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuLinkItem.js","sources":["../../../src/components/dropdown-menu/DropdownMenuLinkItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { DropdownMenuItem } from './DropdownMenuItem'\n\nconst StyledLink = styled('a', {\n textDecoration: 'none'\n})\n\nexport const DropdownMenuLinkItem = ({\n children,\n href,\n ...props\n}: React.ComponentProps<typeof DropdownMenuItem> & {
|
|
1
|
+
{"version":3,"file":"DropdownMenuLinkItem.js","sources":["../../../src/components/dropdown-menu/DropdownMenuLinkItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { DropdownMenuItem } from './DropdownMenuItem'\n\nconst StyledLink = styled('a', {\n textDecoration: 'none'\n})\n\nexport const DropdownMenuLinkItem = ({\n children,\n href,\n target,\n ...props\n}: React.ComponentProps<typeof DropdownMenuItem> & {\n href: string\n target?: string\n}) => {\n const { RouterLink } = useRouter({ href, target })\n\n return (\n <DropdownMenuItem {...props} asChild>\n <StyledLink\n as={RouterLink}\n href={href}\n role=\"menuitem\"\n target={target}\n {...getExternalAnchorProps(href)}\n >\n {children}\n </StyledLink>\n </DropdownMenuItem>\n )\n}\n"],"names":["StyledLink","styled","DropdownMenuLinkItem","children","href","target","props","RouterLink","useRouter","React","DropdownMenuItem","getExternalAnchorProps"],"mappings":"yPAQA,MAAMA,EAAaC,EAAO,IAAK,CAC7B,eAAgB,MAClB,CAAC,EAEYC,EAAuB,CAAC,CACnC,SAAAC,EACA,KAAAC,EACA,OAAAC,KACGC,CACL,IAGM,CACJ,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,KAAAJ,EAAM,OAAAC,CAAO,CAAC,EAEjD,OACEI,EAAA,cAACC,EAAA,CAAkB,GAAGJ,EAAO,QAAO,EAClCG,EAAAA,EAAA,cAACT,EAAA,CACC,GAAIO,EACJ,KAAMH,EACN,KAAK,WACL,OAAQC,EACP,GAAGM,EAAuBP,CAAI,CAE9BD,EAAAA,CACH,CACF,CAEJ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import w from"invariant";import*as m from"react";import{useForm as S,FormProvider as E}from"react-hook-form";import g from"react-hook-form-persist";import{styled as F}from"../../stitches.js";import{StorageEnum as V}from"./Form.types.js";const v=F("form",{}),
|
|
1
|
+
import w from"invariant";import*as m from"react";import{useForm as S,FormProvider as E}from"react-hook-form";import g from"react-hook-form-persist";import{styled as F}from"../../stitches.js";import{StorageEnum as V}from"./Form.types.js";const v=F("form",{}),y=({persist:r,watch:o,setValue:n,children:l})=>{const{id:i,...e}=r;let t={...e,storage:e.storage===V.LOCAL?window.localStorage:window.sessionStorage};if(e.exclude){const{exclude:h,...a}=t,u=o(),c=Object.keys(u).filter(s=>{var d;if(!((d=e.exclude)!=null&&d.includes(s)))return s});t={...a,include:c}}return g(i,{watch:o,setValue:n},t),l},b=({formMethods:r,handleSubmit:o,onSubmit:n,onError:l,children:i,...e})=>m.createElement(E,{...r},m.createElement(v,{"aria-label":"form",...e,onSubmit:o(n,l)},i)),p=({children:r,defaultValues:o={},onSubmit:n,onError:l,validationMode:i="onBlur",render:e,persist:t,...h})=>{w(!(r&&e),"`Form` should only be given one of `children` or `render`. When both are provided, `render` will be used and `children` will be ignored.");const a=S({defaultValues:o,mode:i}),{handleSubmit:u,watch:c,setValue:s}=a,d=e?e(a):r,f={formMethods:a,handleSubmit:u,onSubmit:n,onError:l,...h};return t?m.createElement(y,{persist:t,watch:c,setValue:s},m.createElement(b,{...f},d)):m.createElement(b,{...f},d)};p.displayName="Form";export{p as Form};
|
|
2
2
|
//# sourceMappingURL=Form.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as e from"react";import{useRouter as d}from"../../context/router/index.js";import{styled as f}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 l}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as c}from"../../utilities/uri/index.js";import{StyledHeading as y}from"../heading/Heading.js";import{StyledLi as u}from"../list/List.js";import"../markdown-content/components/MarkdownCode.js";import{StyledMarkdownEmphasis as b}from"../markdown-content/components/MarkdownEmphasis.js";import"../markdown-content/components/MarkdownInlineCode.js";import"../image/Image.js";import{StyledText as g,textVariants as h}from"../text/Text.js";import"../markdown-content/components/MarkdownStrong.js";import"../divider/Divider.js";const o=f("a",{bg:"unset",border:"unset",p:"unset",color:"$primary800",cursor:"pointer",fontFamily:"$body",textDecoration:"none","&:focus, &:hover":{color:"$primary900",textDecoration:"underline"},"&:active":{color:"$primary1000"},"&[disabled]":{...l,pointerEvents:"none"},[`${g} > &, ${y} > &, ${u} > &, ${b} > &`]:{fontSize:"100%",lineHeight:1,"&::before, &::after":{content:"none"}},variants:h,defaultVariants:{size:"md"}}),i=e.forwardRef(({as:n,disabled:a,href:r,target:t,...m},p)=>{const{RouterLink:s}=d({href:r,target:t});return e.createElement(o,{as:n||(r?s:"button"),noCapsize:r?void 0:!0,href:r,target:t,...a&&{disabled:!0},...m,...c(r),ref:p})});i.displayName="Link";export{i as Link,o as StyledLink};
|
|
2
2
|
//# sourceMappingURL=Link.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.js","sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { StyledHeading } from '../heading/Heading'\nimport { StyledLi } from '../list/List'\nimport { StyledMarkdownEmphasis } from '../markdown-content/components'\nimport { StyledText, textVariants } from '../text/Text'\n\nexport const StyledLink = styled('a', {\n bg: 'unset',\n border: 'unset',\n p: 'unset',\n color: '$primary800',\n cursor: 'pointer',\n fontFamily: '$body',\n textDecoration: 'none',\n '&:focus, &:hover': {\n color: '$primary900',\n textDecoration: 'underline'\n },\n '&:active': {\n color: '$primary1000'\n },\n '&[disabled]': {\n ...disabledStyle,\n pointerEvents: 'none'\n },\n\n [`${StyledText} > &, ${StyledHeading} > &, ${StyledLi} > &, ${StyledMarkdownEmphasis} > &`]:\n {\n fontSize: '100%',\n lineHeight: 1,\n '&::before, &::after': {\n content: 'none'\n }\n },\n variants: textVariants,\n defaultVariants: {\n size: 'md'\n }\n})\n\ntype LinkProps = Override<\n React.ComponentProps<typeof StyledLink>,\n {\n as?: React.ComponentType | React.ElementType\n } & NavigatorActions & { disabled?: boolean }\n>\n\nexport const Link: React.ForwardRefExoticComponent<LinkProps> =\n React.forwardRef(({ as, disabled, href, ...rest }, ref) => {\n const { RouterLink } = useRouter({ href })\n\n return (\n <StyledLink\n as={as || (href ? RouterLink : 'button')}\n noCapsize={!href ? true : undefined}\n href={href}\n {...(disabled && { disabled: true })}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref}\n />\n )\n })\n\nLink.displayName = 'Link'\n"],"names":["StyledLink","styled","disabledStyle","StyledText","StyledHeading","StyledLi","StyledMarkdownEmphasis","textVariants","Link","React","as","disabled","href","rest","ref","RouterLink","useRouter","getExternalAnchorProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Link.js","sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { StyledHeading } from '../heading/Heading'\nimport { StyledLi } from '../list/List'\nimport { StyledMarkdownEmphasis } from '../markdown-content/components'\nimport { StyledText, textVariants } from '../text/Text'\n\nexport const StyledLink = styled('a', {\n bg: 'unset',\n border: 'unset',\n p: 'unset',\n color: '$primary800',\n cursor: 'pointer',\n fontFamily: '$body',\n textDecoration: 'none',\n '&:focus, &:hover': {\n color: '$primary900',\n textDecoration: 'underline'\n },\n '&:active': {\n color: '$primary1000'\n },\n '&[disabled]': {\n ...disabledStyle,\n pointerEvents: 'none'\n },\n\n [`${StyledText} > &, ${StyledHeading} > &, ${StyledLi} > &, ${StyledMarkdownEmphasis} > &`]:\n {\n fontSize: '100%',\n lineHeight: 1,\n '&::before, &::after': {\n content: 'none'\n }\n },\n variants: textVariants,\n defaultVariants: {\n size: 'md'\n }\n})\n\ntype LinkProps = Override<\n React.ComponentProps<typeof StyledLink>,\n {\n as?: React.ComponentType | React.ElementType\n } & NavigatorActions & { disabled?: boolean }\n>\n\nexport const Link: React.ForwardRefExoticComponent<LinkProps> =\n React.forwardRef(({ as, disabled, href, target, ...rest }, ref) => {\n const { RouterLink } = useRouter({ href, target })\n\n return (\n <StyledLink\n as={as || (href ? RouterLink : 'button')}\n noCapsize={!href ? true : undefined}\n href={href}\n target={target}\n {...(disabled && { disabled: true })}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref}\n />\n )\n })\n\nLink.displayName = 'Link'\n"],"names":["StyledLink","styled","disabledStyle","StyledText","StyledHeading","StyledLi","StyledMarkdownEmphasis","textVariants","Link","React","as","disabled","href","target","rest","ref","RouterLink","useRouter","getExternalAnchorProps"],"mappings":"m6BAaO,MAAMA,EAAaC,EAAO,IAAK,CACpC,GAAI,QACJ,OAAQ,QACR,EAAG,QACH,MAAO,cACP,OAAQ,UACR,WAAY,QACZ,eAAgB,OAChB,mBAAoB,CAClB,MAAO,cACP,eAAgB,WAClB,EACA,WAAY,CACV,MAAO,cACT,EACA,cAAe,CACb,GAAGC,EACH,cAAe,MACjB,EAEA,CAAC,GAAGC,UAAmBC,UAAsBC,UAAiBC,SAC5D,CACE,SAAU,OACV,WAAY,EACZ,sBAAuB,CACrB,QAAS,MACX,CACF,EACF,SAAUC,EACV,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EASYC,EACXC,EAAM,WAAW,CAAC,CAAE,GAAAC,EAAI,SAAAC,EAAU,KAAAC,EAAM,OAAAC,KAAWC,CAAK,EAAGC,IAAQ,CACjE,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,KAAAL,EAAM,OAAAC,CAAO,CAAC,EAEjD,OACEJ,EAAA,cAACT,EAAA,CACC,GAAIU,IAAOE,EAAOI,EAAa,UAC/B,UAAYJ,EAAc,OAAP,GACnB,KAAMA,EACN,OAAQC,EACP,GAAIF,GAAY,CAAE,SAAU,EAAK,EACjC,GAAGG,EACH,GAAGI,EAAuBN,CAAI,EAC/B,IAAKG,CAAAA,CACP,CAEJ,CAAC,EAEHP,EAAK,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as i from"@radix-ui/react-navigation-menu";import e from"react";import{useRouter as f}from"../../context/router/index.js";import{styled as o}from"../../stitches.js";import{getExternalAnchorProps as p}from"../../utilities/uri/index.js";import{navigationMenuBaseItemStyles as l,navigationMenuDisabledItemStyles as v,navigationMenuActiveItemStyles as b}from"./NavigationMenu.styles.js";const k=o("button",{...l,...v}),S=o(i.Item),h=o(i.Link,l,{display:"block",textDecoration:"none",lineHeight:1,variants:{elementType:{dropdownItem:{"&[data-active]":{background:"$backgroundSelected",color:"$textSelected","&:hover":{background:"$backgroundSelectedHover",color:"$textSelectedHover"},"&:active":{background:"$backgroundSelectedPressed",color:"$textSelectedPressed"},"&:focus-visible":{boxShadow:"0 0 0 2px $colors$primary800",color:"$textSelectedFocus"}}},link:{"&[data-active]":{...b}}}}}),c=e.forwardRef(({children:r,href:t,target:a,disabled:d,css:n,variant:s="link",ref:x,...m},u)=>{const{RouterLink:g}=f({href:t,target:a});return e.createElement(S,null,d?e.createElement(k,{disabled:!0,css:n},r):e.createElement(h,{href:t,target:a,ref:u,elementType:s,css:n,...p(t),...m,asChild:!0},e.createElement(g,null,r)))});c.displayName="NavigationMenuLink";export{c as NavigationMenuLink};
|
|
2
2
|
//# sourceMappingURL=NavigationMenuLink.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationMenuLink.js","sources":["../../../src/components/navigation/NavigationMenuLink.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport {\n navigationMenuActiveItemStyles,\n navigationMenuBaseItemStyles,\n navigationMenuDisabledItemStyles\n} from './NavigationMenu.styles'\n\nconst DisabledButton = styled('button', {\n ...navigationMenuBaseItemStyles,\n ...navigationMenuDisabledItemStyles\n})\n\nconst ListItem = styled(NavigationMenuPrimitive.Item)\n\nconst StyledLink = styled(\n NavigationMenuPrimitive.Link,\n navigationMenuBaseItemStyles,\n {\n display: 'block',\n textDecoration: 'none',\n lineHeight: 1,\n variants: {\n elementType: {\n dropdownItem: {\n '&[data-active]': {\n background: '$backgroundSelected',\n color: '$textSelected',\n '&:hover': {\n background: '$backgroundSelectedHover',\n color: '$textSelectedHover'\n },\n '&:active': {\n background: '$backgroundSelectedPressed',\n color: '$textSelectedPressed'\n },\n '&:focus-visible': {\n boxShadow: '0 0 0 2px $colors$primary800',\n color: '$textSelectedFocus'\n }\n }\n },\n link: {\n '&[data-active]': { ...navigationMenuActiveItemStyles }\n }\n }\n }\n }\n)\n\nexport const NavigationMenuLink: React.ForwardRefExoticComponent<\n Omit<React.ComponentProps<typeof StyledLink>, 'elementType'> & {\n disabled?: boolean\n variant?: React.ComponentProps<typeof StyledLink>['elementType']\n }\n> = React.forwardRef(\n (\n { children, href, disabled, css, variant = 'link', ref, ...props },\n forwardedRef\n ) => (\n <ListItem>\n
|
|
1
|
+
{"version":3,"file":"NavigationMenuLink.js","sources":["../../../src/components/navigation/NavigationMenuLink.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport {\n navigationMenuActiveItemStyles,\n navigationMenuBaseItemStyles,\n navigationMenuDisabledItemStyles\n} from './NavigationMenu.styles'\n\nconst DisabledButton = styled('button', {\n ...navigationMenuBaseItemStyles,\n ...navigationMenuDisabledItemStyles\n})\n\nconst ListItem = styled(NavigationMenuPrimitive.Item)\n\nconst StyledLink = styled(\n NavigationMenuPrimitive.Link,\n navigationMenuBaseItemStyles,\n {\n display: 'block',\n textDecoration: 'none',\n lineHeight: 1,\n variants: {\n elementType: {\n dropdownItem: {\n '&[data-active]': {\n background: '$backgroundSelected',\n color: '$textSelected',\n '&:hover': {\n background: '$backgroundSelectedHover',\n color: '$textSelectedHover'\n },\n '&:active': {\n background: '$backgroundSelectedPressed',\n color: '$textSelectedPressed'\n },\n '&:focus-visible': {\n boxShadow: '0 0 0 2px $colors$primary800',\n color: '$textSelectedFocus'\n }\n }\n },\n link: {\n '&[data-active]': { ...navigationMenuActiveItemStyles }\n }\n }\n }\n }\n)\n\nexport const NavigationMenuLink: React.ForwardRefExoticComponent<\n Omit<React.ComponentProps<typeof StyledLink>, 'elementType'> & {\n disabled?: boolean\n variant?: React.ComponentProps<typeof StyledLink>['elementType']\n }\n> = React.forwardRef(\n (\n { children, href, target, disabled, css, variant = 'link', ref, ...props },\n forwardedRef\n ) => {\n const { RouterLink } = useRouter({ href, target })\n return (\n <ListItem>\n {disabled ? (\n <DisabledButton disabled css={css}>\n {children}\n </DisabledButton>\n ) : (\n <StyledLink\n href={href}\n target={target}\n ref={forwardedRef}\n elementType={variant}\n css={css}\n {...getExternalAnchorProps(href)}\n {...props}\n asChild\n >\n <RouterLink>{children}</RouterLink>\n </StyledLink>\n )}\n </ListItem>\n )\n }\n)\n\nNavigationMenuLink.displayName = 'NavigationMenuLink'\n"],"names":["DisabledButton","styled","navigationMenuBaseItemStyles","navigationMenuDisabledItemStyles","ListItem","NavigationMenuPrimitive","StyledLink","navigationMenuActiveItemStyles","NavigationMenuLink","React","children","href","target","disabled","css","variant","ref","props","forwardedRef","RouterLink","useRouter","getExternalAnchorProps"],"mappings":"sYAaA,MAAMA,EAAiBC,EAAO,SAAU,CACtC,GAAGC,EACH,GAAGC,CACL,CAAC,EAEKC,EAAWH,EAAOI,EAAwB,IAAI,EAE9CC,EAAaL,EACjBI,EAAwB,KACxBH,EACA,CACE,QAAS,QACT,eAAgB,OAChB,WAAY,EACZ,SAAU,CACR,YAAa,CACX,aAAc,CACZ,iBAAkB,CAChB,WAAY,sBACZ,MAAO,gBACP,UAAW,CACT,WAAY,2BACZ,MAAO,oBACT,EACA,WAAY,CACV,WAAY,6BACZ,MAAO,sBACT,EACA,kBAAmB,CACjB,UAAW,+BACX,MAAO,oBACT,CACF,CACF,EACA,KAAM,CACJ,iBAAkB,CAAE,GAAGK,CAA+B,CACxD,CACF,CACF,CACF,CACF,EAEaC,EAKTC,EAAM,WACR,CACE,CAAE,SAAAC,EAAU,KAAAC,EAAM,OAAAC,EAAQ,SAAAC,EAAU,IAAAC,EAAK,QAAAC,EAAU,OAAQ,IAAAC,KAAQC,CAAM,EACzEC,IACG,CACH,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,KAAAT,EAAM,OAAAC,CAAO,CAAC,EACjD,OACEH,EAAA,cAACL,EAAA,KACES,EACCJ,EAAA,cAACT,EAAA,CAAe,SAAQ,GAAC,IAAKc,CAC3BJ,EAAAA,CACH,EAEAD,EAAA,cAACH,EAAA,CACC,KAAMK,EACN,OAAQC,EACR,IAAKM,EACL,YAAaH,EACb,IAAKD,EACJ,GAAGO,EAAuBV,CAAI,EAC9B,GAAGM,EACJ,QAAO,EAEPR,EAAAA,EAAA,cAACU,EAAA,KAAYT,CAAS,CACxB,CAEJ,CAEJ,CACF,EAEAF,EAAmB,YAAc"}
|
|
@@ -368,7 +368,7 @@ declare const StyledRoot: import("@stitches/react/types/styled-component").Style
|
|
|
368
368
|
}>>;
|
|
369
369
|
declare type TNavigationVerticalProps = Omit<React.ComponentProps<typeof StyledRoot>, 'delayDuration' | 'skipDelayDuration' | 'defaultValue' | 'value' | 'onValueChange'>;
|
|
370
370
|
export declare const NavigationMenuVertical: (({ children, ...rest }: TNavigationVerticalProps) => JSX.Element) & {
|
|
371
|
-
Link: ({ as, href, children, ...rest }: Omit<import("@radix-ui/react-navigation-menu").NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>, "size" | "css"> & import("@stitches/react/types/styled-component").TransformProps<{
|
|
371
|
+
Link: ({ as, href, target, children, ...rest }: Omit<import("@radix-ui/react-navigation-menu").NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>, "size" | "css"> & import("@stitches/react/types/styled-component").TransformProps<{
|
|
372
372
|
size?: "md" | "lg" | undefined;
|
|
373
373
|
}, {
|
|
374
374
|
sm: string;
|
|
@@ -371,5 +371,5 @@ declare const StyledNavigationMenuVerticalLink: import("@stitches/react/types/st
|
|
|
371
371
|
declare type NavigationMenuVerticalItemProps = React.ComponentProps<typeof StyledNavigationMenuVerticalLink> & {
|
|
372
372
|
as?: React.ComponentType | React.ElementType;
|
|
373
373
|
};
|
|
374
|
-
export declare const NavigationMenuVerticalLink: ({ as, href, children, ...rest }: NavigationMenuVerticalItemProps) => JSX.Element;
|
|
374
|
+
export declare const NavigationMenuVerticalLink: ({ as, href, target, children, ...rest }: NavigationMenuVerticalItemProps) => JSX.Element;
|
|
375
375
|
export {};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Link as
|
|
1
|
+
import{Link as c}from"@radix-ui/react-navigation-menu";import*as t from"react";import{useRouter as p}from"../../context/router/index.js";import{styled as u}from"../../stitches.js";import{getExternalAnchorProps as f}from"../../utilities/uri/index.js";import{navigationMenuVerticalItemStyles as s}from"./NavigationMenuVertical.styles.js";import{NavigationMenuVerticalItem as g}from"./NavigationMenuVerticalItem.js";import{NavigationMenuVerticalItemContent as h}from"./NavigationMenuVerticalItemContent.js";import{preventEvent as v}from"../../utilities/event/preventEvent.js";const E=u(c,s),V=({as:r,href:e,target:o,children:n,...i})=>{const{RouterLink:m}=p({href:e,target:o}),a=r||(e?m:"button"),l=r?{}:e?f(e):{type:"button"};return t.createElement(g,null,t.createElement(E,{size:"lg",href:e,target:o,...i,...l,onSelect:v,asChild:!0},t.createElement(a,null,t.createElement(h,null,n))))};export{V as NavigationMenuVerticalLink};
|
|
2
2
|
//# sourceMappingURL=NavigationMenuVerticalLink.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationMenuVerticalLink.js","sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport * as React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { preventEvent } from '~/utilities/event'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(\n Link,\n navigationMenuVerticalItemStyles\n)\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalLink\n> & {\n as?: React.ComponentType | React.ElementType\n}\n\nexport const NavigationMenuVerticalLink = ({\n as,\n href,\n children,\n ...rest\n}: NavigationMenuVerticalItemProps) => {\n const { RouterLink } = useRouter({ href })\n\n const Component = as || (href ? RouterLink : 'button')\n const componentProps = as\n ? {}\n : href\n ? getExternalAnchorProps(href)\n : { type: 'button' }\n\n return (\n <NavigationMenuVerticalItem>\n <StyledNavigationMenuVerticalLink\n size=\"lg\"\n href={href}\n {...rest}\n {...componentProps}\n onSelect={preventEvent}\n asChild // ?: Can't use `as` for this as we lose `data-active` etc. attributes when we try to. Using `asChild` and `Component` as a workaround.\n >\n <Component>\n <NavigationMenuVerticalItemContent>\n {children}\n </NavigationMenuVerticalItemContent>\n </Component>\n </StyledNavigationMenuVerticalLink>\n </NavigationMenuVerticalItem>\n )\n}\n"],"names":["StyledNavigationMenuVerticalLink","styled","Link","navigationMenuVerticalItemStyles","NavigationMenuVerticalLink","as","href","children","rest","RouterLink","useRouter","Component","componentProps","getExternalAnchorProps","React","NavigationMenuVerticalItem","preventEvent","NavigationMenuVerticalItemContent"],"mappings":"6jBAYA,MAAMA,EAAmCC,EACvCC,EACAC,CACF,EAQaC,EAA6B,CAAC,CACzC,GAAAC,EACA,KAAAC,EACA,SAAAC,KACGC,CACL,IAAuC,CACrC,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,
|
|
1
|
+
{"version":3,"file":"NavigationMenuVerticalLink.js","sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport * as React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { preventEvent } from '~/utilities/event'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(\n Link,\n navigationMenuVerticalItemStyles\n)\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalLink\n> & {\n as?: React.ComponentType | React.ElementType\n}\n\nexport const NavigationMenuVerticalLink = ({\n as,\n href,\n target,\n children,\n ...rest\n}: NavigationMenuVerticalItemProps) => {\n const { RouterLink } = useRouter({ href, target })\n\n const Component = as || (href ? RouterLink : 'button')\n const componentProps = as\n ? {}\n : href\n ? getExternalAnchorProps(href)\n : { type: 'button' }\n\n return (\n <NavigationMenuVerticalItem>\n <StyledNavigationMenuVerticalLink\n size=\"lg\"\n href={href}\n target={target}\n {...rest}\n {...componentProps}\n onSelect={preventEvent}\n asChild // ?: Can't use `as` for this as we lose `data-active` etc. attributes when we try to. Using `asChild` and `Component` as a workaround.\n >\n <Component>\n <NavigationMenuVerticalItemContent>\n {children}\n </NavigationMenuVerticalItemContent>\n </Component>\n </StyledNavigationMenuVerticalLink>\n </NavigationMenuVerticalItem>\n )\n}\n"],"names":["StyledNavigationMenuVerticalLink","styled","Link","navigationMenuVerticalItemStyles","NavigationMenuVerticalLink","as","href","target","children","rest","RouterLink","useRouter","Component","componentProps","getExternalAnchorProps","React","NavigationMenuVerticalItem","preventEvent","NavigationMenuVerticalItemContent"],"mappings":"6jBAYA,MAAMA,EAAmCC,EACvCC,EACAC,CACF,EAQaC,EAA6B,CAAC,CACzC,GAAAC,EACA,KAAAC,EACA,OAAAC,EACA,SAAAC,KACGC,CACL,IAAuC,CACrC,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,KAAAL,EAAM,OAAAC,CAAO,CAAC,EAE3CK,EAAYP,IAAOC,EAAOI,EAAa,UACvCG,EAAiBR,EACnB,CAAA,EACAC,EACAQ,EAAuBR,CAAI,EAC3B,CAAE,KAAM,QAAS,EAErB,OACES,EAAA,cAACC,EAAA,KACCD,EAAA,cAACf,EAAA,CACC,KAAK,KACL,KAAMM,EACN,OAAQC,EACP,GAAGE,EACH,GAAGI,EACJ,SAAUI,EACV,QAAO,EAAA,EAEPF,EAAA,cAACH,EAAA,KACCG,EAAA,cAACG,EAAA,KACEV,CACH,CACF,CACF,CACF,CAEJ"}
|
|
@@ -373,7 +373,7 @@ declare type SideBarProps = React.ComponentProps<typeof Root> & {
|
|
|
373
373
|
};
|
|
374
374
|
export declare const SideBar: {
|
|
375
375
|
({ className, children, type, offset, css, ...rest }: SideBarProps): JSX.Element;
|
|
376
|
-
Brand: ({ href, ...props }: Omit<Pick<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "key" | keyof React.AnchorHTMLAttributes<HTMLAnchorElement>> & {
|
|
376
|
+
Brand: ({ href, target, ...props }: Omit<Pick<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "key" | keyof React.AnchorHTMLAttributes<HTMLAnchorElement>> & {
|
|
377
377
|
ref?: ((instance: HTMLAnchorElement | null) => void) | React.RefObject<HTMLAnchorElement> | null | undefined;
|
|
378
378
|
}, "css"> & import("@stitches/react/types/styled-component").TransformProps<{}, {
|
|
379
379
|
sm: string;
|
|
@@ -1467,7 +1467,7 @@ declare const StyledSideBarBrand: import("@stitches/react/types/styled-component
|
|
|
1467
1467
|
marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
|
|
1468
1468
|
};
|
|
1469
1469
|
}>>;
|
|
1470
|
-
export declare const SideBarBrand: ({ href, ...props }: React.ComponentProps<typeof StyledSideBarBrand>) => JSX.Element;
|
|
1470
|
+
export declare const SideBarBrand: ({ href, target, ...props }: React.ComponentProps<typeof StyledSideBarBrand>) => JSX.Element;
|
|
1471
1471
|
export declare const SideBarBrandLogo: {
|
|
1472
1472
|
(props: Omit<Pick<Omit<Pick<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "key" | keyof React.ImgHTMLAttributes<HTMLImageElement>> & {
|
|
1473
1473
|
ref?: ((instance: HTMLImageElement | null) => void) | React.RefObject<HTMLImageElement> | null | undefined;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as a from"react";import{useRouter as i}from"../../context/router/index.js";import{styled as e}from"../../stitches.js";import{Image as n}from"../image/Image.js";import{Text as p}from"../text/Text.js";const m=e("div",{borderBottom:"1px solid $border",p:"$4",width:"100%"}),f=e("div",{flexGrow:1,overflowY:"auto",overflowX:"hidden",p:"$4",width:"100%"}),s=e("div",{borderTop:"1px solid $border",p:"$4",width:"100%"}),l=e("a",{alignItems:"flex-end",color:"$text",display:"flex",gap:"$4",textDecoration:"none","&:hover, &:focus":{textDecoration:"none"}}),c=({href:o,target:r,...t})=>{const{RouterLink:d}=i({href:o,target:r});return a.createElement(l,{as:d,href:o,target:r,...t})},x=n,B=e(p,{color:"$text",whiteSpace:"nowrap"});export{f as SideBarBody,c as SideBarBrand,x as SideBarBrandLogo,B as SideBarBrandName,s as SideBarFooter,m as SideBarHeader};
|
|
2
2
|
//# sourceMappingURL=SideBarComponents.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SideBarComponents.js","sources":["../../../src/components/side-bar/SideBarComponents.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\n\nimport { Image } from '../image'\nimport { Text } from '../text'\n\nexport const SideBarHeader = styled('div', {\n borderBottom: '1px solid $border',\n p: '$4',\n width: '100%'\n})\n\nexport const SideBarBody = styled('div', {\n flexGrow: 1,\n overflowY: 'auto',\n overflowX: 'hidden',\n p: '$4',\n width: '100%'\n})\n\nexport const SideBarFooter = styled('div', {\n borderTop: '1px solid $border',\n p: '$4',\n width: '100%'\n})\n\nconst StyledSideBarBrand = styled('a', {\n alignItems: 'flex-end',\n color: '$text',\n display: 'flex',\n gap: '$4',\n textDecoration: 'none',\n '&:hover, &:focus': {\n textDecoration: 'none'\n }\n})\nexport const SideBarBrand = ({\n href,\n ...props\n}: React.ComponentProps<typeof StyledSideBarBrand>) => {\n const { RouterLink } = useRouter({ href })\n return <StyledSideBarBrand
|
|
1
|
+
{"version":3,"file":"SideBarComponents.js","sources":["../../../src/components/side-bar/SideBarComponents.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\n\nimport { Image } from '../image'\nimport { Text } from '../text'\n\nexport const SideBarHeader = styled('div', {\n borderBottom: '1px solid $border',\n p: '$4',\n width: '100%'\n})\n\nexport const SideBarBody = styled('div', {\n flexGrow: 1,\n overflowY: 'auto',\n overflowX: 'hidden',\n p: '$4',\n width: '100%'\n})\n\nexport const SideBarFooter = styled('div', {\n borderTop: '1px solid $border',\n p: '$4',\n width: '100%'\n})\n\nconst StyledSideBarBrand = styled('a', {\n alignItems: 'flex-end',\n color: '$text',\n display: 'flex',\n gap: '$4',\n textDecoration: 'none',\n '&:hover, &:focus': {\n textDecoration: 'none'\n }\n})\nexport const SideBarBrand = ({\n href,\n target,\n ...props\n}: React.ComponentProps<typeof StyledSideBarBrand>) => {\n const { RouterLink } = useRouter({ href, target })\n return (\n <StyledSideBarBrand\n as={RouterLink}\n href={href}\n target={target}\n {...props}\n />\n )\n}\n\nexport const SideBarBrandLogo = Image\n\nexport const SideBarBrandName = styled(Text, {\n color: '$text',\n whiteSpace: 'nowrap'\n})\n"],"names":["SideBarHeader","styled","SideBarBody","SideBarFooter","StyledSideBarBrand","SideBarBrand","href","target","props","RouterLink","useRouter","React","SideBarBrandLogo","Image","SideBarBrandName","Text"],"mappings":"8MAQa,MAAAA,EAAgBC,EAAO,MAAO,CACzC,aAAc,oBACd,EAAG,KACH,MAAO,MACT,CAAC,EAEYC,EAAcD,EAAO,MAAO,CACvC,SAAU,EACV,UAAW,OACX,UAAW,SACX,EAAG,KACH,MAAO,MACT,CAAC,EAEYE,EAAgBF,EAAO,MAAO,CACzC,UAAW,oBACX,EAAG,KACH,MAAO,MACT,CAAC,EAEKG,EAAqBH,EAAO,IAAK,CACrC,WAAY,WACZ,MAAO,QACP,QAAS,OACT,IAAK,KACL,eAAgB,OAChB,mBAAoB,CAClB,eAAgB,MAClB,CACF,CAAC,EACYI,EAAe,CAAC,CAC3B,KAAAC,EACA,OAAAC,KACGC,CACL,IAAuD,CACrD,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,KAAAJ,EAAM,OAAAC,CAAO,CAAC,EACjD,OACEI,EAAA,cAACP,EAAA,CACC,GAAIK,EACJ,KAAMH,EACN,OAAQC,EACP,GAAGC,CACN,CAAA,CAEJ,EAEaI,EAAmBC,EAEnBC,EAAmBb,EAAOc,EAAM,CAC3C,MAAO,QACP,WAAY,QACd,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import c from"invariant";import*as p from"react";import{Box as h}from"../box/Box.js";import{StepperProvider as C}from"./stepper-context/StepperContext.js";import{StepperStepBack as f}from"./StepperStepBack.js";import{StepperStepForward as w}from"./StepperStepForward.js";import{StepperSteps as b}from"./StepperSteps.js";const r=({children:s,stepCount:o,allowSkip:n,onComplete:i,onStepChange:l,direction:a="horizontal",steps:e,hideLabels:m=!1,showCompletedIcons:d=!1,css:S})=>{c(!(o&&e),"`Stepper` should only be given one of `stepCount` or `steps`. When both are provided, `steps` will be used and `stepCount` will be ignored.");const t=(e==null?void 0:e.length)||o||0;return p.createElement(C,{stepCount:t,allowSkip:n,onComplete:i,onStepChange:o?l:void 0,direction:a,steps:e||Array(t).fill(""),hideLabels:m,showCompletedIcons:d},p.createElement(h,{"aria-label":"progress",css:{width:"100%",...S}},s))},
|
|
1
|
+
import c from"invariant";import*as p from"react";import{Box as h}from"../box/Box.js";import{StepperProvider as C}from"./stepper-context/StepperContext.js";import{StepperStepBack as f}from"./StepperStepBack.js";import{StepperStepForward as w}from"./StepperStepForward.js";import{StepperSteps as b}from"./StepperSteps.js";const r=({children:s,stepCount:o,allowSkip:n,onComplete:i,onStepChange:l,direction:a="horizontal",steps:e,hideLabels:m=!1,showCompletedIcons:d=!1,css:S})=>{c(!(o&&e),"`Stepper` should only be given one of `stepCount` or `steps`. When both are provided, `steps` will be used and `stepCount` will be ignored.");const t=(e==null?void 0:e.length)||o||0;return p.createElement(C,{stepCount:t,allowSkip:n,onComplete:i,onStepChange:o?l:void 0,direction:a,steps:e||Array(t).fill(""),hideLabels:m,showCompletedIcons:d},p.createElement(h,{"aria-label":"progress",css:{width:"100%",...S}},s))},u=Object.assign(r,{StepBack:f,StepForward:w,Steps:b});r.displayName="Stepper";export{u as Stepper};
|
|
2
2
|
//# sourceMappingURL=Stepper.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import r from"react";import{Tile as l}from"../tile/Tile.js";import"../flex/Flex.js";import{useRouter as p}from"../../context/router/index.js";import{styled as m}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as f}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";const d=m.withConfig({shouldForwardStitchesProp:t=>["as"].includes(t)})(l,{"&[disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([disabled])":{cursor:"pointer",transform:"translateY(0)",transition:"transform 250ms ease","&::after":{content:"",position:"absolute",inset:0,boxShadow:"$2",opacity:0,transition:"opacity 250ms ease-out",borderRadius:"inherit",pointerEvents:"none"},"&:hover":{transform:"translateY(-$space$0)","&::after":{opacity:1}},"&:active":{bg:"$base2"},"&:focus-visible":{...f()}}}),i=r.forwardRef(({onClick:t,href:o,target:e,type:a="button",...s},n)=>{const{RouterLink:c}=p({href:o,target:e});return r.createElement(d,{...s,...o?{as:c,href:o,target:e,onClick:void 0}:{as:"button",type:a,onClick:t},ref:n})});i.displayName="TileInteractive";export{i as TileInteractive};
|
|
2
2
|
//# sourceMappingURL=TileInteractive.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TileInteractive.js","sources":["../../../src/components/tile-interactive/TileInteractive.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tile } from '~/components/tile'\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { focusVisibleStyleBlock } from '~/utilities'\n\nconst StyledTileInteractive = styled.withConfig({\n shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Tile, {\n '&[disabled]': {\n opacity: 0.3,\n cursor: 'not-allowed'\n },\n '&:not([disabled])': {\n cursor: 'pointer',\n transform: 'translateY(0)',\n transition: 'transform 250ms ease',\n '&::after': {\n content: '',\n position: 'absolute',\n inset: 0,\n boxShadow: '$2',\n opacity: 0,\n transition: 'opacity 250ms ease-out',\n borderRadius: 'inherit',\n pointerEvents: 'none'\n },\n '&:hover': {\n transform: 'translateY(-$space$0)',\n '&::after': {\n opacity: 1\n }\n },\n '&:active': {\n bg: '$base2'\n },\n '&:focus-visible': {\n ...focusVisibleStyleBlock()\n }\n }\n})\n\ntype TTileInteractiveProps = React.ComponentProps<\n typeof StyledTileInteractive\n> &\n React.ButtonHTMLAttributes<HTMLButtonElement> &\n NavigatorActions\n\nexport const TileInteractive: React.ForwardRefExoticComponent<TTileInteractiveProps> =\n React.forwardRef(({ onClick, href, type = 'button', ...rest }, ref) => {\n
|
|
1
|
+
{"version":3,"file":"TileInteractive.js","sources":["../../../src/components/tile-interactive/TileInteractive.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tile } from '~/components/tile'\nimport { useRouter } from '~/context/router'\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { focusVisibleStyleBlock } from '~/utilities'\n\nconst StyledTileInteractive = styled.withConfig({\n shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Tile, {\n '&[disabled]': {\n opacity: 0.3,\n cursor: 'not-allowed'\n },\n '&:not([disabled])': {\n cursor: 'pointer',\n transform: 'translateY(0)',\n transition: 'transform 250ms ease',\n '&::after': {\n content: '',\n position: 'absolute',\n inset: 0,\n boxShadow: '$2',\n opacity: 0,\n transition: 'opacity 250ms ease-out',\n borderRadius: 'inherit',\n pointerEvents: 'none'\n },\n '&:hover': {\n transform: 'translateY(-$space$0)',\n '&::after': {\n opacity: 1\n }\n },\n '&:active': {\n bg: '$base2'\n },\n '&:focus-visible': {\n ...focusVisibleStyleBlock()\n }\n }\n})\n\ntype TTileInteractiveProps = React.ComponentProps<\n typeof StyledTileInteractive\n> &\n React.ButtonHTMLAttributes<HTMLButtonElement> &\n NavigatorActions\n\nexport const TileInteractive: React.ForwardRefExoticComponent<TTileInteractiveProps> =\n React.forwardRef(\n ({ onClick, href, target, type = 'button', ...rest }, ref) => {\n const { RouterLink } = useRouter({ href, target })\n\n const elementSpecificProps = href\n ? { as: RouterLink, href, target, onClick: undefined }\n : { as: 'button' as React.ElementType, type, onClick }\n\n return (\n <StyledTileInteractive {...rest} {...elementSpecificProps} ref={ref} />\n )\n }\n )\n\nTileInteractive.displayName = 'TileInteractive'\n"],"names":["StyledTileInteractive","styled","propName","Tile","focusVisibleStyleBlock","TileInteractive","React","onClick","href","target","type","rest","ref","RouterLink","useRouter"],"mappings":"6cAQA,MAAMA,EAAwBC,EAAO,WAAW,CAC9C,0BAA4BC,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAAM,CACP,cAAe,CACb,QAAS,GACT,OAAQ,aACV,EACA,oBAAqB,CACnB,OAAQ,UACR,UAAW,gBACX,WAAY,uBACZ,WAAY,CACV,QAAS,GACT,SAAU,WACV,MAAO,EACP,UAAW,KACX,QAAS,EACT,WAAY,yBACZ,aAAc,UACd,cAAe,MACjB,EACA,UAAW,CACT,UAAW,wBACX,WAAY,CACV,QAAS,CACX,CACF,EACA,WAAY,CACV,GAAI,QACN,EACA,kBAAmB,CACjB,GAAGC,GACL,CACF,CACF,CAAC,EAQYC,EACXC,EAAM,WACJ,CAAC,CAAE,QAAAC,EAAS,KAAAC,EAAM,OAAAC,EAAQ,KAAAC,EAAO,YAAaC,CAAK,EAAGC,IAAQ,CAC5D,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,KAAAN,EAAM,OAAAC,CAAO,CAAC,EAMjD,OACEH,EAAA,cAACN,EAAA,CAAuB,GAAGW,EAAO,GALPH,EACzB,CAAE,GAAIK,EAAY,KAAAL,EAAM,OAAAC,EAAQ,QAAS,MAAU,EACnD,CAAE,GAAI,SAA+B,KAAAC,EAAM,QAAAH,CAAQ,EAGM,IAAKK,CAAAA,CAAK,CAEzE,CACF,EAEFP,EAAgB,YAAc"}
|
|
@@ -379,7 +379,7 @@ export declare const TopBar: {
|
|
|
379
379
|
({ size, className, ...props }: TopBarProps): JSX.Element;
|
|
380
380
|
displayName: string;
|
|
381
381
|
} & {
|
|
382
|
-
Brand: ({ href, ...props }: Omit<Pick<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "key" | keyof React.AnchorHTMLAttributes<HTMLAnchorElement>> & {
|
|
382
|
+
Brand: ({ href, target, ...props }: Omit<Pick<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "key" | keyof React.AnchorHTMLAttributes<HTMLAnchorElement>> & {
|
|
383
383
|
ref?: ((instance: HTMLAnchorElement | null) => void) | React.RefObject<HTMLAnchorElement> | null | undefined;
|
|
384
384
|
}, "css"> & import("@stitches/react/types/styled-component").TransformProps<{}, {
|
|
385
385
|
sm: string;
|
|
@@ -1118,5 +1118,5 @@ declare const StyledTopBarBrand: import("@stitches/react/types/styled-component"
|
|
|
1118
1118
|
marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
|
|
1119
1119
|
};
|
|
1120
1120
|
}>>;
|
|
1121
|
-
export declare const TopBarBrand: ({ href, ...props }: React.ComponentProps<typeof StyledTopBarBrand>) => JSX.Element;
|
|
1121
|
+
export declare const TopBarBrand: ({ href, target, ...props }: React.ComponentProps<typeof StyledTopBarBrand>) => JSX.Element;
|
|
1122
1122
|
export {};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"react";import{useRouter as
|
|
1
|
+
import e from"react";import{useRouter as s}from"../../context/router/index.js";import{styled as a}from"../../stitches.js";import{Image as c}from"../image/Image.js";import{Text as l}from"../text/Text.js";const n=({src:o,alt:t="Atom Learning logo",css:r})=>e.createElement(c,{className:"topbar-brand-logo",src:o,alt:t,css:{mr:"$3",mb:"5px",...r}});n.toString=()=>".topbar-brand-logo";const p=a(l,{color:"$tonal400"}),i=a("a",{display:"flex",alignItems:"center",textDecoration:"none",color:"$tonal400","&:hover, &:focus":{textDecoration:"none"}}),f=({href:o,target:t,...r})=>{const{RouterLink:m}=s({href:o,target:t});return e.createElement(i,{as:m,href:o,target:t,...r})};export{f as TopBarBrand,n as TopBarBrandLogo,p as TopBarBrandName};
|
|
2
2
|
//# sourceMappingURL=TopBarBrand.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopBarBrand.js","sources":["../../../src/components/top-bar/TopBarBrand.tsx"],"sourcesContent":["import React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { CSS, styled } from '~/stitches'\n\nimport { Image } from '../image'\nimport { Text } from '../text'\n\ntype TopBarBrandLogoProps = {\n src: string\n alt?: string\n css?: CSS\n}\n\nexport const TopBarBrandLogo = ({\n src,\n alt = 'Atom Learning logo',\n css\n}: TopBarBrandLogoProps): JSX.Element => (\n <Image\n className=\"topbar-brand-logo\"\n src={src}\n alt={alt}\n css={{\n mr: '$3',\n mb: '5px',\n ...css\n }}\n />\n)\n\nTopBarBrandLogo.toString = () => '.topbar-brand-logo'\n\nexport const TopBarBrandName = styled(Text, {\n color: '$tonal400'\n})\n\nconst StyledTopBarBrand = styled('a', {\n display: 'flex',\n alignItems: 'center',\n textDecoration: 'none',\n color: '$tonal400',\n '&:hover, &:focus': { textDecoration: 'none' }\n})\n\nexport const TopBarBrand = ({\n href,\n ...props\n}: React.ComponentProps<typeof StyledTopBarBrand>) => {\n const { RouterLink } = useRouter({ href })\n return <StyledTopBarBrand as={RouterLink} href={href} {...props} />\n}\n"],"names":["TopBarBrandLogo","src","alt","css","React","Image","TopBarBrandName","styled","Text","StyledTopBarBrand","TopBarBrand","href","props","RouterLink","useRouter"],"mappings":"2MAcO,MAAMA,EAAkB,CAAC,CAC9B,IAAAC,EACA,IAAAC,EAAM,qBACN,IAAAC,CACF,IACEC,EAAA,cAACC,EAAA,CACC,UAAU,oBACV,IAAKJ,EACL,IAAKC,EACL,IAAK,CACH,GAAI,KACJ,GAAI,MACJ,GAAGC,CACL,CAAA,
|
|
1
|
+
{"version":3,"file":"TopBarBrand.js","sources":["../../../src/components/top-bar/TopBarBrand.tsx"],"sourcesContent":["import React from 'react'\n\nimport { useRouter } from '~/context/router'\nimport { CSS, styled } from '~/stitches'\n\nimport { Image } from '../image'\nimport { Text } from '../text'\n\ntype TopBarBrandLogoProps = {\n src: string\n alt?: string\n css?: CSS\n}\n\nexport const TopBarBrandLogo = ({\n src,\n alt = 'Atom Learning logo',\n css\n}: TopBarBrandLogoProps): JSX.Element => (\n <Image\n className=\"topbar-brand-logo\"\n src={src}\n alt={alt}\n css={{\n mr: '$3',\n mb: '5px',\n ...css\n }}\n />\n)\n\nTopBarBrandLogo.toString = () => '.topbar-brand-logo'\n\nexport const TopBarBrandName = styled(Text, {\n color: '$tonal400'\n})\n\nconst StyledTopBarBrand = styled('a', {\n display: 'flex',\n alignItems: 'center',\n textDecoration: 'none',\n color: '$tonal400',\n '&:hover, &:focus': { textDecoration: 'none' }\n})\n\nexport const TopBarBrand = ({\n href,\n target,\n ...props\n}: React.ComponentProps<typeof StyledTopBarBrand>) => {\n const { RouterLink } = useRouter({ href, target })\n return (\n <StyledTopBarBrand as={RouterLink} href={href} target={target} {...props} />\n )\n}\n"],"names":["TopBarBrandLogo","src","alt","css","React","Image","TopBarBrandName","styled","Text","StyledTopBarBrand","TopBarBrand","href","target","props","RouterLink","useRouter"],"mappings":"2MAcO,MAAMA,EAAkB,CAAC,CAC9B,IAAAC,EACA,IAAAC,EAAM,qBACN,IAAAC,CACF,IACEC,EAAA,cAACC,EAAA,CACC,UAAU,oBACV,IAAKJ,EACL,IAAKC,EACL,IAAK,CACH,GAAI,KACJ,GAAI,MACJ,GAAGC,CACL,CACF,CAAA,EAGFH,EAAgB,SAAW,IAAM,qBAEpB,MAAAM,EAAkBC,EAAOC,EAAM,CAC1C,MAAO,WACT,CAAC,EAEKC,EAAoBF,EAAO,IAAK,CACpC,QAAS,OACT,WAAY,SACZ,eAAgB,OAChB,MAAO,YACP,mBAAoB,CAAE,eAAgB,MAAO,CAC/C,CAAC,EAEYG,EAAc,CAAC,CAC1B,KAAAC,EACA,OAAAC,KACGC,CACL,IAAsD,CACpD,KAAM,CAAE,WAAAC,CAAW,EAAIC,EAAU,CAAE,KAAAJ,EAAM,OAAAC,CAAO,CAAC,EACjD,OACER,EAAA,cAACK,EAAA,CAAkB,GAAIK,EAAY,KAAMH,EAAM,OAAQC,EAAS,GAAGC,CAAAA,CAAO,CAE9E"}
|
|
@@ -3,8 +3,9 @@ export declare const RouterProvider: ({ children, Link }: {
|
|
|
3
3
|
children: any;
|
|
4
4
|
Link: any;
|
|
5
5
|
}) => JSX.Element;
|
|
6
|
-
export declare const useRouter: ({ href }: {
|
|
6
|
+
export declare const useRouter: ({ href, target }: {
|
|
7
7
|
href?: string | undefined;
|
|
8
|
+
target?: string | undefined;
|
|
8
9
|
}) => {
|
|
9
10
|
RouterLink: string | ((props: any) => JSX.Element);
|
|
10
11
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as t from"react";import{isAbsoluteUrl as i,isUriScheme as s}from"../../utilities/uri/index.js";const u=(e,r)=>e&&!i(e)&&!s(e)&&r!=="_self",o=t.createContext({Link:e=>t.createElement("a",{...e})}),a=({children:e,Link:r})=>t.createElement(o.Provider,{value:{Link:r}},e),c=({href:e,target:r})=>{const{Link:n}=t.useContext(o);return{RouterLink:u(e,r)?n:"a"}};export{a as RouterProvider,c as useRouter};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/context/router/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport {
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/context/router/index.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { isAbsoluteUrl, isUriScheme } from '~/utilities/uri'\n\nconst shouldUseRouter = (url?: string, target?: string) =>\n url && !isAbsoluteUrl(url) && !isUriScheme(url) && target !== '_self'\n\nconst RouterContext = React.createContext({\n // eslint-disable-next-line jsx-a11y/anchor-has-content\n Link: (props) => <a {...props} />\n})\n\nexport const RouterProvider = ({ children, Link }) => (\n <RouterContext.Provider value={{ Link }}>{children}</RouterContext.Provider>\n)\n\nexport const useRouter = ({\n href,\n target\n}: {\n href?: string\n target?: string\n}) => {\n const { Link: RouterLink } = React.useContext(RouterContext)\n\n return {\n RouterLink: shouldUseRouter(href, target) ? RouterLink : 'a'\n }\n}\n"],"names":["shouldUseRouter","url","target","isAbsoluteUrl","isUriScheme","RouterContext","React","props","RouterProvider","children","Link","useRouter","href","RouterLink"],"mappings":"sGAIA,MAAMA,EAAkB,CAACC,EAAcC,IACrCD,GAAO,CAACE,EAAcF,CAAG,GAAK,CAACG,EAAYH,CAAG,GAAKC,IAAW,QAE1DG,EAAgBC,EAAM,cAAc,CAExC,KAAOC,GAAUD,EAAA,cAAC,IAAG,CAAA,GAAGC,EAAO,CACjC,CAAC,EAEYC,EAAiB,CAAC,CAAE,SAAAC,EAAU,KAAAC,CAAK,IAC9CJ,EAAA,cAACD,EAAc,SAAd,CAAuB,MAAO,CAAE,KAAAK,CAAK,GAAID,CAAS,EAGxCE,EAAY,CAAC,CACxB,KAAAC,EACA,OAAAV,CACF,IAGM,CACJ,KAAM,CAAE,KAAMW,CAAW,EAAIP,EAAM,WAAWD,CAAa,EAE3D,MAAO,CACL,WAAYL,EAAgBY,EAAMV,CAAM,EAAIW,EAAa,GAC3D,CACF"}
|