@atom-learning/components 6.16.0-beta.0 → 6.16.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/components/router-provider/RouterProvider.d.ts +0 -1
  2. package/dist/components/router-provider/RouterProvider.js +6 -2
  3. package/dist/components/router-provider/RouterProvider.js.map +1 -1
  4. package/dist/components/tile-interactive/TileInteractive.d.ts +3 -1
  5. package/dist/components/tile-interactive/TileInteractive.js +4 -2
  6. package/dist/components/tile-interactive/TileInteractive.js.map +1 -1
  7. package/dist/components/tile-toggle-group/TileToggleGroupItem.d.ts +3 -1
  8. package/dist/docgen.json +1 -1
  9. package/dist/index.cjs.js +9 -4
  10. package/dist/index.cjs.js.map +1 -1
  11. package/package.json +1 -1
package/dist/components/router-provider/RouterProvider.d.ts CHANGED
@@ -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
  }) => {
package/dist/components/router-provider/RouterProvider.js CHANGED
@@ -1,11 +1,15 @@
1
1
  import * as React$1 from "react";
2
2
  //#region src/components/router-provider/RouterProvider.tsx
3
3
  var RouterContext = React$1.createContext({});
4
- var RouterProvider = ({ link, children }) => /* @__PURE__ */ React$1.createElement(RouterContext.Provider, { value: { link } }, children);
4
+ var RouterProvider = ({ link, children }) => {
5
+ const value = React$1.useMemo(() => ({ link }), [link]);
6
+ return /* @__PURE__ */ React$1.createElement(RouterContext.Provider, { value }, children);
7
+ };
5
8
  var isAbsoluteUrl = (url) => /^https?:\/\//.test(url || "");
9
+ var EMPTY = {};
6
10
  var useRouterLinkProps = (href, { reloadDocument } = {}) => {
7
11
  const { link } = React$1.useContext(RouterContext);
8
- if (!link || !href || isAbsoluteUrl(href) || reloadDocument) return {};
12
+ if (!link || !href || isAbsoluteUrl(href) || reloadDocument) return EMPTY;
9
13
  return { as: link };
10
14
  };
11
15
  RouterProvider.displayName = "RouterProvider";
package/dist/components/router-provider/RouterProvider.js.map CHANGED
@@ -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 const value = React.useMemo<RouterContextValue>(() => ({ link }), [link])\n return <RouterContext.Provider value={value}>{children}</RouterContext.Provider>\n}\n\nconst isAbsoluteUrl = (url?: string) => /^https?:\\/\\//.test(url || '')\n\nconst EMPTY: { as?: LinkComponent } = {}\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 EMPTY\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,eAAoC;CACzE,MAAM,QAAQ,QAAM,eAAmC,EAAE,MAAM,GAAG,CAAC,KAAK,CAAC;AACzE,QAAO,wBAAA,cAAC,cAAc,UAAf,EAA+B,OAA0C,EAAlC,SAAkC;;AAGlF,IAAM,iBAAiB,QAAiB,eAAe,KAAK,OAAO,GAAG;AAEtE,IAAM,QAAgC,EAAE;AAExC,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;AAGT,QAAO,EAAE,IAAI,MAAM;;AAGrB,eAAe,cAAc"}
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>;