@stratakit/structures 0.2.2 → 0.2.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 +65 -2
- package/dist/Banner.d.ts +2 -1
- package/dist/Banner.js +3 -2
- package/dist/Chip.d.ts +42 -7
- package/dist/Chip.js +82 -26
- package/dist/DEV/Banner.js +3 -2
- package/dist/DEV/Chip.js +85 -26
- package/dist/DEV/DropdownMenu.js +2 -2
- package/dist/DEV/ErrorRegion.js +4 -4
- package/dist/DEV/Table.js +2 -2
- package/dist/DEV/Toolbar.js +13 -7
- package/dist/DEV/TreeItem.js +3 -3
- package/dist/DEV/index.js +4 -4
- package/dist/DEV/styles.css.js +1 -1
- package/dist/DropdownMenu.js +2 -2
- package/dist/ErrorRegion.js +4 -4
- package/dist/Table.js +2 -2
- package/dist/Tabs.d.ts +10 -0
- package/dist/Toolbar.js +13 -7
- package/dist/TreeItem.js +3 -3
- package/dist/index.d.ts +2 -2
- package/dist/index.js +4 -4
- package/dist/styles.css.js +1 -1
- package/package.json +69 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,70 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 0.2.3
|
|
4
|
+
|
|
5
|
+
- [#788](https://github.com/iTwin/design-system/pull/788): Updated `Tabs.Tab` component to support optional start and end icons.
|
|
6
|
+
|
|
7
|
+
```tsx
|
|
8
|
+
// Add end icon to a tab.
|
|
9
|
+
<Tabs.Tab id="tab-1">
|
|
10
|
+
Tab 1
|
|
11
|
+
<Icon href={…} />
|
|
12
|
+
</Tabs.Tab>
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
- [#773](https://github.com/iTwin/design-system/pull/773): Added [subpath exports](https://nodejs.org/api/packages.html#subpath-exports) for individual components. These new exports allow StrataKit to expose both convenience and compositional APIs of the same component.
|
|
16
|
+
|
|
17
|
+
```tsx
|
|
18
|
+
// Convenience import
|
|
19
|
+
import Chip from "@stratakit/structures/Chip";
|
|
20
|
+
// Alternative
|
|
21
|
+
import { default as Chip } from "@stratakit/structures/Chip";
|
|
22
|
+
|
|
23
|
+
<Chip />;
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
```tsx
|
|
27
|
+
// Compositional import
|
|
28
|
+
import * as Chip from "@stratakit/structures/Chip";
|
|
29
|
+
|
|
30
|
+
<Chip.Root>
|
|
31
|
+
<Chip.Label>Label</Chip.Label>
|
|
32
|
+
<Chip.DismissButton />
|
|
33
|
+
</Chip.Root>;
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
Compositional components are useful for building custom components that require more control over the structure and behavior, while convenience components provide a ready-to-use solution for common use cases. See [#405](https://github.com/iTwin/design-system/discussions/405) for more details.
|
|
37
|
+
|
|
38
|
+
APIs exported from the barrel file are not changed in this release. Some exported components are compositional, while others are convenience components.
|
|
39
|
+
|
|
40
|
+
```tsx
|
|
41
|
+
// Chip is exported as a convenience API in the barrel file:
|
|
42
|
+
import { Chip } from "@stratakit/structures";
|
|
43
|
+
|
|
44
|
+
<Chip />;
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
- [#763](https://github.com/iTwin/design-system/pull/763): Added compositional `Chip.Root`, `Chip.Label` and `Chip.DismissButton` components. These new components can be used when you need fine grained configuration.
|
|
48
|
+
|
|
49
|
+
To use the compositional components, import them from the `/Chip` subpath:
|
|
50
|
+
|
|
51
|
+
```tsx
|
|
52
|
+
import * as Chip from "@stratakit/structures/Chip";
|
|
53
|
+
|
|
54
|
+
<Chip.Root>
|
|
55
|
+
<Chip.Label>Label</Chip.Label>
|
|
56
|
+
<Chip.DismissButton onClick={onDismiss} />
|
|
57
|
+
</Chip.Root>;
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
- [#815](https://github.com/iTwin/design-system/pull/815): Fixed an issue where Toolbar was using Context as a component which doesn't work in React 18.
|
|
61
|
+
- [#781](https://github.com/iTwin/design-system/pull/781): Updated `Chip.Label` component styling when rendered as a button.
|
|
62
|
+
- [#793](https://github.com/iTwin/design-system/pull/793): Added `zustand` as a dependency.
|
|
63
|
+
|
|
64
|
+
- Updated dependencies:
|
|
65
|
+
- @stratakit/foundations@0.2.0
|
|
66
|
+
- @stratakit/bricks@0.3.1
|
|
67
|
+
|
|
3
68
|
## 0.2.2
|
|
4
69
|
|
|
5
70
|
- [#756](https://github.com/iTwin/design-system/pull/756): `DropdownMenu.Button` will now ignore `render={undefined}`.
|
|
@@ -24,7 +89,6 @@
|
|
|
24
89
|
- [#720](https://github.com/iTwin/design-system/pull/720): Renamed `onExpandedChange` prop for `unstable_ErrorRegion.Root` to `setOpen`.
|
|
25
90
|
Renamed `expanded` prop for `unstable_ErrorRegion.Root` to `open`.
|
|
26
91
|
- [#709](https://github.com/iTwin/design-system/pull/709): `unstable_AccordionItem` breaking changes:
|
|
27
|
-
|
|
28
92
|
- `AccordionItem.Trigger` renamed to `AccordionItem.Header` and no longer represents the underlying `<button>` element (see `AccordionItem.Label`).
|
|
29
93
|
- `AccordionItem.Label` must be wrapped with the new `AccordionItem.Button`.
|
|
30
94
|
|
|
@@ -53,7 +117,6 @@
|
|
|
53
117
|
## 0.1.1
|
|
54
118
|
|
|
55
119
|
- [#704](https://github.com/iTwin/design-system/pull/704): The following components have been moved from `@stratakit/bricks` into `@stratakit/structures`.
|
|
56
|
-
|
|
57
120
|
- `unstable_AccordionItem`
|
|
58
121
|
- `unstable_Banner`
|
|
59
122
|
- `Chip`
|
package/dist/Banner.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ import type { BaseProps } from "@stratakit/foundations/secret-internals";
|
|
|
9
9
|
* <Banner label="Title" message="Message" icon={placeholderIcon} onDismiss={() => {}} />
|
|
10
10
|
* ```
|
|
11
11
|
*/
|
|
12
|
-
|
|
12
|
+
declare const Banner: React.ForwardRefExoticComponent<Omit<BaseProps, "children"> & {
|
|
13
13
|
/**
|
|
14
14
|
* Icon to be displayed inside the banner.
|
|
15
15
|
*
|
|
@@ -79,3 +79,4 @@ export declare const Banner: React.ForwardRefExoticComponent<Omit<BaseProps, "ch
|
|
|
79
79
|
*/
|
|
80
80
|
variant?: "outline";
|
|
81
81
|
} & React.RefAttributes<HTMLDivElement | HTMLElement>>;
|
|
82
|
+
export default Banner;
|
package/dist/Banner.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Role } from "@ariakit/react/role";
|
|
3
4
|
import { IconButton, Text } from "@stratakit/bricks";
|
|
4
5
|
import { GhostAligner } from "@stratakit/bricks/secret-internals";
|
|
5
6
|
import { Icon } from "@stratakit/foundations";
|
|
6
7
|
import { forwardRef } from "@stratakit/foundations/secret-internals";
|
|
7
8
|
import cx from "classnames";
|
|
8
|
-
import * as React from "react";
|
|
9
9
|
import { Dismiss, StatusIcon } from "./~utils.icons.js";
|
|
10
10
|
const Banner = forwardRef((props, forwardedRef) => {
|
|
11
11
|
const {
|
|
@@ -66,6 +66,7 @@ const Banner = forwardRef((props, forwardedRef) => {
|
|
|
66
66
|
}
|
|
67
67
|
);
|
|
68
68
|
});
|
|
69
|
+
var Banner_default = Banner;
|
|
69
70
|
export {
|
|
70
|
-
|
|
71
|
+
Banner_default as default
|
|
71
72
|
};
|
package/dist/Chip.d.ts
CHANGED
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import type { BaseProps } from "@stratakit/foundations/secret-internals";
|
|
3
|
-
interface
|
|
4
|
-
/**
|
|
5
|
-
* The label displayed inside the chip.
|
|
6
|
-
*/
|
|
7
|
-
label: React.ReactNode;
|
|
3
|
+
interface ChipRootProps extends BaseProps<"div"> {
|
|
8
4
|
/**
|
|
9
5
|
* The variant style of the Chip.
|
|
10
6
|
* Use "solid" for primary states and "outline" for less prominent states.
|
|
@@ -12,6 +8,44 @@ interface ChipProps extends Omit<BaseProps<"div">, "children"> {
|
|
|
12
8
|
* @default "solid"
|
|
13
9
|
*/
|
|
14
10
|
variant?: "solid" | "outline";
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Root component of the compositional Chip component.
|
|
14
|
+
*
|
|
15
|
+
* Example:
|
|
16
|
+
* ```tsx
|
|
17
|
+
* <Chip.Root>
|
|
18
|
+
* <Chip.Label>Label</Chip.Label>
|
|
19
|
+
* <Chip.DismissButton onClick={onClick} />
|
|
20
|
+
* </Chip.Root>
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
23
|
+
declare const ChipRoot: React.ForwardRefExoticComponent<ChipRootProps & React.RefAttributes<HTMLDivElement | HTMLElement>>;
|
|
24
|
+
interface ChipLabelProps extends BaseProps<"span"> {
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Label component that should be used with the compositional Chip component.
|
|
28
|
+
*/
|
|
29
|
+
declare const ChipLabel: React.ForwardRefExoticComponent<ChipLabelProps & React.RefAttributes<HTMLElement | HTMLSpanElement>>;
|
|
30
|
+
interface ChipDismissButtonProps extends Omit<BaseProps<"button">, "children"> {
|
|
31
|
+
/**
|
|
32
|
+
* Label for the dismiss button.
|
|
33
|
+
*
|
|
34
|
+
* The final accessible name of the dismiss button is a combination of this `label` and the text content of `Chip.Label`.
|
|
35
|
+
*
|
|
36
|
+
* @default "Dismiss"
|
|
37
|
+
*/
|
|
38
|
+
label?: string;
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* Dismiss button component that should be used with the compositional Chip component.
|
|
42
|
+
*/
|
|
43
|
+
declare const ChipDismissButton: React.ForwardRefExoticComponent<ChipDismissButtonProps & React.RefAttributes<HTMLElement | HTMLButtonElement>>;
|
|
44
|
+
interface ChipProps extends Omit<BaseProps<"div">, "children">, Pick<ChipRootProps, "variant"> {
|
|
45
|
+
/**
|
|
46
|
+
* The label displayed inside the chip.
|
|
47
|
+
*/
|
|
48
|
+
label: React.ReactNode;
|
|
15
49
|
/**
|
|
16
50
|
* Callback invoked when the dismiss ("❌") button is clicked.
|
|
17
51
|
*
|
|
@@ -31,5 +65,6 @@ interface ChipProps extends Omit<BaseProps<"div">, "children"> {
|
|
|
31
65
|
* <Chip label="Value" variant="outline" />
|
|
32
66
|
* ```
|
|
33
67
|
*/
|
|
34
|
-
|
|
35
|
-
export
|
|
68
|
+
declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLDivElement | HTMLElement>>;
|
|
69
|
+
export default Chip;
|
|
70
|
+
export { ChipRoot as Root, ChipLabel as Label, ChipDismissButton as DismissButton, };
|
package/dist/Chip.js
CHANGED
|
@@ -1,41 +1,97 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Role } from "@ariakit/react/role";
|
|
3
4
|
import { IconButton } from "@stratakit/bricks";
|
|
4
|
-
import {
|
|
5
|
+
import {
|
|
6
|
+
forwardRef,
|
|
7
|
+
useSafeContext
|
|
8
|
+
} from "@stratakit/foundations/secret-internals";
|
|
5
9
|
import cx from "classnames";
|
|
6
|
-
import
|
|
10
|
+
import { createStore, useStore } from "zustand";
|
|
11
|
+
import { combine } from "zustand/middleware";
|
|
7
12
|
import { Dismiss } from "./~utils.icons.js";
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
13
|
+
function createChipStore(initialState) {
|
|
14
|
+
return createStore(
|
|
15
|
+
combine(initialState, (set, _, store) => ({
|
|
16
|
+
setLabelId: (labelId) => {
|
|
17
|
+
set({ labelId: labelId || store.getInitialState().labelId });
|
|
18
|
+
}
|
|
19
|
+
}))
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
const ChipContext = React.createContext(void 0);
|
|
23
|
+
function ChipProvider(props) {
|
|
24
|
+
const defaultLabelId = React.useId();
|
|
25
|
+
const [store] = React.useState(
|
|
26
|
+
() => createChipStore({ labelId: defaultLabelId })
|
|
27
|
+
);
|
|
28
|
+
return /* @__PURE__ */ jsx(ChipContext.Provider, { value: store, children: props.children });
|
|
29
|
+
}
|
|
30
|
+
function useChipState(selectorFn) {
|
|
31
|
+
const store = useSafeContext(ChipContext);
|
|
32
|
+
return useStore(store, selectorFn);
|
|
33
|
+
}
|
|
34
|
+
const ChipRoot = forwardRef((props, forwardedRef) => {
|
|
35
|
+
const { variant = "solid", ...rest } = props;
|
|
36
|
+
return /* @__PURE__ */ jsx(ChipProvider, { children: /* @__PURE__ */ jsx(
|
|
14
37
|
Role.div,
|
|
15
38
|
{
|
|
16
39
|
"data-kiwi-variant": variant,
|
|
17
40
|
...rest,
|
|
18
41
|
className: cx("\u{1F95D}-chip", props.className),
|
|
19
|
-
ref: forwardedRef
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
42
|
+
ref: forwardedRef
|
|
43
|
+
}
|
|
44
|
+
) });
|
|
45
|
+
});
|
|
46
|
+
const ChipLabel = forwardRef((props, forwardedRef) => {
|
|
47
|
+
const labelId = useChipState((state) => state.labelId);
|
|
48
|
+
const setLabelId = useChipState((state) => state.setLabelId);
|
|
49
|
+
React.useEffect(() => {
|
|
50
|
+
setLabelId(props.id);
|
|
51
|
+
}, [setLabelId, props.id]);
|
|
52
|
+
return /* @__PURE__ */ jsx(
|
|
53
|
+
Role.span,
|
|
54
|
+
{
|
|
55
|
+
id: labelId,
|
|
56
|
+
...props,
|
|
57
|
+
className: cx("\u{1F95D}-chip-label", props.className),
|
|
58
|
+
ref: forwardedRef
|
|
36
59
|
}
|
|
37
60
|
);
|
|
38
61
|
});
|
|
62
|
+
const ChipDismissButton = forwardRef(
|
|
63
|
+
(props, forwardedRef) => {
|
|
64
|
+
const { label = "Dismiss", ...rest } = props;
|
|
65
|
+
const labelId = useChipState((state) => state.labelId);
|
|
66
|
+
const defaultId = React.useId();
|
|
67
|
+
const id = props.id ?? defaultId;
|
|
68
|
+
return /* @__PURE__ */ jsx(
|
|
69
|
+
IconButton,
|
|
70
|
+
{
|
|
71
|
+
id,
|
|
72
|
+
"aria-labelledby": `${id} ${labelId}`,
|
|
73
|
+
...rest,
|
|
74
|
+
label,
|
|
75
|
+
className: cx("\u{1F95D}-chip-dismiss-button", props.className),
|
|
76
|
+
variant: "ghost",
|
|
77
|
+
labelVariant: "visually-hidden",
|
|
78
|
+
icon: /* @__PURE__ */ jsx(Dismiss, {}),
|
|
79
|
+
ref: forwardedRef
|
|
80
|
+
}
|
|
81
|
+
);
|
|
82
|
+
}
|
|
83
|
+
);
|
|
84
|
+
const Chip = forwardRef((props, forwardedRef) => {
|
|
85
|
+
const { onDismiss, label, ...rest } = props;
|
|
86
|
+
return /* @__PURE__ */ jsxs(ChipRoot, { ...rest, ref: forwardedRef, children: [
|
|
87
|
+
/* @__PURE__ */ jsx(ChipLabel, { children: label }),
|
|
88
|
+
onDismiss && /* @__PURE__ */ jsx(ChipDismissButton, { onClick: onDismiss })
|
|
89
|
+
] });
|
|
90
|
+
});
|
|
91
|
+
var Chip_default = Chip;
|
|
39
92
|
export {
|
|
40
|
-
|
|
93
|
+
ChipDismissButton as DismissButton,
|
|
94
|
+
ChipLabel as Label,
|
|
95
|
+
ChipRoot as Root,
|
|
96
|
+
Chip_default as default
|
|
41
97
|
};
|
package/dist/DEV/Banner.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Role } from "@ariakit/react/role";
|
|
3
4
|
import { IconButton, Text } from "@stratakit/bricks";
|
|
4
5
|
import { GhostAligner } from "@stratakit/bricks/secret-internals";
|
|
5
6
|
import { Icon } from "@stratakit/foundations";
|
|
6
7
|
import { forwardRef } from "@stratakit/foundations/secret-internals";
|
|
7
8
|
import cx from "classnames";
|
|
8
|
-
import * as React from "react";
|
|
9
9
|
import { Dismiss, StatusIcon } from "./~utils.icons.js";
|
|
10
10
|
const Banner = forwardRef((props, forwardedRef) => {
|
|
11
11
|
const {
|
|
@@ -67,6 +67,7 @@ const Banner = forwardRef((props, forwardedRef) => {
|
|
|
67
67
|
);
|
|
68
68
|
});
|
|
69
69
|
DEV: Banner.displayName = "Banner";
|
|
70
|
+
var Banner_default = Banner;
|
|
70
71
|
export {
|
|
71
|
-
|
|
72
|
+
Banner_default as default
|
|
72
73
|
};
|
package/dist/DEV/Chip.js
CHANGED
|
@@ -1,42 +1,101 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Role } from "@ariakit/react/role";
|
|
3
4
|
import { IconButton } from "@stratakit/bricks";
|
|
4
|
-
import {
|
|
5
|
+
import {
|
|
6
|
+
forwardRef,
|
|
7
|
+
useSafeContext
|
|
8
|
+
} from "@stratakit/foundations/secret-internals";
|
|
5
9
|
import cx from "classnames";
|
|
6
|
-
import
|
|
10
|
+
import { createStore, useStore } from "zustand";
|
|
11
|
+
import { combine } from "zustand/middleware";
|
|
7
12
|
import { Dismiss } from "./~utils.icons.js";
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
13
|
+
function createChipStore(initialState) {
|
|
14
|
+
return createStore(
|
|
15
|
+
combine(initialState, (set, _, store) => ({
|
|
16
|
+
setLabelId: (labelId) => {
|
|
17
|
+
set({ labelId: labelId || store.getInitialState().labelId });
|
|
18
|
+
}
|
|
19
|
+
}))
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
const ChipContext = React.createContext(void 0);
|
|
23
|
+
function ChipProvider(props) {
|
|
24
|
+
const defaultLabelId = React.useId();
|
|
25
|
+
const [store] = React.useState(
|
|
26
|
+
() => createChipStore({ labelId: defaultLabelId })
|
|
27
|
+
);
|
|
28
|
+
return /* @__PURE__ */ jsx(ChipContext.Provider, { value: store, children: props.children });
|
|
29
|
+
}
|
|
30
|
+
function useChipState(selectorFn) {
|
|
31
|
+
const store = useSafeContext(ChipContext);
|
|
32
|
+
return useStore(store, selectorFn);
|
|
33
|
+
}
|
|
34
|
+
const ChipRoot = forwardRef((props, forwardedRef) => {
|
|
35
|
+
const { variant = "solid", ...rest } = props;
|
|
36
|
+
return /* @__PURE__ */ jsx(ChipProvider, { children: /* @__PURE__ */ jsx(
|
|
14
37
|
Role.div,
|
|
15
38
|
{
|
|
16
39
|
"data-kiwi-variant": variant,
|
|
17
40
|
...rest,
|
|
18
41
|
className: cx("\u{1F95D}-chip", props.className),
|
|
19
|
-
ref: forwardedRef
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
42
|
+
ref: forwardedRef
|
|
43
|
+
}
|
|
44
|
+
) });
|
|
45
|
+
});
|
|
46
|
+
DEV: ChipRoot.displayName = "Chip.Root";
|
|
47
|
+
const ChipLabel = forwardRef((props, forwardedRef) => {
|
|
48
|
+
const labelId = useChipState((state) => state.labelId);
|
|
49
|
+
const setLabelId = useChipState((state) => state.setLabelId);
|
|
50
|
+
React.useEffect(() => {
|
|
51
|
+
setLabelId(props.id);
|
|
52
|
+
}, [setLabelId, props.id]);
|
|
53
|
+
return /* @__PURE__ */ jsx(
|
|
54
|
+
Role.span,
|
|
55
|
+
{
|
|
56
|
+
id: labelId,
|
|
57
|
+
...props,
|
|
58
|
+
className: cx("\u{1F95D}-chip-label", props.className),
|
|
59
|
+
ref: forwardedRef
|
|
36
60
|
}
|
|
37
61
|
);
|
|
38
62
|
});
|
|
63
|
+
DEV: ChipLabel.displayName = "Chip.Label";
|
|
64
|
+
const ChipDismissButton = forwardRef(
|
|
65
|
+
(props, forwardedRef) => {
|
|
66
|
+
const { label = "Dismiss", ...rest } = props;
|
|
67
|
+
const labelId = useChipState((state) => state.labelId);
|
|
68
|
+
const defaultId = React.useId();
|
|
69
|
+
const id = props.id ?? defaultId;
|
|
70
|
+
return /* @__PURE__ */ jsx(
|
|
71
|
+
IconButton,
|
|
72
|
+
{
|
|
73
|
+
id,
|
|
74
|
+
"aria-labelledby": `${id} ${labelId}`,
|
|
75
|
+
...rest,
|
|
76
|
+
label,
|
|
77
|
+
className: cx("\u{1F95D}-chip-dismiss-button", props.className),
|
|
78
|
+
variant: "ghost",
|
|
79
|
+
labelVariant: "visually-hidden",
|
|
80
|
+
icon: /* @__PURE__ */ jsx(Dismiss, {}),
|
|
81
|
+
ref: forwardedRef
|
|
82
|
+
}
|
|
83
|
+
);
|
|
84
|
+
}
|
|
85
|
+
);
|
|
86
|
+
DEV: ChipDismissButton.displayName = "Chip.DismissButton";
|
|
87
|
+
const Chip = forwardRef((props, forwardedRef) => {
|
|
88
|
+
const { onDismiss, label, ...rest } = props;
|
|
89
|
+
return /* @__PURE__ */ jsxs(ChipRoot, { ...rest, ref: forwardedRef, children: [
|
|
90
|
+
/* @__PURE__ */ jsx(ChipLabel, { children: label }),
|
|
91
|
+
onDismiss && /* @__PURE__ */ jsx(ChipDismissButton, { onClick: onDismiss })
|
|
92
|
+
] });
|
|
93
|
+
});
|
|
39
94
|
DEV: Chip.displayName = "Chip";
|
|
95
|
+
var Chip_default = Chip;
|
|
40
96
|
export {
|
|
41
|
-
|
|
97
|
+
ChipDismissButton as DismissButton,
|
|
98
|
+
ChipLabel as Label,
|
|
99
|
+
ChipRoot as Root,
|
|
100
|
+
Chip_default as default
|
|
42
101
|
};
|
package/dist/DEV/DropdownMenu.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Button as ButtonAk } from "@ariakit/react/button";
|
|
3
4
|
import {
|
|
4
5
|
Menu,
|
|
@@ -22,9 +23,8 @@ import {
|
|
|
22
23
|
usePopoverApi
|
|
23
24
|
} from "@stratakit/foundations/secret-internals";
|
|
24
25
|
import cx from "classnames";
|
|
25
|
-
import * as React from "react";
|
|
26
|
-
import * as ListItem from "./~utils.ListItem.js";
|
|
27
26
|
import { Checkmark } from "./~utils.icons.js";
|
|
27
|
+
import * as ListItem from "./~utils.ListItem.js";
|
|
28
28
|
function DropdownMenuRoot(props) {
|
|
29
29
|
const {
|
|
30
30
|
children,
|
package/dist/DEV/ErrorRegion.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import {
|
|
3
4
|
Collection,
|
|
4
5
|
CollectionItem,
|
|
@@ -18,7 +19,6 @@ import {
|
|
|
18
19
|
useControlledState
|
|
19
20
|
} from "@stratakit/foundations/secret-internals";
|
|
20
21
|
import cx from "classnames";
|
|
21
|
-
import * as React from "react";
|
|
22
22
|
import { ChevronDown, StatusIcon } from "./~utils.icons.js";
|
|
23
23
|
const ErrorRegionRoot = forwardRef(
|
|
24
24
|
(props, forwardedRef) => {
|
|
@@ -46,16 +46,16 @@ const ErrorRegionRoot = forwardRef(
|
|
|
46
46
|
el.animate(
|
|
47
47
|
[
|
|
48
48
|
{
|
|
49
|
-
boxShadow: "0 0 0 0 var(--
|
|
49
|
+
boxShadow: "0 0 0 0 var(--stratakit-color-border-attention-base)",
|
|
50
50
|
opacity: 1
|
|
51
51
|
},
|
|
52
52
|
{
|
|
53
|
-
boxShadow: "0 0 15px 2px var(--
|
|
53
|
+
boxShadow: "0 0 15px 2px var(--stratakit-color-border-attention-base)",
|
|
54
54
|
opacity: 0.7,
|
|
55
55
|
offset: 0.5
|
|
56
56
|
},
|
|
57
57
|
{
|
|
58
|
-
boxShadow: "0 0 0 0 var(--
|
|
58
|
+
boxShadow: "0 0 0 0 var(--stratakit-color-border-attention-base)",
|
|
59
59
|
opacity: 1
|
|
60
60
|
}
|
|
61
61
|
],
|
package/dist/DEV/Table.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Role } from "@ariakit/react/role";
|
|
3
|
-
import { forwardRef } from "@stratakit/foundations/secret-internals";
|
|
4
4
|
import {
|
|
5
|
+
forwardRef,
|
|
5
6
|
useMergedRefs,
|
|
6
7
|
useSafeContext
|
|
7
8
|
} from "@stratakit/foundations/secret-internals";
|
|
8
9
|
import cx from "classnames";
|
|
9
|
-
import * as React from "react";
|
|
10
10
|
const TableContext = React.createContext(void 0);
|
|
11
11
|
const TableHeaderContext = React.createContext(false);
|
|
12
12
|
const HtmlTable = forwardRef((props, forwardedRef) => {
|
package/dist/DEV/Toolbar.js
CHANGED
|
@@ -1,18 +1,24 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import * as Toolbar from "@ariakit/react/toolbar";
|
|
3
4
|
import { IconButtonContext } from "@stratakit/bricks/secret-internals";
|
|
4
5
|
import { forwardRef } from "@stratakit/foundations/secret-internals";
|
|
5
6
|
import cx from "classnames";
|
|
6
|
-
import * as React from "react";
|
|
7
7
|
const ToolbarGroup = forwardRef((props, forwardedRef) => {
|
|
8
|
-
return /* @__PURE__ */ jsx(
|
|
9
|
-
|
|
8
|
+
return /* @__PURE__ */ jsx(
|
|
9
|
+
IconButtonContext.Provider,
|
|
10
10
|
{
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
value: React.useMemo(() => ({ iconSize: "large" }), []),
|
|
12
|
+
children: /* @__PURE__ */ jsx(
|
|
13
|
+
Toolbar.Toolbar,
|
|
14
|
+
{
|
|
15
|
+
...props,
|
|
16
|
+
className: cx("\u{1F95D}-toolbar", props.className),
|
|
17
|
+
ref: forwardedRef
|
|
18
|
+
}
|
|
19
|
+
)
|
|
14
20
|
}
|
|
15
|
-
)
|
|
21
|
+
);
|
|
16
22
|
});
|
|
17
23
|
DEV: ToolbarGroup.displayName = "Toolbar.Group";
|
|
18
24
|
const ToolbarItem = forwardRef(
|
package/dist/DEV/TreeItem.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { CompositeItem } from "@ariakit/react/composite";
|
|
3
4
|
import { PopoverProvider } from "@ariakit/react/popover";
|
|
4
5
|
import { Role } from "@ariakit/react/role";
|
|
@@ -14,10 +15,9 @@ import {
|
|
|
14
15
|
useEventHandlers
|
|
15
16
|
} from "@stratakit/foundations/secret-internals";
|
|
16
17
|
import cx from "classnames";
|
|
17
|
-
import * as React from "react";
|
|
18
|
-
import * as DropdownMenu from "./DropdownMenu.js";
|
|
19
|
-
import * as ListItem from "./~utils.ListItem.js";
|
|
20
18
|
import { ChevronDown, MoreHorizontal, StatusIcon } from "./~utils.icons.js";
|
|
19
|
+
import * as ListItem from "./~utils.ListItem.js";
|
|
20
|
+
import * as DropdownMenu from "./DropdownMenu.js";
|
|
21
21
|
const TreeItemErrorContext = React.createContext(void 0);
|
|
22
22
|
const TreeItemActionsContext = React.createContext(void 0);
|
|
23
23
|
const TreeItemDecorationsContext = React.createContext(void 0);
|
package/dist/DEV/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import * as unstable_AccordionItem from "./AccordionItem.js";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
3
|
+
import { default as default2 } from "./Banner.js";
|
|
4
|
+
import { default as default3 } from "./Chip.js";
|
|
5
5
|
import * as DropdownMenu from "./DropdownMenu.js";
|
|
6
6
|
import * as unstable_ErrorRegion from "./ErrorRegion.js";
|
|
7
7
|
import * as Table from "./Table.js";
|
|
@@ -9,13 +9,13 @@ import * as Tabs from "./Tabs.js";
|
|
|
9
9
|
import * as unstable_Toolbar from "./Toolbar.js";
|
|
10
10
|
import * as Tree from "./Tree.js";
|
|
11
11
|
export {
|
|
12
|
-
Chip,
|
|
12
|
+
default3 as Chip,
|
|
13
13
|
DropdownMenu,
|
|
14
14
|
Table,
|
|
15
15
|
Tabs,
|
|
16
16
|
Tree,
|
|
17
17
|
unstable_AccordionItem,
|
|
18
|
-
|
|
18
|
+
default2 as unstable_Banner,
|
|
19
19
|
unstable_ErrorRegion,
|
|
20
20
|
unstable_Toolbar
|
|
21
21
|
};
|
package/dist/DEV/styles.css.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// inline-css:/home/runner/work/design-system/design-system/packages/structures/src/styles.css
|
|
2
|
-
var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--active,var(--ids-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--ids-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--ids-color-border-neutral-muted);grid-template-rows:[header-start]auto[header-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer states{.🥝-accordion-item:where([data-kiwi-open=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-header{padding:var(--🥝accordion-item-padding);grid-area:header/decoration-before-start/header/decoration-after-end;grid-template-columns:inherit;align-items:center;display:grid;position:relative}@supports (grid-template-columns:subgrid){.🥝-accordion-item-header{grid-template-columns:subgrid}}}@layer base{.🥝-accordion-item-marker{pointer-events:none;grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-header:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;font-weight:500;display:inline-block}}@layer base{.🥝-accordion-item-button{cursor:pointer;--🥝focus-outline-offset:-4px;border-radius:12px;grid-column:content}.🥝-accordion-item-button:after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer states{.🥝-accordion-item-button:focus-visible{outline:0}.🥝-accordion-item-button:focus-visible:after{outline:var(--🥝focus-outline);outline-offset:var(--🥝focus-outline-offset)}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--ids-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-accordion-item-heading{text-box:cap alphabetic;grid-column:content;margin-block:0}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--ids-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--ids-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--ids-color-border-info-base);--🥝icon-color:var(--ids-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--ids-color-border-positive-base);--🥝icon-color:var(--ids-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--ids-color-border-attention-base);--🥝icon-color:var(--ids-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--ids-color-border-critical-base);--🥝icon-color:var(--ids-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--ids-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--ids-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--ids-color-bg-page-base)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--ids-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--ids-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--ids-color-border-attention-base);background-color:var(--ids-color-bg-elevation-base);box-shadow:var(--ids-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--ids-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--ids-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--ids-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--ids-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--ids-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--ids-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--ids-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--ids-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--ids-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-neutral-primary))var(--🌀tab-state--selected,var(--ids-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-accent-strong))var(--🌀tab-state--selected,var(--ids-color-text-accent-strong))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--ids-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--ids-color-bg-page-base);box-shadow:var(--ids-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--ids-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--ids-color-icon-attention-base);--🥝tree-item-color:var(--ids-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--ids-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
|
|
2
|
+
var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--stratakit-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--stratakit-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--stratakit-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--stratakit-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--stratakit-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--stratakit-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--stratakit-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--stratakit-color-text-neutral-primary))var(--🌀list-item-state--active,var(--stratakit-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--stratakit-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--stratakit-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--stratakit-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--stratakit-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--stratakit-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--stratakit-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--stratakit-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--stratakit-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--stratakit-color-border-neutral-muted);grid-template-rows:[header-start]auto[header-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer states{.🥝-accordion-item:where([data-kiwi-open=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-header{padding:var(--🥝accordion-item-padding);grid-area:header/decoration-before-start/header/decoration-after-end;grid-template-columns:inherit;align-items:center;display:grid;position:relative}@supports (grid-template-columns:subgrid){.🥝-accordion-item-header{grid-template-columns:subgrid}}}@layer base{.🥝-accordion-item-marker{pointer-events:none;grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-header:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;font-weight:500;display:inline-block}}@layer base{.🥝-accordion-item-button{cursor:pointer;--🥝focus-outline-offset:-4px;border-radius:12px;grid-column:content}.🥝-accordion-item-button:after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer states{.🥝-accordion-item-button:focus-visible{outline:0}.🥝-accordion-item-button:focus-visible:after{outline:var(--🥝focus-outline);outline-offset:var(--🥝focus-outline-offset)}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--stratakit-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-accordion-item-heading{text-box:cap alphabetic;grid-column:content;margin-block:0}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--stratakit-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--stratakit-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--stratakit-color-border-info-base);--🥝icon-color:var(--stratakit-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--stratakit-color-border-positive-base);--🥝icon-color:var(--stratakit-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--stratakit-color-border-attention-base);--🥝icon-color:var(--stratakit-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--stratakit-color-border-critical-base);--🥝icon-color:var(--stratakit-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--stratakit-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--stratakit-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--stratakit-color-bg-page-base)}}@layer base{.🥝-chip-label:where(button){border-radius:inherit}.🥝-chip-label:where(button):after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--stratakit-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--stratakit-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--stratakit-color-border-attention-base);background-color:var(--stratakit-color-bg-elevation-base);box-shadow:var(--stratakit-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--stratakit-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--stratakit-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--stratakit-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--stratakit-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--stratakit-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--stratakit-color-bg-page-base)100.0%,var(--stratakit-color-glow-hue)var(--stratakit-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--stratakit-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--stratakit-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--stratakit-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--stratakit-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;align-items:center;gap:4px;transition:background-color .15s ease-out,color .15s ease-out;display:inline-flex;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--stratakit-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--stratakit-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--stratakit-color-text-neutral-primary))var(--🌀tab-state--selected,var(--stratakit-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--stratakit-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--stratakit-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--stratakit-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--stratakit-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--stratakit-color-text-accent-strong))var(--🌀tab-state--selected,var(--stratakit-color-text-accent-strong))var(--🌀tab-state--disabled,var(--stratakit-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--stratakit-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--stratakit-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--stratakit-color-bg-page-base);box-shadow:var(--stratakit-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--stratakit-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--stratakit-color-icon-attention-base);--🥝tree-item-color:var(--stratakit-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--stratakit-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--stratakit-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
|
|
3
3
|
|
|
4
4
|
// src/styles.css.ts
|
|
5
5
|
var styles_css_default = styles_default;
|
package/dist/DropdownMenu.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Button as ButtonAk } from "@ariakit/react/button";
|
|
3
4
|
import {
|
|
4
5
|
Menu,
|
|
@@ -22,9 +23,8 @@ import {
|
|
|
22
23
|
usePopoverApi
|
|
23
24
|
} from "@stratakit/foundations/secret-internals";
|
|
24
25
|
import cx from "classnames";
|
|
25
|
-
import * as React from "react";
|
|
26
|
-
import * as ListItem from "./~utils.ListItem.js";
|
|
27
26
|
import { Checkmark } from "./~utils.icons.js";
|
|
27
|
+
import * as ListItem from "./~utils.ListItem.js";
|
|
28
28
|
function DropdownMenuRoot(props) {
|
|
29
29
|
const {
|
|
30
30
|
children,
|
package/dist/ErrorRegion.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import {
|
|
3
4
|
Collection,
|
|
4
5
|
CollectionItem,
|
|
@@ -18,7 +19,6 @@ import {
|
|
|
18
19
|
useControlledState
|
|
19
20
|
} from "@stratakit/foundations/secret-internals";
|
|
20
21
|
import cx from "classnames";
|
|
21
|
-
import * as React from "react";
|
|
22
22
|
import { ChevronDown, StatusIcon } from "./~utils.icons.js";
|
|
23
23
|
const ErrorRegionRoot = forwardRef(
|
|
24
24
|
(props, forwardedRef) => {
|
|
@@ -46,16 +46,16 @@ const ErrorRegionRoot = forwardRef(
|
|
|
46
46
|
el.animate(
|
|
47
47
|
[
|
|
48
48
|
{
|
|
49
|
-
boxShadow: "0 0 0 0 var(--
|
|
49
|
+
boxShadow: "0 0 0 0 var(--stratakit-color-border-attention-base)",
|
|
50
50
|
opacity: 1
|
|
51
51
|
},
|
|
52
52
|
{
|
|
53
|
-
boxShadow: "0 0 15px 2px var(--
|
|
53
|
+
boxShadow: "0 0 15px 2px var(--stratakit-color-border-attention-base)",
|
|
54
54
|
opacity: 0.7,
|
|
55
55
|
offset: 0.5
|
|
56
56
|
},
|
|
57
57
|
{
|
|
58
|
-
boxShadow: "0 0 0 0 var(--
|
|
58
|
+
boxShadow: "0 0 0 0 var(--stratakit-color-border-attention-base)",
|
|
59
59
|
opacity: 1
|
|
60
60
|
}
|
|
61
61
|
],
|
package/dist/Table.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { Role } from "@ariakit/react/role";
|
|
3
|
-
import { forwardRef } from "@stratakit/foundations/secret-internals";
|
|
4
4
|
import {
|
|
5
|
+
forwardRef,
|
|
5
6
|
useMergedRefs,
|
|
6
7
|
useSafeContext
|
|
7
8
|
} from "@stratakit/foundations/secret-internals";
|
|
8
9
|
import cx from "classnames";
|
|
9
|
-
import * as React from "react";
|
|
10
10
|
const TableContext = React.createContext(void 0);
|
|
11
11
|
const TableHeaderContext = React.createContext(false);
|
|
12
12
|
const HtmlTable = forwardRef((props, forwardedRef) => {
|
package/dist/Tabs.d.ts
CHANGED
|
@@ -64,6 +64,16 @@ interface TabProps extends FocusableProps<"button">, Pick<AkTab.TabProps, "id">
|
|
|
64
64
|
* ```tsx
|
|
65
65
|
* <Tabs.Tab id="tab-1">Tab 1</Tabs.Tab>
|
|
66
66
|
* ```
|
|
67
|
+
*
|
|
68
|
+
* Start and end icons can be added by passing `Icon` as children.
|
|
69
|
+
*
|
|
70
|
+
* ```tsx
|
|
71
|
+
* <Tabs.Tab id="tab-1">
|
|
72
|
+
* <Icon href={…} />
|
|
73
|
+
* Tab 1
|
|
74
|
+
* <Icon href={…} />
|
|
75
|
+
* </Tabs.Tab>
|
|
76
|
+
* ```
|
|
67
77
|
*/
|
|
68
78
|
declare const Tab: import("react").ForwardRefExoticComponent<TabProps & import("react").RefAttributes<HTMLElement | HTMLButtonElement>>;
|
|
69
79
|
interface TabPanelProps extends FocusableProps<"div">, Pick<AkTab.TabPanelProps, "tabId" | "unmountOnHide" | "focusable"> {
|
package/dist/Toolbar.js
CHANGED
|
@@ -1,18 +1,24 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import * as Toolbar from "@ariakit/react/toolbar";
|
|
3
4
|
import { IconButtonContext } from "@stratakit/bricks/secret-internals";
|
|
4
5
|
import { forwardRef } from "@stratakit/foundations/secret-internals";
|
|
5
6
|
import cx from "classnames";
|
|
6
|
-
import * as React from "react";
|
|
7
7
|
const ToolbarGroup = forwardRef((props, forwardedRef) => {
|
|
8
|
-
return /* @__PURE__ */ jsx(
|
|
9
|
-
|
|
8
|
+
return /* @__PURE__ */ jsx(
|
|
9
|
+
IconButtonContext.Provider,
|
|
10
10
|
{
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
value: React.useMemo(() => ({ iconSize: "large" }), []),
|
|
12
|
+
children: /* @__PURE__ */ jsx(
|
|
13
|
+
Toolbar.Toolbar,
|
|
14
|
+
{
|
|
15
|
+
...props,
|
|
16
|
+
className: cx("\u{1F95D}-toolbar", props.className),
|
|
17
|
+
ref: forwardedRef
|
|
18
|
+
}
|
|
19
|
+
)
|
|
14
20
|
}
|
|
15
|
-
)
|
|
21
|
+
);
|
|
16
22
|
});
|
|
17
23
|
const ToolbarItem = forwardRef(
|
|
18
24
|
(props, forwardedRef) => {
|
package/dist/TreeItem.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
import { CompositeItem } from "@ariakit/react/composite";
|
|
3
4
|
import { PopoverProvider } from "@ariakit/react/popover";
|
|
4
5
|
import { Role } from "@ariakit/react/role";
|
|
@@ -14,10 +15,9 @@ import {
|
|
|
14
15
|
useEventHandlers
|
|
15
16
|
} from "@stratakit/foundations/secret-internals";
|
|
16
17
|
import cx from "classnames";
|
|
17
|
-
import * as React from "react";
|
|
18
|
-
import * as DropdownMenu from "./DropdownMenu.js";
|
|
19
|
-
import * as ListItem from "./~utils.ListItem.js";
|
|
20
18
|
import { ChevronDown, MoreHorizontal, StatusIcon } from "./~utils.icons.js";
|
|
19
|
+
import * as ListItem from "./~utils.ListItem.js";
|
|
20
|
+
import * as DropdownMenu from "./DropdownMenu.js";
|
|
21
21
|
const TreeItemErrorContext = React.createContext(void 0);
|
|
22
22
|
const TreeItemActionsContext = React.createContext(void 0);
|
|
23
23
|
const TreeItemDecorationsContext = React.createContext(void 0);
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export * as unstable_AccordionItem from "./AccordionItem.js";
|
|
2
|
-
export {
|
|
3
|
-
export { Chip } from "./Chip.js";
|
|
2
|
+
export { default as unstable_Banner } from "./Banner.js";
|
|
3
|
+
export { default as Chip } from "./Chip.js";
|
|
4
4
|
export * as DropdownMenu from "./DropdownMenu.js";
|
|
5
5
|
export * as unstable_ErrorRegion from "./ErrorRegion.js";
|
|
6
6
|
export * as Table from "./Table.js";
|
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import * as unstable_AccordionItem from "./AccordionItem.js";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
3
|
+
import { default as default2 } from "./Banner.js";
|
|
4
|
+
import { default as default3 } from "./Chip.js";
|
|
5
5
|
import * as DropdownMenu from "./DropdownMenu.js";
|
|
6
6
|
import * as unstable_ErrorRegion from "./ErrorRegion.js";
|
|
7
7
|
import * as Table from "./Table.js";
|
|
@@ -9,13 +9,13 @@ import * as Tabs from "./Tabs.js";
|
|
|
9
9
|
import * as unstable_Toolbar from "./Toolbar.js";
|
|
10
10
|
import * as Tree from "./Tree.js";
|
|
11
11
|
export {
|
|
12
|
-
Chip,
|
|
12
|
+
default3 as Chip,
|
|
13
13
|
DropdownMenu,
|
|
14
14
|
Table,
|
|
15
15
|
Tabs,
|
|
16
16
|
Tree,
|
|
17
17
|
unstable_AccordionItem,
|
|
18
|
-
|
|
18
|
+
default2 as unstable_Banner,
|
|
19
19
|
unstable_ErrorRegion,
|
|
20
20
|
unstable_Toolbar
|
|
21
21
|
};
|
package/dist/styles.css.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// inline-css:/home/runner/work/design-system/design-system/packages/structures/src/styles.css
|
|
2
|
-
var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--active,var(--ids-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--ids-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--ids-color-border-neutral-muted);grid-template-rows:[header-start]auto[header-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer states{.🥝-accordion-item:where([data-kiwi-open=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-header{padding:var(--🥝accordion-item-padding);grid-area:header/decoration-before-start/header/decoration-after-end;grid-template-columns:inherit;align-items:center;display:grid;position:relative}@supports (grid-template-columns:subgrid){.🥝-accordion-item-header{grid-template-columns:subgrid}}}@layer base{.🥝-accordion-item-marker{pointer-events:none;grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-header:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;font-weight:500;display:inline-block}}@layer base{.🥝-accordion-item-button{cursor:pointer;--🥝focus-outline-offset:-4px;border-radius:12px;grid-column:content}.🥝-accordion-item-button:after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer states{.🥝-accordion-item-button:focus-visible{outline:0}.🥝-accordion-item-button:focus-visible:after{outline:var(--🥝focus-outline);outline-offset:var(--🥝focus-outline-offset)}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--ids-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-accordion-item-heading{text-box:cap alphabetic;grid-column:content;margin-block:0}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--ids-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--ids-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--ids-color-border-info-base);--🥝icon-color:var(--ids-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--ids-color-border-positive-base);--🥝icon-color:var(--ids-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--ids-color-border-attention-base);--🥝icon-color:var(--ids-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--ids-color-border-critical-base);--🥝icon-color:var(--ids-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--ids-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--ids-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--ids-color-bg-page-base)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--ids-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--ids-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--ids-color-border-attention-base);background-color:var(--ids-color-bg-elevation-base);box-shadow:var(--ids-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--ids-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--ids-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--ids-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--ids-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--ids-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--ids-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--ids-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--ids-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--ids-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-neutral-primary))var(--🌀tab-state--selected,var(--ids-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-accent-strong))var(--🌀tab-state--selected,var(--ids-color-text-accent-strong))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--ids-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--ids-color-bg-page-base);box-shadow:var(--ids-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--ids-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--ids-color-icon-attention-base);--🥝tree-item-color:var(--ids-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--ids-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--ids-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
|
|
2
|
+
var styles_default = String.raw`@layer itwinui.components{@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--stratakit-font-size-12);min-block-size:var(--🥝list-item-height,1.75rem);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--stratakit-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--stratakit-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--stratakit-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--stratakit-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);color:var(--🥝list-item-color,var(--🌀list-item-state--default,var(--stratakit-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--stratakit-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--stratakit-color-text-neutral-primary))var(--🌀list-item-state--active,var(--stratakit-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--stratakit-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--stratakit-color-text-neutral-disabled)));--🥝icon-color:var(--🌀list-item-state--default,var(--stratakit-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--stratakit-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--stratakit-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--stratakit-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--stratakit-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--stratakit-color-icon-neutral-disabled));grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-content:center;align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where(:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer modifiers{.🥝-list-item:where(:has(>:nth-child(2 of .🥝-list-item-content))){--🥝list-item-height:2.75rem;grid-template-rows:repeat(auto-fit,minmax(0,auto))}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-area:1/decoration-before/-1;align-self:start;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@media (forced-colors:active){.🥝-list-item:where(:disabled,[aria-disabled=true]){color:graytext}}.🥝-accordion-item{--🥝accordion-item-gap:12px;--🥝accordion-item-padding:12px}@layer base{.🥝-accordion-item{contain:paint;border-block-end:1px solid var(--stratakit-color-border-neutral-muted);grid-template-rows:[header-start]auto[header-end content-start]auto[content-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];display:grid}}@layer states{.🥝-accordion-item:where([data-kiwi-open=true]){--🥝chevron-down-rotate:-.5turn}}@layer base{.🥝-accordion-item-header{padding:var(--🥝accordion-item-padding);grid-area:header/decoration-before-start/header/decoration-after-end;grid-template-columns:inherit;align-items:center;display:grid;position:relative}@supports (grid-template-columns:subgrid){.🥝-accordion-item-header{grid-template-columns:subgrid}}}@layer base{.🥝-accordion-item-marker{pointer-events:none;grid-area:1/decoration-after;margin-inline-start:var(--🥝accordion-item-gap);margin-inline-end:calc(-1*var(--🥝ghost-inline-offset))}}@layer states{@media (any-hover:hover){:where(.🥝-accordion-item-header:hover) .🥝-accordion-item-marker{--🌀button-state:var(--🌀button-state--hover)}}}@layer base{.🥝-accordion-item-label.🥝-text{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;text-box:cap alphabetic;font-weight:500;display:inline-block}}@layer base{.🥝-accordion-item-button{cursor:pointer;--🥝focus-outline-offset:-4px;border-radius:12px;grid-column:content}.🥝-accordion-item-button:after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer states{.🥝-accordion-item-button:focus-visible{outline:0}.🥝-accordion-item-button:focus-visible:after{outline:var(--🥝focus-outline);outline-offset:var(--🥝focus-outline-offset)}}@layer base{.🥝-accordion-item-content{text-box:cap alphabetic;color:var(--stratakit-color-text-neutral-secondary);grid-area:content;padding-block-end:var(--🥝accordion-item-padding)}}@layer base{.🥝-accordion-item-decoration{grid-column:decoration-before;margin-inline-end:var(--🥝accordion-item-gap)}}@layer base{.🥝-accordion-item-heading{text-box:cap alphabetic;grid-column:content;margin-block:0}}@layer base{.🥝-banner{background-color:var(--🥝banner-color-background);border:1px solid var(--🥝banner-color-border);border-radius:8px;grid-template-columns:[start]auto[content]minmax(0,1fr)[end]auto;align-items:center;inline-size:100%;padding:12px;display:grid}}@layer modifiers{.🥝-banner:where([data-kiwi-variant=outline]){--🥝banner-color-background:var(--stratakit-color-bg-elevation-base)}.🥝-banner:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝banner-color-border:var(--stratakit-color-border-neutral-base)}.🥝-banner:where([data-kiwi-tone=info]){--🥝banner-color-border:var(--stratakit-color-border-info-base);--🥝icon-color:var(--stratakit-color-icon-info-base)}.🥝-banner:where([data-kiwi-tone=positive]){--🥝banner-color-border:var(--stratakit-color-border-positive-base);--🥝icon-color:var(--stratakit-color-icon-positive-base)}.🥝-banner:where([data-kiwi-tone=attention]){--🥝banner-color-border:var(--stratakit-color-border-attention-base);--🥝icon-color:var(--stratakit-color-icon-attention-base)}.🥝-banner:where([data-kiwi-tone=critical]){--🥝banner-color-border:var(--stratakit-color-border-critical-base);--🥝icon-color:var(--stratakit-color-icon-critical-base)}}@layer base{.🥝-banner-icon{grid-area:1/start;align-self:start;margin-inline-end:8px}}@layer base{.🥝-banner-label{grid-column:content;align-self:start;margin-block-end:4px;font-weight:500}}@layer base{.🥝-banner-message{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;grid-column:content;overflow:hidden}}@layer base{.🥝-banner-actions{flex-wrap:wrap;grid-column:content;justify-self:start;align-items:baseline;gap:8px;margin-block-start:12px;display:flex}}@layer base{.🥝-banner-dismiss-button{grid-area:1/end;align-self:start;margin-inline-start:12px}}@media (forced-colors:active){.🥝-banner{--🥝icon-color:CanvasText}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--stratakit-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--stratakit-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--stratakit-color-bg-page-base)}}@layer base{.🥝-chip-label:where(button){border-radius:inherit}.🥝-chip-label:where(button):after{content:"";border-radius:inherit;position:absolute;inset:0}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer base{.🥝-dropdown-menu{background-color:var(--stratakit-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--stratakit-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:4px;display:flex}@media (forced-colors:active){.🥝-dropdown-menu{border:1px solid canvastext}}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-item-dot.🥝-dot{align-self:center}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-error-region{z-index:1;position:relative}}@layer states{.🥝-error-region:where([data-kiwi-expanded=true]){--🥝chevron-down-rotate:-.5turn;--🥝error-region-header-border-end-radius:0}.🥝-error-region:where([data-kiwi-visible=true]){block-size:2.625rem;padding-block:4px;padding-inline:4px}.🥝-error-region:where([data-kiwi-visible=false]){--🥝error-region-container-display:none}}@layer base{.🥝-error-region-container{isolation:isolate;display:var(--🥝error-region-container-display,flex);border:1px solid var(--stratakit-color-border-attention-base);background-color:var(--stratakit-color-bg-elevation-base);box-shadow:var(--stratakit-shadow-surface-sm);border-radius:8px;flex-direction:column;position:relative}@media (prefers-reduced-motion:no-preference){.🥝-error-region-container:before{content:"";border-radius:inherit;z-index:-1;position:absolute;inset:0}}}@layer base{.🥝-error-region-header{border-start-start-radius:7px;border-start-end-radius:7px;border-end-end-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));border-end-start-radius:var(--🥝error-region-header-border-end-radius,calc(8px - 1px));flex-wrap:wrap;min-block-size:2rem;padding-inline:8px 4px;font-weight:400;transition:border-radius 0s linear .15s}}@layer base{.🥝-error-region-icon{--🥝icon-color:var(--stratakit-color-icon-attention-base)}}@layer base{.🥝-error-region-label{text-align:start;overflow-wrap:break-word;flex:1;max-inline-size:100%}}@layer base{.🥝-error-region-dialog{transition:max-block-size .15s linear,opacity .15s linear;overflow:hidden}}@layer states{.🥝-error-region-dialog:where(:not([data-enter])){opacity:0}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where(:not([data-enter])){max-block-size:0}}.🥝-error-region-dialog:where([data-enter]){opacity:1}@media (prefers-reduced-motion:no-preference){.🥝-error-region-dialog:where([data-enter]){max-block-size:calc(348px - 2rem)}@supports (interpolate-size:allow-keywords){.🥝-error-region-dialog:where([data-enter]){max-block-size:max-content}}}}@layer base{.🥝-error-region-items{border-block-start:1px solid var(--stratakit-color-border-page-base);max-block-size:calc(348px - 2rem);overflow:auto}}@layer base{.🥝-error-region-item{flex-direction:column;padding-block:12px;padding-inline:calc(12px + 1rem) 4px;display:flex}.🥝-error-region-item:where(:not(:nth-child(1 of .🥝-error-region-item))){border-block-start:1px solid var(--stratakit-color-border-page-base)}}@layer base{.🥝-error-region-item-actions{margin-block-start:8px}}@layer base{.🥝-table:where(table){table-layout:fixed;inline-size:100%}}@layer base{.🥝-table-header{color:var(--stratakit-color-text-neutral-secondary)}}@layer base{.🥝-table-row:where([role=row]){display:flex}}@layer base{.🥝-table-caption,.🥝-table-cell{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;align-content:center;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem .75rem}:is(.🥝-table-caption,.🥝-table-cell):where(th,td){block-size:3rem}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--stratakit-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--stratakit-color-bg-page-base)100.0%,var(--stratakit-color-glow-hue)var(--stratakit-color-bg-glow-base-hover-\%)));border-block-end:1px solid var(--stratakit-color-border-neutral-muted);min-inline-size:4rem}.🥝-table-cell:where(:not(th,td)){flex-grow:1;flex-basis:4rem;column-gap:.5rem}.🥝-table-cell:where(th){font-weight:inherit}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where([role=cell],td){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:8px;--🥝tab-active-stripe-size:2px;--🥝tab-padding-inline:4px;gap:8px;display:flex;position:relative}@supports (position-anchor:--foo){.🥝-tab-list:after{content:"";position-anchor:--🥝active-tab;inline-size:calc(anchor-size(inline) - 2*var(--🥝tab-padding-inline));block-size:var(--🥝tab-active-stripe-size);background-color:var(--🥝tab-active-stripe-color);position:absolute;inset-block-end:calc(anchor(end) - var(--🥝tab-active-stripe-gap));inset-inline-start:calc(anchor(start) + var(--🥝tab-padding-inline))}@media (prefers-reduced-motion:no-preference){.🥝-tab-list:after{transition:inset-inline-start .15s ease-in-out,inline-size .15s ease-in-out}}}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}.🥝-tab-list:where([data-kiwi-tone=neutral]){--🥝tab-active-stripe-color:var(--stratakit-color-border-neutral-inverse)}.🥝-tab-list:where([data-kiwi-tone=accent]){--🥝tab-active-stripe-color:var(--stratakit-color-border-accent-strong)}}@layer base{.🥝-tab{font-size:var(--stratakit-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);block-size:1.25rem;padding-inline:var(--🥝tab-padding-inline);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;align-items:center;gap:4px;transition:background-color .15s ease-out,color .15s ease-out;display:inline-flex;position:relative}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--stratakit-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--stratakit-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--stratakit-color-text-neutral-primary))var(--🌀tab-state--selected,var(--stratakit-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--stratakit-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--stratakit-color-bg-glow-on-surface-neutral-pressed)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--stratakit-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--stratakit-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--stratakit-color-text-accent-strong))var(--🌀tab-state--selected,var(--stratakit-color-text-accent-strong))var(--🌀tab-state--disabled,var(--stratakit-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--stratakit-color-bg-glow-on-surface-accent-pressed)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected);anchor-name:--🥝active-tab}@supports not (anchor-name:--foo){.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:var(--🥝tab-active-stripe-size);inset-inline:var(--🥝tab-padding-inline);inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where(:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--stratakit-color-border-neutral-disabled);cursor:not-allowed;-webkit-tap-highlight-color:transparent}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{--🥝focus-outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@media (forced-colors:active){.🥝-tab-list,.🥝-tab{--🥝tab-active-stripe-color:CanvasText}.🥝-tab{--🥝tab-color:CanvasText}.🥝-tab:where([aria-selected=true]){forced-color-adjust:none;--🥝tab-bg:SelectedItem;--🥝tab-color:SelectedItemText}.🥝-tab:where(:disabled,[aria-disabled=true]){--🥝tab-color:GrayText}}@layer base{.🥝-toolbar{background-color:var(--stratakit-color-bg-page-base);box-shadow:var(--stratakit-shadow-toolbar-base);border-radius:8px;gap:4px;padding:4px;display:inline-flex}}@media (forced-colors:active){.🥝-toolbar{border:1px solid}}@layer base{.🥝-tree{background-color:var(--stratakit-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:var(--🥝focus-outline);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-visible,:has(:focus-visible),:has([data-has-popover-open]))){--🥝tree-item-action-visibility:hidden}@supports not selector(:has(+ *)){.🥝-tree-item{--🥝tree-item-action-visibility:visible}}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;--🥝list-item-color:var(--🥝tree-item-color);padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer modifiers{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]){--🥝icon-color:var(--stratakit-color-icon-attention-base);--🥝tree-item-color:var(--stratakit-color-text-attention-base)}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝chevron-down-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-description.🥝-list-item-content{color:var(--🥝tree-item-color,var(--🌀list-item-state--default,var(--stratakit-color-text-neutral-secondary)))}}@layer base{.🥝-tree-item-actions-container.🥝-list-item-decoration{background-color:var(--stratakit-color-bg-page-base);visibility:var(--🥝tree-item-actions-container-visibility,var(--🥝tree-item-action-visibility));align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions-container.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions-container.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-container-visibility:visible}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility);transition:visibility 16ms}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-item-decoration{align-items:center;gap:.25rem;display:flex}}@media (forced-colors:active){.🥝-tree-item-node.🥝-list-item{--🥝list-item-background-color:Canvas;--🥝tree-item-color:CanvasText}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true],[data-kiwi-selected=true]){forced-color-adjust:none}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-content,.🥝-tree-item-node.🥝-list-item:where([data-kiwi-error=true]) .🥝-tree-item-decoration{color:marktext;background-color:mark}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🥝list-item-background-color:SelectedItem;--🥝tree-item-color:SelectedItemText}}}`;
|
|
3
3
|
|
|
4
4
|
// src/styles.css.ts
|
|
5
5
|
var styles_css_default = styles_default;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stratakit/structures",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.2.
|
|
4
|
+
"version": "0.2.3",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"sideEffects": false,
|
|
7
7
|
"types": "./dist/index.d.ts",
|
|
@@ -12,7 +12,67 @@
|
|
|
12
12
|
"development": "./dist/DEV/index.js",
|
|
13
13
|
"default": "./dist/index.js"
|
|
14
14
|
},
|
|
15
|
-
"./package.json": "./package.json"
|
|
15
|
+
"./package.json": "./package.json",
|
|
16
|
+
"./unstable_AccordionItem": {
|
|
17
|
+
"@stratakit/source": "./src/AccordionItem.tsx",
|
|
18
|
+
"types": "./dist/AccordionItem.d.ts",
|
|
19
|
+
"development": "./dist/DEV/AccordionItem.js",
|
|
20
|
+
"default": "./dist/AccordionItem.js"
|
|
21
|
+
},
|
|
22
|
+
"./unstable_Banner": {
|
|
23
|
+
"@stratakit/source": "./src/Banner.tsx",
|
|
24
|
+
"types": "./dist/Banner.d.ts",
|
|
25
|
+
"development": "./dist/DEV/Banner.js",
|
|
26
|
+
"default": "./dist/Banner.js"
|
|
27
|
+
},
|
|
28
|
+
"./Chip": {
|
|
29
|
+
"@stratakit/source": "./src/Chip.tsx",
|
|
30
|
+
"types": "./dist/Chip.d.ts",
|
|
31
|
+
"development": "./dist/DEV/Chip.js",
|
|
32
|
+
"default": "./dist/Chip.js"
|
|
33
|
+
},
|
|
34
|
+
"./DropdownMenu": {
|
|
35
|
+
"@stratakit/source": "./src/DropdownMenu.tsx",
|
|
36
|
+
"types": "./dist/DropdownMenu.d.ts",
|
|
37
|
+
"development": "./dist/DEV/DropdownMenu.js",
|
|
38
|
+
"default": "./dist/DropdownMenu.js"
|
|
39
|
+
},
|
|
40
|
+
"./unstable_ErrorRegion": {
|
|
41
|
+
"@stratakit/source": "./src/ErrorRegion.tsx",
|
|
42
|
+
"types": "./dist/ErrorRegion.d.ts",
|
|
43
|
+
"development": "./dist/DEV/ErrorRegion.js",
|
|
44
|
+
"default": "./dist/ErrorRegion.js"
|
|
45
|
+
},
|
|
46
|
+
"./Table": {
|
|
47
|
+
"@stratakit/source": "./src/Table.tsx",
|
|
48
|
+
"types": "./dist/Table.d.ts",
|
|
49
|
+
"development": "./dist/DEV/Table.js",
|
|
50
|
+
"default": "./dist/Table.js"
|
|
51
|
+
},
|
|
52
|
+
"./Tabs": {
|
|
53
|
+
"@stratakit/source": "./src/Tabs.tsx",
|
|
54
|
+
"types": "./dist/Tabs.d.ts",
|
|
55
|
+
"development": "./dist/DEV/Tabs.js",
|
|
56
|
+
"default": "./dist/Tabs.js"
|
|
57
|
+
},
|
|
58
|
+
"./unstable_Toolbar": {
|
|
59
|
+
"@stratakit/source": "./src/Toolbar.tsx",
|
|
60
|
+
"types": "./dist/Toolbar.d.ts",
|
|
61
|
+
"development": "./dist/DEV/Toolbar.js",
|
|
62
|
+
"default": "./dist/Toolbar.js"
|
|
63
|
+
},
|
|
64
|
+
"./Tree": {
|
|
65
|
+
"@stratakit/source": "./src/Tree.tsx",
|
|
66
|
+
"types": "./dist/Tree.d.ts",
|
|
67
|
+
"development": "./dist/DEV/Tree.js",
|
|
68
|
+
"default": "./dist/Tree.js"
|
|
69
|
+
},
|
|
70
|
+
"./TreeItem": {
|
|
71
|
+
"@stratakit/source": "./src/TreeItem.tsx",
|
|
72
|
+
"types": "./dist/TreeItem.d.ts",
|
|
73
|
+
"development": "./dist/DEV/TreeItem.js",
|
|
74
|
+
"default": "./dist/TreeItem.js"
|
|
75
|
+
}
|
|
16
76
|
},
|
|
17
77
|
"files": [
|
|
18
78
|
"dist",
|
|
@@ -42,21 +102,22 @@
|
|
|
42
102
|
],
|
|
43
103
|
"dependencies": {
|
|
44
104
|
"@ariakit/react": "^0.4.17",
|
|
45
|
-
"@stratakit/bricks": "^0.3.
|
|
46
|
-
"classnames": "^2.5.1"
|
|
105
|
+
"@stratakit/bricks": "^0.3.1",
|
|
106
|
+
"classnames": "^2.5.1",
|
|
107
|
+
"zustand": "^5.0.5"
|
|
47
108
|
},
|
|
48
109
|
"devDependencies": {
|
|
49
|
-
"@types/node": "^22.15.
|
|
50
|
-
"@types/react": "^19.1.
|
|
110
|
+
"@types/node": "^22.15.34",
|
|
111
|
+
"@types/react": "^19.1.8",
|
|
51
112
|
"@types/react-dom": "^19.1.6",
|
|
52
113
|
"esbuild": "^0.25.5",
|
|
53
114
|
"react": "^19.1.0",
|
|
54
115
|
"react-dom": "^19.1.0",
|
|
55
116
|
"typescript": "~5.8.3",
|
|
56
|
-
"@stratakit/foundations": "0.
|
|
117
|
+
"@stratakit/foundations": "0.2.0"
|
|
57
118
|
},
|
|
58
119
|
"peerDependencies": {
|
|
59
|
-
"@stratakit/foundations": "^0.
|
|
120
|
+
"@stratakit/foundations": "^0.2.0",
|
|
60
121
|
"react": ">=18.0.0",
|
|
61
122
|
"react-dom": ">=18.0.0"
|
|
62
123
|
},
|