@atom-learning/components 6.15.0 → 6.16.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/components/action-icon/ActionIcon.d.ts +1 -0
  2. package/dist/components/action-icon/ActionIcon.js +4 -2
  3. package/dist/components/action-icon/ActionIcon.js.map +1 -1
  4. package/dist/components/banner/banner-regular/BannerRegular.d.ts +1 -0
  5. package/dist/components/banner/banner-regular/BannerRegularDismiss.d.ts +2 -1
  6. package/dist/components/banner/banner-slim/BannerSlim.d.ts +1 -0
  7. package/dist/components/banner/banner-slim/BannerSlimDismiss.d.ts +2 -1
  8. package/dist/components/button/Button.d.ts +1 -0
  9. package/dist/components/button/Button.js +17 -13
  10. package/dist/components/button/Button.js.map +1 -1
  11. package/dist/components/dropdown-menu/DropdownMenu.d.ts +2 -1
  12. package/dist/components/dropdown-menu/DropdownMenuLinkItem.d.ts +2 -1
  13. package/dist/components/dropdown-menu/DropdownMenuLinkItem.js +13 -8
  14. package/dist/components/dropdown-menu/DropdownMenuLinkItem.js.map +1 -1
  15. package/dist/components/index.d.ts +1 -0
  16. package/dist/components/link/Link.d.ts +1 -0
  17. package/dist/components/link/Link.js +13 -9
  18. package/dist/components/link/Link.js.map +1 -1
  19. package/dist/components/navigation-menu-vertical/NavigationMenuVertical.d.ts +3 -1
  20. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.d.ts +4 -2
  21. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js +5 -3
  22. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js.map +1 -1
  23. package/dist/components/number-input/NumberInputStepper.d.ts +2 -1
  24. package/dist/components/pagination/PaginationNextButton.d.ts +2 -1
  25. package/dist/components/pagination/PaginationPreviousButton.d.ts +2 -1
  26. package/dist/components/router-provider/RouterProvider.d.ts +16 -0
  27. package/dist/components/router-provider/RouterProvider.js +15 -0
  28. package/dist/components/router-provider/RouterProvider.js.map +1 -0
  29. package/dist/components/sortable/Handle.d.ts +2 -1
  30. package/dist/components/tile-interactive/TileInteractive.d.ts +3 -1
  31. package/dist/components/tile-interactive/TileInteractive.js +4 -2
  32. package/dist/components/tile-interactive/TileInteractive.js.map +1 -1
  33. package/dist/components/tile-toggle-group/TileToggleGroupItem.d.ts +3 -1
  34. package/dist/components/top-bar/TopBar.d.ts +2 -1
  35. package/dist/docgen.json +1 -1
  36. package/dist/index.cjs.js +62 -37
  37. package/dist/index.cjs.js.map +1 -1
  38. package/dist/index.js +2 -1
  39. package/package.json +1 -1
package/dist/components/action-icon/ActionIcon.d.ts CHANGED
@@ -15,6 +15,7 @@ declare const StyledButton: React.ForwardRefExoticComponent<Omit<Omit<React.Deta
15
15
  type ActionIconProps = Override<React.ComponentProps<typeof StyledButton>, {
16
16
  children: React.ReactNode;
17
17
  label: string;
18
+ reloadDocument?: boolean;
18
19
  } & Omit<TOptionalTooltipWrapperProps, 'label'> & NavigatorActions>;
19
20
  export declare const ActionIcon: React.ForwardRefExoticComponent<Omit<ActionIconProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
20
21
  export {};
package/dist/components/action-icon/ActionIcon.js CHANGED
@@ -2,6 +2,7 @@ import { styled } from "../../styled.js";
2
2
  import { Icon } from "../icon/Icon.js";
3
3
  import { OptionalTooltipWrapper } from "../../utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js";
4
4
  import { getExternalAnchorProps } from "../../utilities/uri/index.js";
5
+ import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
5
6
  import { ActionIconSizeMap } from "./ActionIcon.constants.js";
6
7
  import * as React$1 from "react";
7
8
  import invariant from "invariant";
@@ -101,11 +102,12 @@ var StyledButton = styled("button", {
101
102
  isRounded: { true: ["rounded-full"] }
102
103
  }
103
104
  }, { enabledResponsiveVariants: true });
