@reapit/elements 5.0.0-beta.84 → 5.0.0-beta.85

package/dist/types/utils/video/__tests__/video.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=video.test.d.ts.map

package/dist/types/utils/video/__tests__/video.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"video.test.d.ts","sourceRoot":"","sources":["../../../../../src/utils/video/__tests__/video.test.tsx"],"names":[],"mappings":""}

package/dist/types/utils/video/index.d.ts

@@ -0,0 +1,4 @@
+export * from './styles';
+export * from './use-video';
+export * from './video';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/utils/video/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/utils/video/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,aAAa,CAAA;AAC3B,cAAc,SAAS,CAAA"}

package/dist/types/utils/video/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const elVideoContainer: import("@linaria/core").LinariaClassName;
+export declare const elVideo: import("@linaria/core").LinariaClassName;
+//# sourceMappingURL=styles.d.ts.map

package/dist/types/utils/video/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/utils/video/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,gBAAgB,0CAM5B,CAAA;AAED,eAAO,MAAM,OAAO,0CA8BnB,CAAA"}

package/dist/types/utils/video/use-video.d.ts

@@ -0,0 +1,19 @@
+import type { ReactEventHandler } from 'react';
+export declare namespace useVideo {
+    interface Input {
+        /** Callback fired when the video fails to load. */
+        onError?: ReactEventHandler<HTMLVideoElement>;
+        /** Callback fired when the video has loaded enough to begin playback. */
+        onLoadedData?: ReactEventHandler<HTMLVideoElement>;
+    }
+    interface Output {
+        /** Whether the video encountered a loading error. */
+        hasError: boolean;
+        /** Handler to attach to the video element's `onLoadedData` event. */
+        handleLoadedData: ReactEventHandler<HTMLVideoElement>;
+        /** Handler to attach to the video element's `onError` event. */
+        handleError: ReactEventHandler<HTMLVideoElement>;
+    }
+}
+export declare function useVideo({ onError, onLoadedData }?: useVideo.Input): useVideo.Output;
+//# sourceMappingURL=use-video.d.ts.map

package/dist/types/utils/video/use-video.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-video.d.ts","sourceRoot":"","sources":["../../../../src/utils/video/use-video.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAE9C,yBAAiB,QAAQ,CAAC;IACxB,UAAiB,KAAK;QACpB,mDAAmD;QACnD,OAAO,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAA;QAC7C,yEAAyE;QACzE,YAAY,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAA;KACnD;IAED,UAAiB,MAAM;QACrB,qDAAqD;QACrD,QAAQ,EAAE,OAAO,CAAA;QACjB,qEAAqE;QACrE,gBAAgB,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAA;QACrD,gEAAgE;QAChE,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAA;KACjD;CACF;AAED,wBAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,GAAE,QAAQ,CAAC,KAAU,GAAG,QAAQ,CAAC,MAAM,CAcxF"}

package/dist/types/utils/video/video.d.ts

