@godxjp/ui 16.1.0 → 16.2.0

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.
@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import * as React from "react";
3
3
  import { cva } from "class-variance-authority";
4
4
  import { cn } from "../../lib/utils";
5
- const cardVariants = cva("group/card border", {
5
+ const cardVariants = cva("group/card", {
6
6
  variants: {
7
7
  size: {
8
8
  md: "",
@@ -255,14 +255,14 @@ function Cascader({
255
255
  className: "w-auto min-w-[var(--radix-popover-trigger-width)] p-0",
256
256
  align: "start",
257
257
  children: [
258
- showSearch && /* @__PURE__ */ jsx("div", { className: "border-b p-2", children: /* @__PURE__ */ jsx(Command, { shouldFilter: false, children: /* @__PURE__ */ jsx(
258
+ showSearch && /* @__PURE__ */ jsx(Command, { shouldFilter: false, children: /* @__PURE__ */ jsx(
259
259
  CommandInput,
260
260
  {
261
261
  placeholder: t("dataEntry.cascader.searchPlaceholder"),
262
262
  value: search,
263
263
  onValueChange: setSearch
264
264
  }
265
- ) }) }),
265
+ ) }),
266
266
  isSearching ? /* @__PURE__ */ jsx(ScrollArea, { className: "max-h-[min(300px,50vh)]", children: /* @__PURE__ */ jsx(
267
267
  "div",
268
268
  {
@@ -199,7 +199,7 @@ function SearchSelect({
199
199
  collisionPadding: 12,
200
200
  className: "flex max-h-[var(--radix-popover-content-available-height)] w-max max-w-[min(32rem,calc(100vw-1.5rem))] min-w-[var(--radix-popover-trigger-width)] flex-col p-0",
201
201
  children: /* @__PURE__ */ jsxs(Command, { shouldFilter: false, className: "flex min-h-0 flex-col", children: [
202
- /* @__PURE__ */ jsx("div", { className: "border-border shrink-0 border-b p-2", children: /* @__PURE__ */ jsx(
202
+ /* @__PURE__ */ jsx("div", { className: "border-border shrink-0 border-b", children: /* @__PURE__ */ jsx(
203
203
  Input,
204
204
  {
205
205
  autoFocus: true,
@@ -209,7 +209,8 @@ function SearchSelect({
209
209
  value: query,
210
210
  onChange: (event) => setQuery(event.target.value),
211
211
  onKeyDown,
212
- placeholder: searchPlaceholder ?? t("dataEntry.searchSelect.search")
212
+ placeholder: searchPlaceholder ?? t("dataEntry.searchSelect.search"),
213
+ className: "rounded-none border-0 shadow-none focus-visible:ring-0"
213
214
  }
214
215
  ) }),
215
216
  /* @__PURE__ */ jsxs(
@@ -199,14 +199,14 @@ function TreeSelectRoot({
199
199
  }
200
200
  ) }),
201
201
  /* @__PURE__ */ jsxs(PopoverContent, { className: "w-[var(--radix-popover-trigger-width)] p-0", align: "start", children: [
202
- showSearch && /* @__PURE__ */ jsx("div", { className: "border-b p-2", children: /* @__PURE__ */ jsx(Command, { shouldFilter: false, children: /* @__PURE__ */ jsx(
202
+ showSearch && /* @__PURE__ */ jsx(Command, { shouldFilter: false, children: /* @__PURE__ */ jsx(
203
203
  CommandInput,
204
204
  {
205
205
  placeholder: t("dataEntry.treeSelect.searchPlaceholder"),
206
206
  value: search,
207
207
  onValueChange: setSearch
208
208
  }
209
- ) }) }),
209
+ ) }),
210
210
  /* @__PURE__ */ jsx(ScrollArea, { className: "max-h-[min(300px,50vh)]", children: /* @__PURE__ */ jsx(
211
211
  "div",
212
212
  {
@@ -23,6 +23,10 @@
23
23
  @layer components {
24
24
  [data-slot="card"] {
25
25
  min-width: 0;
26
+ /* Base hairline border — width lives here (not a Tailwind `border` utility) so the
27
+ * `[data-accent]` rail-width override below can win within the same cascade layer. */
28
+ border-width: 1px;
29
+ border-style: solid;
26
30
  border-color: hsl(var(--card-border));
27
31
  border-radius: var(--card-radius);
28
32
  background: hsl(var(--card-background));
@@ -149,7 +153,8 @@
149
153
 
150
154
  [data-slot="card-header"][data-banded] {
151
155
  padding-inline: var(--card-space-inset);
152
- padding-block: var(--card-space-header-y);
156
+ /* Divided band → symmetric vertical padding (border-aware). */
157
+ padding-block: var(--card-space-divided-y);
153
158
  gap: var(--card-space-gap);
154
159
  }
155
160
 
@@ -248,7 +253,10 @@
248
253
  overflow: hidden;
249
254
  }
250
255
 
251
- [data-slot="card"]:has([data-slot="card-cover"]) [data-slot="card-header"] {
256
+ /* A header BELOW a cover gets a top gap to clear the media — but a BANDED header is a
257
+ * self-contained divider band that must stay symmetric (border-aware), so it keeps its
258
+ * own `--card-space-divided-y` block padding instead of this one-sided top gap. */
259
+ [data-slot="card"]:has([data-slot="card-cover"]) [data-slot="card-header"]:not([data-banded]) {
252
260
  padding-top: var(--card-space-body-y);
253
261
  }
254
262
 
@@ -321,7 +329,8 @@
321
329
 
322
330
  [data-slot="card-footer"][data-separated] {
323
331
  border-top: 1px solid hsl(var(--card-border));
324
- padding-block: var(--card-space-footer-y);
332
+ /* Divided band → symmetric vertical padding (border-aware), in sync with a banded header. */
333
+ padding-block: var(--card-space-divided-y);
325
334
  justify-content: flex-end;
326
335
  }
327
336
 
@@ -5,6 +5,12 @@
5
5
  --card-space-header-y: var(--space-stack-sm);
6
6
  --card-space-body-y: var(--space-section-active);
7
7
  --card-space-footer-y: var(--space-stack-sm);
8
+ /* DIVIDED-section vertical padding (rule #44/#45). A header/footer that carries a
9
+ * divider border (banded header, separated footer) reads as its own band, so it gets
10
+ * SYMMETRIC top+bottom padding — distinct from a plain header that flows into the body
11
+ * (top inset, no bottom). One themeable knob keeps the header- and footer-band rhythm in
12
+ * sync; a service theme tunes the band density here instead of forking per-slot CSS. */
13
+ --card-space-divided-y: var(--card-space-header-y);
8
14
  --card-space-gap: var(--space-stack-xs);
9
15
  --card-title-font-size: var(--font-size-base);
10
16
  --card-title-line-height: var(--line-height-tight);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@godxjp/ui",
3
- "version": "16.1.0",
3
+ "version": "16.2.0",
4
4
  "type": "module",
5
5
  "packageManager": "pnpm@10.29.1",
6
6
  "sideEffects": false,