@sit-onyx/storybook-utils 1.0.0-beta.103 → 1.0.0-beta.104
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/package.json +6 -7
- package/src/breakpoints.ts +17 -0
- package/src/preview.ts +3 -1
- package/src/theme.ts +1 -4
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sit-onyx/storybook-utils",
|
|
3
3
|
"description": "Storybook utilities for Vue",
|
|
4
|
-
"version": "1.0.0-beta.
|
|
4
|
+
"version": "1.0.0-beta.104",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": "Schwarz IT KG",
|
|
7
7
|
"license": "Apache-2.0",
|
|
@@ -32,17 +32,16 @@
|
|
|
32
32
|
"storybook": ">= 9.0.0",
|
|
33
33
|
"vue-component-type-helpers": ">= 2",
|
|
34
34
|
"@sit-onyx/flags": "^1.0.0-beta.7",
|
|
35
|
-
"@sit-onyx/icons": "^1.0.0-beta.
|
|
36
|
-
"@sit-onyx/shared": "^1.0.0-beta.4"
|
|
35
|
+
"@sit-onyx/icons": "^1.0.0-beta.26"
|
|
37
36
|
},
|
|
38
37
|
"dependencies": {
|
|
39
38
|
"deepmerge-ts": "^7.1.5"
|
|
40
39
|
},
|
|
41
40
|
"devDependencies": {
|
|
42
|
-
"storybook": "^9.1.
|
|
43
|
-
"vue": "3.5.
|
|
44
|
-
"vue-component-type-helpers": "^3.0.
|
|
45
|
-
"@sit-onyx/icons": "^1.0.0-beta.
|
|
41
|
+
"storybook": "^9.1.3",
|
|
42
|
+
"vue": "3.5.20",
|
|
43
|
+
"vue-component-type-helpers": "^3.0.6",
|
|
44
|
+
"@sit-onyx/icons": "^1.0.0-beta.26",
|
|
46
45
|
"@sit-onyx/shared": "^1.0.0-beta.4"
|
|
47
46
|
},
|
|
48
47
|
"scripts": {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* All available onyx breakpoints / viewports.
|
|
3
|
+
* Key = breakpoint name, value = width in pixels.
|
|
4
|
+
*/
|
|
5
|
+
export const ONYX_BREAKPOINTS = {
|
|
6
|
+
"2xs": 320,
|
|
7
|
+
xs: 577,
|
|
8
|
+
sm: 769,
|
|
9
|
+
md: 993,
|
|
10
|
+
lg: 1441,
|
|
11
|
+
xl: 1921,
|
|
12
|
+
} as const;
|
|
13
|
+
|
|
14
|
+
// "string &" is needed to fix a current Vue issue where a warning is logged for invalid property types
|
|
15
|
+
// when this types is used in a union, see:
|
|
16
|
+
// https://github.com/SchwarzIT/onyx/issues/3290
|
|
17
|
+
export type OnyxBreakpoint = string & keyof typeof ONYX_BREAKPOINTS;
|
package/src/preview.ts
CHANGED
|
@@ -144,7 +144,9 @@ export const sourceCodeTransformer = async (originalSourceCode: string): Promise
|
|
|
144
144
|
// add imports for all used onyx components
|
|
145
145
|
// Set is used here to only include unique components if they are used multiple times
|
|
146
146
|
const usedOnyxComponents = new Set(
|
|
147
|
-
Array.from(code.matchAll(/<(Onyx\w+)(?:\s*\/?)/g))
|
|
147
|
+
Array.from(code.matchAll(/<(Onyx\w+)(?:\s*\/?)/g))
|
|
148
|
+
.map((match) => match[1])
|
|
149
|
+
.filter((i) => i != undefined),
|
|
148
150
|
);
|
|
149
151
|
additionalImports.set("sit-onyx", usedOnyxComponents);
|
|
150
152
|
|
package/src/theme.ts
CHANGED
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
ONYX_BREAKPOINTS as RAW_ONYX_BREAKPOINTS,
|
|
3
|
-
type OnyxBreakpoint,
|
|
4
|
-
} from "@sit-onyx/shared/breakpoints";
|
|
5
1
|
import { create, type ThemeVars } from "storybook/internal/theming";
|
|
6
2
|
import type { Viewport } from "storybook/internal/viewport";
|
|
3
|
+
import { ONYX_BREAKPOINTS as RAW_ONYX_BREAKPOINTS, type OnyxBreakpoint } from "./breakpoints.js";
|
|
7
4
|
|
|
8
5
|
export type BrandDetails = Pick<ThemeVars, "brandTitle" | "brandImage" | "brandUrl">;
|
|
9
6
|
|