@@ -0,0 +1,25 @@
+import { MediaFallback } from '../media-fallback';
+import type { ReactNode, VideoHTMLAttributes } from 'react';
+export declare namespace Video {
+    interface Props extends Omit<VideoHTMLAttributes<HTMLVideoElement>, 'height' | 'width'> {
+        /** Custom fallback content displayed when the video fails to load. */
+        fallback?: ReactNode;
+        /** CSS height of the video container. */
+        height: string;
+        /** How the video should be resized to fit its container. */
+        objectFit?: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
+        /**
+         * Source URL of the video. Optional when `<source>` elements are provided as `children`
+         * instead. When all sources fail to load, an error event fires on the `<video>` element
+         * and the fallback UI is shown.
+         */
+        src?: string;
+        /** CSS width of the video container. */
+        width: string;
+    }
+}
+export declare function Video({ children, className, controls, fallback, height, objectFit, onError, onLoadedData, src, style, tabIndex, width, ...rest }: Video.Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace Video {
+    var Fallback: typeof MediaFallback;
+}
+//# sourceMappingURL=video.d.ts.map

package/dist/types/utils/video/video.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"video.d.ts","sourceRoot":"","sources":["../../../../src/utils/video/video.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAKjD,OAAO,KAAK,EAAiB,SAAS,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAE1E,yBAAiB,KAAK,CAAC;IACrB,UAAiB,KAAM,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;QAC5F,sEAAsE;QACtE,QAAQ,CAAC,EAAE,SAAS,CAAA;QACpB,yCAAyC;QACzC,MAAM,EAAE,MAAM,CAAA;QACd,4DAA4D;QAC5D,SAAS,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,YAAY,CAAA;QAChE;;;;WAIG;QACH,GAAG,CAAC,EAAE,MAAM,CAAA;QACZ,wCAAwC;QACxC,KAAK,EAAE,MAAM,CAAA;KACd;CACF;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,SAAqB,EACrB,OAAO,EACP,YAAY,EACZ,GAAG,EACH,KAAK,EACL,QAAQ,EACR,KAAK,EACL,GAAG,IAAI,EACR,EAAE,KAAK,CAAC,KAAK,2CAmCb;yBAjDe,KAAK"}

package/dist/types/utils/video/video.stories.d.ts

@@ -0,0 +1,48 @@
+import { Video } from './video';
+import type { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: typeof Video;
+    argTypes: {
+        objectFit: {
+            control: "select";
+        };
+        src: {
+            control: "text";
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof Video>;
+/**
+ * By default, the video uses `object-fit: contain` so the entire video is visible
+ * within the container without any cropping, regardless of the video's aspect ratio.
+ */
+export declare const Example: Story;
+/**
+ * While the video accepts an explicit width and height, it is constrained to the size of its container.
+ * This allows ancestors to control the size the video is displayed at.
+ */
+export declare const Sizing: Story;
+/**
+ * `objectFit` determines how the video is resized to fit its container. Here, `cover` is used to
+ * size the video to fill its content box while maintaining its aspect ratio.
+ */
+export declare const ObjectFit: Story;
+/**
+ * Pass `<source>` elements as `children` to let the browser select the most suitable format.
+ * The error fallback is shown when all sources have been exhausted.
+ * Note: `src` is optional when `<source>` children are used.
+ */
+export declare const Sources: Story;
+/**
+ * If the video fails to load, a default fallback UI is shown. The fallback uses
+ * `aria-live="polite"` and `role="status"` so assistive technology announces
+ * the error state.
+ */
+export declare const Fallback: Story;
+/**
+ * Use `fallback` to provide custom fallback content.
+ */
+export declare const CustomFallback: Story;
+//# sourceMappingURL=video.stories.d.ts.map

package/dist/types/utils/video/video.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"video.stories.d.ts","sourceRoot":"","sources":["../../../../src/utils/video/video.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,QAAA,MAAM,IAAI;;;;;;;;;;;CASoB,CAAA;AAE9B,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,KAAK,CAAC,CAAA;AAEnC;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KAerB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,EAAE,KAWpB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,KAKvB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAoBrB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE,KAqB5B,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reapit/elements",
-  "version": "5.0.0-beta.84",
+  "version": "5.0.0-beta.85",
   "description": "A React implementation of Reapit's Design System",
   "homepage": "https://github.com/reapit/elements#readme",
   "bugs": {
@@ -24,6 +24,7 @@
       "types": [
         "./src/*.js",
         "./src/*/index.js",
+        "./dist/types/*.d.ts",
         "./dist/types/*/index.d.ts"
       ],
       "import": "./src/*"
@@ -107,11 +108,11 @@
     "@figma/code-connect": "^1.4.1",
     "@linaria/postcss-linaria": "7.0.0",
     "@playwright/test": "1.58.2",
-    "@storybook/addon-a11y": "10.3.1",
-    "@storybook/addon-docs": "10.3.1",
-    "@storybook/addon-links": "10.3.1",
-    "@storybook/cli": "10.3.1",
-    "@storybook/react-vite": "10.3.1",
+    "@storybook/addon-a11y": "10.3.3",
+    "@storybook/addon-docs": "10.3.3",
+    "@storybook/addon-links": "10.3.3",
+    "@storybook/cli": "10.3.3",
+    "@storybook/react-vite": "10.3.3",
     "@testing-library/dom": "10.4.1",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.2",
@@ -121,8 +122,8 @@
     "@types/react-dom": "18.3.7",
     "@vitejs/plugin-react": "^6.0.1",
     "@vitest/coverage-v8": "^4.1.0",
-    "@wyw-in-js/babel-preset": "1.0.6",
-    "@wyw-in-js/vite": "1.0.6",
+    "@wyw-in-js/babel-preset": "1.0.7",
+    "@wyw-in-js/vite": "1.0.7",
     "colord": "2.9.3",
     "coverage-badges-cli": "2.2.0",
     "dashify": "2.0.0",
@@ -131,20 +132,20 @@
     "http-server": "^14.1.1",
     "husky": "^9.1.7",
     "lint-staged": "^16.4.0",
-    "oxfmt": "^0.41.0",
+    "oxfmt": "^0.42.0",
     "oxlint": "^1.55.0",
     "postcss": "8.5.8",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "rimraf": "6.1.3",
     "snyk": "^1.1303.1",
-    "storybook": "10.3.1",
+    "storybook": "10.3.3",
     "style-dictionary": "5.4.0",
-    "stylelint": "17.5.0",
+    "stylelint": "17.6.0",
     "ts-morph": "^27.0.2",
-    "typescript": "^5.9.3",
+    "typescript": "^6.0.2",
     "vite": "^8.0.0",
-    "vite-plugin-svgr": "^4.5.0",
+    "vite-plugin-svgr": "^5.0.0",
     "vitest": "^4.1.0"
   },
   "peerDependencies": {

package/dist/js/image-DnCb83Fu.js

@@ -1,95 +0,0 @@
-import { t as e } from "./dist-Du1lGuAB.js";
-import { t } from "./photo-D9oujcFA.js";
-import { useState as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/utils/image/styles.ts
-var a = "el-image-container", o = "el-image", s = "el-image-fallback", c = "el-image-fallback-overlay", l = "el-image-fallback-icon", u = "el-image-fallback-message", d = "el-responsive-image";
-//#endregion
-//#region src/utils/image/image-fallback.tsx
-function f({ children: t, className: n, icon: a, ...o }) {
-	return /* @__PURE__ */ i("div", {
-		...o,
-		className: e(s, n),
-		children: [a && /* @__PURE__ */ r("div", {
-			"aria-hidden": !0,
-			className: "el-image-fallback-icon",
-			children: a
-		}), t && /* @__PURE__ */ r("p", {
-			className: "el-image-fallback-message",
-			children: t
-		})]
-	});
-}
-f.displayName = "Image.Fallback";
-//#endregion
-//#region src/utils/image/responsive-image.tsx
-function p({ className: t, height: n, objectFit: i = "contain", width: a, ...o }) {
-	let s = {
-		...a !== void 0 && { "--image-width": a },
-		...n !== void 0 && { "--image-height": n }
-	};
-	return /* @__PURE__ */ r("img", {
-		...o,
-		className: e(d, t),
-		"data-object-fit": i,
-		style: {
-			...o.style,
-			...s
-		}
-	});
-}
-//#endregion
-//#region src/utils/image/use-image.ts
-function m({ onError: e, onLoad: t } = {}) {
-	let [r, i] = n(!1);
-	return {
-		handleError: (t) => {
-			i(!0), e?.(t);
-		},
-		handleLoad: (e) => {
-			i(!1), t?.(e);
-		},
-		hasError: r
-	};
-}
-//#endregion
-//#region src/utils/image/image.tsx
-function h({ alt: n, className: s, fallback: c, height: l, objectFit: u = "contain", onError: d, onLoad: h, src: g, width: _, ...v }) {
-	let { handleError: y, handleLoad: b, hasError: x } = m({
-		onError: d,
-		onLoad: h
-	}), S = n !== "" && !c, C = n ? `The image could not be loaded: ${n}` : "The image could not be loaded";
-	return /* @__PURE__ */ i("div", {
-		className: a,
-		style: {
-			"--image-width": _,
-			"--image-height": l
-		},
-		children: [/* @__PURE__ */ r(p, {
-			...v,
-			alt: n,
-			"aria-hidden": x ? "true" : void 0,
-			className: e(o, s),
-			objectFit: u,
-			onError: y,
-			onLoad: b,
-			src: g
-		}), x && /* @__PURE__ */ r("div", {
-			className: "el-image-fallback-overlay",
-			children: c ?? /* @__PURE__ */ r(f, {
-				"aria-atomic": S ? "true" : void 0,
-				"aria-live": S ? "polite" : void 0,
-				icon: /* @__PURE__ */ r(t, {
-					"aria-hidden": !0,
-					color: "primary",
-					size: "lg"
-				}),
-				role: S ? "status" : void 0,
-				children: C
-			})
-		})]
-	});
-}
-h.Fallback = f;
-//#endregion
-export { o as a, l as c, d, f as i, u as l, m as n, a as o, p as r, s, h as t, c as u };

package/dist/js/key-value-list-zoqFOL6c.js

@@ -1,47 +0,0 @@
-import { ht as e, lt as t, ut as n } from "./grid-DZ8TDSFa.js";
-import { t as r } from "./dist-DLc9lUhF.js";
-import { t as i } from "./dist-Du1lGuAB.js";
-import { FlexContainer as a } from "./deprecated/layout.js";
-import { TextSM as o, TextXS as s } from "./deprecated/typography.js";
-import "react";
-import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
-//#region src/styles/deprecated-typography.ts
-var d = "el-text-left", f = "el-text-center", p = "el-text-right", m = "el-text-justify", h = "el-font-bold", g = "el-font-italic", _ = "el-font-uppercase", v = "el-text-ellipsis", y = "el-code", b = /* @__PURE__ */ r("div")({
-	name: "ElKeyValueIconWrap",
-	class: "el-key-value-icon-wrap",
-	propsAsIs: !1
-}), x = /* @__PURE__ */ r("div")({
-	name: "ElKeyValueListWrap",
-	class: "el-key-value-list-wrap",
-	propsAsIs: !1
-}), S = ({ children: e, className: t, ...n }) => /* @__PURE__ */ l(b, {
-	className: i(t),
-	...n,
-	children: e
-}), C = ({ children: e, className: t, ...n }) => /* @__PURE__ */ l(x, {
-	className: i(t),
-	...n,
-	children: e
-}), w = ({ item: { intent: e, iconName: t, icon: n, value: r, key: d, textEllipsis: f } }) => /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(S, { children: n || t || "" }), /* @__PURE__ */ u(a, {
-	isFlexColumn: !0,
-	children: [/* @__PURE__ */ l(s, {
-		className: i(f && "el-text-ellipsis"),
-		hasGreyText: !0,
-		children: d
-	}), /* @__PURE__ */ l(o, {
-		className: i(f && "el-text-ellipsis"),
-		children: r
-	})]
-})] }), T = ({ className: r, items: o, hasGrid: s, ...c }) => s ? /* @__PURE__ */ l(e, {
-	className: i(r),
-	...c,
-	children: o.map((e) => e.colSize === "half" ? /* @__PURE__ */ l(n, { children: /* @__PURE__ */ l(a, { children: /* @__PURE__ */ l(w, { item: e }) }) }, e.key) : /* @__PURE__ */ l(t, { children: /* @__PURE__ */ l(a, { children: /* @__PURE__ */ l(w, { item: e }) }) }, e.key))
-}) : /* @__PURE__ */ l("div", {
-	role: "list",
-	children: o.map((e) => /* @__PURE__ */ l(C, {
-		role: "listitem",
-		children: /* @__PURE__ */ l(w, { item: e })
-	}, e.key))
-});
-//#endregion
-export { b as a, h as c, f as d, v as f, p as h, C as i, g as l, d as m, S as n, x as o, m as p, T as r, y as s, w as t, _ as u };

package/dist/js/lab/select-custom.js

@@ -1,259 +0,0 @@
-import { t as e } from "../dist-DLc9lUhF.js";
-import "../make-icon-Cez0iOAn.js";
-import { t } from "../chevron-down-BJacFTxw.js";
-import { t as n } from "../close-DmeJ8DiA.js";
-import { t as r } from "../button-jgaS-YWF.js";
-import { t as i } from "../check-CFmQeZXr.js";
-import { t as a } from "../popover-DY4LMxoS.js";
-import "../anchor-positioning-XqfCUAUX.js";
-import { t as o } from "../chip-group-BQqToHL0.js";
-import { LabelText as s } from "../core/label-text.js";
-import { Badge as c } from "../core/badge.js";
-import { Text as l } from "../utils/text.js";
-import { createContext as u, useContext as d, useEffect as f, useRef as p, useState as m } from "react";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
-//#region src/lab/select-custom/styles.tsx
-var _ = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomContainer",
-	class: "el-experimental-select-custom-container",
-	propsAsIs: !1
-}), v = /* @__PURE__ */ e(r)({
-	name: "ElExperimentalSelectCustomInputField",
-	class: "el-experimental-select-custom-input-field",
-	propsAsIs: !0
-}), y = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomContent",
-	class: "el-experimental-select-custom-content",
-	propsAsIs: !1
-}), b = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomPlaceholder",
-	class: "el-experimental-select-custom-placeholder",
-	propsAsIs: !1
-}), x = "el-experimental-select-custom-popover", S = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomOptionGroup",
-	class: "el-experimental-select-custom-option-group",
-	propsAsIs: !1
-}), C = "el-experimental-select-custom-group-title", w = /* @__PURE__ */ e("li")({
-	name: "ElExperimentalSelectCustomOption",
-	class: "el-experimental-select-custom-option",
-	propsAsIs: !1
-}), T = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomLabelContainer",
-	class: "el-experimental-select-custom-label-container",
-	propsAsIs: !1
-}), E = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomLabelItem",
-	class: "el-experimental-select-custom-label-item",
-	propsAsIs: !1
-}), D = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomAdditionalInfo1",
-	class: "el-experimental-select-custom-additional-info1",
-	propsAsIs: !1
-}), O = /* @__PURE__ */ e("div")({
-	name: "ElExperimentalSelectCustomAdditionalInfo2",
-	class: "el-experimental-select-custom-additional-info2",
-	propsAsIs: !1
-}), k = ({ label: e, children: t }) => /* @__PURE__ */ g(S, {
-	role: "group",
-	children: [e && /* @__PURE__ */ h(s, {
-		size: "xs",
-		children: e
-	}), t]
-}), A = u({
-	selectedValues: [],
-	onSelect: () => {},
-	isMultiple: !1
-});
-function j() {
-	return d(A);
-}
-//#endregion
-//#region src/lab/select-custom/option/option.tsx
-var M = ({ value: e, label: t, badge: n, additionalInfo1: r, additionalInfo2: a }) => {
-	let { selectedValues: o, onSelect: l } = j(), u = o.some((t) => t.value === e), d = () => l({
-		value: e,
-		label: t
-	});
-	return /* @__PURE__ */ g(w, {
-		role: "option",
-		"aria-selected": u,
-		tabIndex: -1,
-		onClick: d,
-		children: [
-			/* @__PURE__ */ g(T, { children: [/* @__PURE__ */ g(E, { children: [/* @__PURE__ */ h(s, {
-				size: "xs",
-				children: t
-			}), n && /* @__PURE__ */ h(c, {
-				colour: "neutral",
-				children: n
-			})] }), u && /* @__PURE__ */ h(i, {
-				size: "md",
-				color: "secondary"
-			})] }),
-			r && /* @__PURE__ */ h(D, { children: r }),
-			a && /* @__PURE__ */ h(O, { children: a })
-		]
-	});
-}, N = (e) => {
-	let t = p(null), [n, r] = m(0);
-	return f(() => {
-		let i = t.current;
-		if (!i) return;
-		let a = (t) => {
-			let a = i.querySelectorAll("[role=\"option\"]");
-			a.length && (t.key === "ArrowDown" ? (t.preventDefault(), r((e) => (e + 1) % a.length)) : t.key === "ArrowUp" ? (t.preventDefault(), r((e) => (e - 1 + a.length) % a.length)) : t.key === "Enter" ? (t.preventDefault(), a[n]?.click()) : t.key === "Escape" && (t.preventDefault(), document.getElementById(e)?.hidePopover?.()));
-		};
-		return i.addEventListener("keydown", a), () => i.removeEventListener("keydown", a);
-	}, [n, e]), f(() => {
-		let e = t.current;
-		if (!e) return;
-		let r = e.querySelectorAll("[role=\"option\"]");
-		r.forEach((e, t) => {
-			e.setAttribute("tabindex", t === n ? "0" : "-1");
-		}), r[n]?.focus();
-	}, [n]), f(() => {
-		let n = document.getElementById(e);
-		if (!n) return;
-		let i = new MutationObserver(() => {
-			if (n.matches(":popover-open")) {
-				let e = t.current?.querySelectorAll("[role=\"option\"]");
-				e && e.length > 0 && (r(0), e[0].focus());
-			}
-		});
-		return i.observe(n, {
-			attributes: !0,
-			attributeFilter: ["popover"]
-		}), () => i.disconnect();
-	}, [e]), t;
-}, P = (e, t) => {
-	let n = [], r = (e) => {
-		if (e) {
-			if (Array.isArray(e)) e.forEach(r);
-			else if (typeof e == "object" && "props" in e) {
-				let t = e.props;
-				e.type === M && t.selected && n.push({
-					value: t.value,
-					label: t.label
-				}), e.type === k && r(t.children);
-			}
-		}
-	};
-	return r(e), !t && n.length > 1 ? [n[0]] : n;
-}, F = (e) => {
-	let t = 0, n = (e) => {
-		if (e) {
-			if (Array.isArray(e)) e.forEach(n);
-			else if (typeof e == "object" && "props" in e) {
-				let r = e.props;
-				e.type === M && (t += 1), e.type === k && n(r.children);
-			}
-		}
-	};
-	return n(e), t;
-};
-//#endregion
-//#region src/lab/select-custom/select-custom.tsx
-function I({ id: e, size: r = "medium", label: i, children: c, helperText: u, errorMessage: d, isMultiple: p = !1, isClearable: S = !1, isRequired: C = !1, isDisabled: w = !1, popoverMaxHeight: T, popoverPlacement: E }) {
-	let [D, O] = m(() => P(c, p)), [k, j] = m(0), M = `select-popover-${e.replace(/\s+/g, "-").toLowerCase()}`, I = `select-input-${e.replace(/\s+/g, "-").toLowerCase()}`, L = N(M), R = () => {
-		document.getElementById(M)?.hidePopover?.();
-	}, z = (e) => {
-		O((t) => p ? t.find((t) => t.value === e.value) ? t.filter((t) => t.value !== e.value) : [...t, e] : [e]), p || R();
-	}, B = () => O([]), V = p ? "" : D[0]?.label || "", H = a.getTriggerProps({
-		id: I,
-		popoverTarget: M,
-		popoverTargetAction: "toggle"
-	}), U = `${e}-description`, W = d || u, G = !!d, K = F(c), q = p && D.length >= K;
-	return f(() => {
-		q && R();
-	}, [q]), f(() => {
-		let e = document.getElementById(I);
-		if (!e) return;
-		let t = () => j(e.offsetWidth);
-		t();
-		let n = new ResizeObserver(t);
-		return n.observe(e), () => n.disconnect();
-	}, [I]), /* @__PURE__ */ g(_, {
-		id: e,
-		children: [
-			i && /* @__PURE__ */ h(s, {
-				size: r === "large" ? "sm" : "xs",
-				isRequired: C,
-				children: i
-			}),
-			/* @__PURE__ */ g(v, {
-				variant: "secondary",
-				size: r,
-				...H,
-				type: "button",
-				role: "combobox",
-				"aria-expanded": "false",
-				"aria-disabled": w || q,
-				"aria-describedby": W ? U : void 0,
-				"aria-invalid": G || !1,
-				children: [V ? /* @__PURE__ */ h(y, { children: /* @__PURE__ */ h(l, {
-					as: "span",
-					colour: "primary",
-					font: "text-xs/regular",
-					overflow: "truncate",
-					children: V
-				}) }) : /* @__PURE__ */ h(b, { children: /* @__PURE__ */ h(l, {
-					as: "span",
-					colour: "placeholder",
-					font: "text-xs/regular",
-					overflow: "truncate",
-					children: "Select an option"
-				}) }), S && !p && D.length > 0 ? /* @__PURE__ */ h(n, {
-					color: "primary",
-					size: "sm",
-					onClick: (e) => {
-						e.stopPropagation(), B();
-					}
-				}) : /* @__PURE__ */ h(t, {
-					size: "sm",
-					color: "primary"
-				})]
-			}),
-			/* @__PURE__ */ h(a, {
-				id: M,
-				anchorId: I,
-				placement: E || "bottom-start",
-				popover: "auto",
-				className: x,
-				maxHeight: T,
-				style: { minWidth: k },
-				gap: "var(--spacing-1)",
-				children: /* @__PURE__ */ h(A.Provider, {
-					value: {
-						selectedValues: D,
-						onSelect: z,
-						isMultiple: p
-					},
-					children: /* @__PURE__ */ h("ul", {
-						role: "listbox",
-						ref: L,
-						tabIndex: -1,
-						children: c
-					})
-				})
-			}),
-			W && /* @__PURE__ */ h(s, {
-				id: U,
-				size: "xs",
-				"data-error": !!G,
-				children: W
-			}),
-			p && D.length > 0 && /* @__PURE__ */ h(o, {
-				variant: "selection",
-				children: D.map((e, t) => /* @__PURE__ */ h(o.Item, {
-					variant: "filter",
-					onClick: () => z(e),
-					"aria-disabled": w,
-					children: e.label
-				}, `${e.value}-${t}`))
-			})
-		]
-	});
-}
-I.Group = k, I.Option = M;
-//#endregion
-export { D as ElExperimentalSelectCustomAdditionalInfo1, O as ElExperimentalSelectCustomAdditionalInfo2, _ as ElExperimentalSelectCustomContainer, y as ElExperimentalSelectCustomContent, v as ElExperimentalSelectCustomInputField, T as ElExperimentalSelectCustomLabelContainer, E as ElExperimentalSelectCustomLabelItem, w as ElExperimentalSelectCustomOption, S as ElExperimentalSelectCustomOptionGroup, b as ElExperimentalSelectCustomPlaceholder, M as ExperimentalSelectCustomOption, k as ExperimentalSelectCustomOptionGroup, I as SelectCustom, C as elExperimentalSelectCustomGroupTitle, x as elExperimentalSelectCustomPopover, N as useSelectKeyboardNavigation };

