@ultraviolet/ui 3.8.2 → 3.10.0

package/dist/components/SelectableCardOptionGroup/components/Option.js

@@ -1,142 +1,89 @@
-"use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { cn } from "@ultraviolet/utils";
-import { useId } from "react";
+'use client';
+import { __name } from "../../../_virtual/_rolldown/runtime.js";
+import { _objectSpread2 } from "../../../_virtual/_@oxc-project_runtime@0.113.0/helpers/objectSpread2.js";
+import { Stack } from "../../Stack/index.js";
 import { Label } from "../../Label/index.js";
 import { SelectInput } from "../../SelectInput/index.js";
-import { Stack } from "../../Stack/index.js";
+import { SelectableCard } from "../../SelectableCard/SelectableCard.js";
 import { useSelectableCardOptionGroup } from "../Provider.js";
 import { optionFullHeight, optionPadded, optionSelectInput, optionSelectInputDisabled, optionSelectInputError, selectableCard } from "../styles.css.js";
 import { Image } from "./Image.js";
-import { SelectableCard } from "../../SelectableCard/SelectableCard.js";
-const Option = ({
-  value,
-  label,
-  labelDescription,
-  "aria-label": ariaLabel,
-  children,
-  className,
-  options,
-  optionPlaceholder,
-  image,
-  disabled,
-  id,
-  "data-testid": dataTestId,
-  tooltip,
-  style
-}) => {
-  const {
-    onChange,
-    onChangeOption,
-    groupValue,
-    disabled: groupDisabled,
-    size,
-    error,
-    optionValue
-  } = useSelectableCardOptionGroup();
-  const generatedId = useId();
-  const inputId = id || generatedId;
-  return /* @__PURE__ */ jsx(
-    SelectableCard,
-    {
-      checked: groupValue === value,
-      className: cn(className, selectableCard),
-      "data-testid": dataTestId,
-      disabled: disabled || groupDisabled,
-      isError: error,
-      onChange: (event) => {
-        onChange?.(event);
-        if (Array.isArray(options)) {
-          onChangeOption?.(options?.[0]?.value);
-        }
-      },
-      showTick: true,
-      style,
-      tooltip,
-      type: "radio",
-      value,
-      ...label ? { id: inputId } : { "aria-label": ariaLabel },
-      children: /* @__PURE__ */ jsxs(
-        Stack,
-        {
-          className: optionFullHeight,
-          direction: "column",
-          flex: "1 1 auto",
-          gap: 2,
-          justifyContent: "space-between",
-          width: "100%",
-          children: [
-            /* @__PURE__ */ jsxs(
-              Stack,
-              {
-                alignItems: "center",
-                className: optionPadded,
-                direction: "column",
-                gap: 1,
-                justifyContent: "center",
-                width: "100%",
-                children: [
-                  typeof image === "string" ? /* @__PURE__ */ jsx(
-                    Image,
-                    {
-                      alt: typeof label === "string" ? label : value,
-                      disabled: disabled || groupDisabled,
-                      size,
-                      src: image
-                    }
-                  ) : image,
-                  /* @__PURE__ */ jsxs(
-                    Stack,
-                    {
-                      alignItems: "center",
-                      direction: "column",
-                      gap: 0.5,
-                      justifyContent: "center",
-                      width: "100%",
-                      children: [
-                        typeof label === "string" ? /* @__PURE__ */ jsx(
-                          Label,
-                          {
-                            disabled: disabled || groupDisabled,
-                            htmlFor: inputId,
-                            labelDescription,
-                            sentiment: groupValue === value ? "primary" : "neutral",
-                            children: label
-                          }
-                        ) : label,
-                        children
-                      ]
-                    }
-                  )
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              SelectInput,
-              {
-                "aria-label": typeof label === "string" ? `${label} option` : `${value} option`,
-                className: cn(
-                  optionSelectInput,
-                  disabled || groupDisabled ? optionSelectInputDisabled : "",
-                  error ? optionSelectInputError : ""
-                ),
-                "data-testid": dataTestId ? `${dataTestId}-select` : void 0,
-                disabled: disabled || groupDisabled,
-                error,
-                name: "selectable-card-option",
-                onChange: onChangeOption,
-                options,
-                placeholder: optionPlaceholder,
-                size: "medium",
-                value: optionValue
-              }
-            )
-          ]
-        }
-      )
-    }
-  );
-};
-export {
-  Option
+import { cn } from "@ultraviolet/utils";
+import { useId } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/SelectableCardOptionGroup/components/Option.tsx
+const Option = ({ value, label, labelDescription, "aria-label": ariaLabel, children, className, options, optionPlaceholder, image, disabled, id, "data-testid": dataTestId, tooltip, style }) => {
+	const { onChange, onChangeOption, groupValue, disabled: groupDisabled, size, error, optionValue } = useSelectableCardOptionGroup();
+	const generatedId = useId();
+	const inputId = id !== null && id !== void 0 ? id : generatedId;
+	const isDisabled = disabled || groupDisabled;
+	return /* @__PURE__ */ jsx(SelectableCard, _objectSpread2(_objectSpread2({
+		checked: groupValue === value,
+		className: cn(className, selectableCard),
+		"data-testid": dataTestId,
+		disabled: isDisabled,
+		isError: error,
+		onChange: (event) => {
+			onChange === null || onChange === void 0 || onChange(event);
+			if (Array.isArray(options)) {
+				var _options$;
+				onChangeOption === null || onChangeOption === void 0 || onChangeOption(options === null || options === void 0 || (_options$ = options[0]) === null || _options$ === void 0 ? void 0 : _options$.value);
+			}
+		},
+		showTick: true,
+		style,
+		tooltip,
+		type: "radio",
+		value
+	}, label ? { id: inputId } : { "aria-label": ariaLabel }), {}, { children: /* @__PURE__ */ jsxs(Stack, {
+		className: optionFullHeight,
+		direction: "column",
+		flex: "1 1 auto",
+		gap: 2,
+		justifyContent: "space-between",
+		width: "100%",
+		children: [/* @__PURE__ */ jsxs(Stack, {
+			alignItems: "center",
+			className: optionPadded,
+			direction: "column",
+			gap: 1,
+			justifyContent: "center",
+			width: "100%",
+			children: [typeof image === "string" ? /* @__PURE__ */ jsx(Image, {
+				alt: typeof label === "string" ? label : value,
+				disabled: isDisabled,
+				size,
+				src: image
+			}) : image, /* @__PURE__ */ jsxs(Stack, {
+				alignItems: "center",
+				direction: "column",
+				gap: .5,
+				justifyContent: "center",
+				width: "100%",
+				children: [typeof label === "string" ? /* @__PURE__ */ jsx(Label, {
+					disabled: isDisabled,
+					htmlFor: inputId,
+					labelDescription,
+					sentiment: groupValue === value ? "primary" : "neutral",
+					children: label
+				}) : label, children]
+			})]
+		}), /* @__PURE__ */ jsx(SelectInput, {
+			"aria-label": typeof label === "string" ? `${label} option` : `${value} option`,
+			className: cn(optionSelectInput, isDisabled ? optionSelectInputDisabled : "", error ? optionSelectInputError : ""),
+			"data-testid": dataTestId ? `${dataTestId}-select` : void 0,
+			disabled: isDisabled,
+			error,
+			name: "selectable-card-option",
+			onChange: onChangeOption,
+			options,
+			placeholder: optionPlaceholder,
+			size: "medium",
+			value: optionValue
+		})]
+	}) }));
 };
+
+//#endregion
+export { Option };

package/dist/components/SelectableCardOptionGroup/styles.css.js

@@ -1,4 +1,6 @@
-/* empty css                          */
+/* empty css                      */
+
+//#region src/components/SelectableCardOptionGroup/styles.css.ts
 var selectableCardOptionFieldSet = "uv_12n1yvr0";
 var disabledImage = "uv_12n1yvr1";
 var selectableCard = "uv_12n1yvr2";
@@ -7,13 +9,6 @@ var optionSelectInput = "uv_12n1yvr4";
 var optionSelectInputDisabled = "uv_12n1yvr5";
 var optionSelectInputError = "uv_12n1yvr6";
 var optionPadded = "uv_12n1yvr7";
-export {
-  disabledImage,
-  optionFullHeight,
-  optionPadded,
-  optionSelectInput,
-  optionSelectInputDisabled,
-  optionSelectInputError,
-  selectableCard,
-  selectableCardOptionFieldSet
-};
+
+//#endregion
+export { disabledImage, optionFullHeight, optionPadded, optionSelectInput, optionSelectInputDisabled, optionSelectInputError, selectableCard, selectableCardOptionFieldSet };

package/dist/components/Separator/index.d.ts

@@ -10,6 +10,6 @@ type SeparatorProps = {
 /**
  * Separator component used to separate content with a horizontal or vertical line.
  */
-export declare const Separator: ({ direction, thickness, sentiment, className, "data-testid": dataTestId, children, style, }: SeparatorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Separator: ({ direction, thickness, sentiment, className, 'data-testid': dataTestId, children, style, }: SeparatorProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Separator/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Separator/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACrD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAGrD,KAAK,cAAc,GAAG;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,iBAAiB,CAAA;AAErB;;GAEG;AACH,eAAO,MAAM,SAAS,GAAI,6FAQvB,cAAc,4CAmCd,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Separator/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACrD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAGrD,KAAK,cAAc,GAAG;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,iBAAiB,CAAA;AAErB;;GAEG;AACH,eAAO,MAAM,SAAS,0JA2CnB,CAAA"}

package/dist/components/Separator/index.js

@@ -1,61 +1,51 @@
-"use client";
-import { jsxs, jsx } from "react/jsx-runtime";
+'use client';
+import { __name } from "../../_virtual/_rolldown/runtime.js";
+import { hr, iconWraperSeparator, thicknessSeparator } from "./styles.css.js";
 import { cn } from "@ultraviolet/utils";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
-import { hr, thicknessSeparator, iconWraperSeparator } from "./styles.css.js";
-const Separator = ({
-  direction = "horizontal",
-  thickness = 1,
-  sentiment = "neutral",
-  className,
-  "data-testid": dataTestId,
-  children,
-  style
-}) => children ? (
-  // biome-ignore  lint/a11y/useFocusableInteractive: to fix
-  // biome-ignore lint/a11y/useSemanticElements: cannot have a separator inside a separator
-  /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "aria-orientation": direction,
-      className: cn(className, iconWraperSeparator({ direction, sentiment })),
-      "data-testid": dataTestId,
-      role: "separator",
-      style,
-      children: [
-        /* @__PURE__ */ jsx(
-          "hr",
-          {
-            className: hr({ direction, hasIcon: true, sentiment }),
-            style: assignInlineVars({
-              [thicknessSeparator]: `${thickness}px`
-            })
-          }
-        ),
-        children,
-        /* @__PURE__ */ jsx(
-          "hr",
-          {
-            className: hr({ direction, hasIcon: true, sentiment }),
-            style: assignInlineVars({
-              [thicknessSeparator]: `${thickness}px`
-            })
-          }
-        )
-      ]
-    }
-  )
-) : /* @__PURE__ */ jsx(
-  "hr",
-  {
-    "aria-orientation": direction,
-    className: cn(className, hr({ direction, sentiment })),
-    "data-testid": dataTestId,
-    style: assignInlineVars({
-      [thicknessSeparator]: `${thickness}px`
-    })
-  }
-);
-export {
-  Separator
-};
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/Separator/index.tsx
+/**
+* Separator component used to separate content with a horizontal or vertical line.
+*/
+const Separator = ({ direction = "horizontal", thickness = 1, sentiment = "neutral", className, "data-testid": dataTestId, children, style }) => children ? /* @__PURE__ */ jsxs("div", {
+	"aria-orientation": direction,
+	className: cn(className, iconWraperSeparator({
+		direction,
+		sentiment
+	})),
+	"data-testid": dataTestId,
+	role: "separator",
+	style,
+	children: [
+		/* @__PURE__ */ jsx("hr", {
+			className: hr({
+				direction,
+				hasIcon: true,
+				sentiment
+			}),
+			style: assignInlineVars({ [thicknessSeparator]: `${thickness}px` })
+		}),
+		children,
+		/* @__PURE__ */ jsx("hr", {
+			className: hr({
+				direction,
+				hasIcon: true,
+				sentiment
+			}),
+			style: assignInlineVars({ [thicknessSeparator]: `${thickness}px` })
+		})
+	]
+}) : /* @__PURE__ */ jsx("hr", {
+	"aria-orientation": direction,
+	className: cn(className, hr({
+		direction,
+		sentiment
+	})),
+	"data-testid": dataTestId,
+	style: assignInlineVars({ [thicknessSeparator]: `${thickness}px` })
+});
+
+//#endregion
+export { Separator };

package/dist/components/Separator/styles.css.d.ts

@@ -14,15 +14,15 @@ export declare const iconWraperSeparator: import("@vanilla-extract/recipes").Run
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         info: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         neutral: {
             color: `var(--${string})`;
@@ -31,29 +31,29 @@ export declare const iconWraperSeparator: import("@vanilla-extract/recipes").Run
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         secondary: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         success: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         warning: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
     };
 }>;
@@ -79,46 +79,52 @@ export declare const hr: import("@vanilla-extract/recipes").RuntimeFn<{
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         info: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         neutral: {
             backgroundColor: `var(--${string})`;
+            selectors: {
+                [x: string]: {
+                    backgroundColor: `var(--${string})`;
+                    minHeight: number;
+                };
+            };
         };
         primary: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         secondary: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         success: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
         warning: {
             backgroundColor: `var(--${string})`;
             color?: undefined;
         } | {
-            color: `var(--${string})`;
             backgroundColor?: undefined;
+            color: `var(--${string})`;
         };
     };
 }>;

package/dist/components/Separator/styles.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/Separator/styles.css.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AAI9D,eAAO,MAAM,kBAAkB,oBAAc,CAAA;AAc7C,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8B9B,CAAA;AACF,eAAO,MAAM,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkCb,CAAA;AAEF,MAAM,MAAM,iBAAiB,GAAG,WAAW,CACzC,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAC3C,CAAA"}
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/Separator/styles.css.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AAK9D,eAAO,MAAM,kBAAkB,oBAAc,CAAA;AAc7C,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8B9B,CAAA;AACF,eAAO,MAAM,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwCb,CAAA;AAEF,MAAM,MAAM,iBAAiB,GAAG,WAAW,CACzC,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAC3C,CAAA"}

package/dist/components/Separator/styles.css.js

@@ -1,10 +1,56 @@
-/* empty css                          */
+/* empty css                              */
+/* empty css                      */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
+
+//#region src/components/Separator/styles.css.ts
 var thicknessSeparator = "var(--uv_bu43fb0)";
-var iconWraperSeparator = createRuntimeFn({ defaultClassName: "uv_bu43fb1", variantClassNames: { direction: { horizontal: "uv_bu43fb2", vertical: "uv_bu43fb3" }, sentiment: { danger: "uv_bu43fb4", info: "uv_bu43fb5", neutral: "uv_bu43fb6", primary: "uv_bu43fb7", secondary: "uv_bu43fb8", success: "uv_bu43fb9", warning: "uv_bu43fba" } }, defaultVariants: { direction: "horizontal", sentiment: "neutral" }, compoundVariants: [] });
-var hr = createRuntimeFn({ defaultClassName: "uv_bu43fbb", variantClassNames: { direction: { horizontal: "uv_bu43fbc", vertical: "uv_bu43fbd" }, hasIcon: { false: "uv_bu43fbe", true: "uv_bu43fbf" }, sentiment: { danger: "uv_bu43fbg", info: "uv_bu43fbh", neutral: "uv_bu43fbi", primary: "uv_bu43fbj", secondary: "uv_bu43fbk", success: "uv_bu43fbl", warning: "uv_bu43fbm" } }, defaultVariants: {}, compoundVariants: [] });
-export {
-  hr,
-  iconWraperSeparator,
-  thicknessSeparator
-};
+var iconWraperSeparator = createRuntimeFn({
+	defaultClassName: "uv_bu43fb1",
+	variantClassNames: {
+		direction: {
+			horizontal: "uv_bu43fb2",
+			vertical: "uv_bu43fb3"
+		},
+		sentiment: {
+			danger: "uv_bu43fb4",
+			info: "uv_bu43fb5",
+			neutral: "uv_bu43fb6",
+			primary: "uv_bu43fb7",
+			secondary: "uv_bu43fb8",
+			success: "uv_bu43fb9",
+			warning: "uv_bu43fba"
+		}
+	},
+	defaultVariants: {
+		direction: "horizontal",
+		sentiment: "neutral"
+	},
+	compoundVariants: []
+});
+var hr = createRuntimeFn({
+	defaultClassName: "uv_bu43fbb",
+	variantClassNames: {
+		direction: {
+			horizontal: "uv_bu43fbc",
+			vertical: "uv_bu43fbd"
+		},
+		hasIcon: {
+			false: "uv_bu43fbe",
+			true: "uv_bu43fbf"
+		},
+		sentiment: {
+			danger: "uv_bu43fbg",
+			info: "uv_bu43fbh",
+			neutral: "uv_bu43fbi",
+			primary: "uv_bu43fbj",
+			secondary: "uv_bu43fbk",
+			success: "uv_bu43fbl",
+			warning: "uv_bu43fbm"
+		}
+	},
+	defaultVariants: {},
+	compoundVariants: []
+});
+
+//#endregion
+export { hr, iconWraperSeparator, thicknessSeparator };

package/dist/components/Skeleton/Block.d.ts

@@ -1,4 +1,4 @@
 export declare const Block: ({ length }: {
-    length?: number;
+    length?: number | undefined;
 }) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Block.d.ts.map

package/dist/components/Skeleton/Block.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Block.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/Block.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,KAAK,GAAI,YAAgB;IAAE,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,4CAYxD,CAAA"}
+{"version":3,"file":"Block.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/Block.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,KAAK;;6CAYjB,CAAA"}

package/dist/components/Skeleton/Block.js

@@ -1,16 +1,19 @@
-"use client";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Fragment } from "react";
+'use client';
+import { __name } from "../../_virtual/_rolldown/runtime.js";
+import { blockSkeletonLine, blockSkeletonList } from "./stylesVariants.css.js";
 import { IconSkeleton } from "./IconSkeleton.js";
 import { Line } from "./Line.js";
-import { blockSkeletonList, blockSkeletonLine } from "./stylesVariants.css.js";
-const Block = ({ length = 3 }) => /* @__PURE__ */ jsx("ul", { className: blockSkeletonList, children: Array.from({ length }, (_, i) => (
-  // biome-ignore lint/suspicious/noArrayIndexKey: to fix
-  /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("li", { className: blockSkeletonLine, children: [
-    /* @__PURE__ */ jsx(IconSkeleton, {}),
-    /* @__PURE__ */ jsx(Line, {})
-  ] }) }, `skeleton-block-${i}`)
-)) });
-export {
-  Block
-};
+import { Fragment } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/Skeleton/Block.tsx
+const Block = ({ length = 3 }) => /* @__PURE__ */ jsx("ul", {
+	className: blockSkeletonList,
+	children: Array.from({ length }, (_, i) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("li", {
+		className: blockSkeletonLine,
+		children: [/* @__PURE__ */ jsx(IconSkeleton, {}), /* @__PURE__ */ jsx(Line, {})]
+	}) }, `skeleton-block-${i}`))
+});
+
+//#endregion
+export { Block };

package/dist/components/Skeleton/Blocks.d.ts

@@ -1,5 +1,5 @@
 export declare const Blocks: ({ col, length, }: {
-    col?: number;
-    length?: number;
+    col?: number | undefined;
+    length?: number | undefined;
 }) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Blocks.d.ts.map

package/dist/components/Skeleton/Blocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Blocks.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/Blocks.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,MAAM,GAAI,kBAGpB;IACD,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,4CAeA,CAAA"}
+{"version":3,"file":"Blocks.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/Blocks.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,MAAM;;;6CAqBlB,CAAA"}