@lumx/vue 4.9.0-next.1 → 4.9.0-next.10

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.
@@ -1,11 +1,11 @@
1
- import { inject as l, computed as m, unref as P, defineComponent as c, provide as i, ref as y, watch as b, onBeforeUnmount as p, createVNode as C, Teleport as R, isVNode as x, onMounted as L } from "vue";
1
+ import { inject as i, computed as m, unref as P, defineComponent as c, provide as l, ref as y, watch as b, onBeforeUnmount as p, createVNode as C, Teleport as R, isVNode as x, onMounted as L } from "vue";
2
2
  import { Theme as T } from "@lumx/core/js/constants";
3
3
  function S(e = { defaultTheme: T.light }) {
4
- const { defaultTheme: n } = e, o = l("theme", void 0);
4
+ const { defaultTheme: n } = e, o = i("theme", void 0);
5
5
  return m(() => P(o) || n);
6
6
  }
7
7
  const g = c(
8
- (e, { slots: n }) => (i(
8
+ (e, { slots: n }) => (l(
9
9
  "theme",
10
10
  m(() => e.value)
11
11
  ), () => n.default?.()),
@@ -15,9 +15,9 @@ const g = c(
15
15
  }
16
16
  ), v = /* @__PURE__ */ Symbol("LumxPortal"), A = () => ({
17
17
  container: "body"
18
- }), O = /* @__PURE__ */ c((e, {
18
+ }), N = /* @__PURE__ */ c((e, {
19
19
  slots: n
20
- }) => (i(v, e.value), () => n.default?.()), {
20
+ }) => (l(v, e.value), () => n.default?.()), {
21
21
  name: "LumxPortalProvider",
22
22
  props: {
23
23
  value: {
@@ -29,20 +29,20 @@ const g = c(
29
29
  function w(e) {
30
30
  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !x(e);
31
31
  }
32
- const Y = /* @__PURE__ */ c((e, {
32
+ const O = /* @__PURE__ */ c((e, {
33
33
  slots: n
34
34
  }) => {
35
- const o = l(v, A), t = y(null), u = () => {
35
+ const o = i(v, A), t = y(null), u = () => {
36
36
  e.enabled ? t.value = o() : t.value = null;
37
37
  };
38
38
  return u(), b(() => e.enabled, u), p(() => {
39
39
  t.value?.teardown?.();
40
40
  }), () => {
41
- const r = n.default?.(), a = t.value?.container;
42
- return !e.enabled || !a ? r : C(R, {
43
- to: a
44
- }, w(r) ? r : {
45
- default: () => [r]
41
+ const a = n.default?.(), r = t.value?.container;
42
+ return !e.enabled || !r ? a : C(R, {
43
+ to: r
44
+ }, w(a) ? a : {
45
+ default: () => [a]
46
46
  });
47
47
  };
48
48
  }, {
@@ -55,39 +55,39 @@ const Y = /* @__PURE__ */ c((e, {
55
55
  }
56
56
  }), s = ["mousedown", "touchstart"];
57
57
  function E(e, n) {
58
- return !n.some((o) => e.some((t) => o?.contains(t)));
58
+ return !n.some((o) => o instanceof Node && e.some((t) => o.contains(t)));
59
59
  }
60
60
  function j(e, n) {
61
61
  if (!n)
62
62
  return;
63
63
  const o = (t) => {
64
- const u = [t.composedPath?.()[0], t.target], r = e();
65
- E(u, r) && n(t);
64
+ const u = [t.composedPath?.()[0], t.target].filter((r) => r instanceof Node), a = e();
65
+ E(u, a) && n(t);
66
66
  };
67
67
  return s.forEach((t) => document.addEventListener(t, o)), () => {
68
68
  s.forEach((t) => document.removeEventListener(t, o));
69
69
  };
70
70
  }
71
- const f = /* @__PURE__ */ Symbol("LumxClickAway"), I = /* @__PURE__ */ c((e, {
71
+ const f = /* @__PURE__ */ Symbol("LumxClickAway"), Y = /* @__PURE__ */ c((e, {
72
72
  slots: n
73
73
  }) => {
74
- const o = l(f, null), t = [], u = {
74
+ const o = i(f, null), t = [], u = {
75
75
  childrenRefs: t,
76
- addRefs(...a) {
77
- for (const h of a) {
76
+ addRefs(...r) {
77
+ for (const h of r) {
78
78
  const d = h.value;
79
79
  d && t.push(d);
80
80
  }
81
- o && (o.addRefs(...a), e.parentRef && o.addRefs(e.parentRef));
81
+ o && (o.addRefs(...r), e.parentRef && o.addRefs(e.parentRef));
82
82
  }
83
83
  };
84
- i(f, u);
85
- let r;
84
+ l(f, u);
85
+ let a;
86
86
  return L(() => {
87
- const a = e.childrenRefs.value;
88
- a && u.addRefs(...a), r = j(() => t, e.callback);
87
+ const r = e.childrenRefs.value;
88
+ r && u.addRefs(...r), a = j(() => t, e.callback);
89
89
  }), p(() => {
90
- r?.();
90
+ a?.();
91
91
  }), () => n.default?.();
92
92
  }, {
93
93
  name: "LumxClickAwayProvider",
@@ -107,11 +107,11 @@ const f = /* @__PURE__ */ Symbol("LumxClickAway"), I = /* @__PURE__ */ c((e, {
107
107
  }
108
108
  });
109
109
  export {
110
- I as C,
111
- Y as P,
110
+ Y as C,
111
+ O as P,
112
112
  g as T,
113
- O as a,
113
+ N as a,
114
114
  j as s,
115
115
  S as u
116
116
  };
117
- //# sourceMappingURL=DCsEMm-b.js.map
117
+ //# sourceMappingURL=BrPeaE_u.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DCsEMm-b.js","sources":["../../src/utils/theme/useTheme.ts","../../src/utils/theme/ThemeProvider.ts","../../src/utils/Portal/PortalProvider.tsx","../../src/utils/Portal/Portal.tsx","../../../lumx-core/src/js/utils/ClickAway/index.ts","../../src/utils/ClickAway/ClickAwayProvider.tsx"],"sourcesContent":["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","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 { 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) => 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] as HTMLElement[];\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 the context's collected refs directly\n teardown = setupClickAway(() => contextChildrenRefs, props.callback);\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"],"names":["useTheme","options","Theme","defaultTheme","injected","inject","computed","unref","ThemeProvider","defineComponent","props","slots","provide","PORTAL_KEY","Symbol","defaultPortalInit","container","PortalProvider","value","default","name","type","Function","required","_isSlot","s","Object","prototype","toString","call","_isVNode","Portal","portalInit","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","evtType","CLICK_AWAY_KEY","ClickAwayProvider","parentContext","contextChildrenRefs","currentContext","childrenRefs","addRefs","newChildrenRefs","newRef","el","push","parentRef","onMounted","refs","undefined"],"mappings":"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"}
1
+ {"version":3,"file":"BrPeaE_u.js","sources":["../../src/utils/theme/useTheme.ts","../../src/utils/theme/ThemeProvider.ts","../../src/utils/Portal/PortalProvider.tsx","../../src/utils/Portal/Portal.tsx","../../../lumx-core/src/js/utils/ClickAway/index.ts","../../src/utils/ClickAway/ClickAwayProvider.tsx"],"sourcesContent":["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","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 { 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 the context's collected refs directly\n teardown = setupClickAway(() => contextChildrenRefs, props.callback);\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"],"names":["useTheme","options","Theme","defaultTheme","injected","inject","computed","unref","ThemeProvider","defineComponent","props","slots","provide","PORTAL_KEY","Symbol","defaultPortalInit","container","PortalProvider","value","default","name","type","Function","required","_isSlot","s","Object","prototype","toString","call","_isVNode","Portal","portalInit","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","undefined"],"mappings":"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"}
@@ -1,28 +1,5 @@
1
1
  declare const _default: {
2
2
  component: any;
3
- argTypes: {
4
- 'list.itemPadding': {
5
- control: {
6
- type: "select" | "inline-radio";
7
- };
8
- options: ("big" | "huge" | undefined)[];
9
- mapping: Record<string, "big" | "huge" | undefined> | undefined;
10
- };
11
- 'listItem.size': {
12
- control: {
13
- type: "select" | "inline-radio";
14
- };
15
- options: ("big" | "tiny" | "regular" | undefined)[];
16
- mapping: Record<string, "big" | "tiny" | "regular" | undefined> | undefined;
17
- };
18
- };
19
- title: string;
20
- };
21
- export default _default;
22
- export declare const Default: {
23
- args: {
24
- label: string;
25
- };
26
3
  argTypes: {
27
4
  icon: {
28
5
  control: {
@@ -90,6 +67,27 @@ export declare const Default: {
90
67
  mdiViewList: string;
91
68
  };
92
69
  };
70
+ 'list.itemPadding': {
71
+ control: {
72
+ type: "select" | "inline-radio";
73
+ };
74
+ options: ("big" | "huge" | undefined)[];
75
+ mapping: Record<string, "big" | "huge" | undefined> | undefined;
76
+ };
77
+ 'listItem.size': {
78
+ control: {
79
+ type: "select" | "inline-radio";
80
+ };
81
+ options: ("big" | "tiny" | "regular" | undefined)[];
82
+ mapping: Record<string, "big" | "tiny" | "regular" | undefined> | undefined;
83
+ };
84
+ };
85
+ title: string;
86
+ };
87
+ export default _default;
88
+ export declare const Default: {
89
+ args: {
90
+ label: string;
93
91
  };
94
92
  render({ "list.itemPadding": itemPadding, "listItem.size": itemSize, ...args }: any): import("vue/jsx-runtime").JSX.Element;
95
93
  };
@@ -0,0 +1,30 @@
1
+ import { MosaicProps as UIProps, MosaicPropsToOverride } from '@lumx/core/js/components/Mosaic';
2
+ import { VueToJSXProps } from '../../utils/VueToJSX';
3
+ import { ThumbnailProps } from '../thumbnail/Thumbnail';
4
+ export type MosaicThumbnailItem = Omit<ThumbnailProps, 'class'> & {
5
+ onClick?: (event: Event) => void;
6
+ };
7
+ export type MosaicProps = VueToJSXProps<UIProps, MosaicPropsToOverride> & {
8
+ /** Thumbnails. */
9
+ thumbnails: MosaicThumbnailItem[];
10
+ };
11
+ export declare const emitSchema: {
12
+ handleClick: (index: number) => boolean;
13
+ };
14
+ /**
15
+ * Mosaic component.
16
+ *
17
+ * @param props Component props.
18
+ * @return Vue element.
19
+ */
20
+ declare const Mosaic: import('vue').DefineSetupFnComponent<MosaicProps, {
21
+ handleClick: (index: number) => boolean;
22
+ }, {}, Omit<UIProps, "className" | import('@lumx/core/js/types').PropsToOverride | "children" | MosaicPropsToOverride> & {
23
+ class?: string;
24
+ } & {
25
+ /** Thumbnails. */
26
+ thumbnails: MosaicThumbnailItem[];
27
+ } & {
28
+ onHandleClick?: ((index: number) => any) | undefined;
29
+ }, import('vue').PublicProps>;
30
+ export default Mosaic;
@@ -0,0 +1,93 @@
1
+ declare const _default: {
2
+ component: any;
3
+ render: (args: any) => import("vue/jsx-runtime").JSX.Element;
4
+ args: Partial<import('@lumx/core/js/components/Mosaic').MosaicProps>;
5
+ argTypes: {};
6
+ decorators: ((story: any, context: any) => any)[];
7
+ title: string;
8
+ };
9
+ export default _default;
10
+ export declare const OneThumbnail: {
11
+ args: {
12
+ thumbnails: {
13
+ image: string;
14
+ }[];
15
+ };
16
+ };
17
+ export declare const OneThumbnailClickable: {
18
+ args: {
19
+ thumbnails: {
20
+ image: string;
21
+ }[];
22
+ };
23
+ };
24
+ export declare const TwoThumbnail: {
25
+ args: {
26
+ thumbnails: {
27
+ image: string;
28
+ }[];
29
+ };
30
+ };
31
+ export declare const TwoThumbnailClickable: {
32
+ args: {
33
+ thumbnails: {
34
+ image: string;
35
+ }[];
36
+ };
37
+ };
38
+ export declare const ThreeThumbnail: {
39
+ args: {
40
+ thumbnails: {
41
+ image: string;
42
+ }[];
43
+ };
44
+ };
45
+ export declare const ThreeThumbnailClickable: {
46
+ args: {
47
+ thumbnails: {
48
+ image: string;
49
+ }[];
50
+ };
51
+ };
52
+ export declare const FourThumbnail: {
53
+ args: {
54
+ thumbnails: {
55
+ image: string;
56
+ }[];
57
+ };
58
+ };
59
+ export declare const FourThumbnailClickable: {
60
+ args: {
61
+ thumbnails: {
62
+ image: string;
63
+ }[];
64
+ };
65
+ };
66
+ export declare const FiveThumbnail: {
67
+ args: {
68
+ thumbnails: {
69
+ image: string;
70
+ }[];
71
+ };
72
+ };
73
+ export declare const FiveThumbnailClickable: {
74
+ args: {
75
+ thumbnails: {
76
+ image: string;
77
+ }[];
78
+ };
79
+ };
80
+ export declare const SixThumbnail: {
81
+ args: {
82
+ thumbnails: {
83
+ image: string;
84
+ }[];
85
+ };
86
+ };
87
+ export declare const SixThumbnailClickable: {
88
+ args: {
89
+ thumbnails: {
90
+ image: string;
91
+ }[];
92
+ };
93
+ };
@@ -0,0 +1 @@
1
+ export { default as Mosaic, type MosaicProps, type MosaicThumbnailItem } from './Mosaic';
@@ -0,0 +1,16 @@
1
+ import { TabProps as UIProps, TabPropsToOverride, CLASSNAME, COMPONENT_NAME, DEFAULT_PROPS } from '@lumx/core/js/components/Tabs/Tab';
2
+ import { VueToJSXProps } from '../../utils/VueToJSX';
3
+ export type TabProps = VueToJSXProps<UIProps, TabPropsToOverride>;
4
+ export { CLASSNAME, COMPONENT_NAME, DEFAULT_PROPS };
5
+ /**
6
+ * Tab component.
7
+ *
8
+ * Implements WAI-ARIA `tab` role.
9
+ *
10
+ * @param props Component props.
11
+ * @return Vue element.
12
+ */
13
+ declare const Tab: import('vue').DefineSetupFnComponent<TabProps, {}, {}, Omit<UIProps, "className" | import('@lumx/core/js/types').PropsToOverride | "children" | TabPropsToOverride> & {
14
+ class?: string;
15
+ } & {}, import('vue').PublicProps>;
16
+ export default Tab;
@@ -0,0 +1,21 @@
1
+ import { TabListProps as UIProps, TabListLayout, COMPONENT_NAME, DEFAULT_PROPS } from '@lumx/core/js/components/Tabs/TabList';
2
+ import { TABS_CLASSNAME as CLASSNAME } from '@lumx/core/js/components/Tabs/constants';
3
+ import { VueToJSXProps } from '../../utils/VueToJSX';
4
+ type InternalProps = VueToJSXProps<UIProps, 'aria-label'>;
5
+ /** Public props type (includes aria-label for TypeScript consumers). */
6
+ export type TabListProps = InternalProps & {
7
+ 'aria-label': string;
8
+ };
9
+ export { TabListLayout, CLASSNAME, COMPONENT_NAME, DEFAULT_PROPS };
10
+ /**
11
+ * TabList component.
12
+ *
13
+ * Implements WAI-ARIA `tablist` role.
14
+ *
15
+ * @param props Component props.
16
+ * @return Vue element.
17
+ */
18
+ declare const TabList: import('vue').DefineSetupFnComponent<InternalProps, {}, {}, Omit<UIProps, "className" | import('@lumx/core/js/types').PropsToOverride | "children" | "aria-label"> & {
19
+ class?: string;
20
+ } & {}, import('vue').PublicProps>;
21
+ export default TabList;
@@ -0,0 +1,16 @@
1
+ import { TabPanelProps as UIProps, TabPanelPropsToOverride, CLASSNAME, COMPONENT_NAME, DEFAULT_PROPS } from '@lumx/core/js/components/Tabs/TabPanel';
2
+ import { VueToJSXProps } from '../../utils/VueToJSX';
3
+ export type TabPanelProps = VueToJSXProps<UIProps, TabPanelPropsToOverride>;
4
+ export { CLASSNAME, COMPONENT_NAME, DEFAULT_PROPS };
5
+ /**
6
+ * TabPanel component.
7
+ *
8
+ * Implements WAI-ARIA `tabpanel` role.
9
+ *
10
+ * @param props Component props.
11
+ * @return Vue element.
12
+ */
13
+ declare const TabPanel: import('vue').DefineSetupFnComponent<TabPanelProps, {}, {}, Omit<UIProps, "className" | import('@lumx/core/js/types').PropsToOverride | "children" | TabPanelPropsToOverride> & {
14
+ class?: string;
15
+ } & {}, import('vue').PublicProps>;
16
+ export default TabPanel;
@@ -0,0 +1,26 @@
1
+ export interface TabProviderProps {
2
+ /** Active tab index (controlled mode). */
3
+ activeTabIndex?: number;
4
+ /** Tab panel children should not render if the tab panel is hidden. */
5
+ isLazy?: boolean;
6
+ /** Activate tabs on focus. */
7
+ shouldActivateOnFocus?: boolean;
8
+ }
9
+ export declare const emitSchema: {
10
+ change: (index: number) => boolean;
11
+ };
12
+ /**
13
+ * This component provides a context in which tabs can be defined and linked to their tab panel.
14
+ *
15
+ * It does not produce any markup so you can wrap it around any Vue elements and then split
16
+ * the TabList and TabPanel components in the component tree.
17
+ *
18
+ * @param props Component props.
19
+ * @return Vue element.
20
+ */
21
+ declare const TabProvider: import('vue').DefineSetupFnComponent<TabProviderProps, {
22
+ change: (index: number) => boolean;
23
+ }, {}, TabProviderProps & {
24
+ onChange?: ((index: number) => any) | undefined;
25
+ }, import('vue').PublicProps>;
26
+ export default TabProvider;
@@ -0,0 +1,53 @@
1
+ import { TabListLayout } from '../..';
2
+ declare const _default: {
3
+ title: string;
4
+ parameters: {
5
+ controls: {
6
+ sort: string;
7
+ };
8
+ };
9
+ };
10
+ export default _default;
11
+ /** Default tab behavior */
12
+ export declare const Default: {
13
+ render: ({ layout, position }: any) => import("vue/jsx-runtime").JSX.Element;
14
+ argTypes: {
15
+ layout: {
16
+ control: {
17
+ type: "select" | "inline-radio";
18
+ };
19
+ options: TabListLayout[];
20
+ mapping: Record<string, TabListLayout> | undefined;
21
+ };
22
+ position: {
23
+ control: {
24
+ type: "select" | "inline-radio";
25
+ };
26
+ options: ("center" | "right" | "left")[];
27
+ mapping: Record<string, "center" | "right" | "left"> | undefined;
28
+ };
29
+ };
30
+ };
31
+ /** Control active tab externally. */
32
+ export declare const Controlled: {
33
+ render(): () => import("vue/jsx-runtime").JSX.Element;
34
+ parameters: {
35
+ chromatic: {
36
+ disable: boolean;
37
+ };
38
+ };
39
+ tags: string[];
40
+ };
41
+ /** Dynamically generate tabs. */
42
+ export declare const DynamicTabs: {
43
+ render({ tabCount }: any): () => import("vue/jsx-runtime").JSX.Element;
44
+ args: {
45
+ tabCount: number;
46
+ };
47
+ parameters: {
48
+ chromatic: {
49
+ disable: boolean;
50
+ };
51
+ };
52
+ tags: string[];
53
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,4 @@
1
+ export { default as Tab, type TabProps } from './Tab';
2
+ export { default as TabList, type TabListProps, TabListLayout } from './TabList';
3
+ export { default as TabPanel, type TabPanelProps } from './TabPanel';
4
+ export { default as TabProvider, type TabProviderProps } from './TabProvider';
@@ -0,0 +1,19 @@
1
+ import { ComputedRef, InjectionKey, Ref } from 'vue';
2
+ import { Action, State, TabState, TabType } from '@lumx/core/js/components/Tabs/state';
3
+ export { type TabType, type State, INIT_STATE, type Action, reducer, type TabState, } from '@lumx/core/js/components/Tabs/state';
4
+ export type TabProviderContextValue = {
5
+ state: Ref<State>;
6
+ dispatch: (action: Action) => void;
7
+ };
8
+ /** Injection key used by TabProvider (provide) and Tab/TabPanel (inject). */
9
+ export declare const TAB_PROVIDER_INJECT_KEY: InjectionKey<TabProviderContextValue>;
10
+ /**
11
+ * Composable equivalent of React's useTabProviderContext.
12
+ * Registers the tab/tabPanel with the provider on mount and unregisters on unmount.
13
+ * Returns a computed ref with the derived tab state, or undefined if no provider is present.
14
+ */
15
+ export declare const useTabProviderContext: (type: TabType, originalId?: string) => ComputedRef<TabState | undefined>;
16
+ /**
17
+ * Returns the raw tab provider state ref, or undefined if no provider is present.
18
+ */
19
+ export declare const useTabProviderContextState: () => Ref<State> | undefined;
@@ -0,0 +1,39 @@
1
+ import { UserBlockProps as UIProps, UserBlockPropsToOverride, CLASSNAME, COMPONENT_NAME, DEFAULT_PROPS, UserBlockSize } from '@lumx/core/js/components/UserBlock';
2
+ import { VueToJSXProps } from '../../utils/VueToJSX';
3
+ import { AvatarProps } from '../avatar';
4
+ export type { UserBlockSize };
5
+ export type UserBlockProps = VueToJSXProps<UIProps, UserBlockPropsToOverride | 'handleClick' | 'handleMouseEnter' | 'handleMouseLeave' | 'simpleAction' | 'multipleActions' | 'additionalFields' | 'after'> & {
6
+ /** Props to pass to the avatar. */
7
+ avatarProps?: Omit<AvatarProps, 'alt'>;
8
+ /** Props to pass to the link wrapping the avatar thumbnail. */
9
+ linkProps?: Record<string, any>;
10
+ };
11
+ export declare const emitSchema: {
12
+ click: () => boolean;
13
+ mouseenter: () => boolean;
14
+ mouseleave: () => boolean;
15
+ };
16
+ export { CLASSNAME, COMPONENT_NAME, DEFAULT_PROPS };
17
+ /**
18
+ * UserBlock component.
19
+ *
20
+ * @param props Component props.
21
+ * @return Vue element.
22
+ */
23
+ declare const UserBlock: import('vue').DefineSetupFnComponent<UserBlockProps, {
24
+ click: () => boolean;
25
+ mouseenter: () => boolean;
26
+ mouseleave: () => boolean;
27
+ }, {}, Omit<UIProps, "className" | import('@lumx/core/js/types').PropsToOverride | "children" | "after" | "multipleActions" | "simpleAction" | "additionalFields" | UserBlockPropsToOverride> & {
28
+ class?: string;
29
+ } & {
30
+ /** Props to pass to the avatar. */
31
+ avatarProps?: Omit<AvatarProps, "alt">;
32
+ /** Props to pass to the link wrapping the avatar thumbnail. */
33
+ linkProps?: Record<string, any>;
34
+ } & {
35
+ onClick?: (() => any) | undefined;
36
+ onMouseenter?: (() => any) | undefined;
37
+ onMouseleave?: (() => any) | undefined;
38
+ }, import('vue').PublicProps>;
39
+ export default UserBlock;