package/dist/types/lab/select-custom/__tests__/helper.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=helper.test.d.ts.map

package/dist/types/lab/select-custom/__tests__/helper.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"helper.test.d.ts","sourceRoot":"","sources":["../../../../../src/lab/select-custom/__tests__/helper.test.tsx"],"names":[],"mappings":""}

package/dist/types/lab/select-custom/__tests__/select-custom.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=select-custom.test.d.ts.map

package/dist/types/lab/select-custom/__tests__/select-custom.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"select-custom.test.d.ts","sourceRoot":"","sources":["../../../../../src/lab/select-custom/__tests__/select-custom.test.tsx"],"names":[],"mappings":""}

package/dist/types/lab/select-custom/context.d.ts

@@ -1,29 +0,0 @@
-/**
- * Represents an item that can be selected in the custom select component.
- */
-export interface SelectedItem {
-    /** The value of the selected item */
-    value: string;
-    /** The label displayed for the selected item */
-    label: string;
-}
-export declare namespace SelectCustomContext {
-    interface Value {
-        /** Currently selected items */
-        selectedValues: SelectedItem[];
-        /** Function to select or deselect an item */
-        onSelect: (item: SelectedItem) => void;
-        /** Determines if multiple selections are allowed */
-        isMultiple: boolean;
-    }
-}
-/**
- * Context provided to `Option` and `Group` components within `SelectCustom`.
- * Manages selection state and behavior for the custom select component.
- */
-export declare const SelectCustomContext: import("react").Context<SelectCustomContext.Value>;
-/**
- * Returns the current SelectCustomContext value.
- */
-export declare function useSelectCustomContext(): SelectCustomContext.Value;
-//# sourceMappingURL=context.d.ts.map

package/dist/types/lab/select-custom/context.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/lab/select-custom/context.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,qCAAqC;IACrC,KAAK,EAAE,MAAM,CAAA;IACb,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAA;CACd;AAED,yBAAiB,mBAAmB,CAAC;IACnC,UAAiB,KAAK;QACpB,+BAA+B;QAC/B,cAAc,EAAE,YAAY,EAAE,CAAA;QAC9B,6CAA6C;QAC7C,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAA;QACtC,oDAAoD;QACpD,UAAU,EAAE,OAAO,CAAA;KACpB;CACF;AAED;;;GAGG;AACH,eAAO,MAAM,mBAAmB,oDAI9B,CAAA;AAEF;;GAEG;AACH,wBAAgB,sBAAsB,IAAI,mBAAmB,CAAC,KAAK,CAElE"}

package/dist/types/lab/select-custom/group/__tests__/group.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=group.test.d.ts.map

package/dist/types/lab/select-custom/group/__tests__/group.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"group.test.d.ts","sourceRoot":"","sources":["../../../../../../src/lab/select-custom/group/__tests__/group.test.tsx"],"names":[],"mappings":""}