@base-framework/ui 1.0.205 → 1.0.207

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.
package/dist/atoms.es.js CHANGED
@@ -1,4 +1,4 @@
1
- import { B as e, C as t, b as o, F as n, a as r, L as p, P as u, R as I, S as i, c as l, T as d } from "./tooltip-9MdaFacr.js";
1
+ import { B as e, C as t, b as o, F as n, a as r, L as p, P as u, R as I, S as i, c as l, T as d } from "./tooltip-CvlontVf.js";
2
2
  import { B as T, I as c, L as x } from "./buttons-Cm9etaEG.js";
3
3
  import { C, d as g, D as F, c as b, E as f, F as L, H as P, I as R, M as S, N as h, P as k, R as D, T as V, a as E, b as G, U as H, W as M } from "./inputs-CMjx5-IX.js";
4
4
  import { V as U, a as W } from "./veil-D4dRxILB.js";
package/dist/index.es.js CHANGED
@@ -1,4 +1,4 @@
1
- import { B as e, C as o, b as t, F as r, a as n, L as l, P as i, R as p, S as u, c as m, T as d } from "./tooltip-9MdaFacr.js";
1
+ import { B as e, C as o, b as t, F as r, a as n, L as l, P as i, R as p, S as u, c as m, T as d } from "./tooltip-CvlontVf.js";
2
2
  import { B as g, I as C, L as T } from "./buttons-Cm9etaEG.js";
3
3
  import { C as D, d as I, D as S, c as B, E as P, F, H as M, I as k, M as N, N as f, P as v, R as x, T as y, a as h, b as W, U as H, W as L } from "./inputs-CMjx5-IX.js";
4
4
  import { V as w, a as U } from "./veil-D4dRxILB.js";
@@ -1,4 +1,4 @@
1
- import { Span as g, Div as o, Legend as b, Fieldset as x, H4 as C, P as h, UseParent as u, Input as y } from "@base-framework/atoms";
1
+ import { Span as g, Div as l, Legend as f, Fieldset as x, H4 as C, P as h, UseParent as u, Input as y } from "@base-framework/atoms";
2
2
  import { Atom as s, Html as p } from "@base-framework/base";
3
3
  import { a as d } from "./veil-D4dRxILB.js";
4
4
  import { f as k, e as w, g as $ } from "./inputs-CMjx5-IX.js";
@@ -79,18 +79,18 @@ const a = {
79
79
  ringColor: "ring-background"
80
80
  }
