@atom-learning/components 6.16.0-beta.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.
@@ -8,7 +8,6 @@ export declare const RouterProvider: {
8
8
  ({ link, children }: RouterProviderProps): React.JSX.Element;
9
9
  displayName: string;
10
10
  };
11
- export declare const useRouterLink: () => (props: React.AnchorHTMLAttributes<HTMLAnchorElement>) => React.JSX.Element | null;
12
11
  export declare const useRouterLinkProps: (href?: string, { reloadDocument }?: {
13
12
  reloadDocument?: boolean;
14
13
  }) => {
@@ -1 +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 useRouterLink = () => {\n const { link: CustomLink } = React.useContext(RouterContext)\n\n return React.useCallback(\n (props: React.AnchorHTMLAttributes<HTMLAnchorElement>) => {\n if (!CustomLink || isAbsoluteUrl(props.href)) {\n return null\n }\n return <CustomLink {...props} />\n },\n [CustomLink]\n )\n}\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;AAgBtE,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"}
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"}
@@ -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 {};
@@ -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
  } : {
@@ -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"}
@@ -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>;