104
- var ActionIcon = React$1.forwardRef(({ children, theme = "primary", appearance = "simple", size = "sm", label, href, disabled, hasTooltip = true, tooltipSide, ...remainingProps }, ref) => {
105
+ var ActionIcon = React$1.forwardRef(({ children, theme = "primary", appearance = "simple", size = "sm", label, href, disabled, hasTooltip = true, tooltipSide, reloadDocument, ...remainingProps }, ref) => {
105
106
  const INVALID_CHILDREN_MESSAGE = `A single ${Icon.displayName} component is permitted as a child of ${ActionIcon.displayName}`;
106
107
  invariant(React$1.Children.count(children) === 1, INVALID_CHILDREN_MESSAGE);
108
+ const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
107
109
  const optionalLinkProps = href ? {
108
- as: "a",
110
+ as: routerLinkProps.as || "a",
109
111
  href: disabled ? void 0 : href,
110
112
  onClick: void 0,
111
113
  "aria-disabled": !!disabled
package/dist/components/action-icon/ActionIcon.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ActionIcon.js","names":[],"sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst StyledButton = styled(\n 'button',\n {\n base: [\n 'items-center',\n 'appearance-none',\n 'bg-white',\n 'rounded-md',\n 'box-border',\n 'cursor-pointer',\n 'flex',\n 'shrink-0',\n 'justify-center',\n 'transition-all',\n 'duration-100',\n 'ease-out',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n theme: {\n neutral: [\n '[--solid-base:var(--color-white)]',\n '[--solid-interact:var(--color-grey-100)]',\n '[--solid-active:var(--color-grey-200)]',\n '[--solid-text:var(--color-grey-1200)]',\n '[--base:var(--color-grey-700)]',\n '[--interact:var(--color-primary-900)]',\n '[--active:var(--color-primary-1100)]'\n ],\n primary: [\n '[--base:var(--color-primary-800)]',\n '[--interact:var(--color-primary-900)]',\n '[--active:var(--color-primary-1000)]'\n ],\n primaryDark: [\n '[--base:var(--color-primary-1000)]',\n '[--interact:var(--color-primary-1100)]',\n '[--active:var(--color-primary-1200)]'\n ],\n success: [\n '[--base:var(--color-success)]',\n '[--interact:var(--color-success-mid)]',\n '[--active:var(--color-success-dark)]'\n ],\n warning: [\n '[--base:var(--color-warning)]',\n '[--interact:var(--color-warning-mid)]',\n '[--active:var(--color-warning-dark)]'\n ],\n danger: [\n '[--base:var(--color-danger)]',\n '[--interact:var(--color-danger-mid)]',\n '[--active:var(--color-danger-dark)]'\n ],\n white: [\n '[--base:var(--color-white)]',\n '[--interact:var(--color-white)]',\n '[--active:var(--color-white)]'\n ]\n },\n appearance: {\n simple: [\n 'bg-transparent',\n 'text-(--base)',\n 'not-disabled:hover:text-(--interact)',\n 'not-disabled:focus:text-(--interact)',\n 'not-disabled:active:text-(--active)'\n ],\n outline: [\n 'bg-[unset]',\n 'border',\n 'border-current',\n 'text-(--base)',\n 'not-disabled:hover:text-(--interact)',\n 'not-disabled:focus:text-(--interact)',\n 'not-disabled:active:text-(--active)'\n ],\n solid: [\n 'bg-(--solid-base,var(--base))',\n 'text-(--solid-text,white)',\n 'not-disabled:hover:bg-(--solid-interact,var(--interact))',\n 'not-disabled:hover:text-(--solid-text,white)',\n 'not-disabled:focus:bg-(--solid-interact,var(--interact))',\n 'not-disabled:focus:text-(--solid-text,white)',\n 'not-disabled:active:bg-(--solid-active,var(--active))'\n ]\n },\n size: {\n xs: ['size-6'],\n sm: ['size-8'],\n md: ['size-10'],\n lg: ['size-12']\n },\n isRounded: {\n true: ['rounded-full']\n }\n }\n },\n {\n enabledResponsiveVariants: true\n }\n)\n\ntype ActionIconProps = Override<\n React.ComponentProps<typeof StyledButton>,\n {\n children: React.ReactNode\n label: string\n } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n NavigatorActions\n>\n\nexport const ActionIcon = React.forwardRef<HTMLButtonElement, ActionIconProps>(\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 // Polymorphic props: can be either button or anchor element\n // Type assertion needed due to TypeScript limitations with polymorphic components\n const optionalLinkProps = href\n ? ({\n as: 'a',\n href: disabled ? undefined : 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 as any)}\n {...getExternalAnchorProps(href)}\n {...remainingProps}\n aria-label={label}\n theme={theme}\n appearance={appearance}\n size={size}\n ref={ref as any}\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 }\n )\n })}\n </StyledButton>\n </OptionalTooltipWrapper>\n )\n }\n)\n\nActionIcon.displayName = 'ActionIcon'\n"],"mappings":";;;;;;;;AAaA,IAAM,eAAe,OACnB,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,aAAa;IACX;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,QAAQ;IACN;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GAChB;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAWD,IAAa,aAAa,QAAM,YAE5B,EACE,UACA,QAAQ,WACR,aAAa,UACb,OAAO,MACP,OACA,MACA,UACA,aAAa,MACb,aACA,GAAG,kBAEL,QACG;CACH,MAAM,2BAA2B,YAAY,KAAK,YAAY,wCAAwC,WAAW;AAEjH,WAAU,QAAM,SAAS,MAAM,SAAS,KAAK,GAAG,yBAAyB;CAIzE,MAAM,oBAAoB,OACrB;EACC,IAAI;EACJ,MAAM,WAAW,KAAA,IAAY;EAC7B,SAAS,KAAA;EACT,iBAAiB,CAAC,CAAC;EACpB,GACA,EAAE,MAAM,UAAU;AAEvB,QACE,wBAAA,cAAC,wBAAD;EACc;EACL;EACM;EAiCU,EA/BvB,wBAAA,cAAC,cAAD;EACE,GAAK;EACL,GAAI,uBAAuB,KAAK;EAChC,GAAI;EACJ,cAAY;EACL;EACK;EACN;EACD;EACK;EAqBG,EAnBZ,QAAM,SAAS,IAAI,WAAW,UAAU;AAGvC,MAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MAAM,yBAAyB;AAG3C,YACE,MAAM,SAAS,MACf,oBAAoB,OAAO,KAAK,6BAA6B,KAAK,YAAY,2BAA2B,WAAW,cACrH;AAED,SAAO,QAAM,aACX,OACA,EACE,MAAM,kBAAkB,OACzB,CACF;GACD,CACW,CACQ;EAG9B;AAED,WAAW,cAAc"}
1
+ {"version":3,"file":"ActionIcon.js","names":[],"sources":["../../../src/components/action-icon/ActionIcon.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport type { TOptionalTooltipWrapperProps } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { OptionalTooltipWrapper } from '~/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { Icon } from '../icon/Icon'\nimport { useRouterLinkProps } from '../router-provider/RouterProvider'\nimport { ActionIconSizeMap } from './ActionIcon.constants'\n\nconst StyledButton = styled(\n 'button',\n {\n base: [\n 'items-center',\n 'appearance-none',\n 'bg-white',\n 'rounded-md',\n 'box-border',\n 'cursor-pointer',\n 'flex',\n 'shrink-0',\n 'justify-center',\n 'transition-all',\n 'duration-100',\n 'ease-out',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n theme: {\n neutral: [\n '[--solid-base:var(--color-white)]',\n '[--solid-interact:var(--color-grey-100)]',\n '[--solid-active:var(--color-grey-200)]',\n '[--solid-text:var(--color-grey-1200)]',\n '[--base:var(--color-grey-700)]',\n '[--interact:var(--color-primary-900)]',\n '[--active:var(--color-primary-1100)]'\n ],\n primary: [\n '[--base:var(--color-primary-800)]',\n '[--interact:var(--color-primary-900)]',\n '[--active:var(--color-primary-1000)]'\n ],\n primaryDark: [\n '[--base:var(--color-primary-1000)]',\n '[--interact:var(--color-primary-1100)]',\n '[--active:var(--color-primary-1200)]'\n ],\n success: [\n '[--base:var(--color-success)]',\n '[--interact:var(--color-success-mid)]',\n '[--active:var(--color-success-dark)]'\n ],\n warning: [\n '[--base:var(--color-warning)]',\n '[--interact:var(--color-warning-mid)]',\n '[--active:var(--color-warning-dark)]'\n ],\n danger: [\n '[--base:var(--color-danger)]',\n '[--interact:var(--color-danger-mid)]',\n '[--active:var(--color-danger-dark)]'\n ],\n white: [\n '[--base:var(--color-white)]',\n '[--interact:var(--color-white)]',\n '[--active:var(--color-white)]'\n ]\n },\n appearance: {\n simple: [\n 'bg-transparent',\n 'text-(--base)',\n 'not-disabled:hover:text-(--interact)',\n 'not-disabled:focus:text-(--interact)',\n 'not-disabled:active:text-(--active)'\n ],\n outline: [\n 'bg-[unset]',\n 'border',\n 'border-current',\n 'text-(--base)',\n 'not-disabled:hover:text-(--interact)',\n 'not-disabled:focus:text-(--interact)',\n 'not-disabled:active:text-(--active)'\n ],\n solid: [\n 'bg-(--solid-base,var(--base))',\n 'text-(--solid-text,white)',\n 'not-disabled:hover:bg-(--solid-interact,var(--interact))',\n 'not-disabled:hover:text-(--solid-text,white)',\n 'not-disabled:focus:bg-(--solid-interact,var(--interact))',\n 'not-disabled:focus:text-(--solid-text,white)',\n 'not-disabled:active:bg-(--solid-active,var(--active))'\n ]\n },\n size: {\n xs: ['size-6'],\n sm: ['size-8'],\n md: ['size-10'],\n lg: ['size-12']\n },\n isRounded: {\n true: ['rounded-full']\n }\n }\n },\n {\n enabledResponsiveVariants: true\n }\n)\n\ntype ActionIconProps = Override<\n React.ComponentProps<typeof StyledButton>,\n {\n children: React.ReactNode\n label: string\n reloadDocument?: boolean\n } & Omit<TOptionalTooltipWrapperProps, 'label'> &\n NavigatorActions\n>\n\nexport const ActionIcon = React.forwardRef<HTMLButtonElement, ActionIconProps>(\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 reloadDocument,\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 routerLinkProps = useRouterLinkProps(href, { reloadDocument })\n\n // Polymorphic props: can be either button or anchor element\n // Type assertion needed due to TypeScript limitations with polymorphic components\n const optionalLinkProps = href\n ? ({\n as: routerLinkProps.as || 'a',\n href: disabled ? undefined : 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 as any)}\n {...getExternalAnchorProps(href)}\n {...remainingProps}\n aria-label={label}\n theme={theme}\n appearance={appearance}\n size={size}\n ref={ref as any}\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 }\n )\n })}\n </StyledButton>\n </OptionalTooltipWrapper>\n )\n }\n)\n\nActionIcon.displayName = 'ActionIcon'\n"],"mappings":";;;;;;;;;AAcA,IAAM,eAAe,OACnB,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,aAAa;IACX;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,QAAQ;IACN;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,SAAS;GACd,IAAI,CAAC,UAAU;GACf,IAAI,CAAC,UAAU;GAChB;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAYD,IAAa,aAAa,QAAM,YAE5B,EACE,UACA,QAAQ,WACR,aAAa,UACb,OAAO,MACP,OACA,MACA,UACA,aAAa,MACb,aACA,gBACA,GAAG,kBAEL,QACG;CACH,MAAM,2BAA2B,YAAY,KAAK,YAAY,wCAAwC,WAAW;AAEjH,WAAU,QAAM,SAAS,MAAM,SAAS,KAAK,GAAG,yBAAyB;CAEzE,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;CAIpE,MAAM,oBAAoB,OACrB;EACC,IAAI,gBAAgB,MAAM;EAC1B,MAAM,WAAW,KAAA,IAAY;EAC7B,SAAS,KAAA;EACT,iBAAiB,CAAC,CAAC;EACpB,GACA,EAAE,MAAM,UAAU;AAEvB,QACE,wBAAA,cAAC,wBAAD;EACc;EACL;EACM;EAiCU,EA/BvB,wBAAA,cAAC,cAAD;EACE,GAAK;EACL,GAAI,uBAAuB,KAAK;EAChC,GAAI;EACJ,cAAY;EACL;EACK;EACN;EACD;EACK;EAqBG,EAnBZ,QAAM,SAAS,IAAI,WAAW,UAAU;AAGvC,MAAI,CAAC,QAAM,eAAe,MAAM,CAC9B,OAAM,IAAI,MAAM,yBAAyB;AAG3C,YACE,MAAM,SAAS,MACf,oBAAoB,OAAO,KAAK,6BAA6B,KAAK,YAAY,2BAA2B,WAAW,cACrH;AAED,SAAO,QAAM,aACX,OACA,EACE,MAAM,kBAAkB,OACzB,CACF;GACD,CACW,CACQ;EAG9B;AAED,WAAW,cAAc"}
package/dist/components/banner/banner-regular/BannerRegular.d.ts CHANGED
@@ -314,6 +314,7 @@ export declare const BannerRegular: {
314
314
  formTarget?: string | undefined | undefined;
315
315
  hasTooltip?: boolean | undefined;
316
316
  tooltipSide?: "bottom" | "left" | "right" | "top" | undefined;
317
+ reloadDocument?: boolean | undefined;
317
318
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
318
319
  }): React.JSX.Element;
319
320
  displayName: string;
package/dist/components/banner/banner-regular/BannerRegularDismiss.d.ts CHANGED
@@ -8,9 +8,10 @@ declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit
8
8
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
9
9
  } & {
10
10
  as?: React.ElementType;
11
- }, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../../..").NavigatorActions> & {
11
+ }, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../../..").NavigatorActions> & {
12
12
  children: React.ReactNode;
13
13
  label: string;
14
+ reloadDocument?: boolean;
14
15
  } & Omit<import("../../..").TOptionalTooltipWrapperProps, "label"> & import("../../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
15
16
  as?: React.ElementType;
16
17
  }>;
package/dist/components/banner/banner-slim/BannerSlim.d.ts CHANGED
@@ -302,6 +302,7 @@ export declare const BannerSlim: {
302
302
  formTarget?: string | undefined | undefined;
303
303
  hasTooltip?: boolean | undefined;
304
304
  tooltipSide?: "bottom" | "left" | "right" | "top" | undefined;
305
+ reloadDocument?: boolean | undefined;
305
306
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
306
307
  emphasis?: ("bold" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold">>) | undefined;
307
308
  containerSize?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;
package/dist/components/banner/banner-slim/BannerSlimDismiss.d.ts CHANGED
@@ -8,9 +8,10 @@ declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit
8
8
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
9
9
  } & {
10
10
  as?: React.ElementType;
11
- }, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../../..").NavigatorActions> & {
11
+ }, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../../..").NavigatorActions> & {
12
12
  children: React.ReactNode;
13
13
  label: string;
14
+ reloadDocument?: boolean;
14
15
  } & Omit<import("../../..").TOptionalTooltipWrapperProps, "label"> & import("../../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "emphasis" | "containerSize"> & {
15
16
  emphasis?: ("bold" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold">>) | undefined;
16
17
  containerSize?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;
package/dist/components/button/Button.d.ts CHANGED
@@ -16,6 +16,7 @@ type ButtonProps = Override<React.ComponentProps<typeof StyledButton>, {
16
16
  children: React.ReactNode;
17
17
  href?: string;
18
18
  isLoading?: boolean;
19
+ reloadDocument?: boolean;
19
20
  } & NavigatorActions>;
20
21
  export declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLElement>>;
21
22
  export {};
package/dist/components/button/Button.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { styled } from "../../styled.js";
2
2
  import { getExternalAnchorProps } from "../../utilities/uri/index.js";
3
+ import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
3
4
  import { Loader } from "../loader/Loader.js";
4
5
  import * as React$1 from "react";
5
6
  //#region src/components/button/Button.tsx
@@ -144,19 +145,22 @@ var LoaderContentsWrapper = styled("span", {
144
145
  defaultVariants: { size: "md" }
145
146
  }, { enabledResponsiveVariants: true });
146
147
  var WithLoader = ({ size, children }) => /* @__PURE__ */ React$1.createElement(React$1.Fragment, null, /* @__PURE__ */ React$1.createElement(Loader, { className: "absolute" }), /* @__PURE__ */ React$1.createElement(LoaderContentsWrapper, { size }, children));
147
- var Button = React$1.forwardRef(({ children, as, href, isLoading = false, onClick, disabled, ...rest }, ref) => /* @__PURE__ */ React$1.createElement(StyledButton, {
148
- as: as || (href ? "a" : void 0),
149
- ...!disabled && !isLoading && {
150
- href,
151
- onClick
152
- },
153
- isLoading,
154
- type: !href ? "button" : void 0,
155
- disabled,
156
- ...rest,
157
- ...getExternalAnchorProps(href),
158
- ref
159
- }, isLoading ? /* @__PURE__ */ React$1.createElement(WithLoader, { size: rest.size }, children) : children));
148
+ var Button = React$1.forwardRef(({ children, as, href, isLoading = false, onClick, disabled, reloadDocument, ...rest }, ref) => {
149
+ const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
150
+ return /* @__PURE__ */ React$1.createElement(StyledButton, {
151
+ as: as || routerLinkProps.as || (href ? "a" : void 0),
152
+ ...!disabled && !isLoading && {
153
+ href,
154
+ onClick
155
+ },
156
+ isLoading,
157
+ type: !href ? "button" : void 0,
158
+ disabled,
159
+ ...rest,
160
+ ...getExternalAnchorProps(href),
161
+ ref
162
+ }, isLoading ? /* @__PURE__ */ React$1.createElement(WithLoader, { size: rest.size }, children) : children);
163
+ });
160
164
  Button.displayName = "Button";
161
165
  //#endregion
162
166
  export { Button, StyledButton };
package/dist/components/button/Button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","names":[],"sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Loader } from '~/components/loader/Loader'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nexport const StyledButton = styled(\n 'button',\n {\n base: [\n 'items-center',\n 'bg-[unset]',\n 'rounded-md',\n 'cursor-pointer',\n 'flex',\n 'font-body',\n 'font-semibold',\n 'justify-center',\n 'no-underline',\n 'transition-all',\n 'duration-100',\n 'ease-out',\n 'whitespace-nowrap',\n 'w-max',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n theme: {\n primary: [\n '[--base:var(--color-primary-800)]',\n '[--interact:var(--color-primary-900)]',\n '[--active:var(--color-primary-1000)]'\n ],\n secondary: [\n '[--base:var(--color-primary-1000)]',\n '[--interact:var(--color-primary-1100)]',\n '[--active:var(--color-primary-1200)]'\n ],\n success: [\n '[--base:var(--color-success)]',\n '[--interact:var(--color-success-mid)]',\n '[--active:var(--color-success-dark)]'\n ],\n warning: [\n '[--base:var(--color-warning)]',\n '[--interact:var(--color-warning-mid)]',\n '[--active:var(--color-warning-dark)]',\n '[--text:var(--color-grey-800)]'\n ],\n danger: [\n '[--base:var(--color-danger)]',\n '[--interact:var(--color-danger-mid)]',\n '[--active:var(--color-danger-dark)]'\n ],\n neutral: [\n '[--base:white]',\n '[--interact:rgba(255,255,255,0.9)]',\n '[--active:rgba(255,255,255,0.75)]',\n '[--text:var(--color-primary-800)]'\n ]\n },\n appearance: {\n solid: [\n 'bg-(--base)',\n 'text-(--text,white)',\n 'disabled:opacity-30',\n 'disabled:cursor-not-allowed',\n 'not-disabled:hover:bg-(--interact)',\n 'not-disabled:hover:text-(--text,white)',\n 'not-disabled:focus:bg-(--interact)',\n 'not-disabled:focus:text-(--text,white)',\n 'not-disabled:active:bg-(--active)'\n ],\n outline: [\n 'border',\n 'border-current',\n 'text-(--base)',\n 'disabled:opacity-30',\n 'disabled:cursor-not-allowed',\n 'not-disabled:hover:no-underline',\n 'not-disabled:hover:text-(--interact)',\n 'not-disabled:focus:no-underline',\n 'not-disabled:focus:text-(--interact)',\n 'not-disabled:active:text-(--active)'\n ]\n },\n size: {\n sm: [\n 'text-sm',\n 'leading-[1.53]',\n 'h-8',\n 'px-4',\n 'gap-2',\n '[&_svg]:size-4'\n ],\n md: [\n 'text-md',\n 'leading-normal',\n 'h-10',\n 'px-8',\n 'gap-3',\n '[&_svg]:size-5'\n ],\n lg: [\n 'text-lg',\n 'leading-normal',\n 'h-12',\n 'px-8',\n 'gap-3',\n '[&_svg]:size-[22px]'\n ],\n xl: [\n 'text-lg',\n 'leading-normal',\n 'h-16',\n 'px-8',\n 'gap-3',\n '[&_svg]:size-[22px]'\n ]\n },\n isLoading: {\n true: ['cursor-not-allowed opacity-60 pointer-events-none']\n },\n fullWidth: {\n true: ['w-full'],\n false: ['w-max']\n }\n },\n defaultVariants: {\n appearance: 'solid',\n size: 'md',\n theme: 'primary'\n }\n },\n {\n enabledResponsiveVariants: true\n }\n)\n\nconst LoaderContentsWrapper = styled(\n 'span',\n {\n base: ['items-center', 'flex', 'justify-center', 'invisible'],\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 {\n enabledResponsiveVariants: true\n }\n)\n\nconst WithLoader = ({\n size,\n children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n <>\n <Loader className=\"absolute\" />\n <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n </>\n)\n\ntype ButtonProps = Override<\n React.ComponentProps<typeof StyledButton>,\n {\n children: React.ReactNode\n href?: string\n isLoading?: boolean\n } & NavigatorActions\n>\n\nexport const Button = React.forwardRef<HTMLElement, ButtonProps>(\n (\n { children, as, href, isLoading = false, onClick, disabled, ...rest },\n ref\n ) => (\n <StyledButton\n as={as || (href ? 'a' : undefined)}\n {...(!disabled && !isLoading && { href, onClick })}\n isLoading={isLoading}\n type={!href ? 'button' : undefined}\n disabled={disabled}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref as any}\n >\n {isLoading ? (\n <WithLoader size={rest.size}>{children}</WithLoader>\n ) : (\n children\n )}\n </StyledButton>\n )\n)\n\nButton.displayName = 'Button'\n"],"mappings":";;;;;AAQA,IAAa,eAAe,OAC1B,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACD;GACD,WAAW;IACT;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,WAAW,EACT,MAAM,CAAC,oDAAoD,EAC5D;EACD,WAAW;GACT,MAAM,CAAC,SAAS;GAChB,OAAO,CAAC,QAAQ;GACjB;EACF;CACD,iBAAiB;EACf,YAAY;EACZ,MAAM;EACN,OAAO;EACR;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,wBAAwB,OAC5B,QACA;CACE,MAAM;EAAC;EAAgB;EAAQ;EAAkB;EAAY;CAC7D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACd,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,cAAc,EAClB,MACA,eAEA,wBAAA,cAAA,QAAA,UAAA,MACE,wBAAA,cAAC,QAAD,EAAQ,WAAU,YAAa,CAAA,EAC/B,wBAAA,cAAC,uBAAD,EAA6B,MAAwC,EAAjC,SAAiC,CACpE;AAYL,IAAa,SAAS,QAAM,YAExB,EAAE,UAAU,IAAI,MAAM,YAAY,OAAO,SAAS,UAAU,GAAG,QAC/D,QAEA,wBAAA,cAAC,cAAD;CACE,IAAI,OAAO,OAAO,MAAM,KAAA;CACxB,GAAK,CAAC,YAAY,CAAC,aAAa;EAAE;EAAM;EAAS;CACtC;CACX,MAAM,CAAC,OAAO,WAAW,KAAA;CACf;CACV,GAAI;CACJ,GAAI,uBAAuB,KAAK;CAC3B;CAOQ,EALZ,YACC,wBAAA,cAAC,YAAD,EAAY,MAAM,KAAK,MAA6B,EAAtB,SAAsB,GAEpD,SAEW,CAElB;AAED,OAAO,cAAc"}
1
+ {"version":3,"file":"Button.js","names":[],"sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Loader } from '~/components/loader/Loader'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { useRouterLinkProps } from '../router-provider/RouterProvider'\n\nexport const StyledButton = styled(\n 'button',\n {\n base: [\n 'items-center',\n 'bg-[unset]',\n 'rounded-md',\n 'cursor-pointer',\n 'flex',\n 'font-body',\n 'font-semibold',\n 'justify-center',\n 'no-underline',\n 'transition-all',\n 'duration-100',\n 'ease-out',\n 'whitespace-nowrap',\n 'w-max',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n theme: {\n primary: [\n '[--base:var(--color-primary-800)]',\n '[--interact:var(--color-primary-900)]',\n '[--active:var(--color-primary-1000)]'\n ],\n secondary: [\n '[--base:var(--color-primary-1000)]',\n '[--interact:var(--color-primary-1100)]',\n '[--active:var(--color-primary-1200)]'\n ],\n success: [\n '[--base:var(--color-success)]',\n '[--interact:var(--color-success-mid)]',\n '[--active:var(--color-success-dark)]'\n ],\n warning: [\n '[--base:var(--color-warning)]',\n '[--interact:var(--color-warning-mid)]',\n '[--active:var(--color-warning-dark)]',\n '[--text:var(--color-grey-800)]'\n ],\n danger: [\n '[--base:var(--color-danger)]',\n '[--interact:var(--color-danger-mid)]',\n '[--active:var(--color-danger-dark)]'\n ],\n neutral: [\n '[--base:white]',\n '[--interact:rgba(255,255,255,0.9)]',\n '[--active:rgba(255,255,255,0.75)]',\n '[--text:var(--color-primary-800)]'\n ]\n },\n appearance: {\n solid: [\n 'bg-(--base)',\n 'text-(--text,white)',\n 'disabled:opacity-30',\n 'disabled:cursor-not-allowed',\n 'not-disabled:hover:bg-(--interact)',\n 'not-disabled:hover:text-(--text,white)',\n 'not-disabled:focus:bg-(--interact)',\n 'not-disabled:focus:text-(--text,white)',\n 'not-disabled:active:bg-(--active)'\n ],\n outline: [\n 'border',\n 'border-current',\n 'text-(--base)',\n 'disabled:opacity-30',\n 'disabled:cursor-not-allowed',\n 'not-disabled:hover:no-underline',\n 'not-disabled:hover:text-(--interact)',\n 'not-disabled:focus:no-underline',\n 'not-disabled:focus:text-(--interact)',\n 'not-disabled:active:text-(--active)'\n ]\n },\n size: {\n sm: [\n 'text-sm',\n 'leading-[1.53]',\n 'h-8',\n 'px-4',\n 'gap-2',\n '[&_svg]:size-4'\n ],\n md: [\n 'text-md',\n 'leading-normal',\n 'h-10',\n 'px-8',\n 'gap-3',\n '[&_svg]:size-5'\n ],\n lg: [\n 'text-lg',\n 'leading-normal',\n 'h-12',\n 'px-8',\n 'gap-3',\n '[&_svg]:size-[22px]'\n ],\n xl: [\n 'text-lg',\n 'leading-normal',\n 'h-16',\n 'px-8',\n 'gap-3',\n '[&_svg]:size-[22px]'\n ]\n },\n isLoading: {\n true: ['cursor-not-allowed opacity-60 pointer-events-none']\n },\n fullWidth: {\n true: ['w-full'],\n false: ['w-max']\n }\n },\n defaultVariants: {\n appearance: 'solid',\n size: 'md',\n theme: 'primary'\n }\n },\n {\n enabledResponsiveVariants: true\n }\n)\n\nconst LoaderContentsWrapper = styled(\n 'span',\n {\n base: ['items-center', 'flex', 'justify-center', 'invisible'],\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 {\n enabledResponsiveVariants: true\n }\n)\n\nconst WithLoader = ({\n size,\n children\n}: React.ComponentProps<typeof LoaderContentsWrapper>) => (\n <>\n <Loader className=\"absolute\" />\n <LoaderContentsWrapper size={size}>{children}</LoaderContentsWrapper>\n </>\n)\n\ntype ButtonProps = Override<\n React.ComponentProps<typeof StyledButton>,\n {\n children: React.ReactNode\n href?: string\n isLoading?: boolean\n reloadDocument?: boolean\n } & NavigatorActions\n>\n\nexport const Button = React.forwardRef<HTMLElement, ButtonProps>(\n (\n {\n children,\n as,\n href,\n isLoading = false,\n onClick,\n disabled,\n reloadDocument,\n ...rest\n },\n ref\n ) => {\n const routerLinkProps = useRouterLinkProps(href, { reloadDocument })\n\n return (\n <StyledButton\n as={as || routerLinkProps.as || (href ? 'a' : undefined)}\n {...(!disabled && !isLoading && { href, onClick })}\n isLoading={isLoading}\n type={!href ? 'button' : undefined}\n disabled={disabled}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref as any}\n >\n {isLoading ? (\n <WithLoader size={rest.size}>{children}</WithLoader>\n ) : (\n children\n )}\n </StyledButton>\n )\n }\n)\n\nButton.displayName = 'Button'\n"],"mappings":";;;;;;AAUA,IAAa,eAAe,OAC1B,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS;IACP;IACA;IACA;IACD;GACD,WAAW;IACT;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACD;GACF;EACD,YAAY;GACV,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACD,SAAS;IACP;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,MAAM;GACJ,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,WAAW,EACT,MAAM,CAAC,oDAAoD,EAC5D;EACD,WAAW;GACT,MAAM,CAAC,SAAS;GAChB,OAAO,CAAC,QAAQ;GACjB;EACF;CACD,iBAAiB;EACf,YAAY;EACZ,MAAM;EACN,OAAO;EACR;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,wBAAwB,OAC5B,QACA;CACE,MAAM;EAAC;EAAgB;EAAQ;EAAkB;EAAY;CAC7D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACb,IAAI,CAAC,QAAQ;EACd,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EACE,2BAA2B,MAC5B,CACF;AAED,IAAM,cAAc,EAClB,MACA,eAEA,wBAAA,cAAA,QAAA,UAAA,MACE,wBAAA,cAAC,QAAD,EAAQ,WAAU,YAAa,CAAA,EAC/B,wBAAA,cAAC,uBAAD,EAA6B,MAAwC,EAAjC,SAAiC,CACpE;AAaL,IAAa,SAAS,QAAM,YAExB,EACE,UACA,IACA,MACA,YAAY,OACZ,SACA,UACA,gBACA,GAAG,QAEL,QACG;CACH,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;AAEpE,QACE,wBAAA,cAAC,cAAD;EACE,IAAI,MAAM,gBAAgB,OAAO,OAAO,MAAM,KAAA;EAC9C,GAAK,CAAC,YAAY,CAAC,aAAa;GAAE;GAAM;GAAS;EACtC;EACX,MAAM,CAAC,OAAO,WAAW,KAAA;EACf;EACV,GAAI;EACJ,GAAI,uBAAuB,KAAK;EAC3B;EAOQ,EALZ,YACC,wBAAA,cAAC,YAAD,EAAY,MAAM,KAAK,MAA6B,EAAtB,SAAsB,GAEpD,SAEW;EAGpB;AAED,OAAO,cAAc"}
package/dist/components/dropdown-menu/DropdownMenu.d.ts CHANGED
@@ -7,8 +7,9 @@ export declare const DropdownMenu: React.FC<import("@radix-ui/react-dropdown-men
7
7
  Item: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, never> & {
8
8
  as?: React.ElementType;
9
9
  }>;
10
- LinkItem: ({ children, href, ...props }: React.ComponentProps<typeof DropdownMenuItem> & {
10
+ LinkItem: ({ children, href, reloadDocument, ...props }: React.ComponentProps<typeof DropdownMenuItem> & {
11
11
  href: string;
12
+ reloadDocument?: boolean;
12
13
  }) => React.JSX.Element;
13
14
  Portal: React.FC<import("@radix-ui/react-dropdown-menu").DropdownMenuPortalProps>;
14
15
  Separator: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dropdown-menu").DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, never> & {
package/dist/components/dropdown-menu/DropdownMenuLinkItem.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import { DropdownMenuItem } from './DropdownMenuItem';
3
- export declare const DropdownMenuLinkItem: ({ children, href, ...props }: React.ComponentProps<typeof DropdownMenuItem> & {
3
+ export declare const DropdownMenuLinkItem: ({ children, href, reloadDocument, ...props }: React.ComponentProps<typeof DropdownMenuItem> & {
4
4
  href: string;
5
+ reloadDocument?: boolean;
5
6
  }) => React.JSX.Element;
package/dist/components/dropdown-menu/DropdownMenuLinkItem.js CHANGED
@@ -1,17 +1,22 @@
1
1
  import { styled } from "../../styled.js";
2
2
  import { getExternalAnchorProps } from "../../utilities/uri/index.js";
3
+ import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
3
4
  import { DropdownMenuItem } from "./DropdownMenuItem.js";
4
5
  import React from "react";
5
6
  //#region src/components/dropdown-menu/DropdownMenuLinkItem.tsx
6
7
  var StyledLink = styled("a", { base: ["no-underline"] });
7
- var DropdownMenuLinkItem = ({ children, href, ...props }) => /* @__PURE__ */ React.createElement(DropdownMenuItem, {
8
- ...props,
9
- asChild: true
10
- }, /* @__PURE__ */ React.createElement(StyledLink, {
11
- href,
12
- role: "menuitem",
13
- ...getExternalAnchorProps(href)
14
- }, children));
8
+ var DropdownMenuLinkItem = ({ children, href, reloadDocument, ...props }) => {
9
+ const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
10
+ return /* @__PURE__ */ React.createElement(DropdownMenuItem, {
11
+ ...props,
12
+ asChild: true
13
+ }, /* @__PURE__ */ React.createElement(StyledLink, {
14
+ as: routerLinkProps.as,
15
+ href,
16
+ role: "menuitem",
17
+ ...getExternalAnchorProps(href)
18
+ }, children));
19
+ };
15
20
  //#endregion
16
21
  export { DropdownMenuLinkItem };
17
22
 
package/dist/components/dropdown-menu/DropdownMenuLinkItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DropdownMenuLinkItem.js","names":[],"sources":["../../../src/components/dropdown-menu/DropdownMenuLinkItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/styled'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { DropdownMenuItem } from './DropdownMenuItem'\n\nconst StyledLink = styled('a', {\n base: ['no-underline']\n})\n\nexport const DropdownMenuLinkItem = ({\n children,\n href,\n ...props\n}: React.ComponentProps<typeof DropdownMenuItem> & { href: string }) => (\n <DropdownMenuItem {...props} asChild>\n <StyledLink href={href} role=\"menuitem\" {...getExternalAnchorProps(href)}>\n {children}\n </StyledLink>\n </DropdownMenuItem>\n)\n"],"mappings":";;;;;AAOA,IAAM,aAAa,OAAO,KAAK,EAC7B,MAAM,CAAC,eAAe,EACvB,CAAC;AAEF,IAAa,wBAAwB,EACnC,UACA,MACA,GAAG,YAEH,sBAAA,cAAC,kBAAD;CAAkB,GAAI;CAAO,SAAA;CAIV,EAHjB,sBAAA,cAAC,YAAD;CAAkB;CAAM,MAAK;CAAW,GAAI,uBAAuB,KAAK;CAE3D,EADV,SACU,CACI"}
1
+ {"version":3,"file":"DropdownMenuLinkItem.js","names":[],"sources":["../../../src/components/dropdown-menu/DropdownMenuLinkItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/styled'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { useRouterLinkProps } from '../router-provider/RouterProvider'\nimport { DropdownMenuItem } from './DropdownMenuItem'\n\nconst StyledLink = styled('a', {\n base: ['no-underline']\n})\n\nexport const DropdownMenuLinkItem = ({\n children,\n href,\n reloadDocument,\n ...props\n}: React.ComponentProps<typeof DropdownMenuItem> & {\n href: string\n reloadDocument?: boolean\n}) => {\n const routerLinkProps = useRouterLinkProps(href, { reloadDocument })\n\n return (\n <DropdownMenuItem {...props} asChild>\n <StyledLink\n as={routerLinkProps.as}\n href={href}\n role=\"menuitem\"\n {...getExternalAnchorProps(href)}\n >\n {children}\n </StyledLink>\n </DropdownMenuItem>\n )\n}\n"],"mappings":";;;;;;AAQA,IAAM,aAAa,OAAO,KAAK,EAC7B,MAAM,CAAC,eAAe,EACvB,CAAC;AAEF,IAAa,wBAAwB,EACnC,UACA,MACA,gBACA,GAAG,YAIC;CACJ,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;AAEpE,QACE,sBAAA,cAAC,kBAAD;EAAkB,GAAI;EAAO,SAAA;EASV,EARjB,sBAAA,cAAC,YAAD;EACE,IAAI,gBAAgB;EACd;EACN,MAAK;EACL,GAAI,uBAAuB,KAAK;EAGrB,EADV,SACU,CACI"}
package/dist/components/index.d.ts CHANGED
@@ -62,6 +62,7 @@ export { RadioButton } from './radio-button/RadioButton';
62
62
  export { RadioButtonGroup } from './radio-button/RadioButtonGroup';
63
63
  export { RadioButtonField } from './radio-button-field/RadioButtonField';
64
64
  export { RadioCard } from './radio-card/RadioCard';
65
+ export { RouterProvider } from './router-provider/RouterProvider';
65
66
  export { RadioCardGroup } from './radio-card/RadioCardGroup';
66
67
  export { SearchField } from './search-field/SearchField';
67
68
  export { SearchInput } from './search-input/SearchInput';
package/dist/components/link/Link.d.ts CHANGED
@@ -11,6 +11,7 @@ export declare const StyledLink: React.ForwardRefExoticComponent<Omit<Omit<React
11
11
  }>;
12
12
  type LinkProps = Override<React.ComponentProps<typeof StyledLink>, NavigatorActions & {
13
13
  disabled?: boolean;
14
+ reloadDocument?: boolean;
14
15
  }>;
15
16
  export declare const Link: React.ForwardRefExoticComponent<Omit<LinkProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
16
17
  export {};
package/dist/components/link/Link.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { styled } from "../../styled.js";
2
2
  import { getExternalAnchorProps } from "../../utilities/uri/index.js";
3
+ import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
3
4
  import * as React$1 from "react";
4
5
  //#region src/components/link/Link.tsx
5
6
  var StyledLink = styled("a", {
@@ -53,15 +54,18 @@ var StyledLink = styled("a", {
53
54
  },
54
55
  defaultVariants: { size: "md" }
55
56
  }, { enabledResponsiveVariants: true });
56
- var Link = React$1.forwardRef(({ as, disabled, href, ...rest }, ref) => /* @__PURE__ */ React$1.createElement(StyledLink, {
57
- as: as || (!href ? "button" : void 0),
58
- noCapsize: !href ? true : void 0,
59
- href,
60
- ...disabled && { disabled: true },
61
- ...rest,
62
- ...getExternalAnchorProps(href),
63
- ref
64
- }));
57
+ var Link = React$1.forwardRef(({ as, disabled, href, reloadDocument, ...rest }, ref) => {
58
+ const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
59
+ return /* @__PURE__ */ React$1.createElement(StyledLink, {
60
+ as: as || routerLinkProps.as || (!href ? "button" : void 0),
61
+ noCapsize: !href ? true : void 0,
62
+ href,
63
+ ...disabled && { disabled: true },
64
+ ...rest,
65
+ ...getExternalAnchorProps(href),
66
+ ref
67
+ });
68
+ });
65
69
  Link.displayName = "Link";
66
70
  //#endregion
67
71
  export { Link, StyledLink };
package/dist/components/link/Link.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Link.js","names":[],"sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nexport const StyledLink = styled(\n 'a',\n {\n base: [\n 'bg-[unset]',\n 'text-primary-800',\n 'cursor-pointer',\n 'font-body',\n 'no-underline',\n 'focus:text-primary-900',\n 'focus:underline',\n 'hover:text-primary-900',\n 'hover:underline',\n 'active:text-primary-1000',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none',\n '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:after:content-none',\n '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:before:content-none',\n '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:text-[100%]/none'\n ],\n variants: {\n size: {\n xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]']\n },\n noCapsize: {\n true: ['capsize-none']\n }\n },\n defaultVariants: {\n size: 'md'\n }\n },\n { enabledResponsiveVariants: true }\n)\n\ntype LinkProps = Override<\n React.ComponentProps<typeof StyledLink>,\n NavigatorActions & { disabled?: boolean }\n>\n\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n ({ as, disabled, href, ...rest }, ref) => (\n <StyledLink\n as={as || (!href ? 'button' : undefined)}\n noCapsize={!href ? true : undefined}\n href={href}\n {...(disabled && { disabled: true })}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref as any}\n />\n )\n)\n\nLink.displayName = 'Link'\n"],"mappings":";;;;AAOA,IAAa,aAAa,OACxB,KACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EAAE,2BAA2B,MAAM,CACpC;AAOD,IAAa,OAAO,QAAM,YACvB,EAAE,IAAI,UAAU,MAAM,GAAG,QAAQ,QAChC,wBAAA,cAAC,YAAD;CACE,IAAI,OAAO,CAAC,OAAO,WAAW,KAAA;CAC9B,WAAW,CAAC,OAAO,OAAO,KAAA;CACpB;CACN,GAAK,YAAY,EAAE,UAAU,MAAM;CACnC,GAAI;CACJ,GAAI,uBAAuB,KAAK;CAC3B;CACL,CAAA,CAEL;AAED,KAAK,cAAc"}
1
+ {"version":3,"file":"Link.js","names":[],"sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\nimport { Override } from '~/utilities/types'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { useRouterLinkProps } from '../router-provider/RouterProvider'\n\nexport const StyledLink = styled(\n 'a',\n {\n base: [\n 'bg-[unset]',\n 'text-primary-800',\n 'cursor-pointer',\n 'font-body',\n 'no-underline',\n 'focus:text-primary-900',\n 'focus:underline',\n 'hover:text-primary-900',\n 'hover:underline',\n 'active:text-primary-1000',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none',\n '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:after:content-none',\n '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:before:content-none',\n '[p>&,h1>&,h2>&,h3>&,h4>&,li>&,em>&]:text-[100%]/none'\n ],\n variants: {\n size: {\n xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]']\n },\n noCapsize: {\n true: ['capsize-none']\n }\n },\n defaultVariants: {\n size: 'md'\n }\n },\n { enabledResponsiveVariants: true }\n)\n\ntype LinkProps = Override<\n React.ComponentProps<typeof StyledLink>,\n NavigatorActions & { disabled?: boolean; reloadDocument?: boolean }\n>\n\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n ({ as, disabled, href, reloadDocument, ...rest }, ref) => {\n const routerLinkProps = useRouterLinkProps(href, { reloadDocument })\n\n return (\n <StyledLink\n as={as || routerLinkProps.as || (!href ? 'button' : undefined)}\n noCapsize={!href ? true : undefined}\n href={href}\n {...(disabled && { disabled: true })}\n {...rest}\n {...getExternalAnchorProps(href)}\n ref={ref as any}\n />\n )\n }\n)\n\nLink.displayName = 'Link'\n"],"mappings":";;;;;AASA,IAAa,aAAa,OACxB,KACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACtD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,EACD,EAAE,2BAA2B,MAAM,CACpC;AAOD,IAAa,OAAO,QAAM,YACvB,EAAE,IAAI,UAAU,MAAM,gBAAgB,GAAG,QAAQ,QAAQ;CACxD,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;AAEpE,QACE,wBAAA,cAAC,YAAD;EACE,IAAI,MAAM,gBAAgB,OAAO,CAAC,OAAO,WAAW,KAAA;EACpD,WAAW,CAAC,OAAO,OAAO,KAAA;EACpB;EACN,GAAK,YAAY,EAAE,UAAU,MAAM;EACnC,GAAI;EACJ,GAAI,uBAAuB,KAAK;EAC3B;EACL,CAAA;EAGP;AAED,KAAK,cAAc"}
package/dist/components/navigation-menu-vertical/NavigationMenuVertical.d.ts CHANGED
@@ -4,10 +4,12 @@ declare const StyledRoot: React.ForwardRefExoticComponent<Omit<import("@radix-ui
4
4
  }>;
5
5
  type TNavigationVerticalProps = Omit<React.ComponentProps<typeof StyledRoot>, 'delayDuration' | 'skipDelayDuration' | 'defaultValue' | 'value' | 'onValueChange'>;
6
6
  export declare const NavigationMenuVertical: (({ children, ...rest }: TNavigationVerticalProps) => React.JSX.Element) & {
7
- Link: ({ as, href, children, ...rest }: Omit<import("@radix-ui/react-navigation-menu").NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>, "size"> & {
7
+ Link: ({ as, href, children, reloadDocument, ...rest }: Omit<import("@radix-ui/react-navigation-menu").NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>, "size"> & {
8
8
  size?: "md" | "lg" | undefined;
9
9
  } & {
10
10
  as?: React.ElementType;
11
+ } & {
12
+ reloadDocument?: boolean;
11
13
  }) => React.JSX.Element;
12
14
  Accordion: ({ defaultOpen, open, onOpenChange, disabled, ...rest }: import("@radix-ui/react-collapsible").CollapsibleProps & React.RefAttributes<HTMLDivElement> & {
13
15
  content?: string | undefined | undefined;
package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.d.ts CHANGED
@@ -4,6 +4,8 @@ declare const StyledNavigationMenuVerticalLink: React.ForwardRefExoticComponent<
4
4
  } & {
5
5
  as?: React.ElementType;
6
6
  }>;
7
- type NavigationMenuVerticalItemProps = React.ComponentProps<typeof StyledNavigationMenuVerticalLink>;
8
- export declare const NavigationMenuVerticalLink: ({ as, href, children, ...rest }: NavigationMenuVerticalItemProps) => React.JSX.Element;
7
+ type NavigationMenuVerticalItemProps = React.ComponentProps<typeof StyledNavigationMenuVerticalLink> & {
8
+ reloadDocument?: boolean;
9
+ };
10
+ export declare const NavigationMenuVerticalLink: ({ as, href, children, reloadDocument, ...rest }: NavigationMenuVerticalItemProps) => React.JSX.Element;
9
11
  export {};
package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { styled } from "../../styled.js";
2
2
  import { getExternalAnchorProps } from "../../utilities/uri/index.js";
3
+ import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
3
4
  import { preventEvent } from "../../utilities/event/preventEvent.js";
4
5
  import { NavigationMenuVerticalItem } from "./NavigationMenuVerticalItem.js";
5
6
  import { navigationMenuVerticalItemStyles } from "./NavigationMenuVertical.styles.js";
@@ -14,9 +15,10 @@ var StyledNavigationMenuVerticalLink = styled(Link, {
14
15
  lg: ["min-h-12"]
15
16
  } }
16
17
  });
17
- var NavigationMenuVerticalLink = ({ as, href, children, ...rest }) => {
18
- const Component = as || (href ? "a" : "button");
19
- const componentProps = as ? {} : href ? getExternalAnchorProps(href) : { type: "button" };
18
+ var NavigationMenuVerticalLink = ({ as, href, children, reloadDocument, ...rest }) => {
19
+ const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
20
+ const Component = as || routerLinkProps.as || (href ? "a" : "button");
21
+ const componentProps = as || routerLinkProps.as ? {} : href ? getExternalAnchorProps(href) : { type: "button" };
20
22
  return /* @__PURE__ */ React.createElement(NavigationMenuVerticalItem, null, /* @__PURE__ */ React.createElement(StyledNavigationMenuVerticalLink, {
21
23
  size: "lg",
22
24
  href,
package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NavigationMenuVerticalLink.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { preventEvent } from '~/utilities/event/preventEvent'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(Link, {\n base: navigationMenuVerticalItemStyles,\n variants: {\n size: {\n md: ['min-h-10'],\n lg: ['min-h-12']\n }\n }\n})\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalLink\n>\n\nexport const NavigationMenuVerticalLink = ({\n as,\n href,\n children,\n ...rest\n}: NavigationMenuVerticalItemProps) => {\n const Component = (as || (href ? 'a' : 'button')) as React.ElementType\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"],"mappings":";;;;;;;;;AAWA,IAAM,mCAAmC,OAAO,MAAM;CACpD,MAAM;CACN,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW;EAChB,IAAI,CAAC,WAAW;EACjB,EACF;CACF,CAAC;AAMF,IAAa,8BAA8B,EACzC,IACA,MACA,UACA,GAAG,WACkC;CACrC,MAAM,YAAa,OAAO,OAAO,MAAM;CACvC,MAAM,iBAAiB,KACnB,EAAE,GACF,OACE,uBAAuB,KAAK,GAC5B,EAAE,MAAM,UAAU;AAExB,QACE,sBAAA,cAAC,4BAAA,MACC,sBAAA,cAAC,kCAAD;EACE,MAAK;EACC;EACN,GAAI;EACJ,GAAI;EACJ,UAAU;EACV,SAAA;EAOiC,EALjC,sBAAA,cAAC,WAAA,MACC,sBAAA,cAAC,mCAAA,MACE,SACiC,CAC1B,CACqB,CACR"}
1
+ {"version":3,"file":"NavigationMenuVerticalLink.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { preventEvent } from '~/utilities/event/preventEvent'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { useRouterLinkProps } from '../router-provider/RouterProvider'\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(Link, {\n base: navigationMenuVerticalItemStyles,\n variants: {\n size: {\n md: ['min-h-10'],\n lg: ['min-h-12']\n }\n }\n})\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalLink\n> & { reloadDocument?: boolean }\n\nexport const NavigationMenuVerticalLink = ({\n as,\n href,\n children,\n reloadDocument,\n ...rest\n}: NavigationMenuVerticalItemProps) => {\n const routerLinkProps = useRouterLinkProps(href, { reloadDocument })\n const Component = (as ||\n routerLinkProps.as ||\n (href ? 'a' : 'button')) as React.ElementType\n const componentProps =\n as || routerLinkProps.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"],"mappings":";;;;;;;;;;AAYA,IAAM,mCAAmC,OAAO,MAAM;CACpD,MAAM;CACN,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW;EAChB,IAAI,CAAC,WAAW;EACjB,EACF;CACF,CAAC;AAMF,IAAa,8BAA8B,EACzC,IACA,MACA,UACA,gBACA,GAAG,WACkC;CACrC,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;CACpE,MAAM,YAAa,MACjB,gBAAgB,OACf,OAAO,MAAM;CAChB,MAAM,iBACJ,MAAM,gBAAgB,KAClB,EAAE,GACF,OACE,uBAAuB,KAAK,GAC5B,EAAE,MAAM,UAAU;AAE1B,QACE,sBAAA,cAAC,4BAAA,MACC,sBAAA,cAAC,kCAAD;EACE,MAAK;EACC;EACN,GAAI;EACJ,GAAI;EACJ,UAAU;EACV,SAAA;EAOiC,EALjC,sBAAA,cAAC,WAAA,MACC,sBAAA,cAAC,mCAAA,MACE,SACiC,CAC1B,CACqB,CACR"}
package/dist/components/number-input/NumberInputStepper.d.ts CHANGED
@@ -9,9 +9,10 @@ declare const StyledStepperButton: React.ForwardRefExoticComponent<Omit<Omit<Omi
9
9
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
10
10
  } & {
11
11
  as?: React.ElementType;
12
- }, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
12
+ }, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../..").NavigatorActions> & {
13
13
  children: React.ReactNode;
14
14
  label: string;
15
+ reloadDocument?: boolean;
15
16
  } & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "emphasis" | "fieldAppearance" | "fieldTheme"> & {
16
17
  fieldAppearance?: "standard" | "modern" | undefined;
17
18
  fieldTheme?: "grey" | "white" | undefined;
package/dist/components/pagination/PaginationNextButton.d.ts CHANGED
@@ -8,9 +8,10 @@ declare const StyledActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<O
8
8
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
9
9
  } & {
10
10
  as?: React.ElementType;
11
- }, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
11
+ }, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../..").NavigatorActions> & {
12
12
  children: React.ReactNode;
13
13
  label: string;
14
+ reloadDocument?: boolean;
14
15
  } & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
15
16
  as?: React.ElementType;
16
17
  }>;
package/dist/components/pagination/PaginationPreviousButton.d.ts CHANGED
@@ -8,9 +8,10 @@ declare const StyledActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<O
8
8
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
9
9
  } & {
10
10
  as?: React.ElementType;
11
- }, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
11
+ }, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../..").NavigatorActions> & {
12
12
  children: React.ReactNode;
13
13
  label: string;
14
+ reloadDocument?: boolean;
14
15
  } & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
