@base-framework/ui 1.1.14 → 1.1.16

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 (35) hide show
  1. package/README.md +44 -0
  2. package/dist/atoms.es.js +37 -34
  3. package/dist/buttons-HW55zbqy.js +127 -0
  4. package/dist/{empty-state-CuciIYY7.js → empty-state-5g6Pdeeg.js} +324 -321
  5. package/dist/full-page-DccgwWsM.js +69 -0
  6. package/dist/icons.es.js +127 -1
  7. package/dist/image-BhZbKYDj.js +237 -0
  8. package/dist/index.es.js +179 -173
  9. package/dist/{mobile-nav-wrapper-C3Lvz7CH.js → mobile-nav-wrapper-DmrkMxyd.js} +77 -84
  10. package/dist/molecules.es.js +5 -5
  11. package/dist/organisms.es.js +52 -51
  12. package/dist/pages.es.js +10 -9
  13. package/dist/sidebar-menu-C5s4Cogh.js +13 -0
  14. package/dist/sidebar-menu-page-DwqCqwzG.js +153 -0
  15. package/dist/signature-panel-CDQgFxuo.js +1364 -0
  16. package/dist/simple-search-input-mCUOwYbp.js +1654 -0
  17. package/dist/skeleton-BlY3opxG.js +7 -0
  18. package/dist/{tooltip-BlFbB8yL.js → tooltip-BmvjA9XQ.js} +104 -84
  19. package/dist/types/components/atoms/atoms.d.ts +2 -0
  20. package/dist/types/components/atoms/material-icon.d.ts +17 -0
  21. package/dist/types/components/atoms/universal-icon.d.ts +3 -0
  22. package/dist/types/components/icons/icons.d.ts +1 -0
  23. package/dist/types/components/icons/material-symbols.d.ts +19 -0
  24. package/dist/types/components/molecules/breadcrumb/breadcrumb.d.ts +2 -2
  25. package/dist/types/components/molecules/image/image-uploader.d.ts +2 -2
  26. package/dist/types/components/molecules/image/logo-uploader.d.ts +2 -2
  27. package/dist/types/components/organisms/navigation/mobile/nav-wrapper/title-header.d.ts +1 -1
  28. package/package.json +1 -1
  29. package/dist/buttons-Dr-bViom.js +0 -77
  30. package/dist/form-group-BB7dLJir.js +0 -29
  31. package/dist/image-BB__4s0g.js +0 -31
  32. package/dist/inputs-CcimrM1k.js +0 -210
  33. package/dist/range-calendar-CzKIBhgb.js +0 -831
  34. package/dist/sidebar-menu-page-BtuUB_XB.js +0 -217
  35. package/dist/signature-panel-DmyPbuRi.js +0 -2186
