trepur_components 2.3.31 → 2.3.33

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 (6) hide show
  1. package/lib/components/Link/index.js +6 -6
  2. package/lib/components/Nav/index.js +32 -31
  3. package/lib/components/NavItem/NavItem.stories.d.ts +1 -0
  4. package/lib/components/NavItem/index.d.ts +1 -0
  5. package/lib/components/NavItem/index.js +30 -19
  6. package/package.json +1 -1
package/lib/components/Link/index.js CHANGED
@@ -8,17 +8,17 @@ const c = a(
8
8
  children: o,
9
9
  loading: t = !1,
10
10
  variant: r = "primary",
11
- size: n,
12
- href: g,
13
- target: m,
11
+ size: n = "sm",
12
+ href: m,
13
+ target: g,
14
14
  ...u
15
15
  }) => /* @__PURE__ */ b("div", { className: "inline-block", children: /* @__PURE__ */ b(
16
16
  "a",
17
17
  {
18
- href: g,
19
- target: m,
18
+ href: m,
19
+ target: g,
20
20
  className: s(
21
- "flex px-12 py-3 items-center gap-3 rounded border text-center leading-8",
21
+ "flex items-center gap-3 rounded border text-center",
22
22
  {
23
23
  "duration-200": !t,
24
24
  "border-button-primary-border bg-button-primary-bg text-button-primary-text hover:bg-button-primary-hover active:bg-button-primary-active": r === "primary" && !t,
package/lib/components/Nav/index.js CHANGED
@@ -1,20 +1,20 @@
1
1
  import { jsx as e, jsxs as p, Fragment as H } from "react/jsx-runtime";
2
- import { createContext as C, forwardRef as l, useState as v, useMemo as k, useContext as c, useRef as w } from "react";
2
+ import { createContext as w, forwardRef as l, useState as v, useMemo as C, useContext as m, useRef as k } from "react";
3
3
  import { HamburgerIcon as M } from "../HamburgerIcon/index.js";
4
4
  import { faChevronDown as j } from "@fortawesome/fontawesome-free-solid";
5
5
  import d from "clsx";
6
6
  import { Icon as D } from "../Icon/index.js";
7
7
  import { NavItem as F } from "../NavItem/index.js";
8
- const i = C(null), N = l(({ className: t, children: r, loading: a }, s) => {
9
- const [o, n] = v(!1), m = k(
8
+ const i = w(null), N = l(({ className: t, children: r, loading: a }, o) => {
9
+ const [s, n] = v(!1), c = C(
10
10
  () => ({
11
- expanded: o,
11
+ expanded: s,
12
12
  setExpanded: n,
13
13
  loading: a
14
14
  }),
15
- [o, n, a]
15
+ [s, n, a]
16
16
  );
17
- return /* @__PURE__ */ e(i.Provider, { value: m, children: /* @__PURE__ */ e("div", { className: t, ref: s, children: r }) });
17
+ return /* @__PURE__ */ e(i.Provider, { value: c, children: /* @__PURE__ */ e("div", { className: t, ref: o, children: r }) });
18
18
  }), f = l(
19
19
  ({ className: t, children: r }, a) => /* @__PURE__ */ e(
20
20
  "div",
@@ -25,13 +25,13 @@ const i = C(null), N = l(({ className: t, children: r, loading: a }, s) => {
25
25
  }
26
26
  )
27
27
  ), g = l(({ className: t, children: r }, a) => {
28
- const { loading: s, setExpanded: o, expanded: n } = c(i) || {};
29
- return /* @__PURE__ */ p("div", { ref: a, className: d("flex h-full md:hidden", t), children: [
30
- !s && /* @__PURE__ */ e("div", { className: "my-auto", children: /* @__PURE__ */ e(
28
+ const { loading: o, setExpanded: s, expanded: n } = m(i) || {};
29
+ return /* @__PURE__ */ p("div", { ref: a, className: d("flex h-full lg:hidden", t), children: [
30
+ !o && /* @__PURE__ */ e("div", { className: "my-auto", children: /* @__PURE__ */ e(
31
31
  M,
32
32
  {
33
33
  variant: "ghost",
34
- onClick: () => o == null ? void 0 : o(!n),
34
+ onClick: () => s == null ? void 0 : s(!n),
35
35
  className: "aspect-square"
36
36
  }
37
37
  ) }),
@@ -42,15 +42,15 @@ const i = C(null), N = l(({ className: t, children: r, loading: a }, s) => {
42
42
  {
43
43
  ref: a,
44
44
  className: d(
45
- "hidden justify-between md:flex md:gap-4 md:px-4 lg:gap-8 lg:px-20",
45
+ "hidden justify-between lg:flex md:gap-4 md:px-4 lg:gap-8 lg:px-20",
46
46
  t
47
47
  ),
48
48
  children: r
49
49
  }
50
50
  )), x = l(
51
51
  ({ className: t, children: r }, a) => {
52
- const { expanded: s } = c(i) || {};
53
- return s ? /* @__PURE__ */ e(
52
+ const { expanded: o } = m(i) || {};
53
+ return o ? /* @__PURE__ */ e(
54
54
  "div",
55
55
  {
56
56
  ref: a,
@@ -64,13 +64,13 @@ const i = C(null), N = l(({ className: t, children: r, loading: a }, s) => {
64
64
  }
65
65
  ), h = l(
66
66
  ({ className: t, children: r }, a) => {
67
- const { loading: s } = c(i) || {};
68
- return s ? /* @__PURE__ */ e(
67
+ const { loading: o } = m(i) || {};
68
+ return o ? /* @__PURE__ */ e(
69
69
  "div",
70
70
  {
71
71
  ref: a,
72
72
  className: d("my-4 md:flex md:gap-4 lg:gap-6", t),
73
- children: [...Array(5)].map((o, n) => /* @__PURE__ */ e(F, { loading: !0 }, n))
73
+ children: [...Array(5)].map((s, n) => /* @__PURE__ */ e(F, { loading: !0 }, n))
74
74
  }
75
75
  ) : /* @__PURE__ */ e(
76
76
  "div",
@@ -81,38 +81,39 @@ const i = C(null), N = l(({ className: t, children: r, loading: a }, s) => {
81
81
  }
82
82
  );
83
83
  }
84
- ), b = l(({ className: t, label: r, children: a, active: s = !1 }) => {
85
- const [o, n] = v(!1), m = w(null);
84
+ ), b = l(({ className: t, label: r, children: a, active: o = !1 }) => {
85
+ const [s, n] = v(!1), c = k(null);
86
86
  return /* @__PURE__ */ p(
87
87
  "div",
88
88
  {
89
- ref: m,
90
- onClick: () => n(!0),
89
+ ref: c,
90
+ onMouseEnter: () => n(!0),
91
91
  onMouseLeave: () => n(!1),
92
+ onClick: () => n(!s),
92
93
  className: d(
93
- "relative m-auto py-0 text-nav-text after:block after:scale-x-0 after:border-b-2 after:border-nav-text after:transition-all after:duration-300 after:ease-in-out hover:cursor-pointer hover:after:scale-x-100",
94
+ "relative m-auto py-0 text-nav-text md:after:block after:scale-x-0 after:border-b-2 after:border-nav-text after:transition-all after:duration-300 after:ease-in-out hover:cursor-pointer hover:after:scale-x-100",
94
95
  {
95
- "font-bold": s,
96
- "font-light": !s
96
+ "font-bold": o,
97
+ "font-light": !o
97
98
  },
98
99
  t
99
100
  ),
100
101
  children: [
101
- /* @__PURE__ */ p("div", { className: "flex items-center gap-1", children: [
102
+ /* @__PURE__ */ p("div", { className: "flex justify-center items-center gap-1", children: [
102
103
  /* @__PURE__ */ e("p", { className: "text-lg", children: r }),
103
104
  /* @__PURE__ */ e(D, { size: "xs", icon: j })
104
105
  ] }),
105
- o && /* @__PURE__ */ e("div", { className: "absolute -left-5 top-7 z-50 w-40 bg-nav-bg", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 gap-y-2 bg-nav-bg px-4 py-4", children: a }) })
106
+ s && /* @__PURE__ */ e("div", { className: "rounded-md md:absolute md:-left-5 top-7 z-50 w-40 bg-nav-bg", children: /* @__PURE__ */ e("div", { className: "rounded-md grid grid-cols-1 gap-y-2 bg-nav-bg px-1 py-2 w-full", children: a }) })
106
107
  ]
107
108
  }
108
109
  );
109
- }), y = l(({ className: t, src: r, ...a }, s) => {
110
- const { loading: o } = c(i) || {};
111
- return o ? /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: "h-20 w-20 animate-pulse bg-gray-300" }) }) : /* @__PURE__ */ e(
110
+ }), y = l(({ className: t, src: r, ...a }, o) => {
111
+ const { loading: s } = m(i) || {};
112
+ return s ? /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: "h-20 w-20 animate-pulse bg-gray-300" }) }) : /* @__PURE__ */ e(
112
113
  "img",
113
114
  {
114
115
  className: d("h-20 flex-none", t),
115
- ref: s,
116
+ ref: o,
116
117
  src: r,
117
118
  ...a
118
119
  }
@@ -126,7 +127,7 @@ y.displayName = "Nav.Logo";
126
127
  h.displayName = "Nav.Section";
127
128
  x.displayName = "Nav.Body";
128
129
  b.displayName = "Nav.Folder";
129
- const A = Object.assign(N, {
130
+ const q = Object.assign(N, {
130
131
  Header: f,
131
132
  DesktopHeader: u,
132
133
  MobileHeader: g,
@@ -136,5 +137,5 @@ const A = Object.assign(N, {
136
137
  Folder: b
137
138
  });
138
139
  export {
139
- A as Nav
140
+ q as Nav
140
141
  };
package/lib/components/NavItem/NavItem.stories.d.ts CHANGED
@@ -7,6 +7,7 @@ declare const meta: {
7
7
  href?: string | undefined;
8
8
  active?: boolean | undefined;
9
9
  loading?: boolean | undefined;
10
+ isInFolder?: boolean | undefined;
10
11
  } & import('react').RefAttributes<HTMLAnchorElement>> & {
11
12
  Label: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
12
13
  };
package/lib/components/NavItem/index.d.ts CHANGED
@@ -4,6 +4,7 @@ declare const NavItem: import('react').ForwardRefExoticComponent<HTMLAttributes<
4
4
  href?: string | undefined;
5
5
  active?: boolean | undefined;
6
6
  loading?: boolean | undefined;
7
+ isInFolder?: boolean | undefined;
7
8
  } & import('react').RefAttributes<HTMLAnchorElement>> & {
8
9
  Label: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & import('react').RefAttributes<HTMLParagraphElement>>;
9
10
  };
package/lib/components/NavItem/index.js CHANGED
@@ -1,28 +1,39 @@
1
- import { jsx as a } from "react/jsx-runtime";
1
+ import { jsx as e } from "react/jsx-runtime";
2
2
  import { forwardRef as o } from "react";
3
3
  import n from "clsx";
4
- const l = o(({ loading: t = !1, active: e, children: r, className: m, href: f, ...i }, c) => t ? /* @__PURE__ */ a("div", { className: "m-auto", children: /* @__PURE__ */ a("div", { className: "h-7 w-20 animate-pulse rounded-md bg-gray-300" }) }) : /* @__PURE__ */ a(
5
- "a",
6
- {
7
- href: f,
8
- ref: c,
9
- className: n(
10
- "m-auto inline-block py-0 text-nav-text after:block after:scale-x-0 after:border-b-2 after:border-nav-text after:transition-all after:duration-300 after:ease-in-out hover:cursor-pointer hover:after:scale-x-100",
11
- {
12
- "font-bold": e,
13
- "font-light": !e
14
- },
15
- m
16
- ),
17
- ...i,
18
- children: r
19
- }
20
- )), s = o(({ className: t, ...e }, r) => /* @__PURE__ */ a(
4
+ const l = o(
5
+ ({
6
+ loading: t = !1,
7
+ active: a,
8
+ children: r,
9
+ className: m,
10
+ href: i,
11
+ isInFolder: f = !1,
12
+ ...c
13
+ }, d) => t ? /* @__PURE__ */ e("div", { className: "m-auto", children: /* @__PURE__ */ e("div", { className: "h-7 w-20 animate-pulse rounded-md bg-gray-300" }) }) : /* @__PURE__ */ e(
14
+ "a",
15
+ {
16
+ href: i,
17
+ ref: d,
18
+ className: n(
19
+ "group text-center w-full m-auto inline-block py-0 text-nav-text",
20
+ {
21
+ "font-bold": a,
22
+ "font-light": !a,
23
+ "rounded-md hover:bg-gray-300 py-1": f
24
+ },
25
+ m
26
+ ),
27
+ ...c,
28
+ children: /* @__PURE__ */ e("span", { className: "text-center inline-block after:block after:scale-x-0 after:border-b-2 after:border-nav-text after:transition-all after:duration-300 after:ease-in-out group-hover:cursor-pointer group-hover:after:scale-x-100", children: r })
29
+ }
30
+ )
31
+ ), s = o(({ className: t, ...a }, r) => /* @__PURE__ */ e(
21
32
  "p",
22
33
  {
23
34
  className: n("flex-none text-nowrap text-lg", t),
24
35
  ref: r,
25
- ...e
36
+ ...a
26
37
  }
27
38
  ));
28
39
  l.displayName = "NavItem";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "trepur_components",
3
- "version": "2.3.31",
3
+ "version": "2.3.33",
4
4
  "description": "component lib",
5
5
  "author": "trepur_ttenneb",
6
6
  "private": false,