@ponchia/ui 0.9.0 → 0.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +107 -4
- package/MIGRATIONS.json +127 -18
- package/README.md +17 -9
- package/behaviors/index.d.ts +0 -2
- package/behaviors/index.d.ts.map +1 -1
- package/behaviors/index.js +0 -2
- package/behaviors/popover.js +4 -4
- package/classes/classes.json +53 -9
- package/classes/index.d.ts +20 -3
- package/classes/index.js +33 -3
- package/classes/vscode.css-custom-data.json +10 -10
- package/css/annotations.css +2 -2
- package/css/app.css +55 -31
- package/css/base.css +10 -14
- package/css/command.css +4 -4
- package/css/content.css +23 -21
- package/css/disclosure.css +17 -17
- package/css/discussion.css +150 -0
- package/css/feedback.css +15 -15
- package/css/figure.css +6 -4
- package/css/forms.css +8 -7
- package/css/generated.css +19 -12
- package/css/legend.css +13 -5
- package/css/navigation.css +3 -3
- package/css/overlay.css +13 -29
- package/css/primitives.css +48 -28
- package/css/report.css +91 -53
- package/css/sources.css +1 -1
- package/css/state.css +95 -6
- package/css/table.css +3 -3
- package/css/tokens.css +10 -10
- package/css/workbench.css +21 -9
- package/dist/bronto.css +1 -1
- package/dist/css/analytical.css +1 -1
- package/dist/css/annotations.css +1 -1
- package/dist/css/app.css +1 -1
- package/dist/css/base.css +1 -1
- package/dist/css/command.css +1 -1
- package/dist/css/content.css +1 -1
- package/dist/css/disclosure.css +1 -1
- package/dist/css/discussion.css +1 -0
- package/dist/css/feedback.css +1 -1
- package/dist/css/figure.css +1 -1
- package/dist/css/forms.css +1 -1
- package/dist/css/generated.css +1 -1
- package/dist/css/legend.css +1 -1
- package/dist/css/navigation.css +1 -1
- package/dist/css/overlay.css +1 -1
- package/dist/css/primitives.css +1 -1
- package/dist/css/report-kit.css +1 -1
- package/dist/css/report.css +1 -1
- package/dist/css/sources.css +1 -1
- package/dist/css/state.css +1 -1
- package/dist/css/table.css +1 -1
- package/dist/css/tokens.css +1 -1
- package/dist/css/workbench.css +1 -1
- package/docs/adr/0004-prune-unused-adapters.md +5 -1
- package/docs/adr/0005-productive-tools-and-editorial-reports.md +58 -0
- package/docs/adr/0006-trusted-publishing.md +92 -0
- package/docs/architecture.md +16 -23
- package/docs/command.md +1 -2
- package/docs/compositions.md +131 -0
- package/docs/discussion.md +64 -0
- package/docs/figure.md +10 -1
- package/docs/frontier-primitives.md +1 -2
- package/docs/migrations/0.10-to-0.11.md +61 -0
- package/docs/migrations/0.9-to-0.10.md +47 -0
- package/docs/package-contract.md +16 -13
- package/docs/reference.md +47 -18
- package/docs/reporting.md +15 -9
- package/docs/stability.md +20 -55
- package/docs/state.md +47 -0
- package/docs/usage.md +18 -30
- package/llms.txt +7 -18
- package/package.json +18 -54
- package/tokens/figma.variables.json +20 -20
- package/tokens/index.js +10 -10
- package/tokens/index.json +20 -20
- package/tokens/resolved.json +10 -10
- package/tokens/tokens.dtcg.json +20 -20
- package/behaviors/modal.d.ts +0 -45
- package/behaviors/modal.d.ts.map +0 -1
- package/behaviors/modal.js +0 -373
- package/qwik/index.d.ts +0 -48
- package/qwik/index.d.ts.map +0 -1
- package/qwik/index.js +0 -227
- package/react/index.d.ts +0 -45
- package/react/index.d.ts.map +0 -1
- package/react/index.js +0 -165
- package/solid/index.d.ts +0 -75
- package/solid/index.d.ts.map +0 -1
- package/solid/index.js +0 -172
- package/svelte/index.d.ts +0 -114
- package/svelte/index.d.ts.map +0 -1
- package/svelte/index.js +0 -197
- package/vue/index.d.ts +0 -116
- package/vue/index.d.ts.map +0 -1
- package/vue/index.js +0 -266
package/svelte/index.js
DELETED
|
@@ -1,197 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @ponchia/ui/svelte — thin Svelte actions over @ponchia/ui/behaviors.
|
|
3
|
-
*
|
|
4
|
-
* The CSS is the framework; these are optional lifecycle adapters that run the
|
|
5
|
-
* SSR-safe vanilla behavior initializers when a Svelte action mounts and clean
|
|
6
|
-
* them up when the action updates or is destroyed. They do not define markup,
|
|
7
|
-
* own state, or depend on Svelte at runtime.
|
|
8
|
-
*
|
|
9
|
-
* <script>
|
|
10
|
-
* import { themeToggle } from '@ponchia/ui/svelte';
|
|
11
|
-
* </script>
|
|
12
|
-
*
|
|
13
|
-
* <main use:themeToggle>
|
|
14
|
-
* <button data-bronto-theme-toggle>Toggle theme</button>
|
|
15
|
-
* </main>
|
|
16
|
-
*
|
|
17
|
-
* @deprecated Import the framework-agnostic behavior initializers directly.
|
|
18
|
-
* This adapter remains compatible in 0.7 and is scheduled for removal no
|
|
19
|
-
* earlier than 0.8 because no real consumer adopted it.
|
|
20
|
-
*
|
|
21
|
-
* @typedef {import('../behaviors/index.js').Cleanup} Cleanup
|
|
22
|
-
* @typedef {import('../behaviors/index.js').DelegateOpts} DelegateOpts
|
|
23
|
-
* @typedef {import('../behaviors/index.js').ThemeStorageOpts} ThemeStorageOpts
|
|
24
|
-
* @typedef {import('../behaviors/index.js').ToastOpts} ToastOpts
|
|
25
|
-
*
|
|
26
|
-
* @typedef {Document | Element | null | undefined} BrontoActionRoot
|
|
27
|
-
*
|
|
28
|
-
* @typedef {Omit<DelegateOpts, 'root'> & { root?: BrontoActionRoot }} BrontoActionOpts
|
|
29
|
-
*
|
|
30
|
-
* @typedef {Omit<ThemeStorageOpts & DelegateOpts, 'root'> & { root?: BrontoActionRoot }} BrontoThemeActionOpts
|
|
31
|
-
*
|
|
32
|
-
* @typedef {{ init: (opts?: DelegateOpts) => Cleanup | void, opts?: BrontoActionOpts | null | undefined }} BrontoBehaviorParams
|
|
33
|
-
*
|
|
34
|
-
* @typedef {(node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn} BrontoAction
|
|
35
|
-
*
|
|
36
|
-
* @typedef {(node: Element, opts?: BrontoThemeActionOpts | null | undefined) => SvelteActionReturn} BrontoThemeAction
|
|
37
|
-
*
|
|
38
|
-
* @typedef {{ update?: (next?: unknown) => void, destroy: () => void }} SvelteActionReturn
|
|
39
|
-
*/
|
|
40
|
-
import {
|
|
41
|
-
applyStoredTheme,
|
|
42
|
-
initThemeToggle,
|
|
43
|
-
dismissible as initDismissible,
|
|
44
|
-
initDisabledGuard,
|
|
45
|
-
initDisclosure,
|
|
46
|
-
initMenu,
|
|
47
|
-
initFormValidation,
|
|
48
|
-
initCombobox,
|
|
49
|
-
initPopover,
|
|
50
|
-
initTableSort,
|
|
51
|
-
initTabs,
|
|
52
|
-
initDialog,
|
|
53
|
-
initModal,
|
|
54
|
-
initCarousel,
|
|
55
|
-
initDotGlyph,
|
|
56
|
-
initLegend,
|
|
57
|
-
initConnectors,
|
|
58
|
-
initSpotlight,
|
|
59
|
-
initCrosshair,
|
|
60
|
-
initCommand,
|
|
61
|
-
initSources,
|
|
62
|
-
initSplitter,
|
|
63
|
-
toast,
|
|
64
|
-
} from '../behaviors/index.js';
|
|
65
|
-
|
|
66
|
-
function stop(cleanup) {
|
|
67
|
-
if (typeof cleanup === 'function') cleanup();
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
function resolveOpts(node, opts) {
|
|
71
|
-
if (!opts || typeof opts !== 'object') return { root: node };
|
|
72
|
-
if (!('root' in opts)) return { ...opts, root: node };
|
|
73
|
-
return { ...opts, root: opts.root || null };
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
function run(node, init, opts) {
|
|
77
|
-
if (typeof init !== 'function') return () => {};
|
|
78
|
-
const cleanup = init(resolveOpts(node, opts));
|
|
79
|
-
return typeof cleanup === 'function' ? cleanup : () => {};
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
/**
|
|
83
|
-
* Create a Svelte action from any Bronto delegated behavior initializer.
|
|
84
|
-
*
|
|
85
|
-
* @param {(opts?: DelegateOpts) => Cleanup | void} init
|
|
86
|
-
* @returns {BrontoAction}
|
|
87
|
-
*/
|
|
88
|
-
export function createBrontoAction(init) {
|
|
89
|
-
return (node, opts) => {
|
|
90
|
-
let cleanup = run(node, init, opts);
|
|
91
|
-
return {
|
|
92
|
-
update(next) {
|
|
93
|
-
stop(cleanup);
|
|
94
|
-
cleanup = run(node, init, next);
|
|
95
|
-
},
|
|
96
|
-
destroy() {
|
|
97
|
-
stop(cleanup);
|
|
98
|
-
},
|
|
99
|
-
};
|
|
100
|
-
};
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
/**
|
|
104
|
-
* Generic escape hatch for custom behavior initializers.
|
|
105
|
-
*
|
|
106
|
-
* @param {Element} node
|
|
107
|
-
* @param {BrontoBehaviorParams | null | undefined} params
|
|
108
|
-
* @returns {SvelteActionReturn}
|
|
109
|
-
*/
|
|
110
|
-
export function brontoBehavior(node, params) {
|
|
111
|
-
let cleanup = run(node, params?.init, params?.opts);
|
|
112
|
-
return {
|
|
113
|
-
update(next) {
|
|
114
|
-
stop(cleanup);
|
|
115
|
-
cleanup = run(node, next?.init, next?.opts);
|
|
116
|
-
},
|
|
117
|
-
destroy() {
|
|
118
|
-
stop(cleanup);
|
|
119
|
-
},
|
|
120
|
-
};
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
export const useBrontoBehavior = brontoBehavior;
|
|
124
|
-
|
|
125
|
-
/** @type {BrontoThemeAction} */
|
|
126
|
-
export const themeToggle = createBrontoAction(initThemeToggle);
|
|
127
|
-
/** @type {BrontoAction} */
|
|
128
|
-
export const dismissible = createBrontoAction(initDismissible);
|
|
129
|
-
/** @type {BrontoAction} */
|
|
130
|
-
export const disabledGuard = createBrontoAction(initDisabledGuard);
|
|
131
|
-
/** @type {BrontoAction} */
|
|
132
|
-
export const disclosure = createBrontoAction(initDisclosure);
|
|
133
|
-
/** @type {BrontoAction} */
|
|
134
|
-
export const menu = createBrontoAction(initMenu);
|
|
135
|
-
/** @type {BrontoAction} */
|
|
136
|
-
export const formValidation = createBrontoAction(initFormValidation);
|
|
137
|
-
/** @type {BrontoAction} */
|
|
138
|
-
export const combobox = createBrontoAction(initCombobox);
|
|
139
|
-
/** @type {BrontoAction} */
|
|
140
|
-
export const popover = createBrontoAction(initPopover);
|
|
141
|
-
/** @type {BrontoAction} */
|
|
142
|
-
export const tableSort = createBrontoAction(initTableSort);
|
|
143
|
-
/** @type {BrontoAction} */
|
|
144
|
-
export const tabs = createBrontoAction(initTabs);
|
|
145
|
-
/** @type {BrontoAction} */
|
|
146
|
-
export const dialog = createBrontoAction(initDialog);
|
|
147
|
-
/** @type {BrontoAction} */
|
|
148
|
-
export const modal = createBrontoAction(initModal);
|
|
149
|
-
/** @type {BrontoAction} */
|
|
150
|
-
export const carousel = createBrontoAction(initCarousel);
|
|
151
|
-
/** @type {BrontoAction} */
|
|
152
|
-
export const dotGlyph = createBrontoAction(initDotGlyph);
|
|
153
|
-
/** @type {BrontoAction} */
|
|
154
|
-
export const legend = createBrontoAction(initLegend);
|
|
155
|
-
/** @type {BrontoAction} */
|
|
156
|
-
export const connectors = createBrontoAction(initConnectors);
|
|
157
|
-
/** @type {BrontoAction} */
|
|
158
|
-
export const spotlight = createBrontoAction(initSpotlight);
|
|
159
|
-
/** @type {BrontoAction} */
|
|
160
|
-
export const crosshair = createBrontoAction(initCrosshair);
|
|
161
|
-
/** @type {BrontoAction} */
|
|
162
|
-
export const command = createBrontoAction(initCommand);
|
|
163
|
-
/** @type {BrontoAction} */
|
|
164
|
-
export const sources = createBrontoAction(initSources);
|
|
165
|
-
/** @type {BrontoAction} */
|
|
166
|
-
export const splitter = createBrontoAction(initSplitter);
|
|
167
|
-
|
|
168
|
-
// Hook-style aliases keep this action surface parallel with React/Solid/Qwik.
|
|
169
|
-
/** @type {BrontoThemeAction} */
|
|
170
|
-
export const useThemeToggle = themeToggle;
|
|
171
|
-
export const useDismissible = dismissible;
|
|
172
|
-
export const useDisabledGuard = disabledGuard;
|
|
173
|
-
export const useDisclosure = disclosure;
|
|
174
|
-
export const useMenu = menu;
|
|
175
|
-
export const useFormValidation = formValidation;
|
|
176
|
-
export const useCombobox = combobox;
|
|
177
|
-
export const usePopover = popover;
|
|
178
|
-
export const useTableSort = tableSort;
|
|
179
|
-
export const useTabs = tabs;
|
|
180
|
-
export const useDialog = dialog;
|
|
181
|
-
export const useModal = modal;
|
|
182
|
-
export const useCarousel = carousel;
|
|
183
|
-
export const useDotGlyph = dotGlyph;
|
|
184
|
-
export const useLegend = legend;
|
|
185
|
-
export const useConnectors = connectors;
|
|
186
|
-
export const useSpotlight = spotlight;
|
|
187
|
-
export const useCrosshair = crosshair;
|
|
188
|
-
export const useCommand = command;
|
|
189
|
-
export const useSources = sources;
|
|
190
|
-
export const useSplitter = splitter;
|
|
191
|
-
|
|
192
|
-
/** The `toast()` imperative (no lifecycle of its own).
|
|
193
|
-
* @returns {(message: string, opts?: ToastOpts) => Cleanup} */
|
|
194
|
-
export const useToast = () => toast;
|
|
195
|
-
|
|
196
|
-
export { applyStoredTheme, toast };
|
|
197
|
-
export { cls, ui, cx } from '../classes/index.js';
|
package/vue/index.d.ts
DELETED
|
@@ -1,116 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Create a Vue directive object from any Bronto delegated behavior initializer.
|
|
3
|
-
*
|
|
4
|
-
* @param {(opts?: DelegateOpts) => Cleanup | void} init
|
|
5
|
-
* @returns {BrontoDirective}
|
|
6
|
-
*/
|
|
7
|
-
export function createBrontoDirective(init: (opts?: DelegateOpts) => Cleanup | void): BrontoDirective;
|
|
8
|
-
/** @type {BrontoThemeDirective} */
|
|
9
|
-
export const vThemeToggle: BrontoThemeDirective;
|
|
10
|
-
/** @type {BrontoDirective} */
|
|
11
|
-
export const vDismissible: BrontoDirective;
|
|
12
|
-
/** @type {BrontoDirective} */
|
|
13
|
-
export const vDisabledGuard: BrontoDirective;
|
|
14
|
-
/** @type {BrontoDirective} */
|
|
15
|
-
export const vDisclosure: BrontoDirective;
|
|
16
|
-
/** @type {BrontoDirective} */
|
|
17
|
-
export const vMenu: BrontoDirective;
|
|
18
|
-
/** @type {BrontoDirective} */
|
|
19
|
-
export const vFormValidation: BrontoDirective;
|
|
20
|
-
/** @type {BrontoDirective} */
|
|
21
|
-
export const vCombobox: BrontoDirective;
|
|
22
|
-
/** @type {BrontoDirective} */
|
|
23
|
-
export const vPopover: BrontoDirective;
|
|
24
|
-
/** @type {BrontoDirective} */
|
|
25
|
-
export const vTableSort: BrontoDirective;
|
|
26
|
-
/** @type {BrontoDirective} */
|
|
27
|
-
export const vTabs: BrontoDirective;
|
|
28
|
-
/** @type {BrontoDirective} */
|
|
29
|
-
export const vDialog: BrontoDirective;
|
|
30
|
-
/** @type {BrontoDirective} */
|
|
31
|
-
export const vModal: BrontoDirective;
|
|
32
|
-
/** @type {BrontoDirective} */
|
|
33
|
-
export const vCarousel: BrontoDirective;
|
|
34
|
-
/** @type {BrontoDirective} */
|
|
35
|
-
export const vDotGlyph: BrontoDirective;
|
|
36
|
-
/** @type {BrontoDirective} */
|
|
37
|
-
export const vLegend: BrontoDirective;
|
|
38
|
-
/** @type {BrontoDirective} */
|
|
39
|
-
export const vConnectors: BrontoDirective;
|
|
40
|
-
/** @type {BrontoDirective} */
|
|
41
|
-
export const vSpotlight: BrontoDirective;
|
|
42
|
-
/** @type {BrontoDirective} */
|
|
43
|
-
export const vCrosshair: BrontoDirective;
|
|
44
|
-
/** @type {BrontoDirective} */
|
|
45
|
-
export const vCommand: BrontoDirective;
|
|
46
|
-
/** @type {BrontoDirective} */
|
|
47
|
-
export const vSources: BrontoDirective;
|
|
48
|
-
/** @type {BrontoDirective} */
|
|
49
|
-
export const vSplitter: BrontoDirective;
|
|
50
|
-
export const directives: Readonly<{
|
|
51
|
-
themeToggle: BrontoThemeDirective;
|
|
52
|
-
dismissible: BrontoDirective;
|
|
53
|
-
disabledGuard: BrontoDirective;
|
|
54
|
-
disclosure: BrontoDirective;
|
|
55
|
-
menu: BrontoDirective;
|
|
56
|
-
formValidation: BrontoDirective;
|
|
57
|
-
combobox: BrontoDirective;
|
|
58
|
-
popover: BrontoDirective;
|
|
59
|
-
tableSort: BrontoDirective;
|
|
60
|
-
tabs: BrontoDirective;
|
|
61
|
-
dialog: BrontoDirective;
|
|
62
|
-
modal: BrontoDirective;
|
|
63
|
-
carousel: BrontoDirective;
|
|
64
|
-
dotGlyph: BrontoDirective;
|
|
65
|
-
legend: BrontoDirective;
|
|
66
|
-
connectors: BrontoDirective;
|
|
67
|
-
spotlight: BrontoDirective;
|
|
68
|
-
crosshair: BrontoDirective;
|
|
69
|
-
command: BrontoDirective;
|
|
70
|
-
sources: BrontoDirective;
|
|
71
|
-
splitter: BrontoDirective;
|
|
72
|
-
}>;
|
|
73
|
-
/** @type {BrontoVuePlugin} */
|
|
74
|
-
export const brontoVue: BrontoVuePlugin;
|
|
75
|
-
export default brontoVue;
|
|
76
|
-
export function useToast(): (message: string, opts?: ToastOpts) => Cleanup;
|
|
77
|
-
export type Cleanup = import("../behaviors/index.js").Cleanup;
|
|
78
|
-
export type DelegateOpts = import("../behaviors/index.js").DelegateOpts;
|
|
79
|
-
export type ThemeStorageOpts = import("../behaviors/index.js").ThemeStorageOpts;
|
|
80
|
-
export type ToastOpts = import("../behaviors/index.js").ToastOpts;
|
|
81
|
-
export type BrontoDirectiveRoot = Document | Element | null | undefined;
|
|
82
|
-
export type BrontoDirectiveOpts = Omit<DelegateOpts, "root"> & {
|
|
83
|
-
root?: BrontoDirectiveRoot;
|
|
84
|
-
};
|
|
85
|
-
export type BrontoThemeDirectiveOpts = Omit<ThemeStorageOpts & DelegateOpts, "root"> & {
|
|
86
|
-
root?: BrontoDirectiveRoot;
|
|
87
|
-
};
|
|
88
|
-
export type BrontoDirectiveBinding = {
|
|
89
|
-
value?: BrontoDirectiveOpts | null | undefined;
|
|
90
|
-
oldValue?: BrontoDirectiveOpts | null | undefined;
|
|
91
|
-
};
|
|
92
|
-
export type BrontoThemeDirectiveBinding = {
|
|
93
|
-
value?: BrontoThemeDirectiveOpts | null | undefined;
|
|
94
|
-
oldValue?: BrontoThemeDirectiveOpts | null | undefined;
|
|
95
|
-
};
|
|
96
|
-
export type BrontoDirective = {
|
|
97
|
-
mounted: (el: Element, binding?: BrontoDirectiveBinding) => void;
|
|
98
|
-
updated: (el: Element, binding?: BrontoDirectiveBinding) => void;
|
|
99
|
-
beforeUnmount: (el: Element) => void;
|
|
100
|
-
};
|
|
101
|
-
export type BrontoThemeDirective = {
|
|
102
|
-
mounted: (el: Element, binding?: BrontoThemeDirectiveBinding) => void;
|
|
103
|
-
updated: (el: Element, binding?: BrontoThemeDirectiveBinding) => void;
|
|
104
|
-
beforeUnmount: (el: Element) => void;
|
|
105
|
-
};
|
|
106
|
-
export type BrontoVueApp = {
|
|
107
|
-
directive: (name: string, directive: BrontoDirective | BrontoThemeDirective) => unknown;
|
|
108
|
-
};
|
|
109
|
-
export type BrontoVuePlugin = {
|
|
110
|
-
install: (app: BrontoVueApp) => void;
|
|
111
|
-
};
|
|
112
|
-
import { applyStoredTheme } from '../behaviors/index.js';
|
|
113
|
-
import { toast } from '../behaviors/index.js';
|
|
114
|
-
export { applyStoredTheme, toast };
|
|
115
|
-
export { cls, ui, cx } from "../classes/index.js";
|
|
116
|
-
//# sourceMappingURL=index.d.ts.map
|
package/vue/index.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.js"],"names":[],"mappings":"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"}
|
package/vue/index.js
DELETED
|
@@ -1,266 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @ponchia/ui/vue — thin Vue directives over @ponchia/ui/behaviors.
|
|
3
|
-
*
|
|
4
|
-
* @deprecated Import the framework-agnostic behavior initializers directly.
|
|
5
|
-
* This adapter remains compatible in 0.7 and is scheduled for removal no
|
|
6
|
-
* earlier than 0.8 because no real consumer adopted it.
|
|
7
|
-
*
|
|
8
|
-
* The CSS is the framework; these are optional lifecycle adapters that run the
|
|
9
|
-
* vanilla behavior initializers from Vue directive hooks. They are plain
|
|
10
|
-
* directive objects, so this module has no runtime dependency on Vue.
|
|
11
|
-
*
|
|
12
|
-
* import { brontoVue } from '@ponchia/ui/vue';
|
|
13
|
-
* app.use(brontoVue);
|
|
14
|
-
*
|
|
15
|
-
* <main v-bronto-theme-toggle>
|
|
16
|
-
* <button data-bronto-theme-toggle>Toggle theme</button>
|
|
17
|
-
* </main>
|
|
18
|
-
*
|
|
19
|
-
* @typedef {import('../behaviors/index.js').Cleanup} Cleanup
|
|
20
|
-
* @typedef {import('../behaviors/index.js').DelegateOpts} DelegateOpts
|
|
21
|
-
* @typedef {import('../behaviors/index.js').ThemeStorageOpts} ThemeStorageOpts
|
|
22
|
-
* @typedef {import('../behaviors/index.js').ToastOpts} ToastOpts
|
|
23
|
-
*
|
|
24
|
-
* @typedef {Document | Element | null | undefined} BrontoDirectiveRoot
|
|
25
|
-
*
|
|
26
|
-
* @typedef {Omit<DelegateOpts, 'root'> & { root?: BrontoDirectiveRoot }} BrontoDirectiveOpts
|
|
27
|
-
*
|
|
28
|
-
* @typedef {Omit<ThemeStorageOpts & DelegateOpts, 'root'> & { root?: BrontoDirectiveRoot }} BrontoThemeDirectiveOpts
|
|
29
|
-
*
|
|
30
|
-
* @typedef {{ value?: BrontoDirectiveOpts | null | undefined, oldValue?: BrontoDirectiveOpts | null | undefined }} BrontoDirectiveBinding
|
|
31
|
-
*
|
|
32
|
-
* @typedef {{ value?: BrontoThemeDirectiveOpts | null | undefined, oldValue?: BrontoThemeDirectiveOpts | null | undefined }} BrontoThemeDirectiveBinding
|
|
33
|
-
*
|
|
34
|
-
* @typedef {{ mounted: (el: Element, binding?: BrontoDirectiveBinding) => void, updated: (el: Element, binding?: BrontoDirectiveBinding) => void, beforeUnmount: (el: Element) => void }} BrontoDirective
|
|
35
|
-
*
|
|
36
|
-
* @typedef {{ mounted: (el: Element, binding?: BrontoThemeDirectiveBinding) => void, updated: (el: Element, binding?: BrontoThemeDirectiveBinding) => void, beforeUnmount: (el: Element) => void }} BrontoThemeDirective
|
|
37
|
-
*
|
|
38
|
-
* @typedef {{ directive: (name: string, directive: BrontoDirective | BrontoThemeDirective) => unknown }} BrontoVueApp
|
|
39
|
-
*
|
|
40
|
-
* @typedef {{ install: (app: BrontoVueApp) => void }} BrontoVuePlugin
|
|
41
|
-
*/
|
|
42
|
-
import {
|
|
43
|
-
applyStoredTheme,
|
|
44
|
-
initThemeToggle,
|
|
45
|
-
dismissible as initDismissible,
|
|
46
|
-
initDisabledGuard,
|
|
47
|
-
initDisclosure,
|
|
48
|
-
initMenu,
|
|
49
|
-
initFormValidation,
|
|
50
|
-
initCombobox,
|
|
51
|
-
initPopover,
|
|
52
|
-
initTableSort,
|
|
53
|
-
initTabs,
|
|
54
|
-
initDialog,
|
|
55
|
-
initModal,
|
|
56
|
-
initCarousel,
|
|
57
|
-
initDotGlyph,
|
|
58
|
-
initLegend,
|
|
59
|
-
initConnectors,
|
|
60
|
-
initSpotlight,
|
|
61
|
-
initCrosshair,
|
|
62
|
-
initCommand,
|
|
63
|
-
initSources,
|
|
64
|
-
initSplitter,
|
|
65
|
-
toast,
|
|
66
|
-
} from '../behaviors/index.js';
|
|
67
|
-
|
|
68
|
-
const cleanups = new WeakMap();
|
|
69
|
-
const optionSignatures = new WeakMap();
|
|
70
|
-
|
|
71
|
-
function cleanupMap(el) {
|
|
72
|
-
let map = cleanups.get(el);
|
|
73
|
-
if (!map) {
|
|
74
|
-
map = new Map();
|
|
75
|
-
cleanups.set(el, map);
|
|
76
|
-
}
|
|
77
|
-
return map;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
function optionSignatureMap(el) {
|
|
81
|
-
let map = optionSignatures.get(el);
|
|
82
|
-
if (!map) {
|
|
83
|
-
map = new Map();
|
|
84
|
-
optionSignatures.set(el, map);
|
|
85
|
-
}
|
|
86
|
-
return map;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
function optionSignature(opts) {
|
|
90
|
-
return Object.entries(opts).sort(([a], [b]) => a.localeCompare(b));
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
function sameOptionSignature(a, b) {
|
|
94
|
-
if (a === b) return true;
|
|
95
|
-
if (!a || !b || a.length !== b.length) return false;
|
|
96
|
-
return a.every(([key, value], index) => {
|
|
97
|
-
const [otherKey, otherValue] = b[index];
|
|
98
|
-
return key === otherKey && Object.is(value, otherValue);
|
|
99
|
-
});
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
function stop(el, key) {
|
|
103
|
-
const map = cleanups.get(el);
|
|
104
|
-
const cleanup = map?.get(key);
|
|
105
|
-
if (typeof cleanup === 'function') cleanup();
|
|
106
|
-
map?.delete(key);
|
|
107
|
-
if (map?.size === 0) cleanups.delete(el);
|
|
108
|
-
const signatures = optionSignatures.get(el);
|
|
109
|
-
signatures?.delete(key);
|
|
110
|
-
if (signatures?.size === 0) optionSignatures.delete(el);
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
function resolveOpts(el, opts) {
|
|
114
|
-
if (!opts || typeof opts !== 'object') return { root: el };
|
|
115
|
-
if (!('root' in opts)) return { ...opts, root: el };
|
|
116
|
-
return { ...opts, root: opts.root || null };
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
function start(el, key, init, opts) {
|
|
120
|
-
const resolved = resolveOpts(el, opts);
|
|
121
|
-
startResolved(el, key, init, resolved, optionSignature(resolved));
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
function startResolved(el, key, init, resolved, signature) {
|
|
125
|
-
stop(el, key);
|
|
126
|
-
const cleanup = init(resolved);
|
|
127
|
-
if (typeof cleanup === 'function') cleanupMap(el).set(key, cleanup);
|
|
128
|
-
optionSignatureMap(el).set(key, signature);
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
/**
|
|
132
|
-
* Create a Vue directive object from any Bronto delegated behavior initializer.
|
|
133
|
-
*
|
|
134
|
-
* @param {(opts?: DelegateOpts) => Cleanup | void} init
|
|
135
|
-
* @returns {BrontoDirective}
|
|
136
|
-
*/
|
|
137
|
-
export function createBrontoDirective(init) {
|
|
138
|
-
const key = Symbol('bronto-vue-directive');
|
|
139
|
-
return {
|
|
140
|
-
mounted(el, binding) {
|
|
141
|
-
start(el, key, init, binding?.value);
|
|
142
|
-
},
|
|
143
|
-
updated(el, binding) {
|
|
144
|
-
const resolved = resolveOpts(el, binding?.value);
|
|
145
|
-
const signature = optionSignature(resolved);
|
|
146
|
-
if (sameOptionSignature(optionSignatures.get(el)?.get(key), signature)) return;
|
|
147
|
-
startResolved(el, key, init, resolved, signature);
|
|
148
|
-
},
|
|
149
|
-
beforeUnmount(el) {
|
|
150
|
-
stop(el, key);
|
|
151
|
-
},
|
|
152
|
-
};
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
/** @type {BrontoThemeDirective} */
|
|
156
|
-
export const vThemeToggle = createBrontoDirective(initThemeToggle);
|
|
157
|
-
/** @type {BrontoDirective} */
|
|
158
|
-
export const vDismissible = createBrontoDirective(initDismissible);
|
|
159
|
-
/** @type {BrontoDirective} */
|
|
160
|
-
export const vDisabledGuard = createBrontoDirective(initDisabledGuard);
|
|
161
|
-
/** @type {BrontoDirective} */
|
|
162
|
-
export const vDisclosure = createBrontoDirective(initDisclosure);
|
|
163
|
-
/** @type {BrontoDirective} */
|
|
164
|
-
export const vMenu = createBrontoDirective(initMenu);
|
|
165
|
-
/** @type {BrontoDirective} */
|
|
166
|
-
export const vFormValidation = createBrontoDirective(initFormValidation);
|
|
167
|
-
/** @type {BrontoDirective} */
|
|
168
|
-
export const vCombobox = createBrontoDirective(initCombobox);
|
|
169
|
-
/** @type {BrontoDirective} */
|
|
170
|
-
export const vPopover = createBrontoDirective(initPopover);
|
|
171
|
-
/** @type {BrontoDirective} */
|
|
172
|
-
export const vTableSort = createBrontoDirective(initTableSort);
|
|
173
|
-
/** @type {BrontoDirective} */
|
|
174
|
-
export const vTabs = createBrontoDirective(initTabs);
|
|
175
|
-
/** @type {BrontoDirective} */
|
|
176
|
-
export const vDialog = createBrontoDirective(initDialog);
|
|
177
|
-
/** @type {BrontoDirective} */
|
|
178
|
-
export const vModal = createBrontoDirective(initModal);
|
|
179
|
-
/** @type {BrontoDirective} */
|
|
180
|
-
export const vCarousel = createBrontoDirective(initCarousel);
|
|
181
|
-
/** @type {BrontoDirective} */
|
|
182
|
-
export const vDotGlyph = createBrontoDirective(initDotGlyph);
|
|
183
|
-
/** @type {BrontoDirective} */
|
|
184
|
-
export const vLegend = createBrontoDirective(initLegend);
|
|
185
|
-
/** @type {BrontoDirective} */
|
|
186
|
-
export const vConnectors = createBrontoDirective(initConnectors);
|
|
187
|
-
/** @type {BrontoDirective} */
|
|
188
|
-
export const vSpotlight = createBrontoDirective(initSpotlight);
|
|
189
|
-
/** @type {BrontoDirective} */
|
|
190
|
-
export const vCrosshair = createBrontoDirective(initCrosshair);
|
|
191
|
-
/** @type {BrontoDirective} */
|
|
192
|
-
export const vCommand = createBrontoDirective(initCommand);
|
|
193
|
-
/** @type {BrontoDirective} */
|
|
194
|
-
export const vSources = createBrontoDirective(initSources);
|
|
195
|
-
/** @type {BrontoDirective} */
|
|
196
|
-
export const vSplitter = createBrontoDirective(initSplitter);
|
|
197
|
-
|
|
198
|
-
export const directives = Object.freeze({
|
|
199
|
-
themeToggle: vThemeToggle,
|
|
200
|
-
dismissible: vDismissible,
|
|
201
|
-
disabledGuard: vDisabledGuard,
|
|
202
|
-
disclosure: vDisclosure,
|
|
203
|
-
menu: vMenu,
|
|
204
|
-
formValidation: vFormValidation,
|
|
205
|
-
combobox: vCombobox,
|
|
206
|
-
popover: vPopover,
|
|
207
|
-
tableSort: vTableSort,
|
|
208
|
-
tabs: vTabs,
|
|
209
|
-
dialog: vDialog,
|
|
210
|
-
modal: vModal,
|
|
211
|
-
carousel: vCarousel,
|
|
212
|
-
dotGlyph: vDotGlyph,
|
|
213
|
-
legend: vLegend,
|
|
214
|
-
connectors: vConnectors,
|
|
215
|
-
spotlight: vSpotlight,
|
|
216
|
-
crosshair: vCrosshair,
|
|
217
|
-
command: vCommand,
|
|
218
|
-
sources: vSources,
|
|
219
|
-
splitter: vSplitter,
|
|
220
|
-
});
|
|
221
|
-
|
|
222
|
-
const directiveNames = {
|
|
223
|
-
themeToggle: 'bronto-theme-toggle',
|
|
224
|
-
dismissible: 'bronto-dismissible',
|
|
225
|
-
disabledGuard: 'bronto-disabled-guard',
|
|
226
|
-
disclosure: 'bronto-disclosure',
|
|
227
|
-
menu: 'bronto-menu',
|
|
228
|
-
formValidation: 'bronto-form-validation',
|
|
229
|
-
combobox: 'bronto-combobox',
|
|
230
|
-
popover: 'bronto-popover',
|
|
231
|
-
tableSort: 'bronto-table-sort',
|
|
232
|
-
tabs: 'bronto-tabs',
|
|
233
|
-
dialog: 'bronto-dialog',
|
|
234
|
-
modal: 'bronto-modal',
|
|
235
|
-
carousel: 'bronto-carousel',
|
|
236
|
-
dotGlyph: 'bronto-dot-glyph',
|
|
237
|
-
legend: 'bronto-legend',
|
|
238
|
-
connectors: 'bronto-connectors',
|
|
239
|
-
spotlight: 'bronto-spotlight',
|
|
240
|
-
crosshair: 'bronto-crosshair',
|
|
241
|
-
command: 'bronto-command',
|
|
242
|
-
sources: 'bronto-sources',
|
|
243
|
-
splitter: 'bronto-splitter',
|
|
244
|
-
};
|
|
245
|
-
|
|
246
|
-
const camelizeDirectiveName = (name) => name.replace(/-([a-z])/g, (_m, ch) => ch.toUpperCase());
|
|
247
|
-
|
|
248
|
-
/** @type {BrontoVuePlugin} */
|
|
249
|
-
export const brontoVue = Object.freeze({
|
|
250
|
-
install(app) {
|
|
251
|
-
for (const [key, directive] of Object.entries(directives)) {
|
|
252
|
-
const name = directiveNames[key];
|
|
253
|
-
app.directive(name, directive);
|
|
254
|
-
app.directive(camelizeDirectiveName(name), directive);
|
|
255
|
-
}
|
|
256
|
-
},
|
|
257
|
-
});
|
|
258
|
-
|
|
259
|
-
export default brontoVue;
|
|
260
|
-
|
|
261
|
-
/** The `toast()` imperative (no lifecycle of its own).
|
|
262
|
-
* @returns {(message: string, opts?: ToastOpts) => Cleanup} */
|
|
263
|
-
export const useToast = () => toast;
|
|
264
|
-
|
|
265
|
-
export { applyStoredTheme, toast };
|
|
266
|
-
export { cls, ui, cx } from '../classes/index.js';
|