@aortl/admin-react 0.19.0 → 0.20.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.
package/CHANGELOG.md CHANGED
@@ -4,6 +4,18 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
4
4
 
5
5
  ## [Unreleased]
6
6
 
7
+ ## [0.20.0] - 2026-07-06
8
+
9
+ ### Added
10
+
11
+ - `Timeline` horizontal variant — `.timeline-horizontal` (React `horizontal` prop) lays items out as equal-width columns with the connector running along the indicator row. Composes with the numbered variant for a step tracker. (both)
12
+
13
+ ## [0.19.1] - 2026-07-02
14
+
15
+ ### Changed
16
+
17
+ - Copyable `PropertyList` value cells copy on click anywhere in the cell, not only on the copy button (which stays as the keyboard and screen-reader path). Selecting text or clicking an interactive child doesn't trigger a copy; the cell shows a pointer cursor. (both)
18
+
7
19
  ## [0.19.0] - 2026-07-02
8
20
 
9
21
  ### Added
@@ -121,12 +133,14 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
121
133
  - Make `primary` a high-contrast neutral and move blue to `info`. (both)
122
134
  - Use solid color fills for `Alert` and `Badge` status variants. (both)
123
135
 
124
- [Unreleased]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.19.0...HEAD
136
+ [Unreleased]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.20.0...HEAD
125
137
  [0.16.1]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.16.0...v0.16.1
126
138
  [0.16.0]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.15.1...v0.16.0
127
139
  [0.15.1]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.15.0...v0.15.1
128
140
  [0.15.0]: https://github.com/Digital-Udvikling/admin-design-system/releases/tag/v0.15.0
129
141
 
142
+ [0.20.0]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.19.1...v0.20.0
143
+ [0.19.1]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.19.0...v0.19.1
130
144
  [0.19.0]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.5...v0.19.0
131
145
  [0.18.5]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.4...v0.18.5
132
146
  [0.18.4]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.3...v0.18.4
@@ -36,7 +36,7 @@ export interface PropertyListValueProps extends ComponentProps<"dd"> {
36
36
  /** Per-slot class overrides. `className` targets the root; these target inner slots. */
37
37
  classNames?: SlotClasses<"copy">;
38
38
  }
