@base-framework/ui 1.0.278 → 1.0.280

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,7 +1,7 @@
1
- import { Span as c, Legend as f, Fieldset as x, Div as l, UseParent as u, Input as C } from "@base-framework/atoms";
1
+ import { Span as c, Legend as b, Fieldset as C, Div as l, UseParent as u, Input as x } 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-tVDPinrr.js";
4
- import { f as h, e as y, g as k } from "./skeleton-CLm2c9Bc.js";
4
+ import { f as h, e as y, g as k } from "./inputs-DYxmO1rQ.js";
5
5
  const a = {
6
6
  gray: {
7
7
  backgroundColor: "bg-gray-50",
@@ -78,22 +78,22 @@ const a = {
78
78
  textColor: "text-primary",
79
79
  ringColor: "ring-background"
80
80
  }
81
- }, w = (t) => a[t] || a.gray, v = (t) => {
81
+ }, w = (t) => a[t] || a.gray, $ = (t) => {
82
82
  const { backgroundColor: e, textColor: r, ringColor: o } = w(t);
83
83
  return `inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors ${e} ${r} ${o}`;
84
84
  }, T = s((t, e) => {
85
- const r = v(t == null ? void 0 : t.type);
85
+ const r = $(t == null ? void 0 : t.type);
86
86
  return c({ ...t, class: r }, e);
87
- }), P = s((t, e) => f({
87
+ }), v = s((t, e) => b({
88
88
  ...t,
89
89
  class: ` font-medium -mt-4 -mx-1 px-2 py-2 ${t.class || ""}`
90
90
  }, e)), L = s((t, e) => {
91
91
  const r = t.border === "full" ? "border rounded-md" : "border-t";
92
- return x({
92
+ return C({
93
93
  ...t,
94
94
  class: `p-6 ${r} ${t.class || ""}`
95
95
  }, [
96
- t.legend && P(t.legend),
96
+ t.legend && v(t.legend),
97
97
  l({ class: "flex flex-auto flex-col space-y-6" }, e)
98
98
  ]);
99
99
  }), I = d(
@@ -146,7 +146,7 @@ const a = {
146
146
  style: ["left: [[filledPercentage]]%", t]
147
147
  }),
148
148
  // Hidden Range Input
149
- C({
149
+ x({
150
150
  type: "range",
151
151
  min: ["[[min]]", t],
152
152
  max: ["[[max]]", t],
@@ -175,8 +175,8 @@ const a = {
175
175
  },
176
176
  ...t,
177
177
  class: `${k} ${t.class || ""}`.trim()
178
- })), $ = (t) => !t || isNaN(t) ? null : t, i = (t, e) => {
179
- const r = t, o = 16, n = 2 * Math.PI * o, m = r / 100 * n, b = `
178
+ })), P = (t) => !t || isNaN(t) ? null : t, i = (t, e) => {
179
+ const r = t, o = 16, n = 2 * Math.PI * o, m = r / 100 * n, f = `
180
180
  <svg class="w-40 h-40 mx-auto" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
181
181
  <!-- Background Circle -->
182
182
  <circle
@@ -216,7 +216,7 @@ const a = {
216
216
  `;
217
217
  return l({
218
218
  class: "circle-graph text-inherit",
219
- html: b
219
+ html: f
220
220
  });
221
221
  }, R = s((t) => {
222
222
  const e = t.progress || 0, r = t.class || "", o = i(e, r);
@@ -224,7 +224,7 @@ const a = {
224
224
  class: "circle-graph-wrap",
225
225
  onSet: [
226
226
  t.prop,
227
- (n) => (n = $(n), n ? i(n, r) : o)
227
+ (n) => (n = P(n), n ? i(n, r) : o)
228
228
  ]
229
229
  }, [o]);
230
230
  }), S = () => u(({ state: t }) => l({
@@ -282,7 +282,9 @@ const a = {
282
282
  t < 0 && (t = 0), t > 100 && (t = 100), this.state.progress = t;
283
283
  }
284
284
  }
285
- ), g = {
285
+ ), V = ({ class: t, shape: e = "rectangle", width: r = "w-full", height: o = "h-4" }) => l({
286
+ class: `bg-muted animate-pulse ${r} ${o} ${e === "circle" ? "rounded-full" : "rounded-md"} ${t || ""}`
287
+ }), g = {
286
288
  top: "bottom-full left-1/2 transform -translate-x-1/2 mb-2",
287
289
  "top-right": "bottom-full left-full transform -translate-x-1 mb-2",
288
290
  "top-left": "bottom-full right-full transform translate-x-1 mb-2",
@@ -291,7 +293,7 @@ const a = {
291
293
  "bottom-left": "top-full right-full transform translate-x-1 mt-2",
292
294
  left: "top-1/2 right-full transform -translate-y-1/2 mr-2",
293
295
  right: "top-1/2 left-full transform -translate-y-1/2 ml-2"
294
- }, E = (t) => g[t] || g.top, V = s(({ position: t = "top", content: e }, r) => {
296
+ }, E = (t) => g[t] || g.top, D = s(({ position: t = "top", content: e }, r) => {
295
297
  const o = E(t);
296
298
  return Array.isArray(r) === !1 && (r = [r]), l({ class: "relative group inline-block" }, [
297
299
  ...r,
@@ -308,9 +310,10 @@ export {
308
310
  T as B,
309
311
  R as C,
310
312
  L as F,
311
- P as L,
313
+ v as L,
312
314
  O as P,
313
315
  I as R,
314
316
  G as S,
315
- V as T
317
+ D as T,
318
+ V as a
316
319
  };
@@ -1,4 +1,4 @@
1
- export function DataTableBody({ key, rows, selectRow, rowItem, emptyState }: object): object;
1
+ export function DataTableBody({ key, rows, selectRow, rowItem, emptyState, skeleton, columnCount }: object): object;
2
2
  import { CheckboxCol } from './table-header.js';
3
3
  import { HeaderCol } from './table-header.js';
4
4
  import { TableHeader } from './table-header.js';
@@ -26,18 +26,6 @@ export class DataTable extends Component {
26
26
  * @returns {void}
27
27
  */
28
28
  updateSelected(): void;
29
- /**
30
- * Generates skeleton rows for the table.
31
- *
32
- * @returns {Array}
33
- */
34
- generateSkeletonRows(): any[];
35
- /**
36
- * Removes skeleton rows and shows real content.
37
- *
38
- * @returns {void}
39
- */
40
- removeSkeleton(): void;
41
29
  /**
42
30
  * This will get the selected rows.
43
31
  *
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@base-framework/ui",
3
- "version": "1.0.278",
3
+ "version": "1.0.280",
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": {