@@ -1,210 +0,0 @@
1
- import { Div as u, Label as h, Checkbox as m, Span as $, OnState as p, I as x, Input as r, Textarea as k } from "@base-framework/atoms";
2
- import { Jot as g, Atom as s } from "@base-framework/base";
3
- import { Icons as y } from "./icons.es.js";
4
- const I = "flex h-10 w-full px-3 py-2 text-sm", n = "rounded-md border border-border bg-input", o = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ring-offset-background", a = "disabled:cursor-not-allowed disabled:opacity-50 [&:user-invalid]:border-destructive", l = "placeholder:text-muted-foreground", f = `${I} ${n} ${o} ${l} ${a}`, C = ({ id: e, checked: c, bind: t, required: d }) => m({
5
- id: e,
6
- cache: "checkbox",
7
- class: "absolute opacity-0 w-full h-full cursor-pointer pointer-events-none",
8
- aria: {
9
- checked: ["checked"]
10
- },
11
- required: d,
12
- checked: c,
13
- bind: t
14
- }), v = () => $({ class: "absolute text-xs pointer-events-none" }, [
15
- p(
16
- "checked",
17
- (e) => e ? x({
18
- class: "w-2 h-2 pointer-events-none",
19
- html: y.check
20
- }) : null
21
- )
22
- ]), w = ({ id: e, bind: c, checked: t, required: d, clickHandler: b }) => u({
23
- class: `relative flex items-center justify-center w-5 h-5 transition-colors duration-200 hover:border-accent-foreground
24
- rounded-md border
25
- ${o}
26
- ${a}`.trim(),
27
- onState: [
28
- "checked",
29
- {
30
- "bg-primary": !0,
31
- "text-primary-foreground": !0,
32
- "border-primary": !0
33
- }
34
- ],
35
- role: "checkbox",
36
- aria: {
37
- checked: ["checked"]
38
- },
39
- tabIndex: 0,
40
- click: b
41
- }, [
42
- C({ bind: c, checked: t, id: e, required: d }),
43
- v()
44
- ]), T = ({ id: e, label: c, clickHandler: t }) => h({
45
- class: "text-base cursor-pointer",
46
- htmlFor: e,
47
- click: t
48
- }, c), L = g(
49
- {
50
- /**
51
- * This will initialize the state of the checkbox.
52
- *
53
- * @returns {object}
54
- */
55
- state() {
56
- return {
57
- // @ts-ignore
58
- checked: this.checked ?? !1
59
- };
60
- },
61
- /**
62
- * This is added to check the checkbox after the component is rendered
63
- * to see if the bind updated the checked value.
64
- *
65
- * @returns {void}
66
- */
67
- after() {
68
- this.state.checked = this.checkbox.checked;
69
- },
70
- /**
71
- * This will handle the click event for the checkbox.
72
- *
73
- * @param {object} e
74
- * @returns {void}
75
- */
76
- clickHandler(e) {
77
- e.preventDefault(), e.stopPropagation(), this.state.toggle("checked"), this.checkbox.checked = this.state.checked, typeof this.onChange == "function" && this.onChange(this.state.checked, this);
78
- },
79
- /**
80
- * This will render the checkbox component.
81
- *
82
- * @returns {object}
83
- */
84
- render() {
85
- const e = this.getId(), c = (t) => this.clickHandler(t);
86
- return u({ class: `flex items-center gap-x-2 cursor-pointer ${this.class || ""}` }, [
87
- w({
88
- id: e,
89
- // @ts-ignore
90
- bind: this.bind,
91
- // @ts-ignore
92
- checked: this.state.checked,
93
- // @ts-ignore
94
- required: this.required,
95
- // @ts-ignore
96
- clickHandler: c
97
- }),
98
- // @ts-ignore
99
- this.label && T({ id: e, label: this.label, clickHandler: c })
100
- ]);
101
- }
102
- }
103
- ), H = (e) => {
104
- if (!e || e.length === 0) return "";
105
- const t = e.replace(/\D/g, "").match(/^(\d{0,3})(\d{0,3})(\d{0,4})$/);
106
- return t ? t[2] ? `(${t[1]}) ${t[2]}${t[3] ? "-" + t[3] : ""}` : t[1] || "" : e;
107
- }, D = (e) => {
108
- const c = e.target, t = H(c.value);
109
- t && (c.value = t);
110
- }, i = s((e) => r({
111
- ...e,
112
- class: `${f} ${e.class || ""}`.trim()
113
- })), M = s((e) => i({
114
- ...e,
115
- type: "tel",
116
- name: e.name || "Phone",
117
- label: e.label || "Phone",
118
- placeholder: "(555) 555-5555",
119
- pattern: e.pattern || "\\(\\d{3}\\) \\d{3}-\\d{4}",
120
- keyup: D
121
- })), S = s((e) => i({
122
- ...e,
123
- type: "email",
124
- name: e.name || "Email",
125
- label: e.label || "Email",
126
- placeholder: "Email address"
127
- })), q = s((e) => k({
128
- ...e,
129
- as: "textarea",
130
- class: `flex w-full h-24 px-3 py-2 text-sm ${n} ${o} ${l} ${a} ${e.class || ""}`.trim()
131
- })), R = (e = {}) => u({ class: "flex items-center gap-x-2" }, [
132
- r({
133
- ...e,
134
- type: "radio",
135
- class: "cursor-pointer appearance-none h-4 w-4 border rounded-full checked:border-primary checked:bg-primary focus:ring focus:ring-primary".trim()
136
- }),
137
- e.label && h({ forHTML: e.value, class: "cursor-pointer" }, e.label)
138
- ]), U = s((e) => r({
139
- ...e,
140
- type: "date",
141
- class: `${n} ${o} ${l} ${a} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
142
- })), W = s((e) => r({
143
- ...e,
144
- type: "time",
145
- class: `${n} ${o} ${l} ${a} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
146
- })), j = s((e) => r({
147
- ...e,
148
- type: "datetime-local",
149
- class: `${n} ${o} ${l} ${a} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
150
- })), z = s((e) => r({
151
- ...e,
152
- type: "month",
153
- class: `${n} ${o} ${l} ${a} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
154
- })), A = s((e) => r({
155
- ...e,
156
- type: "week",
157
- class: `${n} ${o} ${l} ${a} px-3 py-2 text-sm ring-offset-background ${e.class || ""}`.trim()
158
- })), B = s((e) => i({
159
- ...e,
160
- type: "number"
161
- })), J = s((e) => i({
162
- ...e,
163
- type: "password"
164
- }));
165
- s((e) => i({
166
- ...e,
167
- type: "search"
168
- }));
169
- const O = s((e) => i({
170
- ...e,
171
- type: "url"
172
- })), G = s((e) => i({
173
- ...e,
174
- type: "hidden"
175
- })), K = s((e) => r({
176
- ...e,
177
- type: "color",
178
- class: `${n} text-foreground p-0 ${a} ${e.class || ""}`.trim()
179
- }));
180
- s((e) => m({
181
- ...e,
182
- class: `flex h-4 w-4 text-foreground ${n} ${o} ${a} ${e.class || ""}`.trim()
183
- }));
184
- const E = "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground", Q = s((e) => r({
185
- ...e,
186
- type: "file",
187
- class: `${f} ${E} ${e.class || ""}`.trim()
188
- }));
189
- export {
190
- L as C,
191
- U as D,
192
- S as E,
193
- Q as F,
194
- G as H,
195
- i as I,
196
- z as M,
197
- B as N,
198
- J as P,
199
- R,
200
- M as T,
201
- O as U,
202
- A as W,
203
- K as a,
204
- j as b,
205
- q as c,
206
- W as d,
207
- a as e,
208
- o as f,
209
- f as g
210
- };