39
- declare function PropertyListValue({ numeric, copyable, empty, copyValue, className, classNames, children, ...rest }: PropertyListValueProps): import("react/jsx-runtime").JSX.Element;
39
+ declare function PropertyListValue({ numeric, copyable, empty, copyValue, className, classNames, children, onClick, ...rest }: PropertyListValueProps): import("react/jsx-runtime").JSX.Element;
40
40
  export declare const PropertyList: typeof PropertyListRoot & {
41
41
  Item: typeof PropertyListItem;
42
42
  Label: typeof PropertyListLabel;
@@ -1 +1 @@
1
- {"version":3,"file":"PropertyList.d.ts","sourceRoot":"","sources":["../src/PropertyList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC9E,OAAO,EAAM,KAAK,WAAW,EAAE,MAAM,MAAM,CAAC;AA4C5C,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IACjF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iFAAiF;IACjF,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,sEAAsE;IACtE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CAAC,OAAO,GAAG,OAAO,CAAC,CAAC;CAC7C;AAED,iBAAS,gBAAgB,CAAC,EACxB,OAAO,EACP,OAAO,EACP,cAAc,EACd,KAAK,EACL,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,iBAAiB,2CAoBnB;AAED,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IAC1F,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0FAA0F;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kEAAkE;IAClE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CAAC,OAAO,GAAG,MAAM,CAAC,CAAC;CAC5C;AASD,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,KAAK,EACL,OAAO,EACP,QAAQ,EACR,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,qBAAqB,2CAoBvB;AAED,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;AAC1D,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,sBAAsB,2CAExE;AAED,MAAM,WAAW,sBAAuB,SAAQ,cAAc,CAAC,IAAI,CAAC;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mFAAmF;IACnF,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,kEAAkE;IAClE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAClC;AAED,iBAAS,iBAAiB,CAAC,EACzB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,sBAAsB,2CA2CxB;AAED,eAAO,MAAM,YAAY;;;;CAIvB,CAAC"}
1
+ {"version":3,"file":"PropertyList.d.ts","sourceRoot":"","sources":["../src/PropertyList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,cAAc,EAAmB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAM,KAAK,WAAW,EAAE,MAAM,MAAM,CAAC;AA4C5C,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IACjF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iFAAiF;IACjF,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,sEAAsE;IACtE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CAAC,OAAO,GAAG,OAAO,CAAC,CAAC;CAC7C;AAED,iBAAS,gBAAgB,CAAC,EACxB,OAAO,EACP,OAAO,EACP,cAAc,EACd,KAAK,EACL,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,iBAAiB,2CAoBnB;AAED,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IAC1F,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0FAA0F;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kEAAkE;IAClE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CAAC,OAAO,GAAG,MAAM,CAAC,CAAC;CAC5C;AASD,iBAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,KAAK,EACL,OAAO,EACP,QAAQ,EACR,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,qBAAqB,2CAoBvB;AAED,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;AAC1D,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,sBAAsB,2CAExE;AAED,MAAM,WAAW,sBAAuB,SAAQ,cAAc,CAAC,IAAI,CAAC;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mFAAmF;IACnF,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,kEAAkE;IAClE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAClC;AAED,iBAAS,iBAAiB,CAAC,EACzB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EACV,QAAQ,EACR,OAAO,EACP,GAAG,IAAI,EACR,EAAE,sBAAsB,2CA0DxB;AAED,eAAO,MAAM,YAAY;;;;CAIvB,CAAC"}
@@ -5,8 +5,10 @@ export type TimelineStatus = "default" | "info" | "success" | "warning" | "dange
5
5
  export interface TimelineProps extends ComponentProps<"ol"> {
6
6
  /** Turn the rail into a numbered step list. */
7
7
  numbered?: boolean;
8
+ /** Lay items out as side-by-side columns instead of a vertical rail. */
9
+ horizontal?: boolean;
8
10
  }
9
- declare function TimelineRoot({ numbered, className, ...rest }: TimelineProps): import("react/jsx-runtime").JSX.Element;
11
+ declare function TimelineRoot({ numbered, horizontal, className, ...rest }: TimelineProps): import("react/jsx-runtime").JSX.Element;
10
12
  export interface TimelineItemProps extends Omit<ComponentProps<"li">, "title"> {
11
13
  /** Accent for the indicator. `current` highlights a numbered marker. */
12
14
  status?: TimelineStatus;
@@ -1 +1 @@
1
- {"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../src/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAM,KAAK,WAAW,EAAE,MAAM,MAAM,CAAC;AAC5C,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAEnD,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE/F,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,IAAI,CAAC;IACzD,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AACD,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,2CAEpE;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;IAC5E,wEAAwE;IACxE,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,iDAAiD;IACjD,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,gGAAgG;IAChG,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sBAAsB;IACtB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CACtB,WAAW,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,aAAa,CAC9E,CAAC;CACH;AACD,iBAAS,YAAY,CAAC,EACpB,MAAkB,EAClB,IAAI,EACJ,MAAM,EACN,KAAK,EACL,IAAI,EACJ,WAAW,EACX,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,iBAAiB,2CAgCnB;AAED,eAAO,MAAM,QAAQ;;CAAsD,CAAC"}
1
+ {"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../src/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAM,KAAK,WAAW,EAAE,MAAM,MAAM,CAAC;AAC5C,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAEnD,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE/F,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,IAAI,CAAC;IACzD,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wEAAwE;IACxE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AACD,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,2CAUhF;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;IAC5E,wEAAwE;IACxE,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,iDAAiD;IACjD,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,gGAAgG;IAChG,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sBAAsB;IACtB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,wFAAwF;IACxF,UAAU,CAAC,EAAE,WAAW,CACtB,WAAW,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,aAAa,CAC9E,CAAC;CACH;AACD,iBAAS,YAAY,CAAC,EACpB,MAAkB,EAClB,IAAI,EACJ,MAAM,EACN,KAAK,EACL,IAAI,EACJ,WAAW,EACX,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,iBAAiB,2CAgCnB;AAED,eAAO,MAAM,QAAQ;;CAAsD,CAAC"}
@@ -1744,6 +1744,9 @@
1744
1744
  padding: 0.125rem;
1745
1745
  transition: opacity 100ms ease, color 100ms ease;
1746
1746
  }
1747
+ :scope._ao-property-list-value-copyable, :scope ._ao-property-list-value-copyable {
1748
+ cursor: pointer;
1749
+ }
1747
1750
  :scope._ao-property-list-value-copyable ._ao-property-list-copy, :scope ._ao-property-list-value-copyable ._ao-property-list-copy {
1748
1751
  display: inline-flex;
1749
1752
  opacity: 0;
@@ -3576,6 +3579,43 @@
3576
3579
  background-color: var(--color-primary);
3577
3580
  color: var(--color-primary-content);
3578
3581
  }
3582
+ :scope._ao-timeline-horizontal, :scope ._ao-timeline-horizontal {
3583
+ display: flex;
3584
+ flex-direction: row;
3585
+ }
3586
+ :scope._ao-timeline-horizontal ._ao-timeline-item, :scope ._ao-timeline-horizontal ._ao-timeline-item {
3587
+ grid-template-columns: none;
3588
+ grid-template-rows: 1.5rem auto;
3589
+ row-gap: 0.5rem;
3590
+ flex: 1 1 0;
3591
+ min-width: 0;
3592
+ padding-bottom: 0;
3593
+ padding-inline: 0.5rem;
3594
+ text-align: center;
3595
+ }
3596
+ :scope._ao-timeline-horizontal ._ao-timeline-item:not(:last-child)::before, :scope ._ao-timeline-horizontal ._ao-timeline-item:not(:last-child)::before {
3597
+ inset: 0.75rem -50% auto 50%;
3598
+ width: auto;
3599
+ height: 2px;
3600
+ transform: translateY(-50%);
3601
+ }
3602
+ :scope._ao-timeline-horizontal ._ao-timeline-indicator, :scope ._ao-timeline-horizontal ._ao-timeline-indicator {
3603
+ grid-row: 1;
3604
+ grid-column: auto;
3605
+ justify-self: center;
3606
+ }
3607
+ :scope._ao-timeline-horizontal ._ao-timeline-content, :scope ._ao-timeline-horizontal ._ao-timeline-content {
3608
+ grid-row: 2;
3609
+ grid-column: auto;
3610
+ align-items: center;
3611
+ padding-block: 0;
3612
+ }
3613
+ :scope._ao-timeline-horizontal._ao-timeline-numbered ._ao-timeline-item, :scope ._ao-timeline-horizontal._ao-timeline-numbered ._ao-timeline-item {
3614
+ grid-template-rows: 1.75rem auto;
3615
+ }
3616
+ :scope._ao-timeline-horizontal._ao-timeline-numbered ._ao-timeline-item:not(:last-child)::before, :scope ._ao-timeline-horizontal._ao-timeline-numbered ._ao-timeline-item:not(:last-child)::before {
3617
+ inset-block-start: 0.875rem;
3618
+ }
3579
3619
  :scope._ao-dialog, :scope ._ao-dialog {
3580
3620
  margin: auto;
3581
3621
  flex-direction: column;
package/dist/index.cjs CHANGED
@@ -1523,9 +1523,13 @@ function StatCard({ variant = "default", label, value, detail, trend, icon, comp
1523
1523
  }
1524
1524
  //#endregion
1525
1525
  //#region src/Timeline.tsx
1526
- function TimelineRoot({ numbered, className, ...rest }) {
1526
+ function TimelineRoot({ numbered, horizontal, className, ...rest }) {
1527
1527
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ol", {
1528
- className: cn(["timeline", numbered && "timeline-numbered"], className),
1528
+ className: cn([
1529
+ "timeline",
1530
+ numbered && "timeline-numbered",
1531
+ horizontal && "timeline-horizontal"
1532
+ ], className),
1529
1533
  ...rest
1530
1534
  });
1531
1535
  }
@@ -2582,8 +2586,9 @@ function PropertyListLabel({ className, ...rest }) {
2582
2586
  ...rest
2583
2587
  });
2584
2588
  }
2585
- function PropertyListValue({ numeric, copyable, empty, copyValue, className, classNames, children, ...rest }) {
2589
+ function PropertyListValue({ numeric, copyable, empty, copyValue, className, classNames, children, onClick, ...rest }) {
2586
2590
  const ddRef = (0, react.useRef)(null);
2591
+ const copyButtonRef = (0, react.useRef)(null);
2587
2592
  const [copied, setCopied] = (0, react.useState)(false);
2588
2593
  async function handleCopy() {
2589
2594
  const text = copyValue ?? ddRef.current?.textContent?.trim() ?? "";
@@ -2594,6 +2599,14 @@ function PropertyListValue({ numeric, copyable, empty, copyValue, className, cla
2594
2599
  setTimeout(() => setCopied(false), 1200);
2595
2600
  } catch {}
2596
2601
  }
2602
+ function handleCellClick(event) {
2603
+ onClick?.(event);
2604
+ if (event.defaultPrevented) return;
2605
+ if (window.getSelection()?.toString()) return;
2606
+ const interactive = event.target.closest("a, button, input, select, textarea");
2607
+ if (interactive && interactive !== copyButtonRef.current) return;
2608
+ handleCopy();
2609
+ }
2597
2610
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("dd", {
2598
2611
  ref: ddRef,
2599
2612
  className: cn([
@@ -2602,12 +2615,13 @@ function PropertyListValue({ numeric, copyable, empty, copyValue, className, cla
2602
2615
  copyable && "property-list-value-copyable",
2603
2616
  empty && "property-list-value-empty"
2604
2617
  ], className),
2618
+ onClick: copyable ? handleCellClick : onClick,
2605
2619
  ...rest,
2606
2620
  children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
2621
+ ref: copyButtonRef,
2607
2622
  type: "button",
2608
2623
  "aria-label": "Copy",
2609
2624
  className: cn("property-list-copy", classNames?.copy),
2610
- onClick: handleCopy,
2611
2625
  "data-copied": copied ? "true" : void 0,
2612
2626
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CopyGlyph, { className: cn("property-list-copy-icon", void 0) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckGlyph, { className: cn("property-list-copy-icon-copied", void 0) })]
2613
2627
  })]