@repobuddy/storybook 2.0.1 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm/index.d.ts +574 -13
- package/esm/index.js +491 -12
- package/esm/manager/index.d.ts +38 -1
- package/esm/manager/index.js +32 -1
- package/esm/storybook-addon-tag-badges/index.d.ts +95 -2
- package/esm/storybook-addon-tag-badges/index.js +207 -1
- package/esm/storybook-dark-mode/index.d.ts +110 -3
- package/esm/storybook-dark-mode/index.js +342 -3
- package/package.json +4 -12
- package/cjs/components/show_html.d.ts +0 -16
- package/cjs/components/show_html.js +0 -29
- package/cjs/decorators/show_doc_source.d.ts +0 -6
- package/cjs/decorators/show_doc_source.js +0 -38
- package/cjs/index.d.ts +0 -13
- package/cjs/index.js +0 -137
- package/cjs/manager/brand_title.d.ts +0 -35
- package/cjs/manager/brand_title.js +0 -12
- package/cjs/manager/index.d.ts +0 -1
- package/cjs/manager/index.js +0 -16
- package/cjs/parameters/define_actions_param.d.ts +0 -24
- package/cjs/parameters/define_actions_param.js +0 -11
- package/cjs/parameters/define_backgrounds_param.d.ts +0 -45
- package/cjs/parameters/define_backgrounds_param.js +0 -10
- package/cjs/parameters/define_docs_param.d.ts +0 -217
- package/cjs/parameters/define_docs_param.js +0 -11
- package/cjs/parameters/define_layout_param.d.ts +0 -20
- package/cjs/parameters/define_layout_param.js +0 -10
- package/cjs/parameters/define_parameters.d.ts +0 -39
- package/cjs/parameters/define_parameters.js +0 -9
- package/cjs/parameters/define_test_param.d.ts +0 -34
- package/cjs/parameters/define_test_param.js +0 -11
- package/cjs/parameters/define_viewport_param.d.ts +0 -78
- package/cjs/parameters/define_viewport_param.js +0 -11
- package/cjs/parameters/story_sort.d.ts +0 -27
- package/cjs/parameters/story_sort.js +0 -1
- package/cjs/storybook-addon-tag-badges/index.d.ts +0 -2
- package/cjs/storybook-addon-tag-badges/index.js +0 -16
- package/cjs/storybook-addon-tag-badges/tag_badges.d.ts +0 -41
- package/cjs/storybook-addon-tag-badges/tag_badges.js +0 -179
- package/cjs/storybook-addon-tag-badges/types.d.ts +0 -9
- package/cjs/storybook-addon-tag-badges/types.js +0 -1
- package/cjs/storybook-dark-mode/dark_mode_docs_container.d.ts +0 -26
- package/cjs/storybook-dark-mode/dark_mode_docs_container.js +0 -23
- package/cjs/storybook-dark-mode/define_dark_mode.d.ts +0 -54
- package/cjs/storybook-dark-mode/define_dark_mode.js +0 -11
- package/cjs/storybook-dark-mode/index.d.ts +0 -3
- package/cjs/storybook-dark-mode/index.js +0 -38
- package/cjs/storybook-dark-mode/with_dark_mode.d.ts +0 -22
- package/cjs/storybook-dark-mode/with_dark_mode.js +0 -54
- package/cjs/testing/decorators/when_running_in_test.d.ts +0 -5
- package/cjs/testing/decorators/when_running_in_test.js +0 -12
- package/cjs/testing/decorators/when_running_in_text.ctx.d.ts +0 -3
- package/cjs/testing/decorators/when_running_in_text.ctx.js +0 -10
- package/cjs/types.d.ts +0 -41
- package/cjs/types.js +0 -1
- package/cjs/variants/index.d.ts +0 -1
- package/cjs/variants/index.js +0 -8
- package/cjs/variants/package.json +0 -3
- package/cjs/variants/preset.d.ts +0 -11
- package/cjs/variants/preset.js +0 -3
- package/esm/components/show_html.d.ts +0 -16
- package/esm/components/show_html.js +0 -19
- package/esm/decorators/show_doc_source.d.ts +0 -6
- package/esm/decorators/show_doc_source.js +0 -28
- package/esm/manager/brand_title.d.ts +0 -35
- package/esm/manager/brand_title.js +0 -6
- package/esm/parameters/define_actions_param.d.ts +0 -24
- package/esm/parameters/define_actions_param.js +0 -3
- package/esm/parameters/define_backgrounds_param.d.ts +0 -45
- package/esm/parameters/define_backgrounds_param.js +0 -3
- package/esm/parameters/define_docs_param.d.ts +0 -217
- package/esm/parameters/define_docs_param.js +0 -3
- package/esm/parameters/define_layout_param.d.ts +0 -20
- package/esm/parameters/define_layout_param.js +0 -3
- package/esm/parameters/define_parameters.d.ts +0 -39
- package/esm/parameters/define_parameters.js +0 -3
- package/esm/parameters/define_test_param.d.ts +0 -34
- package/esm/parameters/define_test_param.js +0 -3
- package/esm/parameters/define_viewport_param.d.ts +0 -78
- package/esm/parameters/define_viewport_param.js +0 -3
- package/esm/parameters/story_sort.d.ts +0 -27
- package/esm/parameters/story_sort.js +0 -0
- package/esm/storybook-addon-tag-badges/tag_badges.d.ts +0 -41
- package/esm/storybook-addon-tag-badges/tag_badges.js +0 -189
- package/esm/storybook-addon-tag-badges/types.d.ts +0 -9
- package/esm/storybook-addon-tag-badges/types.js +0 -0
- package/esm/storybook-dark-mode/dark_mode_docs_container.d.ts +0 -26
- package/esm/storybook-dark-mode/dark_mode_docs_container.js +0 -21
- package/esm/storybook-dark-mode/define_dark_mode.d.ts +0 -54
- package/esm/storybook-dark-mode/define_dark_mode.js +0 -3
- package/esm/storybook-dark-mode/with_dark_mode.d.ts +0 -22
- package/esm/storybook-dark-mode/with_dark_mode.js +0 -46
- package/esm/testing/decorators/when_running_in_test.d.ts +0 -5
- package/esm/testing/decorators/when_running_in_test.js +0 -6
- package/esm/testing/decorators/when_running_in_text.ctx.d.ts +0 -3
- package/esm/testing/decorators/when_running_in_text.ctx.js +0 -4
- package/esm/types.d.ts +0 -41
- package/esm/types.js +0 -0
- package/esm/variants/index.d.ts +0 -1
- package/esm/variants/index.js +0 -2
- package/esm/variants/package.json +0 -3
- package/esm/variants/preset.d.ts +0 -11
- package/esm/variants/preset.js +0 -1
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
export interface LayoutParam {
|
|
2
|
-
layout: 'padded' | 'fullscreen' | 'centered';
|
|
3
|
-
}
|
|
4
|
-
/**
|
|
5
|
-
* Helper function to define the layout parameter for a story
|
|
6
|
-
*
|
|
7
|
-
* @see https://storybook.js.org/docs/api/parameters#layout
|
|
8
|
-
*
|
|
9
|
-
* @param layout - The layout type to use ('padded', 'fullscreen', or 'centered')
|
|
10
|
-
* @returns An object containing the layout parameter
|
|
11
|
-
* @example
|
|
12
|
-
* ```ts
|
|
13
|
-
* export const MyStory = {
|
|
14
|
-
* parameters: defineLayoutParam('centered')
|
|
15
|
-
* }
|
|
16
|
-
* ```
|
|
17
|
-
*/
|
|
18
|
-
export declare const defineLayoutParam: (layout: LayoutParam["layout"]) => {
|
|
19
|
-
layout: "centered" | "padded" | "fullscreen";
|
|
20
|
-
};
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import type { BackgroundsParam, GlobalApiBackgroundsParam } from './define_backgrounds_param.js';
|
|
2
|
-
import type { DocsParam } from './define_docs_param.js';
|
|
3
|
-
import type { LayoutParam } from './define_layout_param.js';
|
|
4
|
-
import type { TestParam } from './define_test_param.js';
|
|
5
|
-
import type { ViewportParam } from './define_viewport_param.js';
|
|
6
|
-
import type { StorySortParam } from './story_sort.js';
|
|
7
|
-
export type StorybookBuiltInParams = Partial<BackgroundsParam | GlobalApiBackgroundsParam> & Partial<DocsParam> & Partial<LayoutParam> & Partial<TestParam> & Partial<ViewportParam> & {
|
|
8
|
-
options?: StorySortParam & Record<string, any>;
|
|
9
|
-
} & Record<string, any>;
|
|
10
|
-
/**
|
|
11
|
-
* Defines parameters for Storybook stories, combining built-in parameters with custom ones.
|
|
12
|
-
*
|
|
13
|
-
* @param parameters - Configuration object containing both built-in Storybook parameters and custom parameters
|
|
14
|
-
* @returns The combined parameters object
|
|
15
|
-
*
|
|
16
|
-
* @example
|
|
17
|
-
* ```ts
|
|
18
|
-
* import { defineParameters } from '@repobuddy/storybook'
|
|
19
|
-
*
|
|
20
|
-
* export default {
|
|
21
|
-
* parameters: defineParameters({
|
|
22
|
-
* // Built-in parameters
|
|
23
|
-
* layout: 'centered',
|
|
24
|
-
* backgrounds: {
|
|
25
|
-
* default: 'light',
|
|
26
|
-
* values: [
|
|
27
|
-
* { name: 'light', value: '#ffffff' },
|
|
28
|
-
* { name: 'dark', value: '#333333' }
|
|
29
|
-
* ]
|
|
30
|
-
* },
|
|
31
|
-
* // Custom parameters
|
|
32
|
-
* myCustomParam: {
|
|
33
|
-
* someValue: true
|
|
34
|
-
* }
|
|
35
|
-
* })
|
|
36
|
-
* }
|
|
37
|
-
* ```
|
|
38
|
-
*/
|
|
39
|
-
export declare function defineParameters<P extends Record<string, any>>(param: P & StorybookBuiltInParams, ...rest: Array<StorybookBuiltInParams>): any;
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
export interface TestParam {
|
|
2
|
-
test: {
|
|
3
|
-
clearMocks?: boolean | undefined;
|
|
4
|
-
mockReset?: boolean | undefined;
|
|
5
|
-
restoreMocks?: boolean | undefined;
|
|
6
|
-
dangerouslyIgnoreUnhandledErrors?: boolean | undefined;
|
|
7
|
-
[k: string]: unknown;
|
|
8
|
-
};
|
|
9
|
-
}
|
|
10
|
-
/**
|
|
11
|
-
* Defines test parameters for Storybook stories.
|
|
12
|
-
*
|
|
13
|
-
* @see https://storybook.js.org/docs/api/parameters#test
|
|
14
|
-
*
|
|
15
|
-
* @param test - Configuration for test parameters
|
|
16
|
-
* @returns An object containing the test parameter configuration
|
|
17
|
-
*
|
|
18
|
-
* @example
|
|
19
|
-
* defineTestParam({
|
|
20
|
-
* clearMocks: true,
|
|
21
|
-
* mockReset: true,
|
|
22
|
-
* restoreMocks: true,
|
|
23
|
-
* dangerouslyIgnoreUnhandledErrors: true
|
|
24
|
-
* })
|
|
25
|
-
*/
|
|
26
|
-
export declare function defineTestParam(test: TestParam['test']): {
|
|
27
|
-
test: {
|
|
28
|
-
[k: string]: unknown;
|
|
29
|
-
clearMocks?: boolean | undefined;
|
|
30
|
-
mockReset?: boolean | undefined;
|
|
31
|
-
restoreMocks?: boolean | undefined;
|
|
32
|
-
dangerouslyIgnoreUnhandledErrors?: boolean | undefined;
|
|
33
|
-
};
|
|
34
|
-
};
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
export interface ViewportParam {
|
|
2
|
-
viewport: {
|
|
3
|
-
/**
|
|
4
|
-
* @see https://storybook.js.org/docs/essentials/viewport#viewports
|
|
5
|
-
*/
|
|
6
|
-
viewports?: Record<string, Viewport> | undefined;
|
|
7
|
-
/**
|
|
8
|
-
* @see https://storybook.js.org/docs/essentials/viewport#defaultorientation
|
|
9
|
-
*/
|
|
10
|
-
defaultOrientation?: 'landscape' | 'portrait' | undefined;
|
|
11
|
-
/**
|
|
12
|
-
* @see https://storybook.js.org/docs/essentials/viewport#defaultviewport
|
|
13
|
-
*/
|
|
14
|
-
defaultViewport?: string | undefined;
|
|
15
|
-
/**
|
|
16
|
-
* Disables the viewport parameter.
|
|
17
|
-
* @deprecated Use `disabled` instead.
|
|
18
|
-
*/
|
|
19
|
-
disable?: boolean | undefined;
|
|
20
|
-
[k: string]: unknown;
|
|
21
|
-
};
|
|
22
|
-
}
|
|
23
|
-
export interface Viewport {
|
|
24
|
-
name: string;
|
|
25
|
-
styles: {
|
|
26
|
-
width: string;
|
|
27
|
-
height: string;
|
|
28
|
-
};
|
|
29
|
-
type: 'mobile' | 'tablet' | 'desktop';
|
|
30
|
-
}
|
|
31
|
-
export interface GlobalApiViewportParam {
|
|
32
|
-
viewport: {
|
|
33
|
-
/**
|
|
34
|
-
* @see https://storybook.js.org/docs/essentials/viewport#viewports
|
|
35
|
-
*/
|
|
36
|
-
options?: Record<string, Viewport> | undefined;
|
|
37
|
-
/**
|
|
38
|
-
* @see https://storybook.js.org/docs/essentials/viewport#defaultviewport
|
|
39
|
-
*/
|
|
40
|
-
defaultViewport?: string | undefined;
|
|
41
|
-
/**
|
|
42
|
-
* @see https://storybook.js.org/docs/essentials/viewport#defaultorientation
|
|
43
|
-
*/
|
|
44
|
-
defaultOrientation?: 'landscape' | 'portrait' | undefined;
|
|
45
|
-
/**
|
|
46
|
-
* @see https://storybook.js.org/docs/essentials/viewport#disable
|
|
47
|
-
*/
|
|
48
|
-
disabled?: boolean | undefined;
|
|
49
|
-
};
|
|
50
|
-
}
|
|
51
|
-
/**
|
|
52
|
-
* Defines viewport parameters for Storybook stories.
|
|
53
|
-
*
|
|
54
|
-
* @see https://storybook.js.org/docs/api/parameters#viewport
|
|
55
|
-
*
|
|
56
|
-
* @param viewport - Configuration for viewport parameters including:
|
|
57
|
-
* - viewports: Custom viewport definitions
|
|
58
|
-
* - defaultViewport: The default viewport to use
|
|
59
|
-
* - defaultOrientation: Default orientation (landscape/portrait)
|
|
60
|
-
* - disabled: Whether viewport controls are disabled
|
|
61
|
-
* @returns An object containing the viewport parameter configuration
|
|
62
|
-
*
|
|
63
|
-
* @example
|
|
64
|
-
* ```ts
|
|
65
|
-
* defineViewportParam({
|
|
66
|
-
* viewports: {
|
|
67
|
-
* mobile: {
|
|
68
|
-
* name: 'Mobile',
|
|
69
|
-
* styles: { width: '320px', height: '568px' },
|
|
70
|
-
* type: 'mobile'
|
|
71
|
-
* }
|
|
72
|
-
* },
|
|
73
|
-
* defaultViewport: 'mobile',
|
|
74
|
-
* defaultOrientation: 'portrait'
|
|
75
|
-
* })
|
|
76
|
-
* ```
|
|
77
|
-
*/
|
|
78
|
-
export declare function defineViewportParam(viewport: ViewportParam['viewport'] | GlobalApiViewportParam['viewport']): ViewportParam;
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
type StorySortConfig = {
|
|
2
|
-
includeNames?: boolean;
|
|
3
|
-
locales?: string;
|
|
4
|
-
method?: 'alphabetical' | 'alphabetical-by-kind' | 'custom';
|
|
5
|
-
order?: string[];
|
|
6
|
-
[k: string]: unknown;
|
|
7
|
-
};
|
|
8
|
-
type Story = {
|
|
9
|
-
id: string;
|
|
10
|
-
importPath: string;
|
|
11
|
-
name: string;
|
|
12
|
-
title: string;
|
|
13
|
-
};
|
|
14
|
-
type StorySortFn = (a: Story, b: Story) => number;
|
|
15
|
-
/**
|
|
16
|
-
* Interface for story sorting parameters in Storybook.
|
|
17
|
-
* Used to define how stories should be sorted in the navigation sidebar.
|
|
18
|
-
*/
|
|
19
|
-
export interface StorySortParam {
|
|
20
|
-
/**
|
|
21
|
-
* Configuration for story sorting. Can be either:
|
|
22
|
-
* - A StorySortConfig object specifying sort method and options
|
|
23
|
-
* - A custom sorting function that takes two stories and returns their sort order
|
|
24
|
-
*/
|
|
25
|
-
storySort: StorySortConfig | StorySortFn;
|
|
26
|
-
}
|
|
27
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
var _tag_badges = require("./tag_badges.js");
|
|
7
|
-
Object.keys(_tag_badges).forEach(function (key) {
|
|
8
|
-
if (key === "default" || key === "__esModule") return;
|
|
9
|
-
if (key in exports && exports[key] === _tag_badges[key]) return;
|
|
10
|
-
Object.defineProperty(exports, key, {
|
|
11
|
-
enumerable: true,
|
|
12
|
-
get: function () {
|
|
13
|
-
return _tag_badges[key];
|
|
14
|
-
}
|
|
15
|
-
});
|
|
16
|
-
});
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { type TagBadgeParameters } from 'storybook-addon-tag-badges/manager-helpers';
|
|
2
|
-
type TagBadgeParameter = TagBadgeParameters[0];
|
|
3
|
-
/**
|
|
4
|
-
* Type representing the names of predefined tags used in Storybook stories.
|
|
5
|
-
*/
|
|
6
|
-
export type TagNames = 'editor' | 'new' | 'beta' | 'props' | 'deprecated' | 'outdated' | 'danger' | 'todo' | 'code-only' | 'snapshot' | 'unit' | 'integration' | 'keyboard' | 'internal';
|
|
7
|
-
/**
|
|
8
|
-
* Configuration for story tag badges that appear in the Storybook sidebar.
|
|
9
|
-
* Each badge is associated with a specific tag and displays an emoji with a tooltip.
|
|
10
|
-
*
|
|
11
|
-
* The badges help visually identify stories with certain characteristics:
|
|
12
|
-
* - ✏️ Editor - Stories with live editor
|
|
13
|
-
* - 🆕 New - Recently added stories
|
|
14
|
-
* - 🅱️ Beta - Stories for features in beta
|
|
15
|
-
* - 🪦 Deprecated - Stories for deprecated features
|
|
16
|
-
* - ⚠️ Outdated - Stories that need updating
|
|
17
|
-
* - 🚨 Danger - Stories demonstrating dangerous patterns
|
|
18
|
-
* - 📋 Todo - Stories marked as todo/incomplete
|
|
19
|
-
* - 📝 Code Only - Stories without visual examples
|
|
20
|
-
* - 📸 Snapshot - Stories with snapshot tests
|
|
21
|
-
* - 🧪 Unit - Stories with unit tests
|
|
22
|
-
* - 🔗 Integration - Stories with integration tests
|
|
23
|
-
*
|
|
24
|
-
* Also includes the default version badge from `storybook-addon-tag-badges`.
|
|
25
|
-
*/
|
|
26
|
-
export declare const editorBadge: TagBadgeParameter;
|
|
27
|
-
export declare const newBadge: TagBadgeParameter;
|
|
28
|
-
export declare const betaBadge: TagBadgeParameter;
|
|
29
|
-
export declare const propsBadge: TagBadgeParameter;
|
|
30
|
-
export declare const deprecatedBadge: TagBadgeParameter;
|
|
31
|
-
export declare const outdatedBadge: TagBadgeParameter;
|
|
32
|
-
export declare const dangerBadge: TagBadgeParameter;
|
|
33
|
-
export declare const todoBadge: TagBadgeParameter;
|
|
34
|
-
export declare const codeOnlyBadge: TagBadgeParameter;
|
|
35
|
-
export declare const snapshotBadge: TagBadgeParameter;
|
|
36
|
-
export declare const unitBadge: TagBadgeParameter;
|
|
37
|
-
export declare const integrationBadge: TagBadgeParameter;
|
|
38
|
-
export declare const keyboardBadge: TagBadgeParameter;
|
|
39
|
-
export declare const internalBadge: TagBadgeParameter;
|
|
40
|
-
export declare const tagBadges: TagBadgeParameters;
|
|
41
|
-
export {};
|
|
@@ -1,179 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.unitBadge = exports.todoBadge = exports.tagBadges = exports.snapshotBadge = exports.propsBadge = exports.outdatedBadge = exports.newBadge = exports.keyboardBadge = exports.internalBadge = exports.integrationBadge = exports.editorBadge = exports.deprecatedBadge = exports.dangerBadge = exports.codeOnlyBadge = exports.betaBadge = void 0;
|
|
7
|
-
var _managerHelpers = require("storybook-addon-tag-badges/manager-helpers");
|
|
8
|
-
const [,,,,,, versionBadge] = _managerHelpers.defaultConfig;
|
|
9
|
-
const editorBadge = exports.editorBadge = {
|
|
10
|
-
tags: "editor",
|
|
11
|
-
badge: {
|
|
12
|
-
text: "\u270F\uFE0F",
|
|
13
|
-
style: {
|
|
14
|
-
backgroundColor: "transparent",
|
|
15
|
-
borderColor: "transparent"
|
|
16
|
-
},
|
|
17
|
-
tooltip: "Editor"
|
|
18
|
-
},
|
|
19
|
-
display: {
|
|
20
|
-
sidebar: {
|
|
21
|
-
type: "story",
|
|
22
|
-
skipInherited: false
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
};
|
|
26
|
-
const newBadge = exports.newBadge = {
|
|
27
|
-
tags: "new",
|
|
28
|
-
badge: {
|
|
29
|
-
text: "\u{1F195}",
|
|
30
|
-
style: {
|
|
31
|
-
backgroundColor: "transparent",
|
|
32
|
-
borderColor: "transparent"
|
|
33
|
-
},
|
|
34
|
-
tooltip: "New"
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
const betaBadge = exports.betaBadge = {
|
|
38
|
-
tags: "beta",
|
|
39
|
-
badge: {
|
|
40
|
-
text: "\u{1F171}\uFE0F",
|
|
41
|
-
style: {
|
|
42
|
-
backgroundColor: "transparent",
|
|
43
|
-
borderColor: "transparent"
|
|
44
|
-
},
|
|
45
|
-
tooltip: "Beta"
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
|
-
const propsBadge = exports.propsBadge = {
|
|
49
|
-
tags: "props",
|
|
50
|
-
badge: {
|
|
51
|
-
text: "\u{1F527}",
|
|
52
|
-
style: {
|
|
53
|
-
backgroundColor: "transparent",
|
|
54
|
-
borderColor: "transparent"
|
|
55
|
-
},
|
|
56
|
-
tooltip: "Props"
|
|
57
|
-
}
|
|
58
|
-
};
|
|
59
|
-
const deprecatedBadge = exports.deprecatedBadge = {
|
|
60
|
-
tags: "deprecated",
|
|
61
|
-
badge: {
|
|
62
|
-
text: "\u{1FAA6}",
|
|
63
|
-
style: {
|
|
64
|
-
backgroundColor: "transparent",
|
|
65
|
-
borderColor: "transparent"
|
|
66
|
-
},
|
|
67
|
-
tooltip: "Deprecated"
|
|
68
|
-
}
|
|
69
|
-
};
|
|
70
|
-
const outdatedBadge = exports.outdatedBadge = {
|
|
71
|
-
tags: "outdated",
|
|
72
|
-
badge: {
|
|
73
|
-
text: "\u26A0\uFE0F",
|
|
74
|
-
style: {
|
|
75
|
-
backgroundColor: "transparent",
|
|
76
|
-
borderColor: "transparent"
|
|
77
|
-
},
|
|
78
|
-
tooltip: "Outdated"
|
|
79
|
-
}
|
|
80
|
-
};
|
|
81
|
-
const dangerBadge = exports.dangerBadge = {
|
|
82
|
-
tags: "danger",
|
|
83
|
-
badge: {
|
|
84
|
-
text: "\u{1F6A8}",
|
|
85
|
-
style: {
|
|
86
|
-
backgroundColor: "transparent",
|
|
87
|
-
borderColor: "transparent"
|
|
88
|
-
},
|
|
89
|
-
tooltip: "Dangerous"
|
|
90
|
-
}
|
|
91
|
-
};
|
|
92
|
-
const todoBadge = exports.todoBadge = {
|
|
93
|
-
tags: "todo",
|
|
94
|
-
badge: {
|
|
95
|
-
text: "\u{1F4CB}",
|
|
96
|
-
style: {
|
|
97
|
-
backgroundColor: "transparent",
|
|
98
|
-
borderColor: "transparent"
|
|
99
|
-
},
|
|
100
|
-
tooltip: "Todo"
|
|
101
|
-
}
|
|
102
|
-
};
|
|
103
|
-
const codeOnlyBadge = exports.codeOnlyBadge = {
|
|
104
|
-
tags: "code-only",
|
|
105
|
-
badge: {
|
|
106
|
-
text: "\u{1F4DD}",
|
|
107
|
-
style: {
|
|
108
|
-
backgroundColor: "transparent",
|
|
109
|
-
borderColor: "transparent"
|
|
110
|
-
},
|
|
111
|
-
tooltip: "Code Only"
|
|
112
|
-
}
|
|
113
|
-
};
|
|
114
|
-
const snapshotBadge = exports.snapshotBadge = {
|
|
115
|
-
tags: "snapshot",
|
|
116
|
-
badge: {
|
|
117
|
-
text: "\u{1F4F8}",
|
|
118
|
-
style: {
|
|
119
|
-
backgroundColor: "transparent",
|
|
120
|
-
borderColor: "transparent"
|
|
121
|
-
},
|
|
122
|
-
tooltip: "Snapshot Test"
|
|
123
|
-
},
|
|
124
|
-
display: {
|
|
125
|
-
sidebar: false,
|
|
126
|
-
toolbar: ["story"]
|
|
127
|
-
}
|
|
128
|
-
};
|
|
129
|
-
const unitBadge = exports.unitBadge = {
|
|
130
|
-
tags: "unit",
|
|
131
|
-
badge: {
|
|
132
|
-
text: "\u{1F9EA}",
|
|
133
|
-
style: {
|
|
134
|
-
backgroundColor: "transparent",
|
|
135
|
-
borderColor: "transparent"
|
|
136
|
-
},
|
|
137
|
-
tooltip: "Unit Test"
|
|
138
|
-
},
|
|
139
|
-
display: {
|
|
140
|
-
sidebar: false
|
|
141
|
-
}
|
|
142
|
-
};
|
|
143
|
-
const integrationBadge = exports.integrationBadge = {
|
|
144
|
-
tags: "integration",
|
|
145
|
-
badge: {
|
|
146
|
-
text: "\u{1F517}",
|
|
147
|
-
style: {
|
|
148
|
-
backgroundColor: "transparent",
|
|
149
|
-
borderColor: "transparent"
|
|
150
|
-
},
|
|
151
|
-
tooltip: "Integration Test"
|
|
152
|
-
},
|
|
153
|
-
display: {
|
|
154
|
-
sidebar: false
|
|
155
|
-
}
|
|
156
|
-
};
|
|
157
|
-
const keyboardBadge = exports.keyboardBadge = {
|
|
158
|
-
tags: "keyboard",
|
|
159
|
-
badge: {
|
|
160
|
-
text: "\u2328\uFE0F",
|
|
161
|
-
style: {
|
|
162
|
-
backgroundColor: "transparent",
|
|
163
|
-
borderColor: "transparent"
|
|
164
|
-
},
|
|
165
|
-
tooltip: "Keyboard Interaction"
|
|
166
|
-
}
|
|
167
|
-
};
|
|
168
|
-
const internalBadge = exports.internalBadge = {
|
|
169
|
-
tags: "internal",
|
|
170
|
-
badge: {
|
|
171
|
-
text: "\u{1F512}",
|
|
172
|
-
style: {
|
|
173
|
-
backgroundColor: "transparent",
|
|
174
|
-
borderColor: "transparent"
|
|
175
|
-
},
|
|
176
|
-
tooltip: "Internal"
|
|
177
|
-
}
|
|
178
|
-
};
|
|
179
|
-
const tagBadges = exports.tagBadges = [editorBadge, unitBadge, integrationBadge, keyboardBadge, newBadge, betaBadge, deprecatedBadge, outdatedBadge, dangerBadge, propsBadge, todoBadge, codeOnlyBadge, internalBadge, snapshotBadge, versionBadge];
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import type { Args, Meta as M, StoryObj as SBO } from '@storybook/react-vite';
|
|
2
|
-
import type { ExtendMeta, ExtendStoryObj } from '../types.js';
|
|
3
|
-
import type { TagNames } from './tag_badges.js';
|
|
4
|
-
export type Meta<TCmpOrArgs = Args> = ExtendMeta<TCmpOrArgs, M<TCmpOrArgs>, {
|
|
5
|
-
tag: TagNames;
|
|
6
|
-
}>;
|
|
7
|
-
export type StoryObj<TMetaOrCmpOrArgs = Args> = ExtendStoryObj<TMetaOrCmpOrArgs, SBO<TMetaOrCmpOrArgs>, {
|
|
8
|
-
tag: TagNames;
|
|
9
|
-
}>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { type DocsContextProps } from '@storybook/addon-docs/blocks';
|
|
2
|
-
import { type PropsWithChildren } from 'react';
|
|
3
|
-
import { type ThemeVars } from 'storybook/theming';
|
|
4
|
-
/**
|
|
5
|
-
* Creates a `DocsContainer` for `storybook` that works with `@storybook-community/storybook-dark-mode`.
|
|
6
|
-
*
|
|
7
|
-
* @see https://github.com/hipstersmoothie/storybook-dark-mode/issues/282
|
|
8
|
-
*
|
|
9
|
-
* @example
|
|
10
|
-
* ```ts
|
|
11
|
-
* // .storybook/preview.tsx
|
|
12
|
-
* const preview: Preview = {
|
|
13
|
-
* parameters: {
|
|
14
|
-
* docs: {
|
|
15
|
-
* container: createDarkModeDocsContainer()
|
|
16
|
-
* }
|
|
17
|
-
* }
|
|
18
|
-
* }
|
|
19
|
-
* ```
|
|
20
|
-
*/
|
|
21
|
-
export declare function createDarkModeDocsContainer(customThemes?: {
|
|
22
|
-
light?: ThemeVars | undefined;
|
|
23
|
-
dark?: ThemeVars | undefined;
|
|
24
|
-
} | undefined): (props: PropsWithChildren<{
|
|
25
|
-
context: DocsContextProps;
|
|
26
|
-
}>) => import("react").JSX.Element;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.createDarkModeDocsContainer = createDarkModeDocsContainer;
|
|
7
|
-
var _storybookDarkMode = require("@storybook-community/storybook-dark-mode");
|
|
8
|
-
var _blocks = require("@storybook/addon-docs/blocks");
|
|
9
|
-
var _react = require("react");
|
|
10
|
-
var _theming = require("storybook/theming");
|
|
11
|
-
function createDarkModeDocsContainer(customThemes) {
|
|
12
|
-
return function DarkModeDocsContainer(props) {
|
|
13
|
-
const [isDark, setDark] = (0, _react.useState)(true);
|
|
14
|
-
(0, _react.useEffect)(() => {
|
|
15
|
-
props.context.channel.on(_storybookDarkMode.DARK_MODE_EVENT_NAME, setDark);
|
|
16
|
-
return () => props.context.channel.removeListener(_storybookDarkMode.DARK_MODE_EVENT_NAME, setDark);
|
|
17
|
-
}, [props.context.channel]);
|
|
18
|
-
return /* @__PURE__ */React.createElement(_blocks.DocsContainer, {
|
|
19
|
-
...props,
|
|
20
|
-
theme: isDark ? customThemes?.dark ?? _theming.themes.dark : customThemes?.light ?? _theming.themes.light
|
|
21
|
-
}, props.children);
|
|
22
|
-
};
|
|
23
|
-
}
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import type { CSSProperties } from '@just-web/css';
|
|
2
|
-
import type { ThemeVars } from 'storybook/theming';
|
|
3
|
-
/**
|
|
4
|
-
* Configuration parameters for `@storybook-community/storybook-dark-mode`.
|
|
5
|
-
*/
|
|
6
|
-
export interface DarkModeParam {
|
|
7
|
-
/** The current theme ('dark' or 'light') */
|
|
8
|
-
current?: 'dark' | 'light' | undefined;
|
|
9
|
-
/**
|
|
10
|
-
* CSS class(es) to apply in dark mode.
|
|
11
|
-
*/
|
|
12
|
-
darkClass?: string | string[] | undefined;
|
|
13
|
-
/**
|
|
14
|
-
* CSS style(s) to apply in dark mode.
|
|
15
|
-
*
|
|
16
|
-
* This only works when using `withStoryRoot`.
|
|
17
|
-
*/
|
|
18
|
-
darkStyle?: CSSProperties | undefined;
|
|
19
|
-
/** CSS class(es) to apply in light mode */
|
|
20
|
-
lightClass?: string | string[] | undefined;
|
|
21
|
-
/**
|
|
22
|
-
* CSS style(s) to apply in light mode.
|
|
23
|
-
*
|
|
24
|
-
* This only works when using `withStoryRoot`.
|
|
25
|
-
*/
|
|
26
|
-
lightStyle?: CSSProperties | undefined;
|
|
27
|
-
/** Dark theme variables */
|
|
28
|
-
dark?: ThemeVars;
|
|
29
|
-
/** Light theme variables */
|
|
30
|
-
light?: ThemeVars;
|
|
31
|
-
/** Element to apply theme classes to ('html' or 'body') */
|
|
32
|
-
classTarget?: 'html' | 'body' | undefined;
|
|
33
|
-
/** Whether to apply theme styles to preview iframe */
|
|
34
|
-
stylePreview?: boolean | undefined;
|
|
35
|
-
}
|
|
36
|
-
/**
|
|
37
|
-
* Defines `@storybook-community/storybook-dark-mode` parameters for Storybook stories.
|
|
38
|
-
*
|
|
39
|
-
* @see https://storybook.js.org/addons/@storybook/addon-themes#dark-mode
|
|
40
|
-
* @returns An object containing the dark mode parameter configuration
|
|
41
|
-
*
|
|
42
|
-
* @example
|
|
43
|
-
* ```ts
|
|
44
|
-
* // ./storybook/preview.tsx
|
|
45
|
-
*
|
|
46
|
-
* export const preview = {
|
|
47
|
-
* parameters: {
|
|
48
|
-
* ...defineDarkModeParam({ darkClass: 'dark' })
|
|
49
|
-
* }
|
|
50
|
-
* }
|
|
51
|
-
*/
|
|
52
|
-
export declare function defineDarkModeParam(darkMode: DarkModeParam): {
|
|
53
|
-
darkMode: DarkModeParam;
|
|
54
|
-
};
|