@aortl/admin-react 0.18.1 → 0.18.3
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 +16 -1
- package/dist/Dialog.d.ts +2 -2
- package/dist/Dialog.d.ts.map +1 -1
- package/dist/Tabs.d.ts +9 -3
- package/dist/Tabs.d.ts.map +1 -1
- package/dist/admin.scoped.css +20 -0
- package/dist/index.cjs +7 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +7 -5
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -4,6 +4,19 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
|
|
|
4
4
|
|
|
5
5
|
## [Unreleased]
|
|
6
6
|
|
|
7
|
+
## [0.18.3] - 2026-06-29
|
|
8
|
+
|
|
9
|
+
### Added
|
|
10
|
+
|
|
11
|
+
- `Tabs.Tab` `icon` prop (leading glyph via `renderIcon`); tab SVG icons are pinned to the label size (`.tabs .tab > svg`), so non-Tabler sets (e.g. Heroicons) render uniformly. (both)
|
|
12
|
+
- `Tabs` `wrap` prop (`.tabs-wrap`) lets the list wrap onto new rows instead of overflowing, keeping each tab's label on one line. (both)
|
|
13
|
+
|
|
14
|
+
## [0.18.2] - 2026-06-29
|
|
15
|
+
|
|
16
|
+
### Added
|
|
17
|
+
|
|
18
|
+
- `Dialog` `size="auto"` (`.dialog-auto`) shrinks the modal to fit its content, and `size="metabase"` (`.dialog-metabase`) widens it to 1138px with 44px gutters so a full-width embedded iframe lands at 1048px. (both)
|
|
19
|
+
|
|
7
20
|
## [0.18.1] - 2026-06-25
|
|
8
21
|
|
|
9
22
|
### Fixed
|
|
@@ -85,12 +98,14 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
|
|
|
85
98
|
- Make `primary` a high-contrast neutral and move blue to `info`. (both)
|
|
86
99
|
- Use solid color fills for `Alert` and `Badge` status variants. (both)
|
|
87
100
|
|
|
88
|
-
[Unreleased]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.
|
|
101
|
+
[Unreleased]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.3...HEAD
|
|
89
102
|
[0.16.1]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.16.0...v0.16.1
|
|
90
103
|
[0.16.0]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.15.1...v0.16.0
|
|
91
104
|
[0.15.1]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.15.0...v0.15.1
|
|
92
105
|
[0.15.0]: https://github.com/Digital-Udvikling/admin-design-system/releases/tag/v0.15.0
|
|
93
106
|
|
|
107
|
+
[0.18.3]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.2...v0.18.3
|
|
108
|
+
[0.18.2]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.1...v0.18.2
|
|
94
109
|
[0.18.1]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.18.0...v0.18.1
|
|
95
110
|
[0.18.0]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.17.0...v0.18.0
|
|
96
111
|
[0.17.0]: https://github.com/Digital-Udvikling/admin-design-system/compare/v0.16.2...v0.17.0
|
package/dist/Dialog.d.ts
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { ComponentProps, ReactNode } from 'react';
|
|
2
2
|
import { SlotClasses } from './cn';
|
|
3
3
|
import { IconProp } from './icon';
|
|
4
|
-
export type DialogSize = "sm" | "md" | "lg";
|
|
4
|
+
export type DialogSize = "sm" | "md" | "lg" | "auto" | "metabase";
|
|
5
5
|
export type DialogClosedBy = "any" | "closerequest" | "none";
|
|
6
6
|
export interface DialogContainerProps extends Omit<ComponentProps<"dialog">, "open"> {
|
|
7
7
|
/** Controlled open state. Omit for uncontrolled (e.g. driven by Invoker Commands). */
|
|
8
8
|
open?: boolean;
|
|
9
9
|
/** Fires when the dialog closes (Esc, backdrop, close button, form method="dialog"). */
|
|
10
10
|
onOpenChange?: (open: boolean) => void;
|
|
11
|
-
/** Width preset. Default: `"md"`. */
|
|
11
|
+
/** Width preset. `"auto"` shrinks to content; `"metabase"` fits a 1048px embedded iframe (1138px modal). Default: `"md"`. */
|
|
12
12
|
size?: DialogSize;
|
|
13
13
|
/** Native `closedby` attribute. Default: `"any"`. */
|
|
14
14
|
closedby?: DialogClosedBy;
|
package/dist/Dialog.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../src/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACxE,OAAO,EAAM,KAAK,WAAW,EAAE,MAAM,MAAM,CAAC;AAE5C,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAGnD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../src/Dialog.tsx"],"names":[],"mappings":"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"}
|
package/dist/Tabs.d.ts
CHANGED
|
@@ -1,17 +1,23 @@
|
|
|
1
1
|
import { Tabs as BaseTabs } from '@base-ui/react/tabs';
|
|
2
2
|
import { ComponentProps } from 'react';
|
|
3
|
+
import { IconProp } from './icon';
|
|
3
4
|
export type TabsVariant = "bordered" | "boxed";
|
|
4
5
|
export type TabsSize = "sm" | "md" | "lg";
|
|
5
6
|
export interface TabsProps extends ComponentProps<typeof BaseTabs.Root> {
|
|
6
7
|
variant?: TabsVariant;
|
|
7
8
|
size?: TabsSize;
|
|
8
9
|
fullWidth?: boolean;
|
|
10
|
+
/** Let the list wrap to multiple rows instead of overflowing; each tab stays on one line. */
|
|
11
|
+
wrap?: boolean;
|
|
9
12
|
}
|
|
10
|
-
declare function TabsRoot({ variant, size, fullWidth, className, ...rest }: TabsProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
declare function TabsRoot({ variant, size, fullWidth, wrap, className, ...rest }: TabsProps): import("react/jsx-runtime").JSX.Element;
|
|
11
14
|
export type TabsListProps = ComponentProps<typeof BaseTabs.List>;
|
|
12
15
|
declare function TabsList({ className, ...rest }: TabsListProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
-
export
|
|
14
|
-
|
|
16
|
+
export interface TabsTabProps extends ComponentProps<typeof BaseTabs.Tab> {
|
|
17
|
+
/** Leading icon. Pass a component (`icon={IconLock}`) or an element. */
|
|
18
|
+
icon?: IconProp;
|
|
19
|
+
}
|
|
20
|
+
declare function TabsTab({ icon, className, children, ...rest }: TabsTabProps): import("react/jsx-runtime").JSX.Element;
|
|
15
21
|
export type TabsPanelProps = ComponentProps<typeof BaseTabs.Panel>;
|
|
16
22
|
declare function TabsPanel({ className, ...rest }: TabsPanelProps): import("react/jsx-runtime").JSX.Element;
|
|
17
23
|
export declare const Tabs: typeof TabsRoot & {
|
package/dist/Tabs.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../src/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../src/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAEnD,MAAM,MAAM,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;AAC/C,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE1C,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC;IACrE,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6FAA6F;IAC7F,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,iBAAS,QAAQ,CAAC,EAChB,OAAoB,EACpB,IAAW,EACX,SAAiB,EACjB,IAAY,EACZ,SAAS,EACT,GAAG,IAAI,EACR,EAAE,SAAS,2CAgBX;AAED,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC;AAEjE,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,2CAEtD;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,OAAO,QAAQ,CAAC,GAAG,CAAC;IACvE,wEAAwE;IACxE,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB;AAED,iBAAS,OAAO,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,YAAY,2CAOpE;AAED,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC;AAEnE,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,2CAExD;AAED,eAAO,MAAM,IAAI;;;;CAIf,CAAC"}
|
package/dist/admin.scoped.css
CHANGED
|
@@ -3583,6 +3583,16 @@
|
|
|
3583
3583
|
:scope._ao-dialog-lg, :scope ._ao-dialog-lg {
|
|
3584
3584
|
max-width: 48rem;
|
|
3585
3585
|
}
|
|
3586
|
+
:scope._ao-dialog-auto, :scope ._ao-dialog-auto {
|
|
3587
|
+
width: auto;
|
|
3588
|
+
max-width: calc(100vw - 2rem);
|
|
3589
|
+
}
|
|
3590
|
+
:scope._ao-dialog-metabase, :scope ._ao-dialog-metabase {
|
|
3591
|
+
max-width: 1138px;
|
|
3592
|
+
}
|
|
3593
|
+
:scope._ao-dialog-metabase ._ao-dialog-header, :scope ._ao-dialog-metabase ._ao-dialog-header, :scope._ao-dialog-metabase ._ao-dialog-description, :scope ._ao-dialog-metabase ._ao-dialog-description, :scope._ao-dialog-metabase ._ao-dialog-body, :scope ._ao-dialog-metabase ._ao-dialog-body, :scope._ao-dialog-metabase ._ao-dialog-footer, :scope ._ao-dialog-metabase ._ao-dialog-footer {
|
|
3594
|
+
padding-inline: calc(var(--spacing) * 11);
|
|
3595
|
+
}
|
|
3586
3596
|
:scope._ao-dialog-header, :scope ._ao-dialog-header {
|
|
3587
3597
|
display: flex;
|
|
3588
3598
|
align-items: flex-start;
|
|
@@ -4741,6 +4751,10 @@
|
|
|
4741
4751
|
:scope._ao-tabs ._ao-tab > :is(i, svg), :scope ._ao-tabs ._ao-tab > :is(i, svg) {
|
|
4742
4752
|
flex-shrink: 0;
|
|
4743
4753
|
}
|
|
4754
|
+
:scope._ao-tabs ._ao-tab > svg, :scope ._ao-tabs ._ao-tab > svg {
|
|
4755
|
+
width: 1em;
|
|
4756
|
+
height: 1em;
|
|
4757
|
+
}
|
|
4744
4758
|
:scope._ao-tabs ._ao-tab-input, :scope ._ao-tabs ._ao-tab-input {
|
|
4745
4759
|
position: absolute;
|
|
4746
4760
|
width: 1px;
|
|
@@ -4854,6 +4868,12 @@
|
|
|
4854
4868
|
flex: 1;
|
|
4855
4869
|
justify-content: center;
|
|
4856
4870
|
}
|
|
4871
|
+
:scope._ao-tabs-wrap ._ao-tab-list, :scope ._ao-tabs-wrap ._ao-tab-list {
|
|
4872
|
+
flex-wrap: wrap;
|
|
4873
|
+
}
|
|
4874
|
+
:scope._ao-tabs-wrap ._ao-tab, :scope ._ao-tabs-wrap ._ao-tab {
|
|
4875
|
+
white-space: nowrap;
|
|
4876
|
+
}
|
|
4857
4877
|
:scope._ao-tabs-sm ._ao-tab, :scope ._ao-tabs-sm ._ao-tab {
|
|
4858
4878
|
height: calc(var(--spacing) * 7);
|
|
4859
4879
|
padding-inline: calc(var(--spacing) * 2);
|
package/dist/index.cjs
CHANGED
|
@@ -2352,13 +2352,14 @@ var Navbar = Object.assign(NavbarRoot, {
|
|
|
2352
2352
|
});
|
|
2353
2353
|
//#endregion
|
|
2354
2354
|
//#region src/Tabs.tsx
|
|
2355
|
-
function TabsRoot({ variant = "bordered", size = "md", fullWidth = false, className, ...rest }) {
|
|
2355
|
+
function TabsRoot({ variant = "bordered", size = "md", fullWidth = false, wrap = false, className, ...rest }) {
|
|
2356
2356
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tabs.Tabs.Root, {
|
|
2357
2357
|
className: cn([
|
|
2358
2358
|
"tabs",
|
|
2359
2359
|
variant !== "bordered" && `tabs-${variant}`,
|
|
2360
2360
|
size !== "md" && `tabs-${size}`,
|
|
2361
|
-
fullWidth && "tabs-full-width"
|
|
2361
|
+
fullWidth && "tabs-full-width",
|
|
2362
|
+
wrap && "tabs-wrap"
|
|
2362
2363
|
], className),
|
|
2363
2364
|
...rest
|
|
2364
2365
|
});
|
|
@@ -2369,10 +2370,11 @@ function TabsList({ className, ...rest }) {
|
|
|
2369
2370
|
...rest
|
|
2370
2371
|
});
|
|
2371
2372
|
}
|
|
2372
|
-
function TabsTab({ className, ...rest }) {
|
|
2373
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.
|
|
2373
|
+
function TabsTab({ icon, className, children, ...rest }) {
|
|
2374
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_tabs.Tabs.Tab, {
|
|
2374
2375
|
className: cn("tab", className),
|
|
2375
|
-
...rest
|
|
2376
|
+
...rest,
|
|
2377
|
+
children: [renderIcon(icon), children]
|
|
2376
2378
|
});
|
|
2377
2379
|
}
|
|
2378
2380
|
function TabsPanel({ className, ...rest }) {
|