@lumx/vue 4.12.0-next.5 → 4.12.0-next.6
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/_internal/CO3BhTbu.js +161 -0
- package/_internal/CO3BhTbu.js.map +1 -0
- package/components/chip/SelectionChipGroup.d.ts +25 -4
- package/components/select-text-field/SelectTextField.d.ts +129 -0
- package/components/select-text-field/SelectTextField.stories.d.ts +203 -0
- package/components/select-text-field/SelectTextField.test.d.ts +1 -0
- package/components/select-text-field/SelectTextField.test.stories.d.ts +37 -0
- package/components/select-text-field/Stories/CustomRender.vue.d.ts +2 -0
- package/components/select-text-field/Stories/MultipleWithSearch.vue.d.ts +2 -0
- package/components/select-text-field/Stories/WithCreatableOptions.vue.d.ts +2 -0
- package/components/select-text-field/Stories/WithInfiniteScroll.vue.d.ts +2 -0
- package/components/select-text-field/Stories/WithSearch.vue.d.ts +2 -0
- package/components/select-text-field/index.d.ts +35 -0
- package/index.d.ts +1 -0
- package/index.js +3938 -3588
- package/index.js.map +1 -1
- package/package.json +3 -3
- package/utils/VueToJSX.d.ts +13 -0
- package/utils/index.js +19 -55
- package/utils/index.js.map +1 -1
- package/_internal/BiLpoFMC.js +0 -124
- package/_internal/BiLpoFMC.js.map +0 -1
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
import { defineComponent as s, provide as u, inject as f, ref as p, watch as P, onBeforeUnmount as v, createVNode as h, Teleport as I, isVNode as C, onMounted as L, computed as b, unref as x, watchEffect as R } from "vue";
|
|
2
|
+
import { Theme as A } from "@lumx/core/js/constants";
|
|
3
|
+
const S = () => (...e) => e.reduce(
|
|
4
|
+
(n, o) => (n[o] = { required: !1 }, n),
|
|
5
|
+
{}
|
|
6
|
+
), y = /* @__PURE__ */ Symbol("LumxPortal"), E = () => ({
|
|
7
|
+
container: "body"
|
|
8
|
+
}), Y = /* @__PURE__ */ s((e, {
|
|
9
|
+
slots: n
|
|
10
|
+
}) => (u(y, e.value), () => n.default?.()), {
|
|
11
|
+
name: "LumxPortalProvider",
|
|
12
|
+
props: {
|
|
13
|
+
value: {
|
|
14
|
+
type: Function,
|
|
15
|
+
required: !0
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
function T(e) {
|
|
20
|
+
return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !C(e);
|
|
21
|
+
}
|
|
22
|
+
const K = /* @__PURE__ */ s((e, {
|
|
23
|
+
slots: n
|
|
24
|
+
}) => {
|
|
25
|
+
const o = f(y, E), t = p(null), a = () => {
|
|
26
|
+
e.enabled ? t.value = o() : t.value = null;
|
|
27
|
+
};
|
|
28
|
+
return a(), P(() => e.enabled, a), v(() => {
|
|
29
|
+
t.value?.teardown?.();
|
|
30
|
+
}), () => {
|
|
31
|
+
const c = n.default?.(), r = t.value?.container;
|
|
32
|
+
return !e.enabled || !r ? c : h(I, {
|
|
33
|
+
to: r
|
|
34
|
+
}, T(c) ? c : {
|
|
35
|
+
default: () => [c]
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
}, {
|
|
39
|
+
name: "LumxPortal",
|
|
40
|
+
props: {
|
|
41
|
+
enabled: {
|
|
42
|
+
type: Boolean,
|
|
43
|
+
default: !0
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
}), d = ["mousedown", "touchstart"];
|
|
47
|
+
function w(e, n) {
|
|
48
|
+
return !n.some((o) => o instanceof Node && e.some((t) => o.contains(t)));
|
|
49
|
+
}
|
|
50
|
+
function k(e, n) {
|
|
51
|
+
if (!n)
|
|
52
|
+
return;
|
|
53
|
+
const o = (t) => {
|
|
54
|
+
const a = [t.composedPath?.()[0], t.target].filter((r) => r instanceof Node), c = e();
|
|
55
|
+
w(a, c) && n(t);
|
|
56
|
+
};
|
|
57
|
+
return d.forEach((t) => document.addEventListener(t, o)), () => {
|
|
58
|
+
d.forEach((t) => document.removeEventListener(t, o));
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
const m = /* @__PURE__ */ Symbol("LumxClickAway"), q = /* @__PURE__ */ s((e, {
|
|
62
|
+
slots: n
|
|
63
|
+
}) => {
|
|
64
|
+
const o = f(m, null), t = [], a = {
|
|
65
|
+
childrenRefs: t,
|
|
66
|
+
addRefs(...r) {
|
|
67
|
+
for (const l of r) {
|
|
68
|
+
const i = l.value;
|
|
69
|
+
i && t.push(i);
|
|
70
|
+
}
|
|
71
|
+
o && (o.addRefs(...r), e.parentRef && o.addRefs(e.parentRef));
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
u(m, a);
|
|
75
|
+
let c;
|
|
76
|
+
return L(() => {
|
|
77
|
+
const r = e.childrenRefs.value;
|
|
78
|
+
r && a.addRefs(...r), c = k(() => t, (l) => {
|
|
79
|
+
const i = e.callback;
|
|
80
|
+
typeof i == "function" && i(l);
|
|
81
|
+
});
|
|
82
|
+
}), v(() => {
|
|
83
|
+
c?.();
|
|
84
|
+
}), () => n.default?.();
|
|
85
|
+
}, {
|
|
86
|
+
name: "LumxClickAwayProvider",
|
|
87
|
+
props: {
|
|
88
|
+
callback: {
|
|
89
|
+
type: [Function, Boolean, void 0],
|
|
90
|
+
default: void 0
|
|
91
|
+
},
|
|
92
|
+
childrenRefs: {
|
|
93
|
+
type: Object,
|
|
94
|
+
required: !0
|
|
95
|
+
},
|
|
96
|
+
parentRef: {
|
|
97
|
+
type: Object,
|
|
98
|
+
default: void 0
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
}), B = s(
|
|
102
|
+
(e, { slots: n }) => (u(
|
|
103
|
+
"theme",
|
|
104
|
+
b(() => e.value)
|
|
105
|
+
), () => n.default?.()),
|
|
106
|
+
{
|
|
107
|
+
name: "LumxThemeProvider",
|
|
108
|
+
props: { value: { type: String, default: void 0 } }
|
|
109
|
+
}
|
|
110
|
+
);
|
|
111
|
+
function F(e = { defaultTheme: A.light }) {
|
|
112
|
+
const { defaultTheme: n } = e, o = f("theme", void 0);
|
|
113
|
+
return b(() => x(o) || n);
|
|
114
|
+
}
|
|
115
|
+
function N(e, n, o) {
|
|
116
|
+
const t = new IntersectionObserver((a = []) => {
|
|
117
|
+
a.some((r) => r.isIntersecting) && n();
|
|
118
|
+
}, o);
|
|
119
|
+
return t.observe(e), () => {
|
|
120
|
+
t.unobserve(e);
|
|
121
|
+
};
|
|
122
|
+
}
|
|
123
|
+
const O = "lumx-infinite-scroll-anchor", _ = ({
|
|
124
|
+
ref: e
|
|
125
|
+
}) => (
|
|
126
|
+
// In order to avoid issues when a zoom is added to the browser, we add a small height to the div so that
|
|
127
|
+
// the intersection has a higher chance of working correctly.
|
|
128
|
+
h("div", {
|
|
129
|
+
ref: e,
|
|
130
|
+
"aria-hidden": "true",
|
|
131
|
+
className: O,
|
|
132
|
+
style: {
|
|
133
|
+
height: "4px"
|
|
134
|
+
}
|
|
135
|
+
}, null)
|
|
136
|
+
), V = /* @__PURE__ */ s((e) => {
|
|
137
|
+
const n = p(null);
|
|
138
|
+
return R((o) => {
|
|
139
|
+
const t = n.value;
|
|
140
|
+
if (!t) return;
|
|
141
|
+
const a = N(t, e.callback, e.options);
|
|
142
|
+
o(a);
|
|
143
|
+
}), () => _({
|
|
144
|
+
ref: n
|
|
145
|
+
});
|
|
146
|
+
}, {
|
|
147
|
+
name: "LumxInfiniteScroll",
|
|
148
|
+
inheritAttrs: !1,
|
|
149
|
+
props: S()("callback", "options")
|
|
150
|
+
});
|
|
151
|
+
export {
|
|
152
|
+
q as C,
|
|
153
|
+
V as I,
|
|
154
|
+
K as P,
|
|
155
|
+
B as T,
|
|
156
|
+
Y as a,
|
|
157
|
+
S as k,
|
|
158
|
+
k as s,
|
|
159
|
+
F as u
|
|
160
|
+
};
|
|
161
|
+
//# sourceMappingURL=CO3BhTbu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CO3BhTbu.js","sources":["../../src/utils/VueToJSX.ts","../../src/utils/Portal/PortalProvider.tsx","../../src/utils/Portal/Portal.tsx","../../../lumx-core/src/js/utils/ClickAway/index.ts","../../src/utils/ClickAway/ClickAwayProvider.tsx","../../src/utils/theme/ThemeProvider.ts","../../src/utils/theme/useTheme.ts","../../../lumx-core/src/js/utils/InfiniteScroll/setupInfiniteScrollObserver.ts","../../../lumx-core/src/js/utils/InfiniteScroll/index.tsx","../../src/utils/InfiniteScroll/InfiniteScroll.tsx"],"sourcesContent":["import { PropsToOverride } from '@lumx/core/js/types';\n/**\n * Props interface for components wrapped with VueToJSX.\n * It omits JSX-specific props like `children` and `className` and adds Vue's `class`.\n *\n * @template Props - The base props type\n * @template OmitProps - Additional props to omit beyond the defaults (children, className, ref)\n */\nexport type VueToJSXProps<Props, OmitProps extends keyof Props = never> = Omit<\n Props,\n PropsToOverride | 'children' | 'className' | OmitProps\n> & {\n /** Class name forwarded to the root element of the component. */\n class?: string;\n};\n\n/**\n * Hyphenated aria-* prop keys that must NOT be declared as Vue component props.\n * When declared, Vue normalizes them to camelCase (e.g. aria-haspopup → ariaHaspopup),\n * which breaks hyphenated key destructuring in core component templates.\n * By excluding them from props, they flow through `attrs` with their original hyphenated keys.\n */\nexport type HyphenatedAriaProps = 'aria-expanded' | 'aria-haspopup' | 'aria-label' | 'aria-pressed';\n\nexport const keysOf = <T>() => {\n return <K extends readonly (keyof T)[]>(\n ...keys: [keyof T] extends [K[number]]\n ? K\n : [Error: '❌ Missing keys in your list:', Exclude<keyof T, K[number]>]\n ) => {\n // Return an object with all props marked as optional (not required)\n // This ensures Vue's type system correctly infers props as optional\n return keys.reduce(\n (acc, key) => {\n acc[key as K[number]] = { required: false };\n return acc;\n },\n {} as Record<K[number], { required: false }>,\n );\n };\n};\n\n/**\n * Derive the typed Vue emits map from a runtime `emitSchema` object.\n *\n * @example\n * export const emitSchema = {\n * change: (_newValue?: unknown) => true,\n * search: (_text: string) => true,\n * };\n * export type MyEmits<O> = EmitsOf<typeof emitSchema>\n */\nexport type EmitsOf<S> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n [K in keyof S]: S[K] extends (...args: infer A) => any ? (...args: A) => void : never;\n};\n","import { defineComponent, provide, type PropType, type InjectionKey } from 'vue';\n\nexport type { PortalInit, PortalProviderProps } from '@lumx/core/js/utils/Portal';\nimport type { PortalInit, PortalProviderProps } from '@lumx/core/js/utils/Portal';\n\nexport const PORTAL_KEY: InjectionKey<PortalInit> = Symbol('LumxPortal');\n\nexport const defaultPortalInit: PortalInit = () => ({ container: 'body' });\n\n/**\n * Customize where <Portal> wrapped elements render (tooltip, popover, dialog, etc.)\n */\nexport const PortalProvider = defineComponent(\n (props: PortalProviderProps, { slots }) => {\n provide(PORTAL_KEY, props.value);\n return () => slots.default?.();\n },\n {\n name: 'LumxPortalProvider',\n props: {\n value: {\n type: Function as PropType<PortalInit>,\n required: true,\n },\n },\n },\n);\n","import { defineComponent, inject, onBeforeUnmount, Teleport, ref, watch } from 'vue';\nimport { PORTAL_KEY, defaultPortalInit } from './PortalProvider';\n\nexport type { PortalProps } from '@lumx/core/js/utils/Portal';\nimport type { PortalProps } from '@lumx/core/js/utils/Portal';\n\n/**\n * Render children in a portal outside the current DOM position\n * (defaults to `document.body` but can be customized with the PortalProvider)\n */\nexport const Portal = defineComponent(\n (props: PortalProps, { slots }) => {\n const portalInit = inject(PORTAL_KEY, defaultPortalInit);\n const context = ref<ReturnType<typeof portalInit> | null>(null);\n\n // Initialize portal context when enabled\n const initializePortal = () => {\n if (props.enabled) {\n context.value = portalInit();\n } else {\n context.value = null;\n }\n };\n\n // Initialize on mount and when enabled changes\n initializePortal();\n watch(() => props.enabled, initializePortal);\n\n // Register teardown on unmount\n onBeforeUnmount(() => {\n context.value?.teardown?.();\n });\n\n return () => {\n const content = slots.default?.();\n const container = context.value?.container;\n\n // If disabled or no container, render inline\n if (!props.enabled || !container) {\n return content;\n }\n\n // Render in portal using Teleport\n return <Teleport to={container}>{content}</Teleport>;\n };\n },\n {\n name: 'LumxPortal',\n props: {\n enabled: {\n type: Boolean,\n default: true,\n },\n },\n },\n);\n","/**\n * Shared types and logic for ClickAway detection.\n *\n * ClickAway detects clicks outside a set of elements and triggers a callback.\n * The core logic (event listening + target checking) is framework-agnostic.\n * Framework-specific wrappers (React hook, Vue composable) and context providers\n * (React context, Vue provide/inject) are implemented in each framework package.\n */\n\nimport type { Falsy } from '@lumx/core/js/types';\n\n/** Event types that trigger click away detection. */\nexport const CLICK_AWAY_EVENT_TYPES = ['mousedown', 'touchstart'] as const;\n\n/** Callback triggered when a click away is detected. */\nexport type ClickAwayCallback = EventListener | Falsy;\n\n/**\n * Check if the click event targets are outside all the given elements.\n *\n * @param targets - The event target elements (from `event.target` and `event.composedPath()`).\n * @param elements - The elements considered \"inside\" the click away context.\n * @returns `true` if the click is outside all elements (i.e. a click away).\n */\nexport function isClickAway(targets: HTMLElement[], elements: HTMLElement[]): boolean {\n return !elements.some((element) => element instanceof Node && targets.some((target) => element.contains(target)));\n}\n\n/**\n * Imperative setup for click away detection.\n * Adds mousedown/touchstart listeners on `document` and calls the callback when a click\n * occurs outside the elements returned by `getElements`.\n *\n * Note: when `getElements` returns an empty array, any click is considered a click away.\n * Callers should guard against calling `setupClickAway` when no refs are registered.\n *\n * @param getElements - Getter returning the current list of elements considered \"inside\".\n * @param callback - Callback to invoke on click away.\n * @returns A teardown function that removes the event listeners.\n */\nexport function setupClickAway(\n getElements: () => HTMLElement[],\n callback: ClickAwayCallback,\n): (() => void) | undefined {\n if (!callback) {\n return undefined;\n }\n\n const listener: EventListener = (evt) => {\n const targets = [evt.composedPath?.()[0], evt.target].filter((t): t is HTMLElement => t instanceof Node);\n const elements = getElements();\n if (isClickAway(targets, elements)) {\n callback(evt);\n }\n };\n\n CLICK_AWAY_EVENT_TYPES.forEach((evtType) => document.addEventListener(evtType, listener));\n return () => {\n CLICK_AWAY_EVENT_TYPES.forEach((evtType) => document.removeEventListener(evtType, listener));\n };\n}\n","import {\n defineComponent,\n inject,\n onBeforeUnmount,\n onMounted,\n provide,\n type InjectionKey,\n type PropType,\n type Ref,\n} from 'vue';\nimport { setupClickAway, type ClickAwayCallback } from '@lumx/core/js/utils/ClickAway';\n\ninterface ContextValue {\n childrenRefs: HTMLElement[];\n addRefs(...newChildrenRefs: Array<Ref<HTMLElement | undefined>>): void;\n}\n\nexport const CLICK_AWAY_KEY: InjectionKey<ContextValue> = Symbol('LumxClickAway');\n\n/**\n * Component combining click away detection with Vue's provide/inject to hook into the component tree\n * and take into account both the DOM tree and the component tree to detect click away.\n */\nexport const ClickAwayProvider = defineComponent(\n (\n props: {\n callback: ClickAwayCallback;\n childrenRefs: Ref<Array<Ref<HTMLElement | undefined>>>;\n parentRef?: Ref<HTMLElement | undefined>;\n },\n { slots },\n ) => {\n const parentContext = inject(CLICK_AWAY_KEY, null);\n\n const contextChildrenRefs: HTMLElement[] = [];\n\n const currentContext: ContextValue = {\n childrenRefs: contextChildrenRefs,\n addRefs(...newChildrenRefs) {\n for (const newRef of newChildrenRefs) {\n const el = newRef.value;\n if (el) {\n contextChildrenRefs.push(el);\n }\n }\n if (parentContext) {\n parentContext.addRefs(...newChildrenRefs);\n if (props.parentRef) {\n parentContext.addRefs(props.parentRef);\n }\n }\n },\n };\n\n provide(CLICK_AWAY_KEY, currentContext);\n\n let teardown: (() => void) | undefined;\n\n onMounted(() => {\n const refs = props.childrenRefs.value;\n if (refs) {\n currentContext.addRefs(...refs);\n }\n\n // Setup click away using a closure that always reads the latest callback prop.\n // This handles transitions like closeMode=\"hide\" where the callback changes\n // between open (handleClose) and closed (undefined) without re-creating the listener.\n teardown = setupClickAway(\n () => contextChildrenRefs,\n (event) => {\n const cb = props.callback;\n if (typeof cb === 'function') cb(event);\n },\n );\n });\n\n onBeforeUnmount(() => {\n teardown?.();\n });\n\n return () => slots.default?.();\n },\n {\n name: 'LumxClickAwayProvider',\n props: {\n callback: {\n type: [Function, Boolean, undefined] as PropType<ClickAwayCallback>,\n default: undefined,\n },\n childrenRefs: {\n type: Object as PropType<Ref<Array<Ref<HTMLElement | undefined>>>>,\n required: true,\n },\n parentRef: {\n type: Object as PropType<Ref<HTMLElement | undefined>>,\n default: undefined,\n },\n },\n },\n);\n","import { computed, defineComponent, provide, type PropType } from 'vue';\nimport type { Theme } from '@lumx/core/js/constants';\n\n/**\n * ThemeProvider for Vue: wraps children with `provide('theme', value)` for theme isolation.\n * Vue's `provide()` requires a component boundary, so this is a component.\n */\nexport const ThemeProvider = defineComponent(\n (props: { value: Theme | undefined }, { slots }) => {\n provide(\n 'theme',\n computed(() => props.value),\n );\n return () => slots.default?.();\n },\n {\n name: 'LumxThemeProvider',\n props: { value: { type: String as PropType<Theme | undefined>, default: undefined } },\n },\n);\n","import { type ComputedRef, type Ref, computed, inject, unref } from 'vue';\n\nimport { Theme } from '@lumx/core/js/constants';\n\nexport interface UseTheme {\n defaultTheme?: Theme;\n}\n/**\n * Retrieves the globally applied theme.\n * @returns computed theme value (auto-updates when the provided theme changes)\n */\nexport function useTheme(options: UseTheme = { defaultTheme: Theme.light }): ComputedRef<Theme | undefined> {\n const { defaultTheme } = options;\n const injected = inject<Theme | Ref<Theme | undefined> | undefined>('theme', undefined);\n return computed(() => unref(injected) || defaultTheme);\n}\n","type EventCallback = (evt?: Event) => void;\n\n/**\n * Sets up an IntersectionObserver on the given element.\n * Calls `callback` when at least one observed entry is intersecting.\n * Returns a cleanup function that unobserves the element.\n */\nexport function setupInfiniteScrollObserver(\n element: Element,\n callback: EventCallback,\n options?: IntersectionObserverInit,\n): () => void {\n const observer = new IntersectionObserver((entries = []) => {\n const hasIntersection = entries.some((entry) => entry.isIntersecting);\n\n if (!hasIntersection) {\n return;\n }\n\n callback();\n }, options);\n\n observer.observe(element);\n\n return () => {\n observer.unobserve(element);\n };\n}\n","import type { CommonRef } from '../../types';\n\nexport { setupInfiniteScrollObserver } from './setupInfiniteScrollObserver';\n\nexport const INFINITE_SCROLL_CLASSNAME = 'lumx-infinite-scroll-anchor';\n\nexport interface InfiniteScrollProps {\n /** Callback when infinite scroll component is in view */\n // eslint-disable-next-line react/no-unused-prop-types\n callback: (evt?: Event) => void;\n /** Customize intersection observer option */\n // eslint-disable-next-line react/no-unused-prop-types\n options?: IntersectionObserverInit;\n}\n\n/**\n * Framework-agnostic InfiniteScroll sentinel component.\n *\n * Renders a tiny invisible div that triggers a callback when it enters the viewport\n * (or intersects its root element) via IntersectionObserver.\n *\n * The div has a small height (4px) to avoid issues when a browser zoom is applied,\n * where a zero-height element might not trigger IntersectionObserver reliably.\n */\nexport const InfiniteScroll = ({ ref }: { ref?: CommonRef }) => (\n // In order to avoid issues when a zoom is added to the browser, we add a small height to the div so that\n // the intersection has a higher chance of working correctly.\n <div ref={ref} aria-hidden=\"true\" className={INFINITE_SCROLL_CLASSNAME} style={{ height: '4px' }} />\n);\n","import { defineComponent, ref, watchEffect } from 'vue';\nimport {\n InfiniteScroll as UI,\n type InfiniteScrollProps,\n setupInfiniteScrollObserver,\n} from '@lumx/core/js/utils/InfiniteScroll';\nimport { keysOf } from '../VueToJSX';\n\nexport type { InfiniteScrollProps };\n\n/**\n * Handles basic callback pattern by using intersection observers.\n */\nexport const InfiniteScroll = defineComponent(\n (props: InfiniteScrollProps) => {\n const elementRef = ref<HTMLDivElement | null>(null);\n\n watchEffect((onCleanup) => {\n const element = elementRef.value;\n if (!element) return;\n\n const cleanup = setupInfiniteScrollObserver(element, props.callback, props.options);\n onCleanup(cleanup);\n });\n\n return () => UI({ ref: elementRef });\n },\n {\n name: 'LumxInfiniteScroll',\n inheritAttrs: false,\n props: keysOf<InfiniteScrollProps>()('callback', 'options'),\n },\n);\n\nexport default InfiniteScroll;\n"],"names":["keysOf","keys","acc","key","PORTAL_KEY","Symbol","defaultPortalInit","container","PortalProvider","props","slots","provide","value","default","name","type","Function","required","_isSlot","s","Object","prototype","toString","call","_isVNode","Portal","portalInit","inject","context","ref","initializePortal","enabled","watch","onBeforeUnmount","teardown","content","_createVNode","Teleport","Boolean","CLICK_AWAY_EVENT_TYPES","isClickAway","targets","elements","element","target","setupClickAway","getElements","callback","listener","evt","t","evtType","CLICK_AWAY_KEY","ClickAwayProvider","parentContext","contextChildrenRefs","currentContext","childrenRefs","addRefs","newChildrenRefs","newRef","el","push","parentRef","onMounted","refs","event","cb","undefined","ThemeProvider","defineComponent","computed","useTheme","options","Theme","defaultTheme","injected","unref","setupInfiniteScrollObserver","observer","entries","entry","INFINITE_SCROLL_CLASSNAME","InfiniteScroll","height","elementRef","watchEffect","onCleanup","cleanup","UI","inheritAttrs"],"mappings":"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"}
|
|
@@ -1,23 +1,43 @@
|
|
|
1
|
+
import { EmitFn, EmitsToProps, PublicProps } from 'vue';
|
|
1
2
|
import { SelectionChipGroupProps as UIProps } from '@lumx/core/js/components/Chip/SelectionChipGroup';
|
|
2
3
|
import { VueToJSXProps } from '../../utils/VueToJSX';
|
|
3
4
|
/**
|
|
4
5
|
* Props omit 'ref' (handled internally).
|
|
5
6
|
* inputRef is added here for Vue (ref to an associated input element for backspace focus handling).
|
|
6
7
|
*/
|
|
7
|
-
export type SelectionChipGroupProps = VueToJSXProps<UIProps<
|
|
8
|
+
export type SelectionChipGroupProps<O = any> = VueToJSXProps<UIProps<O>> & {
|
|
8
9
|
/** Ref to the associated input element (for focus restoration on backspace) */
|
|
9
10
|
inputRef?: HTMLInputElement | null;
|
|
10
11
|
};
|
|
12
|
+
/** SelectionChipGroup emit schema */
|
|
11
13
|
export declare const emitSchema: {
|
|
12
14
|
change: (_newValue?: any[]) => boolean;
|
|
13
15
|
};
|
|
16
|
+
/**
|
|
17
|
+
* SelectionChipGroup emits adapted to the value generic type
|
|
18
|
+
*/
|
|
19
|
+
export type SelectionChipGroupEmits<O> = {
|
|
20
|
+
change: (newValue: O[] | undefined) => void;
|
|
21
|
+
};
|
|
22
|
+
/**
|
|
23
|
+
* SelectionChipGroup component constructor with generic type attached to props
|
|
24
|
+
*
|
|
25
|
+
* Vue's `defineComponent` setup-fn overload cannot carry an unbound generic from the setup
|
|
26
|
+
* signature to the resulting component constructor, so the generic is layered on via cast.
|
|
27
|
+
*/
|
|
28
|
+
export interface SelectionChipGroupConstructor {
|
|
29
|
+
new <O = any>(props: SelectionChipGroupProps<O> & EmitsToProps<SelectionChipGroupEmits<O>> & PublicProps): {
|
|
30
|
+
$props: SelectionChipGroupProps<O> & EmitsToProps<SelectionChipGroupEmits<O>>;
|
|
31
|
+
$emit: EmitFn<SelectionChipGroupEmits<O>>;
|
|
32
|
+
};
|
|
33
|
+
}
|
|
14
34
|
/**
|
|
15
35
|
* SelectionChipGroup component.
|
|
16
36
|
*
|
|
17
37
|
* @param props Component props.
|
|
18
38
|
* @return Vue element.
|
|
19
39
|
*/
|
|
20
|
-
declare const SelectionChipGroup: import('vue').DefineSetupFnComponent<SelectionChipGroupProps
|
|
40
|
+
declare const SelectionChipGroup: import('vue').DefineSetupFnComponent<SelectionChipGroupProps<any>, {
|
|
21
41
|
change: (_newValue?: any[]) => boolean;
|
|
22
42
|
}, {}, Omit<UIProps<any>, "className" | import('@lumx/core/js/types').PropsToOverride | "children"> & {
|
|
23
43
|
class?: string;
|
|
@@ -26,5 +46,6 @@ declare const SelectionChipGroup: import('vue').DefineSetupFnComponent<Selection
|
|
|
26
46
|
inputRef?: HTMLInputElement | null;
|
|
27
47
|
} & {
|
|
28
48
|
onChange?: ((_newValue?: any[] | undefined) => any) | undefined;
|
|
29
|
-
},
|
|
30
|
-
|
|
49
|
+
}, PublicProps>;
|
|
50
|
+
declare const _default: SelectionChipGroupConstructor & typeof SelectionChipGroup;
|
|
51
|
+
export default _default;
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { EmitFn, EmitsToProps, PublicProps } from 'vue';
|
|
2
|
+
import { BaseSelectTextFieldWrapperProps } from '@lumx/core/js/utils/select/types';
|
|
3
|
+
import { JSXElement } from '@lumx/core/js/types';
|
|
4
|
+
import { EmitsOf } from '../../utils/VueToJSX';
|
|
5
|
+
/** Props shared across single and multiple selection modes. */
|
|
6
|
+
interface BaseSelectTextFieldProps<O = any> extends BaseSelectTextFieldWrapperProps<O> {
|
|
7
|
+
/** Content to render before the options list. */
|
|
8
|
+
beforeOptions?: JSXElement;
|
|
9
|
+
/** CSS class. */
|
|
10
|
+
class?: string;
|
|
11
|
+
}
|
|
12
|
+
/** Props specific to single selection mode. */
|
|
13
|
+
export interface SingleSelectTextFieldProps<O = any> extends BaseSelectTextFieldProps<O> {
|
|
14
|
+
/** Selection type. */
|
|
15
|
+
selectionType: 'single';
|
|
16
|
+
/** Selected option object. */
|
|
17
|
+
value?: O;
|
|
18
|
+
}
|
|
19
|
+
/** Props specific to multiple selection mode. */
|
|
20
|
+
export interface MultipleSelectTextFieldProps<O = any> extends BaseSelectTextFieldProps<O> {
|
|
21
|
+
/** Selection type. */
|
|
22
|
+
selectionType: 'multiple';
|
|
23
|
+
/** Selected option objects. */
|
|
24
|
+
value?: O[];
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* SelectTextField props — supports both single and multiple selection.
|
|
28
|
+
* Discriminated on `selectionType`: when `'multiple'`, `value` is `O[]`.
|
|
29
|
+
*/
|
|
30
|
+
export type SelectTextFieldProps<O = any> = SingleSelectTextFieldProps<O> | MultipleSelectTextFieldProps<O>;
|
|
31
|
+
/**
|
|
32
|
+
* SelectTextField events schema
|
|
33
|
+
*/
|
|
34
|
+
declare const emitSchema: {
|
|
35
|
+
/**
|
|
36
|
+
* Selection change. Payload type depends on `selectionType`:
|
|
37
|
+
* - `'single'` → `O | undefined` (option on select, `undefined` on clear).
|
|
38
|
+
* - `'multiple'` → `O[] | undefined` (`undefined` when fully cleared).
|
|
39
|
+
*
|
|
40
|
+
* The runtime validator uses `unknown` since the discriminated payload can't be
|
|
41
|
+
* expressed without the component generic. The typed payload is restored by the
|
|
42
|
+
* `change` override on `SelectTextFieldEmits<O, S>`.
|
|
43
|
+
*/
|
|
44
|
+
change: (_newValue?: unknown) => boolean;
|
|
45
|
+
/** User typed in the search input. */
|
|
46
|
+
search: (_searchText: string) => boolean;
|
|
47
|
+
/** Bottom of the options list reached — consumer should fetch the next page. */
|
|
48
|
+
'load-more': () => boolean;
|
|
49
|
+
/** Input lost focus. */
|
|
50
|
+
blur: (_event?: FocusEvent) => boolean;
|
|
51
|
+
/** Input received focus. */
|
|
52
|
+
focus: (_event?: FocusEvent) => boolean;
|
|
53
|
+
/** Key pressed while the input is focused. */
|
|
54
|
+
keydown: (_event?: KeyboardEvent) => boolean;
|
|
55
|
+
/** Clear button clicked (single mode only). */
|
|
56
|
+
clear: (_event?: MouseEvent) => boolean;
|
|
57
|
+
/** Dropdown opened or closed. */
|
|
58
|
+
open: (_isOpen: boolean) => boolean;
|
|
59
|
+
};
|
|
60
|
+
/**
|
|
61
|
+
* SelectTextField emits (adapting to the selection type).
|
|
62
|
+
*/
|
|
63
|
+
type SelectTextFieldEmits<O, S extends 'single' | 'multiple'> = Omit<EmitsOf<typeof emitSchema>, 'change'> & {
|
|
64
|
+
change: (newValue: (S extends 'multiple' ? O[] : O) | undefined) => void;
|
|
65
|
+
};
|
|
66
|
+
type SingleSelectTextFieldPublicProps<O> = SingleSelectTextFieldProps<O> & EmitsToProps<SelectTextFieldEmits<O, 'single'>>;
|
|
67
|
+
type MultipleSelectTextFieldPublicProps<O> = MultipleSelectTextFieldProps<O> & EmitsToProps<SelectTextFieldEmits<O, 'multiple'>>;
|
|
68
|
+
/**
|
|
69
|
+
* SelectTextField component constructor with generic type attached to props
|
|
70
|
+
*
|
|
71
|
+
* Vue's `defineComponent` setup-fn overload cannot carry an unbound generic from the setup
|
|
72
|
+
* signature to the resulting component constructor, so the generic is layered on via cast.
|
|
73
|
+
*/
|
|
74
|
+
export interface SelectTextFieldConstructor {
|
|
75
|
+
new <O = any>(props: SingleSelectTextFieldPublicProps<O> & PublicProps): {
|
|
76
|
+
$props: SingleSelectTextFieldPublicProps<O>;
|
|
77
|
+
$emit: EmitFn<SelectTextFieldEmits<O, 'single'>>;
|
|
78
|
+
};
|
|
79
|
+
new <O = any>(props: MultipleSelectTextFieldPublicProps<O> & PublicProps): {
|
|
80
|
+
$props: MultipleSelectTextFieldPublicProps<O>;
|
|
81
|
+
$emit: EmitFn<SelectTextFieldEmits<O, 'multiple'>>;
|
|
82
|
+
};
|
|
83
|
+
}
|
|
84
|
+
/**
|
|
85
|
+
* A text field with a select dropdown to choose between a list of options.
|
|
86
|
+
* Supports search/filter, single selection, and multiple selection with chips.
|
|
87
|
+
*
|
|
88
|
+
* Scoped slots:
|
|
89
|
+
* - `option({ option, index })` — custom option rendering inside a `<Combobox.Option>`.
|
|
90
|
+
* - `sectionTitle({ sectionId, options })` — custom section header rendering.
|
|
91
|
+
* - `chip({ option, index })` — custom chip rendering (multiple selection only).
|
|
92
|
+
*/
|
|
93
|
+
declare const SelectTextField: import('vue').DefineSetupFnComponent<SelectTextFieldProps<any>, {
|
|
94
|
+
/**
|
|
95
|
+
* Selection change. Payload type depends on `selectionType`:
|
|
96
|
+
* - `'single'` → `O | undefined` (option on select, `undefined` on clear).
|
|
97
|
+
* - `'multiple'` → `O[] | undefined` (`undefined` when fully cleared).
|
|
98
|
+
*
|
|
99
|
+
* The runtime validator uses `unknown` since the discriminated payload can't be
|
|
100
|
+
* expressed without the component generic. The typed payload is restored by the
|
|
101
|
+
* `change` override on `SelectTextFieldEmits<O, S>`.
|
|
102
|
+
*/
|
|
103
|
+
change: (_newValue?: unknown) => boolean;
|
|
104
|
+
/** User typed in the search input. */
|
|
105
|
+
search: (_searchText: string) => boolean;
|
|
106
|
+
/** Bottom of the options list reached — consumer should fetch the next page. */
|
|
107
|
+
'load-more': () => boolean;
|
|
108
|
+
/** Input lost focus. */
|
|
109
|
+
blur: (_event?: FocusEvent) => boolean;
|
|
110
|
+
/** Input received focus. */
|
|
111
|
+
focus: (_event?: FocusEvent) => boolean;
|
|
112
|
+
/** Key pressed while the input is focused. */
|
|
113
|
+
keydown: (_event?: KeyboardEvent) => boolean;
|
|
114
|
+
/** Clear button clicked (single mode only). */
|
|
115
|
+
clear: (_event?: MouseEvent) => boolean;
|
|
116
|
+
/** Dropdown opened or closed. */
|
|
117
|
+
open: (_isOpen: boolean) => boolean;
|
|
118
|
+
}, {}, SelectTextFieldProps<any> & {
|
|
119
|
+
onSearch?: ((_searchText: string) => any) | undefined;
|
|
120
|
+
onBlur?: ((_event?: FocusEvent | undefined) => any) | undefined;
|
|
121
|
+
onChange?: ((_newValue?: unknown) => any) | undefined;
|
|
122
|
+
onFocus?: ((_event?: FocusEvent | undefined) => any) | undefined;
|
|
123
|
+
onKeydown?: ((_event?: KeyboardEvent | undefined) => any) | undefined;
|
|
124
|
+
onClear?: ((_event?: MouseEvent | undefined) => any) | undefined;
|
|
125
|
+
onOpen?: ((_isOpen: boolean) => any) | undefined;
|
|
126
|
+
"onLoad-more"?: (() => any) | undefined;
|
|
127
|
+
}, PublicProps>;
|
|
128
|
+
declare const _default: SelectTextFieldConstructor & typeof SelectTextField;
|
|
129
|
+
export default _default;
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
component: any;
|
|
3
|
+
play({ canvas }: any): Promise<void>;
|
|
4
|
+
title: string;
|
|
5
|
+
};
|
|
6
|
+
export default _default;
|
|
7
|
+
export declare const Default: {
|
|
8
|
+
args: {
|
|
9
|
+
value: undefined;
|
|
10
|
+
};
|
|
11
|
+
decorators: ((story: any, context: any) => any)[];
|
|
12
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
13
|
+
};
|
|
14
|
+
export declare const WithSelectedValue: {
|
|
15
|
+
args: {
|
|
16
|
+
value: {
|
|
17
|
+
id: string;
|
|
18
|
+
name: string;
|
|
19
|
+
icon: string;
|
|
20
|
+
category: string;
|
|
21
|
+
categoryIcon: string;
|
|
22
|
+
description: string;
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
decorators: ((story: any, context: any) => any)[];
|
|
26
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
27
|
+
};
|
|
28
|
+
export declare const NoClearButton: {
|
|
29
|
+
args: {
|
|
30
|
+
value: {
|
|
31
|
+
id: string;
|
|
32
|
+
name: string;
|
|
33
|
+
icon: string;
|
|
34
|
+
category: string;
|
|
35
|
+
categoryIcon: string;
|
|
36
|
+
description: string;
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
decorators: ((story: any, context: any) => any)[];
|
|
40
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
41
|
+
};
|
|
42
|
+
export declare const WithDescriptions: {
|
|
43
|
+
args: {
|
|
44
|
+
value: undefined;
|
|
45
|
+
};
|
|
46
|
+
decorators: ((story: any, context: any) => any)[];
|
|
47
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
48
|
+
};
|
|
49
|
+
export declare const WithSections: {
|
|
50
|
+
args: {
|
|
51
|
+
value: undefined;
|
|
52
|
+
};
|
|
53
|
+
decorators: ((story: any, context: any) => any)[];
|
|
54
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
55
|
+
};
|
|
56
|
+
export declare const WithIcon: {
|
|
57
|
+
args: {
|
|
58
|
+
value: undefined;
|
|
59
|
+
};
|
|
60
|
+
decorators: ((story: any, context: any) => any)[];
|
|
61
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
62
|
+
};
|
|
63
|
+
export declare const Disabled: {
|
|
64
|
+
args: {
|
|
65
|
+
value: {
|
|
66
|
+
id: string;
|
|
67
|
+
name: string;
|
|
68
|
+
icon: string;
|
|
69
|
+
category: string;
|
|
70
|
+
categoryIcon: string;
|
|
71
|
+
description: string;
|
|
72
|
+
};
|
|
73
|
+
};
|
|
74
|
+
decorators: ((story: any, context: any) => any)[];
|
|
75
|
+
play: any;
|
|
76
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
77
|
+
};
|
|
78
|
+
export declare const WithError: {
|
|
79
|
+
args: {
|
|
80
|
+
value: undefined;
|
|
81
|
+
};
|
|
82
|
+
decorators: ((story: any, context: any) => any)[];
|
|
83
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
84
|
+
};
|
|
85
|
+
export declare const WithHelper: {
|
|
86
|
+
args: {
|
|
87
|
+
value: undefined;
|
|
88
|
+
};
|
|
89
|
+
decorators: ((story: any, context: any) => any)[];
|
|
90
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
91
|
+
};
|
|
92
|
+
export declare const MultipleSelection: {
|
|
93
|
+
args: {
|
|
94
|
+
value: never[];
|
|
95
|
+
};
|
|
96
|
+
decorators: ((story: any, context: any) => any)[];
|
|
97
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
98
|
+
};
|
|
99
|
+
export declare const MultipleWithPreselected: {
|
|
100
|
+
args: {
|
|
101
|
+
value: {
|
|
102
|
+
id: string;
|
|
103
|
+
name: string;
|
|
104
|
+
icon: string;
|
|
105
|
+
category: string;
|
|
106
|
+
categoryIcon: string;
|
|
107
|
+
description: string;
|
|
108
|
+
}[];
|
|
109
|
+
};
|
|
110
|
+
decorators: ((story: any, context: any) => any)[];
|
|
111
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
112
|
+
};
|
|
113
|
+
export declare const MultipleWithManyChips: {
|
|
114
|
+
args: {
|
|
115
|
+
value: ({
|
|
116
|
+
id: string;
|
|
117
|
+
name: string;
|
|
118
|
+
icon: string;
|
|
119
|
+
category: string;
|
|
120
|
+
categoryIcon: string;
|
|
121
|
+
description: string;
|
|
122
|
+
} | {
|
|
123
|
+
id: string;
|
|
124
|
+
name: string;
|
|
125
|
+
category: string;
|
|
126
|
+
})[];
|
|
127
|
+
};
|
|
128
|
+
decorators: ((story: any, context: any) => any)[];
|
|
129
|
+
play: any;
|
|
130
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
131
|
+
};
|
|
132
|
+
export declare const MultipleDisabled: {
|
|
133
|
+
args: {
|
|
134
|
+
value: {
|
|
135
|
+
id: string;
|
|
136
|
+
name: string;
|
|
137
|
+
icon: string;
|
|
138
|
+
category: string;
|
|
139
|
+
categoryIcon: string;
|
|
140
|
+
description: string;
|
|
141
|
+
}[];
|
|
142
|
+
};
|
|
143
|
+
decorators: ((story: any, context: any) => any)[];
|
|
144
|
+
play: any;
|
|
145
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
146
|
+
};
|
|
147
|
+
export declare const Loading: {
|
|
148
|
+
args: {
|
|
149
|
+
value: undefined;
|
|
150
|
+
};
|
|
151
|
+
decorators: ((story: any, context: any) => any)[];
|
|
152
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
153
|
+
};
|
|
154
|
+
export declare const LoadingMore: {
|
|
155
|
+
args: {
|
|
156
|
+
value: undefined;
|
|
157
|
+
};
|
|
158
|
+
decorators: ((story: any, context: any) => any)[];
|
|
159
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
160
|
+
};
|
|
161
|
+
export declare const ErrorState: {
|
|
162
|
+
args: {
|
|
163
|
+
value: undefined;
|
|
164
|
+
};
|
|
165
|
+
decorators: ((story: any, context: any) => any)[];
|
|
166
|
+
render: ({ value, onChange }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
167
|
+
};
|
|
168
|
+
/** SelectTextField with custom option, section title, and chip rendering via scoped slots */
|
|
169
|
+
export declare const CustomRender: {
|
|
170
|
+
render: () => {
|
|
171
|
+
components: {
|
|
172
|
+
StoryCustomRender: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
173
|
+
};
|
|
174
|
+
template: string;
|
|
175
|
+
};
|
|
176
|
+
};
|
|
177
|
+
/** SelectTextField with a creatable option before the list */
|
|
178
|
+
export declare const WithCreatableOptions: {
|
|
179
|
+
render: () => {
|
|
180
|
+
components: {
|
|
181
|
+
StoryWithCreatableOptions: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
182
|
+
};
|
|
183
|
+
template: string;
|
|
184
|
+
};
|
|
185
|
+
};
|
|
186
|
+
/** Single-select with consumer-controlled search (`filter="manual"` + `@search` listener) */
|
|
187
|
+
export declare const WithSearch: {
|
|
188
|
+
render: () => {
|
|
189
|
+
components: {
|
|
190
|
+
StoryWithSearch: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
191
|
+
};
|
|
192
|
+
template: string;
|
|
193
|
+
};
|
|
194
|
+
};
|
|
195
|
+
/** Multi-select with consumer-controlled search (`filter="manual"` + `@search` listener) */
|
|
196
|
+
export declare const MultipleWithSearch: {
|
|
197
|
+
render: () => {
|
|
198
|
+
components: {
|
|
199
|
+
StoryMultipleWithSearch: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
200
|
+
};
|
|
201
|
+
template: string;
|
|
202
|
+
};
|
|
203
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
title: string;
|
|
3
|
+
component: any;
|
|
4
|
+
tags: string[];
|
|
5
|
+
parameters: {
|
|
6
|
+
chromatic: {
|
|
7
|
+
disable: boolean;
|
|
8
|
+
};
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
export default _default;
|
|
12
|
+
export declare const ClickOutsideCloses: {
|
|
13
|
+
render: (args: any) => import("vue/jsx-runtime").JSX.Element;
|
|
14
|
+
play({ canvas }: any): Promise<void>;
|
|
15
|
+
};
|
|
16
|
+
export declare const BlurResetsToSelectedValue: {
|
|
17
|
+
render: (args: any) => import("vue/jsx-runtime").JSX.Element;
|
|
18
|
+
play({ canvas }: any): Promise<void>;
|
|
19
|
+
};
|
|
20
|
+
export declare const BlurResetsToEmpty: {
|
|
21
|
+
render: (args: any) => import("vue/jsx-runtime").JSX.Element;
|
|
22
|
+
play({ canvas }: any): Promise<void>;
|
|
23
|
+
};
|
|
24
|
+
export declare const MultiBlurResetsSearch: {
|
|
25
|
+
render: (args: any) => import("vue/jsx-runtime").JSX.Element;
|
|
26
|
+
play({ canvas }: any): Promise<void>;
|
|
27
|
+
};
|
|
28
|
+
/** Test infinite scroll loads more options when scrolling to the bottom */
|
|
29
|
+
export declare const WithInfiniteScroll: {
|
|
30
|
+
render: () => {
|
|
31
|
+
components: {
|
|
32
|
+
StoryWithInfiniteScroll: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
33
|
+
};
|
|
34
|
+
template: string;
|
|
35
|
+
};
|
|
36
|
+
play({ canvas }: any): Promise<void>;
|
|
37
|
+
};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
export default _default;
|