@wpic/ui 0.3.8 → 0.3.10

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/wpic-ui.css CHANGED
@@ -64,6 +64,21 @@
64
64
  .wpic-card--borderless {
65
65
  border: 0;
66
66
  }
67
+ .wpic-card--padding-sm { --wpic-card-padding-x: 0.75rem; --wpic-card-padding-y: 0.75rem; }
68
+ .wpic-card--padding-md { --wpic-card-padding-x: 1rem; --wpic-card-padding-y: 1rem; }
69
+ .wpic-card--padding-lg { --wpic-card-padding-x: 1.5rem; --wpic-card-padding-y: 1.5rem; }
70
+ .wpic-card__header {
71
+ padding: 0.75rem var(--wpic-card-padding-x);
72
+ }
73
+ .wpic-card__body--padded {
74
+ padding: var(--wpic-card-padding-y) var(--wpic-card-padding-x);
75
+ }
76
+ .wpic-card__empty {
77
+ padding: 1.5rem var(--wpic-card-padding-x);
78
+ }
79
+ .wpic-card__footer {
80
+ padding: 0.75rem var(--wpic-card-padding-x);
81
+ }
67
82
  .wpic-card__header--divided {
68
83
  border-bottom: 1px solid var(--border-subtle);
69
84
  }
package/dist/wpic-ui.js CHANGED
@@ -3225,10 +3225,10 @@ const h0 = /* @__PURE__ */ U1(b4, [["render", x4]]), y4 = ["disabled"], C2 = /*
3225
3225
  }
3226
3226
  }), y6 = { class: "font-medium text-zinc-800 dark:text-zinc-200 flex-1 min-w-0 truncate" }, w6 = {
3227
3227
  key: 2,
3228
- class: "wpic-card__empty px-4 py-6 flex items-center gap-2 text-zinc-400 dark:text-zinc-500"
3228
+ class: "wpic-card__empty flex items-center gap-2 text-zinc-400 dark:text-zinc-500"
3229
3229
  }, M6 = {
3230
3230
  key: 3,
3231
- class: "wpic-card__footer px-4 py-3"
3231
+ class: "wpic-card__footer"
3232
3232
  }, Jt = /* @__PURE__ */ J({
3233
3233
  __name: "WCard",
3234
3234
  props: {
@@ -3237,15 +3237,16 @@ const h0 = /* @__PURE__ */ U1(b4, [["render", x4]]), y4 = ["disabled"], C2 = /*
3237
3237
  noPadding: { type: Boolean },
3238
3238
  bodyClass: {},
3239
3239
  borderless: { type: Boolean },
3240
- headerDivider: { type: Boolean }
3240
+ headerDivider: { type: Boolean, default: !0 },
3241
+ padding: { default: "md" }
3241
3242
  },
3242
3243
  setup(n) {
3243
3244
  return (v, c) => (e(), t("div", {
3244
- class: g(["wpic-card rounded-xl bg-zinc-50 dark:bg-zinc-800/60 overflow-hidden", n.borderless ? "wpic-card--borderless" : "wpic-card--bordered"])
3245
+ class: g(["wpic-card rounded-xl bg-zinc-50 dark:bg-zinc-800/60 overflow-hidden", `wpic-card--padding-${n.padding}`, n.borderless ? "wpic-card--borderless" : "wpic-card--bordered"])
3245
3246
  }, [
3246
3247
  v.$slots.icon || v.$slots.title || n.title || v.$slots.actions ? (e(), t("div", {
3247
3248
  key: 0,
3248
- class: g(["wpic-card__header px-4 py-3 flex items-center gap-2", n.headerDivider === !1 ? "wpic-card__header--undivided" : "wpic-card__header--divided"])
3249
+ class: g(["wpic-card__header flex items-center gap-2", n.headerDivider === !1 ? "wpic-card__header--undivided" : "wpic-card__header--divided"])
3249
3250
  }, [
3250
3251
  Q(v.$slots, "icon"),
3251
3252
  l("span", y6, [
@@ -3259,7 +3260,7 @@ const h0 = /* @__PURE__ */ U1(b4, [["render", x4]]), y4 = ["disabled"], C2 = /*
3259
3260
  Q(v.$slots, "empty")
3260
3261
  ])) : (e(), t("div", {
3261
3262
  key: 1,
3262
- class: g(["wpic-card__body", n.noPadding ? "" : n.bodyClass ?? "p-4"])
3263
+ class: g(["wpic-card__body", n.noPadding ? "" : n.bodyClass ?? "wpic-card__body--padded"])
3263
3264
  }, [
3264
3265
  Q(v.$slots, "default")
3265
3266
  ], 2)),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wpic/ui",
3
- "version": "0.3.8",
3
+ "version": "0.3.10",
4
4
  "type": "module",
5
5
  "description": "WPIC shared Vue 3 component library",
6
6
  "publishConfig": {
package/src/style.css CHANGED
@@ -64,6 +64,21 @@
64
64
  .wpic-card--borderless {
65
65
  border: 0;
66
66
  }
67
+ .wpic-card--padding-sm { --wpic-card-padding-x: 0.75rem; --wpic-card-padding-y: 0.75rem; }
68
+ .wpic-card--padding-md { --wpic-card-padding-x: 1rem; --wpic-card-padding-y: 1rem; }
69
+ .wpic-card--padding-lg { --wpic-card-padding-x: 1.5rem; --wpic-card-padding-y: 1.5rem; }
70
+ .wpic-card__header {
71
+ padding: 0.75rem var(--wpic-card-padding-x);
72
+ }
73
+ .wpic-card__body--padded {
74
+ padding: var(--wpic-card-padding-y) var(--wpic-card-padding-x);
75
+ }
76
+ .wpic-card__empty {
77
+ padding: 1.5rem var(--wpic-card-padding-x);
78
+ }
79
+ .wpic-card__footer {
80
+ padding: 0.75rem var(--wpic-card-padding-x);
81
+ }
67
82
  .wpic-card__header--divided {
68
83
  border-bottom: 1px solid var(--border-subtle);
69
84
  }