15
16
  as?: React.ElementType;
16
17
  }>;
package/dist/components/router-provider/RouterProvider.d.ts ADDED
@@ -0,0 +1,16 @@
1
+ import * as React from 'react';
2
+ type LinkComponent = React.ComponentType<React.AnchorHTMLAttributes<HTMLAnchorElement>>;
3
+ type RouterProviderProps = {
4
+ link: LinkComponent;
5
+ children: React.ReactNode;
6
+ };
7
+ export declare const RouterProvider: {
8
+ ({ link, children }: RouterProviderProps): React.JSX.Element;
9
+ displayName: string;
10
+ };
11
+ export declare const useRouterLinkProps: (href?: string, { reloadDocument }?: {
12
+ reloadDocument?: boolean;
13
+ }) => {
14
+ as?: LinkComponent;
15
+ };
16
+ export {};
package/dist/components/router-provider/RouterProvider.js ADDED
@@ -0,0 +1,15 @@
1
+ import * as React$1 from "react";
2
+ //#region src/components/router-provider/RouterProvider.tsx
3
+ var RouterContext = React$1.createContext({});
4
+ var RouterProvider = ({ link, children }) => /* @__PURE__ */ React$1.createElement(RouterContext.Provider, { value: { link } }, children);
5
+ var isAbsoluteUrl = (url) => /^https?:\/\//.test(url || "");
6
+ var useRouterLinkProps = (href, { reloadDocument } = {}) => {
7
+ const { link } = React$1.useContext(RouterContext);
8
+ if (!link || !href || isAbsoluteUrl(href) || reloadDocument) return {};
9
+ return { as: link };
10
+ };
11
+ RouterProvider.displayName = "RouterProvider";
12
+ //#endregion
13
+ export { RouterProvider, useRouterLinkProps };
14
+
15
+ //# sourceMappingURL=RouterProvider.js.map
package/dist/components/router-provider/RouterProvider.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RouterProvider.js","names":[],"sources":["../../../src/components/router-provider/RouterProvider.tsx"],"sourcesContent":["import * as React from 'react'\n\ntype LinkComponent = React.ComponentType<\n React.AnchorHTMLAttributes<HTMLAnchorElement>\n>\n\ntype RouterContextValue = {\n link?: LinkComponent\n}\n\nconst RouterContext = React.createContext<RouterContextValue>({})\n\ntype RouterProviderProps = {\n link: LinkComponent\n children: React.ReactNode\n}\n\nexport const RouterProvider = ({ link, children }: RouterProviderProps) => (\n <RouterContext.Provider value={{ link }}>{children}</RouterContext.Provider>\n)\n\nconst isAbsoluteUrl = (url?: string) => /^https?:\\/\\//.test(url || '')\n\nexport const useRouterLinkProps = (\n href?: string,\n { reloadDocument }: { reloadDocument?: boolean } = {}\n): { as?: LinkComponent } => {\n const { link } = React.useContext(RouterContext)\n\n if (!link || !href || isAbsoluteUrl(href) || reloadDocument) {\n return {}\n }\n\n return { as: link }\n}\n\nRouterProvider.displayName = 'RouterProvider'\n"],"mappings":";;AAUA,IAAM,gBAAgB,QAAM,cAAkC,EAAE,CAAC;AAOjE,IAAa,kBAAkB,EAAE,MAAM,eACrC,wBAAA,cAAC,cAAc,UAAf,EAAwB,OAAO,EAAE,MAAM,EAAqC,EAAlC,SAAkC;AAG9E,IAAM,iBAAiB,QAAiB,eAAe,KAAK,OAAO,GAAG;AAEtE,IAAa,sBACX,MACA,EAAE,mBAAiD,EAAE,KAC1B;CAC3B,MAAM,EAAE,SAAS,QAAM,WAAW,cAAc;AAEhD,KAAI,CAAC,QAAQ,CAAC,QAAQ,cAAc,KAAK,IAAI,eAC3C,QAAO,EAAE;AAGX,QAAO,EAAE,IAAI,MAAM;;AAGrB,eAAe,cAAc"}
package/dist/components/sortable/Handle.d.ts CHANGED
@@ -9,9 +9,10 @@ export declare const StyledHandle: React.ForwardRefExoticComponent<Omit<Omit<Omi
9
9
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
10
10
  } & {
11
11
  as?: React.ElementType;
12
- }, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
12
+ }, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../..").NavigatorActions> & {
13
13
  children: React.ReactNode;
