@caseparts-org/caseblocks 0.0.22 → 0.0.24

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.
@@ -1 +1 @@
1
- ._content_lgc5i_1{box-shadow:8px 8px 12px #00000026;background-color:#fff;padding:var(--spacing-1);box-sizing:border-box;width:max-content;border:1px solid var(--color-neutrals-neutral-1);border-radius:4px;z-index:9999}
1
+ ._content_ogovb_1{box-shadow:8px 8px 12px #00000026;background-color:#fff;padding:var(--spacing-1);box-sizing:border-box;width:max-content;border:1px solid var(--color-neutrals-neutral-1);border-radius:4px;z-index:9999}._wrapper_ogovb_12{position:relative;display:inline-block}._tooltip_ogovb_17{position:absolute;z-index:1000;padding:var(--spacing-0-5);background:var(--color-neutrals-neutral-1);border-radius:4px;box-shadow:0 4px 12px #0000002e;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .15s ease,transform .15s ease}._open_ogovb_30{opacity:1;visibility:visible;transform:translateY(0)}._tooltip_ogovb_17[data-position=top]{bottom:100%;left:50%;transform:translate(-50%,-4px)}._open_ogovb_30._tooltip_ogovb_17[data-position=top]{transform:translate(-50%)}._tooltip_ogovb_17[data-position=bottom]{top:100%;left:50%;transform:translate(-50%,4px)}._open_ogovb_30._tooltip_ogovb_17[data-position=bottom]{transform:translate(-50%)}._tooltip_ogovb_17[data-position=left]{right:100%;top:50%;transform:translate(-4px,-50%)}._open_ogovb_30._tooltip_ogovb_17[data-position=left]{transform:translateY(-50%)}._tooltip_ogovb_17[data-position=right]{left:100%;top:50%;transform:translate(4px,-50%)}._open_ogovb_30._tooltip_ogovb_17[data-position=right]{transform:translateY(-50%)}._tooltip_ogovb_17[data-position=top]{bottom:100%;left:50%;transform:translate(calc(-50% + var(--tooltip-shift-x, 0px)),-4px)}._open_ogovb_30._tooltip_ogovb_17[data-position=top]{transform:translate(calc(-50% + var(--tooltip-shift-x, 0px)))}._tooltip_ogovb_17[data-position=bottom]{top:100%;left:50%;transform:translate(calc(-50% + var(--tooltip-shift-x, 0px)),4px)}._open_ogovb_30._tooltip_ogovb_17[data-position=bottom]{transform:translate(calc(-50% + var(--tooltip-shift-x, 0px)))}._tooltip_ogovb_17[data-position=left]{right:100%;top:50%;transform:translate(-4px,calc(-50% + var(--tooltip-shift-y, 0px)))}._open_ogovb_30._tooltip_ogovb_17[data-position=left]{transform:translateY(calc(-50% + var(--tooltip-shift-y, 0px)))}._tooltip_ogovb_17[data-position=right]{left:100%;top:50%;transform:translate(4px,calc(-50% + var(--tooltip-shift-y, 0px)))}._open_ogovb_30._tooltip_ogovb_17[data-position=right]{transform:translateY(calc(-50% + var(--tooltip-shift-y, 0px)))}
@@ -1,7 +1,15 @@
1
+ import { default as React } from 'react';
1
2
  import { HideAtProps } from '../HideAt';
2
3
  /** A link element. */
3
4
  export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement>, HideAtProps {
4
- /** Is the link disabled? */
5
+ href: string;
6
+ children: React.ReactNode;
5
7
  disabled?: boolean;
6
8
  }
7
- export declare function Link({ href, children, disabled, hideAt, className, ...otherProps }: LinkProps): import("react/jsx-runtime").JSX.Element;
9
+ /** Signature an external router link (e.g. next/link) must satisfy */
10
+ export type LinkComponent = (_props: LinkProps) => JSX.Element;
11
+ export declare function LinkProvider({ component, children, }: {
12
+ component: LinkComponent;
13
+ children: React.ReactNode;
14
+ }): import("react/jsx-runtime").JSX.Element;
15
+ export declare function Link({ href, children, disabled, hideAt, className, onClick, ...otherProps }: LinkProps): import("react/jsx-runtime").JSX.Element;
@@ -1,35 +1,56 @@
1
- import { jsx as n } from "react/jsx-runtime";
2
- import { t as a } from "../../Text.module-smM1g1J4.js";
3
- import { c as d } from "../../clsx-OuTLNxxd.js";
4
- import { getHideAtStyles as m } from "../HideAt.js";
5
- import '../../assets/Link.css';const c = "_link_ygp31_1", f = "_disabled_ygp31_14", s = {
6
- link: c,
7
- disabled: f
8
- };
9
- function x({
10
- href: e,
11
- children: i,
1
+ import { jsx as a } from "react/jsx-runtime";
2
+ import c from "react";
3
+ import { t as k } from "../../Text.module-smM1g1J4.js";
4
+ import { c as y } from "../../clsx-OuTLNxxd.js";
5
+ import { getHideAtStyles as _ } from "../HideAt.js";
6
+ import '../../assets/Link.css';const g = "_link_ygp31_1", v = "_disabled_ygp31_14", f = {
7
+ link: g,
8
+ disabled: v
9
+ }, p = c.createContext(null);
10
+ function P({
11
+ component: n,
12
+ children: e
13
+ }) {
14
+ return /* @__PURE__ */ a(p.Provider, { value: n, children: e });
15
+ }
16
+ function S({
17
+ href: n,
18
+ children: e,
12
19
  disabled: t = !1,
13
- hideAt: o,
14
- className: l,
15
- ...r
20
+ hideAt: i,
21
+ className: u,
22
+ onClick: r,
23
+ ...o
16
24
  }) {
17
- return /* @__PURE__ */ n(
18
- "a",
19
- {
20
- href: t ? void 0 : e,
21
- className: d(
22
- a["text-body"],
23
- s.link,
24
- t ? s.disabled : "",
25
- m(o),
26
- l
27
- ),
28
- ...r,
29
- children: i
30
- }
25
+ const l = c.useContext(p), x = y(
26
+ k["text-body"],
27
+ f.link,
28
+ t && f.disabled,
29
+ _(i),
30
+ u
31
31
  );
32
+ function d(s) {
33
+ if (t) {
34
+ s.preventDefault(), s.stopPropagation();
35
+ return;
36
+ }
37
+ r == null || r(s);
38
+ }
39
+ const m = {
40
+ ...o,
41
+ href: t ? "#" : n,
42
+ className: x,
43
+ children: e,
44
+ disabled: t,
45
+ hideAt: i,
46
+ onClick: d,
47
+ "aria-disabled": t || void 0,
48
+ tabIndex: t ? -1 : o.tabIndex,
49
+ role: t ? "link" : o.role
50
+ };
51
+ return l ? /* @__PURE__ */ a(l, { ...m }) : /* @__PURE__ */ a("a", { ...m, children: e });
32
52
  }
33
53
  export {
34
- x as Link
54
+ S as Link,
55
+ P as LinkProvider
35
56
  };
package/dist/main.d.ts CHANGED
@@ -6,8 +6,6 @@ export { Grid, Column } from './atoms/Grid/Grid';
6
6
  export type { GridProps, ColumnProps } from './atoms/Grid/Grid';
7
7
  export { Head } from './atoms/Root/Head';
8
8
  export { Icon } from './atoms/Icon/Icon';
9
- export { Link } from './atoms/Link/Link';
10
- export type { LinkProps } from './atoms/Link/Link';
11
9
  export { Root } from './atoms/Root/Root';
12
10
  export { Separator } from './atoms/Separator/Separator';
13
11
  export type { SeparatorProps } from './atoms/Separator/Separator';
package/dist/main.js CHANGED
@@ -2,38 +2,36 @@ import { Button as e } from "./atoms/Button/Button.js";
2
2
  import { Flex as p } from "./atoms/Flex/Flex.js";
3
3
  import { Column as m, Grid as f } from "./atoms/Grid/Grid.js";
4
4
  import { Head as n } from "./atoms/Root/Head.js";
5
- import { Icon as c } from "./atoms/Icon/Icon.js";
6
- import { Link as u } from "./atoms/Link/Link.js";
7
- import { Root as h } from "./atoms/Root/Root.js";
8
- import { Separator as S } from "./atoms/Separator/Separator.js";
9
- import { Text as v } from "./atoms/Text/Text.js";
10
- import { Input as B } from "./atoms/Input/Input.js";
11
- import { Account as L } from "./molecules/Account/Account.js";
12
- import { Avatar as k } from "./molecules/Avatar/Avatar.js";
5
+ import { Icon as i } from "./atoms/Icon/Icon.js";
6
+ import { Root as u } from "./atoms/Root/Root.js";
7
+ import { Separator as h } from "./atoms/Separator/Separator.js";
8
+ import { Text as S } from "./atoms/Text/Text.js";
9
+ import { Input as v } from "./atoms/Input/Input.js";
10
+ import { Account as B } from "./molecules/Account/Account.js";
11
+ import { Avatar as T } from "./molecules/Avatar/Avatar.js";
13
12
  import { Chip as F } from "./molecules/Chip/Chip.js";
14
13
  import { Logo as H } from "./molecules/Logo/Logo.js";
15
- import { SearchBox as N } from "./molecules/SearchBox/SearchBox.js";
16
- import { ToggleView as V } from "./molecules/ToggleView/ToggleView.js";
17
- import { MainNav as j } from "./organisms/MainNav/MainNav.js";
18
- import { ChipSelector as s } from "./organisms/ChipSelector/ChipSelector.js";
14
+ import { SearchBox as M } from "./molecules/SearchBox/SearchBox.js";
15
+ import { ToggleView as R } from "./molecules/ToggleView/ToggleView.js";
16
+ import { MainNav as b } from "./organisms/MainNav/MainNav.js";
17
+ import { ChipSelector as k } from "./organisms/ChipSelector/ChipSelector.js";
19
18
  export {
20
- L as Account,
21
- k as Avatar,
19
+ B as Account,
20
+ T as Avatar,
22
21
  e as Button,
23
22
  F as Chip,
24
- s as ChipSelector,
23
+ k as ChipSelector,
25
24
  m as Column,
26
25
  p as Flex,
27
26
  f as Grid,
28
27
  n as Head,
29
- c as Icon,
30
- B as Input,
31
- u as Link,
28
+ i as Icon,
29
+ v as Input,
32
30
  H as Logo,
33
- j as MainNav,
34
- h as Root,
35
- N as SearchBox,
36
- S as Separator,
37
- v as Text,
38
- V as ToggleView
31
+ b as MainNav,
32
+ u as Root,
33
+ M as SearchBox,
34
+ h as Separator,
35
+ S as Text,
36
+ R as ToggleView
39
37
  };
@@ -3,19 +3,19 @@ import { Icon as m } from "../../atoms/Icon/Icon.js";
3
3
  import { Text as n } from "../../atoms/Text/Text.js";
4
4
  import { Button as a } from "../../atoms/Button/Button.js";
5
5
  import { Tooltip as l } from "../Tooltip/Tooltip.js";
6
- import '../../assets/Cart.css';const d = "_cart_15bzn_1", h = "_count_15bzn_8", p = "_cartContainer_15bzn_23", g = "_cartItems_15bzn_32", _ = "_noItems_15bzn_58", s = {
6
+ import '../../assets/Cart.css';const d = "_cart_15bzn_1", h = "_count_15bzn_8", p = "_cartContainer_15bzn_23", _ = "_cartItems_15bzn_32", g = "_noItems_15bzn_58", s = {
7
7
  cart: d,
8
8
  count: h,
9
9
  cartContainer: p,
10
- cartItems: g,
11
- noItems: _
10
+ cartItems: _,
11
+ noItems: g
12
12
  };
13
13
  function v({
14
14
  cart: e,
15
15
  onItemQtyChange: I,
16
16
  onItemDelete: u,
17
17
  onItemEdit: z,
18
- onCheckout: o,
18
+ onCheckout: r,
19
19
  ...c
20
20
  }) {
21
21
  return e = e || { items: [] }, /* @__PURE__ */ t(
@@ -32,24 +32,23 @@ function v({
32
32
  ),
33
33
  e.items.length > 0 && /* @__PURE__ */ t("div", { className: s.count, children: /* @__PURE__ */ t(n, { size: "xxs", children: e.items.length }) })
34
34
  ] }),
35
- arrow: !1,
36
- position: "bottom right",
35
+ position: "bottom",
37
36
  on: "click",
38
37
  children: /* @__PURE__ */ i("div", { className: s.cartContainer, children: [
39
38
  /* @__PURE__ */ t(n, { as: "h1", size: "2xl", children: "Cart" }),
40
39
  /* @__PURE__ */ t("div", { className: s.cartItems, children: e.items.length > 0 ? /* @__PURE__ */ t("ul", { children: e.items.map(
41
- (r) => /* @__PURE__ */ i("li", { children: [
42
- /* @__PURE__ */ t("img", { src: r.imageUrl, alt: `${r.itemId} product image` }),
40
+ (o) => /* @__PURE__ */ i("li", { children: [
41
+ /* @__PURE__ */ t("img", { src: o.imageUrl, alt: `${o.itemId} product image` }),
43
42
  /* @__PURE__ */ i("div", { children: [
44
- /* @__PURE__ */ t(n, { as: "p", size: "sm", children: r.description }),
43
+ /* @__PURE__ */ t(n, { as: "p", size: "sm", children: o.description }),
45
44
  /* @__PURE__ */ i(n, { as: "p", size: "sm", children: [
46
45
  "Part # ",
47
- r.itemId
46
+ o.itemId
48
47
  ] })
49
48
  ] })
50
49
  ] })
51
50
  ) }) : /* @__PURE__ */ t("div", { className: s.noItems, children: /* @__PURE__ */ t(n, { as: "p", size: "sm", children: "No items in your cart yet" }) }) }),
52
- /* @__PURE__ */ t(a, { disabled: e.items.length === 0, onClick: o, variant: "cta-primary", size: "md", children: "Checkout" })
51
+ /* @__PURE__ */ t(a, { disabled: e.items.length === 0, onClick: r, variant: "cta-primary", size: "md", children: "Checkout" })
53
52
  ] })
54
53
  }
55
54
  );
@@ -1,25 +1,24 @@
1
1
  import { jsx as e, jsxs as t } from "react/jsx-runtime";
2
2
  import { c as a } from "../../clsx-OuTLNxxd.js";
3
- import { Text as n } from "../../atoms/Text/Text.js";
4
- import { Link as s } from "../../atoms/Link/Link.js";
3
+ import { Text as s } from "../../atoms/Text/Text.js";
4
+ import { Link as n } from "../../atoms/Link/Link.js";
5
5
  import { Icon as m } from "../../atoms/Icon/Icon.js";
6
6
  import { getHideAtStyles as c } from "../../atoms/HideAt.js";
7
7
  import { Tooltip as h } from "../Tooltip/Tooltip.js";
8
- import '../../assets/CategoryNav.css';const d = "_categories_1m4w9_1", u = "_category_1m4w9_16", p = "_submenuTooltip_1m4w9_42", o = {
8
+ import '../../assets/CategoryNav.css';const d = "_categories_1m4w9_1", u = "_category_1m4w9_16", p = "_submenuTooltip_1m4w9_42", l = {
9
9
  categories: d,
10
10
  category: u,
11
11
  submenuTooltip: p
12
12
  };
13
13
  function z({
14
- categories: r
14
+ categories: o
15
15
  }) {
16
- return !r || r.length === 0 ? null : /* @__PURE__ */ e("ul", { className: a(o.categories, c(["sm"])), children: r.map(
16
+ return !o || o.length === 0 ? null : /* @__PURE__ */ e("ul", { className: a(l.categories, c(["sm"])), children: o.map(
17
17
  (i) => i.children.length > 0 ? /* @__PURE__ */ e(
18
18
  h,
19
19
  {
20
- arrow: !1,
21
- trigger: /* @__PURE__ */ e("li", { className: o.category, children: /* @__PURE__ */ t(s, { href: i.route, children: [
22
- /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: i.label }),
20
+ trigger: /* @__PURE__ */ e("li", { className: l.category, children: /* @__PURE__ */ t(n, { href: i.route, children: [
21
+ /* @__PURE__ */ e(s, { size: "sm", weight: "semibold", children: i.label }),
23
22
  i.showChevron && /* @__PURE__ */ e(
24
23
  m,
25
24
  {
@@ -29,13 +28,12 @@ function z({
29
28
  }
30
29
  )
31
30
  ] }) }),
32
- on: "hover",
33
- position: "bottom center",
34
- children: /* @__PURE__ */ e("ul", { className: o.submenuTooltip, children: i.children.map((l) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(s, { href: l.route, children: /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: l.label }) }) }, l.id)) })
31
+ position: "bottom",
32
+ children: /* @__PURE__ */ e("ul", { className: l.submenuTooltip, children: i.children.map((r) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(n, { href: r.route, children: /* @__PURE__ */ e(s, { size: "sm", weight: "semibold", children: r.label }) }) }, r.id)) })
35
33
  },
36
34
  i.id
37
- ) : /* @__PURE__ */ e("li", { className: o.category, children: /* @__PURE__ */ t(s, { href: i.route, children: [
38
- /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: i.label }),
35
+ ) : /* @__PURE__ */ e("li", { className: l.category, children: /* @__PURE__ */ t(n, { href: i.route, children: [
36
+ /* @__PURE__ */ e(s, { size: "sm", weight: "semibold", children: i.label }),
39
37
  i.showChevron && /* @__PURE__ */ e(
40
38
  m,
41
39
  {
@@ -1,11 +1,14 @@
1
1
  import { default as React } from 'react';
2
- import { PopupProps } from 'reactjs-popup/dist/types';
3
- /**
4
- * Tooltip component that wraps reactjs-popup's Popup,
5
- * applying consistent styling for all tooltips/popups.
6
- */
7
- export type TooltipProps = PopupProps & {
2
+ export interface TooltipProps {
3
+ children: React.ReactNode;
4
+ trigger: React.ReactElement;
5
+ position?: "top" | "bottom" | "left" | "right";
6
+ delay?: number;
8
7
  tooltipClassName?: string;
9
- contentClassName?: string;
10
- };
8
+ wrapperClassName?: string;
9
+ on?: "hover" | "click" | "auto";
10
+ autoAdjust?: boolean;
11
+ flip?: boolean;
12
+ viewportPadding?: number;
13
+ }
11
14
  export declare const Tooltip: React.FC<TooltipProps>;