81
81
  }, v = (t) => a[t] || a.gray, P = (t) => {
82
- const { backgroundColor: r, textColor: e, ringColor: l } = v(t);
83
- return `inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors ${r} ${e} ${l}`;
82
+ const { backgroundColor: r, textColor: e, ringColor: o } = v(t);
83
+ return `inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors ${r} ${e} ${o}`;
84
84
  }, G = s((t, r) => {
85
85
  const e = P(t == null ? void 0 : t.type);
86
86
  return g({ ...t, class: e }, r);
87
87
  }), I = s((t, r) => {
88
- const e = t.margin ?? "my-5 mx-5", l = t.padding ?? "p-4";
89
- return t.hover && (t.class += " hover:shadow-lg hover:bg-muted/50"), o({
88
+ const e = t.margin ?? "my-5 mx-5", o = t.padding ?? "p-4";
89
+ return t.hover && (t.class += " hover:shadow-lg hover:bg-muted/50"), l({
90
90
  ...t,
91
- class: `rounded-lg border bg-card text-card-foreground shadow-md min-w-[120px] min-h-[80px] ${e} ${l} ${t.class || ""}`
91
+ class: `rounded-lg border bg-card text-card-foreground shadow-md min-w-[120px] min-h-[80px] ${e} ${o} ${t.class || ""}`
92
92
  }, r);
93
- }), S = s((t, r) => b({
93
+ }), S = s((t, r) => f({
94
94
  ...t,
95
95
  class: ` font-medium bg-background -mt-4 -mx-1 px-2 py-2 ${t.class || ""}`
96
96
  }, r)), R = s((t, r) => {
@@ -100,23 +100,24 @@ const a = {
100
100
  class: `p-6 ${e} ${t.class || ""}`
101
101
  }, [
102
102
  t.legend && S(t.legend),
103
- o({ class: "flex flex-auto flex-col space-y-6" }, r)
103
+ l({ class: "flex flex-auto flex-col space-y-6" }, r)
104
104
  ]);
105
105
  }), O = s((t, r) => {
106
- var e;
107
- return o({
106
+ var o;
107
+ const e = t.border === !0 ? "border-t" : "";
108
+ return l({
108
109
  ...t,
109
- class: `flex flex-col sm:flex-row ${t.class || ""}`
110
+ class: `flex flex-col sm:flex-row pt-8 ${e} ${t.class || ""}`
110
111
  }, [
111
- t.label && o({
112
+ t.label && l({
112
113
  ...t.labelProps,
113
- class: `w-full sm:w-1/3 space-y-2 ${((e = t.labelProps) == null ? void 0 : e.class) || ""}`
114
+ class: `w-full sm:w-1/3 space-y-2 ${((o = t.labelProps) == null ? void 0 : o.class) || ""}`
114
115
  }, [
115
116
  C({ class: "text-base" }, t.label),
116
117
  t.description && h({ class: "text-sm text-muted-foreground" }, t.description)
117
118
  ]),
118
119
  // Controls container: grows to fill remaining space, spacing between items
119
- o({ class: "w-full sm:flex-1 flex flex-col space-y-4" }, r)
120
+ l({ class: "w-full sm:flex-1 flex flex-col space-y-4" }, r)
120
121
  ]);
121
122
  }), V = d(
122
123
  {
@@ -148,17 +149,17 @@ const a = {
148
149
  * @returns {object}
149
150
  */
150
151
  render() {
151
- return o({ class: "relative w-full h-4 flex items-center" }, [
152
+ return l({ class: "relative w-full h-4 flex items-center" }, [
152
153
  // Track
153
- o({ class: "absolute h-2 w-full rounded-full bg-muted" }),
154
+ l({ class: "absolute h-2 w-full rounded-full bg-muted" }),
154
155
  u(({ state: t }) => [
155
156
  // Filled Track
156
- o({
157
+ l({
157
158
  class: "absolute h-2 bg-primary rounded-full",
158
159
  style: ["width: [[filledPercentage]]%", t]
159
160
  }),
160
161
  // Thumb
161
- o({
162
+ l({
162
163
  class: `
163
164
  absolute block h-5 w-5 rounded-full border-2 border-primary bg-background
164
165
  ring-offset-background transition-colors focus-visible:outline-none
@@ -198,13 +199,13 @@ const a = {
198
199
  ...t,
199
200
  class: `${$} ${t.class || ""}`.trim()
200
201
  })), E = (t) => !t || isNaN(t) ? null : t, i = (t, r) => {
201
- const e = t, l = 16, n = 2 * Math.PI * l, m = e / 100 * n, f = `
202
+ const e = t, o = 16, n = 2 * Math.PI * o, m = e / 100 * n, b = `
202
203
  <svg class="w-40 h-40 mx-auto" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
203
204
  <!-- Background Circle -->
204
205
  <circle
205
206
  cx="18"
206
207
  cy="18"
207
- r="${l}"
208
+ r="${o}"
208
209
  fill="none"
209
210
  stroke="currentColor"
210
211
  stroke-width="4"
@@ -215,7 +216,7 @@ const a = {
215
216
  <circle
216
217
  cx="18"
217
218
  cy="18"
218
- r="${l}"
219
+ r="${o}"
219
220
  fill="none"
220
221
  stroke="currentColor"
221
222
  stroke-width="4"
@@ -236,20 +237,20 @@ const a = {
236
237
  </text>
237
238
  </svg>
238
239
  `;
239
- return o({
240
+ return l({
240
241
  class: "circle-graph text-inherit",
241
- html: f
242
+ html: b
242
243
  });
243
244
  }, H = s((t) => {
244
- const r = t.progress || 0, e = t.class || "", l = i(r, e);
245
- return o({
245
+ const r = t.progress || 0, e = t.class || "", o = i(r, e);
246
+ return l({
246
247
  class: "circle-graph-wrap",
247
248
  onSet: [
248
249
  t.prop,
249
- (n) => (n = E(n), n ? i(n, e) : l)
250
+ (n) => (n = E(n), n ? i(n, e) : o)
250
251
  ]
251
- }, [l]);
252
- }), B = () => u(({ state: t }) => o({
252
+ }, [o]);
253
+ }), B = () => u(({ state: t }) => l({
253
254
  class: "absolute h-full rounded-full bg-primary transition-all duration-300",
254
255
  style: ["width: [[progress]]%;", t]
255
256
  })), M = d(
@@ -260,7 +261,7 @@ const a = {
260
261
  * @returns {object}
261
262
  */
262
263
  render() {
263
- return o({ class: "relative w-full h-4 rounded-full bg-muted" }, [
264
+ return l({ class: "relative w-full h-4 rounded-full bg-muted" }, [
264
265
  B()
265
266
  ]);
266
267
  },
@@ -304,8 +305,8 @@ const a = {
304
305
  t < 0 && (t = 0), t > 100 && (t = 100), this.state.progress = t;
305
306
  }
306
307
  }
307
- ), _ = ({ class: t, shape: r = "rectangle", width: e = "w-full", height: l = "h-4" }) => o({
308
- class: `bg-muted animate-pulse ${e} ${l} ${r === "circle" ? "rounded-full" : "rounded-md"} ${t || ""}`
308
+ ), _ = ({ class: t, shape: r = "rectangle", width: e = "w-full", height: o = "h-4" }) => l({
309
+ class: `bg-muted animate-pulse ${e} ${o} ${r === "circle" ? "rounded-full" : "rounded-md"} ${t || ""}`
309
310
  }), c = {
310
311
  top: "bottom-full left-1/2 transform -translate-x-1/2 mb-2",
311
312
  "top-right": "bottom-full left-full transform -translate-x-1 mb-2",
@@ -316,14 +317,14 @@ const a = {
316
317
  left: "top-1/2 right-full transform -translate-y-1/2 mr-2",
317
318
  right: "top-1/2 left-full transform -translate-y-1/2 ml-2"
318
319
  }, F = (t) => c[t] || c.top, z = s(({ position: t = "top", content: r }, e) => {
319
- const l = F(t);
320
- return Array.isArray(e) === !1 && (e = [e]), o({ class: "relative group inline-block" }, [
320
+ const o = F(t);
321
+ return Array.isArray(e) === !1 && (e = [e]), l({ class: "relative group inline-block" }, [
321
322
  ...e,
322
323
  // Tooltip box
323
324
  g({
324
325
  class: `
325
326
  absolute z-20 px-2 py-1 border text-sm bg-background rounded shadow-md opacity-0 whitespace-nowrap
326
- group-hover:opacity-100 transition-opacity duration-200 ${l} pointer-events-none
327
+ group-hover:opacity-100 transition-opacity duration-200 ${o} pointer-events-none
327
328
  `
328
329
  }, r)
329
330
  ]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@base-framework/ui",
3
- "version": "1.0.205",
3
+ "version": "1.0.207",
4
4
  "description": "This is a UI package that adds components and atoms that use Tailwind CSS and a theme based on Shadcn.",
5
5
  "main": "./dist/index.es.js",
6
6
  "scripts": {