14
14
  label: string;
15
+ reloadDocument?: boolean;
15
16
  } & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "isDragging"> & {
16
17
  isDragging?: boolean | undefined;
17
18
  } & {
package/dist/components/tile-interactive/TileInteractive.d.ts CHANGED
@@ -13,6 +13,8 @@ declare const StyledTileInteractive: React.ForwardRefExoticComponent<Omit<Omit<O
13
13
  }, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
14
14
  as?: React.ElementType;
15
15
  }>;
16
- type TTileInteractiveProps = React.ComponentProps<typeof StyledTileInteractive> & React.ButtonHTMLAttributes<HTMLButtonElement> & NavigatorActions;
16
+ type TTileInteractiveProps = React.ComponentProps<typeof StyledTileInteractive> & React.ButtonHTMLAttributes<HTMLButtonElement> & NavigatorActions & {
17
+ reloadDocument?: boolean;
18
+ };
17
19
  export declare const TileInteractive: React.ForwardRefExoticComponent<Omit<TTileInteractiveProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
18
20
  export {};
package/dist/components/tile-interactive/TileInteractive.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import { styled } from "../../styled.js";
2
+ import { useRouterLinkProps } from "../router-provider/RouterProvider.js";
2
3
  import { Tile } from "../tile/Tile.js";
3
4
  import React from "react";
4
5
  //#region src/components/tile-interactive/TileInteractive.tsx
@@ -28,9 +29,10 @@ var StyledTileInteractive = styled(Tile, { base: [
28
29
  "not-disabled:transition-transform",
29
30
  "not-disabled:translate-y-0"
30
31
  ] });
31
- var TileInteractive = React.forwardRef(({ onClick, href, type = "button", as, ...rest }, ref) => {
32
+ var TileInteractive = React.forwardRef(({ onClick, href, type = "button", as, reloadDocument, ...rest }, ref) => {
33
+ const routerLinkProps = useRouterLinkProps(href, { reloadDocument });
32
34
  const elementSpecificProps = !!href ? {
33
- as: as || "a",
35
+ as: as || routerLinkProps.as || "a",
34
36
  href,
35
37
  onClick: void 0
36
38
  } : {
package/dist/components/tile-interactive/TileInteractive.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TileInteractive.js","names":[],"sources":["../../../src/components/tile-interactive/TileInteractive.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tile } from '~/components/tile/Tile'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\n\nconst StyledTileInteractive = styled(Tile, {\n base: [\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'not-disabled:active:bg-(--base-2)',\n 'not-disabled:after:absolute',\n 'not-disabled:after:duration-250',\n 'not-disabled:after:ease-out',\n 'not-disabled:after:inset-0',\n 'not-disabled:after:opacity-0',\n 'not-disabled:after:pointer-events-none',\n 'not-disabled:after:rounded-[inherit]',\n 'not-disabled:after:shadow-lg',\n 'not-disabled:after:transition-opacity',\n 'not-disabled:cursor-pointer',\n 'not-disabled:duration-250',\n 'not-disabled:ease-in',\n 'not-disabled:focus-visible:outline-none',\n 'not-disabled:focus-visible:relative',\n 'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n 'not-disabled:focus-visible:z-1',\n 'not-disabled:hover:after:opacity-100',\n 'not-disabled:hover:-translate-y-0.5',\n 'not-disabled:transition-transform',\n 'not-disabled:translate-y-0'\n ]\n})\n\ntype TTileInteractiveProps = React.ComponentProps<\n typeof StyledTileInteractive\n> &\n React.ButtonHTMLAttributes<HTMLButtonElement> &\n NavigatorActions\n\nexport const TileInteractive = React.forwardRef<\n HTMLDivElement,\n TTileInteractiveProps\n>(({ onClick, href, type = 'button', as, ...rest }, ref) => {\n const isLink = !!href\n const elementSpecificProps = isLink\n ? {\n as: as || ('a' as React.ElementType),\n href,\n onClick: undefined\n }\n : {\n as: as || ('button' as React.ElementType),\n type,\n onClick\n }\n\n return <StyledTileInteractive {...rest} {...elementSpecificProps} ref={ref} />\n})\n\nTileInteractive.displayName = 'TileInteractive'\n"],"mappings":";;;;AAMA,IAAM,wBAAwB,OAAO,MAAM,EACzC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC;AAQF,IAAa,kBAAkB,MAAM,YAGlC,EAAE,SAAS,MAAM,OAAO,UAAU,IAAI,GAAG,QAAQ,QAAQ;CAE1D,MAAM,uBADS,CAAC,CAAC,OAEb;EACE,IAAI,MAAO;EACX;EACA,SAAS,KAAA;EACV,GACD;EACE,IAAI,MAAO;EACX;EACA;EACD;AAEL,QAAO,sBAAA,cAAC,uBAAD;EAAuB,GAAI;EAAM,GAAI;EAA2B;EAAO,CAAA;EAC9E;AAEF,gBAAgB,cAAc"}
1
+ {"version":3,"file":"TileInteractive.js","names":[],"sources":["../../../src/components/tile-interactive/TileInteractive.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tile } from '~/components/tile/Tile'\nimport { useRouterLinkProps } from '~/components/router-provider/RouterProvider'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\n\nconst StyledTileInteractive = styled(Tile, {\n base: [\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'not-disabled:active:bg-(--base-2)',\n 'not-disabled:after:absolute',\n 'not-disabled:after:duration-250',\n 'not-disabled:after:ease-out',\n 'not-disabled:after:inset-0',\n 'not-disabled:after:opacity-0',\n 'not-disabled:after:pointer-events-none',\n 'not-disabled:after:rounded-[inherit]',\n 'not-disabled:after:shadow-lg',\n 'not-disabled:after:transition-opacity',\n 'not-disabled:cursor-pointer',\n 'not-disabled:duration-250',\n 'not-disabled:ease-in',\n 'not-disabled:focus-visible:outline-none',\n 'not-disabled:focus-visible:relative',\n 'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n 'not-disabled:focus-visible:z-1',\n 'not-disabled:hover:after:opacity-100',\n 'not-disabled:hover:-translate-y-0.5',\n 'not-disabled:transition-transform',\n 'not-disabled:translate-y-0'\n ]\n})\n\ntype TTileInteractiveProps = React.ComponentProps<\n typeof StyledTileInteractive\n> &\n React.ButtonHTMLAttributes<HTMLButtonElement> &\n NavigatorActions & { reloadDocument?: boolean }\n\nexport const TileInteractive = React.forwardRef<\n HTMLDivElement,\n TTileInteractiveProps\n>(({ onClick, href, type = 'button', as, reloadDocument, ...rest }, ref) => {\n const routerLinkProps = useRouterLinkProps(href, { reloadDocument })\n const isLink = !!href\n const elementSpecificProps = isLink\n ? {\n as: as || routerLinkProps.as || ('a' as React.ElementType),\n href,\n onClick: undefined\n }\n : {\n as: as || ('button' as React.ElementType),\n type,\n onClick\n }\n\n return <StyledTileInteractive {...rest} {...elementSpecificProps} ref={ref} />\n})\n\nTileInteractive.displayName = 'TileInteractive'\n"],"mappings":";;;;;AAOA,IAAM,wBAAwB,OAAO,MAAM,EACzC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC;AAQF,IAAa,kBAAkB,MAAM,YAGlC,EAAE,SAAS,MAAM,OAAO,UAAU,IAAI,gBAAgB,GAAG,QAAQ,QAAQ;CAC1E,MAAM,kBAAkB,mBAAmB,MAAM,EAAE,gBAAgB,CAAC;CAEpE,MAAM,uBADS,CAAC,CAAC,OAEb;EACE,IAAI,MAAM,gBAAgB,MAAO;EACjC;EACA,SAAS,KAAA;EACV,GACD;EACE,IAAI,MAAO;EACX;EACA;EACD;AAEL,QAAO,sBAAA,cAAC,uBAAD;EAAuB,GAAI;EAAM,GAAI;EAA2B;EAAO,CAAA;EAC9E;AAEF,gBAAgB,cAAc"}
package/dist/components/tile-toggle-group/TileToggleGroupItem.d.ts CHANGED
@@ -12,7 +12,9 @@ declare const StyledTileToggleGroupItem: React.ForwardRefExoticComponent<Omit<Om
12
12
  colorScheme?: import("../..").TcolorScheme;
13
13
  }, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
14
14
  as?: React.ElementType;
15
- } & React.ButtonHTMLAttributes<HTMLButtonElement> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
15
+ } & React.ButtonHTMLAttributes<HTMLButtonElement> & import("../..").NavigatorActions & {
16
+ reloadDocument?: boolean;
17
+ }, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
16
18
  as?: React.ElementType;
17
19
  }>;
18
20
  type TTileToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> & React.ComponentProps<typeof StyledTileToggleGroupItem>;
package/dist/components/top-bar/TopBar.d.ts CHANGED
@@ -51,9 +51,10 @@ export declare const TopBar: {
51
51
  isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
52
52
  } & {
53
53
  as?: React.ElementType;
54
- }, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
54
+ }, "children" | "label" | "hasTooltip" | "tooltipSide" | "reloadDocument" | keyof import("../..").NavigatorActions> & {
55
55
  children: React.ReactNode;
56
56
  label: string;
57
+ reloadDocument?: boolean;
57
58
  } & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "size" | "children"> & {
58
59
  icon: React.FC<React.SVGProps<SVGSVGElement>>;
59
60
  label: string;