npm - linkedunion-design-kit - Versions diffs - 1.11.6 → 1.11.8 - Mend

linkedunion-design-kit 1.11.6 → 1.11.8

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.

Files changed (258) hide show

package/dist/src/components/ImageUploader/{imageUploader.js → imageUploader.jsx} RENAMED Viewed

@@ -1,16 +1,4 @@
 "use client";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import { useDropzone } from "react-dropzone";
 import { cn } from "../../lib/utils";
@@ -74,6 +62,33 @@ var ImageUploader = function (_a) {
             "image/*": acceptedTypes,
         },
     }), getRootProps = _g.getRootProps, getInputProps = _g.getInputProps;
-    return (_jsxs("div", { className: cn("flex flex-col items-center", className), children: [_jsx("div", __assign({}, getRootProps(), { className: cn("!border !border-dashed !border-gray-300 !rounded-lg cursor-pointer w-64 !p-2"), children: _jsxs("div", { className: "min-h-40 flex items-center justify-center bg-gray-100 !rounded-lg", children: [_jsx("input", __assign({}, getInputProps())), preview ? (_jsx("div", { className: "relative w-full h-40 !mx-auto overflow-hidden", children: _jsx(LuImage, { src: preview, alt: "Uploaded", className: "aspect-square object-contain", fill: true }) })) : (_jsxs("div", { className: "text-center text-sm text-muted-foreground", children: [_jsx(LUIcon, { icon: "upload", size: "lg", className: "!mx-auto !mb-4" }), _jsx(Body, { variant: "body-xs-600", className: "!px-1", children: labels === null || labels === void 0 ? void 0 : labels.chooseFile }), _jsx("p", { className: "text-xs text-muted-foreground", children: labels === null || labels === void 0 ? void 0 : labels.supportedFormats })] }))] }) })), fileError && (_jsx("p", { className: "text-sm text-red-500 text-center mt-2", children: fileError })), required && !preview && !fileError && (_jsx("p", { className: "text-sm text-red-500 text-center !mt-2", children: labels === null || labels === void 0 ? void 0 : labels.imageRequired })), preview && (_jsx(Button, { variant: "link", color: "red", onClick: removeFile, className: "!mt-2", children: labels === null || labels === void 0 ? void 0 : labels.removeImage }))] }));
+    return (<div className={cn("flex flex-col items-center", className)}>
+      <div {...getRootProps()} className={cn("!border !border-dashed !border-gray-300 !rounded-lg cursor-pointer w-64 !p-2")}>
+        <div className="min-h-40 flex items-center justify-center bg-gray-100 !rounded-lg">
+          <input {...getInputProps()}/>
+          {preview ? (<div className="relative w-full h-40 !mx-auto overflow-hidden">
+              <LuImage src={preview} alt="Uploaded" className="aspect-square object-contain" fill/>
+            </div>) : (<div className="text-center text-sm text-muted-foreground">
+              <LUIcon icon="upload" size="lg" className="!mx-auto !mb-4"/>
+              <Body variant="body-xs-600" className="!px-1">
+                {labels === null || labels === void 0 ? void 0 : labels.chooseFile}
+              </Body>
+              <p className="text-xs text-muted-foreground">
+                {labels === null || labels === void 0 ? void 0 : labels.supportedFormats}
+              </p>
+            </div>)}
+        </div>
+      </div>
+      {fileError && (<p className="text-sm text-red-500 text-center mt-2">{fileError}</p>)}
+      {required && !preview && !fileError && (<p className="text-sm text-red-500 text-center !mt-2">
+          {labels === null || labels === void 0 ? void 0 : labels.imageRequired}
+        </p>)}
+      {preview && (<Button variant="link" color="red" onClick={removeFile} className="!mt-2">
+          {labels === null || labels === void 0 ? void 0 : labels.removeImage}
+        </Button>)}
+    </div>);
 };
 export default ImageUploader;

package/dist/src/components/Images/LuImage.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 import { AspectRatioProps } from "./type";
-declare const LuImage: ({ ratio, ...props }: AspectRatioProps) => import("react/jsx-runtime").JSX.Element;
+declare const LuImage: ({ ratio, ...props }: AspectRatioProps) => import("react").JSX.Element;
 export default LuImage;

package/dist/src/components/Images/{LuImage.js → LuImage.jsx} RENAMED Viewed

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -20,12 +9,11 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
 import Image from "next/image";
 import { aspectRatio } from ".";
 var LuImage = function (_a) {
     var _b = _a.ratio, ratio = _b === void 0 ? "square" : _b, props = __rest(_a, ["ratio"]);
     // eslint-disable-next-line jsx-a11y/alt-text
-    return _jsx(Image, __assign({ className: "".concat(aspectRatio[ratio]) }, props));
+    return <Image className={"".concat(aspectRatio[ratio])} {...props}/>;
 };
 export default LuImage;

package/dist/src/components/Images/{LuImage.stories.js → LuImage.stories.jsx} RENAMED Viewed

@@ -1,15 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx } from "react/jsx-runtime";
 import LuImage from "./LuImage";
 import { aspectRatio } from ".";
 export default {
@@ -145,7 +133,7 @@ export default {
         },
     },
 };
-var Template = function (args) { return _jsx(LuImage, __assign({}, args)); };
+var Template = function (args) { return <LuImage {...args}/>; };
 export var _Image = Template.bind({});
 _Image.args = {
     src: "/images/demo-image.jpg",

package/dist/src/components/Images/{LuImage.test.js → LuImage.test.jsx} RENAMED Viewed

@@ -1,15 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx } from "react/jsx-runtime";
 import { render, screen } from "@testing-library/react";
 import LuImage from "./LuImage";
 import { aspectRatio } from ".";
@@ -18,12 +6,12 @@ jest.mock("next/image", function () { return ({
     __esModule: true,
     default: function (props) {
         // eslint-disable-next-line @next/next/no-img-element
-        return _jsx("img", __assign({ alt: "" }, props));
+        return <img alt="" {...props}/>;
     },
 }); });
 describe("LuImage component", function () {
     it("renders with default props", function () {
-        render(_jsx(LuImage, { src: "/test.jpg", width: 100, height: 100, alt: "Demo Image" }));
+        render(<LuImage src="/test.jpg" width={100} height={100} alt="Demo Image"/>);
         var image = screen.getByAltText("Demo Image");
         expect(image).toBeInTheDocument();
         expect(image).toHaveAttribute("src", "/test.jpg");
@@ -31,24 +19,24 @@ describe("LuImage component", function () {
     });
     it("uses correct aspect ratio class", function () {
         var ratio = "aspect-4/3";
-        render(_jsx(LuImage, { src: "/test.jpg", width: 100, height: 100, ratio: ratio, alt: "Demo Image" }));
+        render(<LuImage src="/test.jpg" width={100} height={100} ratio={ratio} alt="Demo Image"/>);
         var image = screen.getByAltText("Demo Image");
         expect(image).toHaveClass(aspectRatio[ratio]);
     });
     it("accepts custom alt text", function () {
-        render(_jsx(LuImage, { src: "/test.jpg", width: 100, height: 100, alt: "Custom Alt" }));
+        render(<LuImage src="/test.jpg" width={100} height={100} alt="Custom Alt"/>);
         var image = screen.getByAltText("Custom Alt");
         expect(image).toBeInTheDocument();
     });
     it("accepts additional className", function () {
-        render(_jsx(LuImage, { src: "/test.jpg", width: 100, height: 100, className: "rounded-full", alt: "Demo Image" }));
+        render(<LuImage src="/test.jpg" width={100} height={100} className="rounded-full" alt="Demo Image"/>);
         var image = screen.getByAltText("Demo Image");
         expect(image).toHaveClass("rounded-full");
     });
     it("renders with different aspect ratios", function () {
         for (var ratio in aspectRatio) {
             var typedRatio = ratio;
-            render(_jsx(LuImage, { src: "/test.jpg", width: 100, height: 100, ratio: typedRatio, alt: "Image with ratio ".concat(typedRatio) }, typedRatio));
+            render(<LuImage key={typedRatio} src="/test.jpg" width={100} height={100} ratio={typedRatio} alt={"Image with ratio ".concat(typedRatio)}/>);
             var image = screen.getByAltText("Image with ratio ".concat(typedRatio));
             expect(image).toHaveClass(aspectRatio[typedRatio]);
         }

package/dist/src/components/Input/Input.stories.d.ts CHANGED Viewed

@@ -1,13 +1,14 @@
+import React from "react";
 import { Meta } from "@storybook/react";
 import { InputFieldProps } from "./type";
 declare const _default: Meta<InputFieldProps>;
 export default _default;
 export declare const Default: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, InputFieldProps>;
-export declare const WithIcons: () => import("react/jsx-runtime").JSX.Element;
-export declare const IconSizes: () => import("react/jsx-runtime").JSX.Element;
-export declare const Variants: () => import("react/jsx-runtime").JSX.Element;
-export declare const Sizes: () => import("react/jsx-runtime").JSX.Element;
-export declare const VariantsWithIcons: () => import("react/jsx-runtime").JSX.Element;
-export declare const ErrorValidation: () => import("react/jsx-runtime").JSX.Element;
-export declare const SuccessValidation: () => import("react/jsx-runtime").JSX.Element;
-export declare const WarningValidation: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithIcons: () => React.JSX.Element;
+export declare const IconSizes: () => React.JSX.Element;
+export declare const Variants: () => React.JSX.Element;
+export declare const Sizes: () => React.JSX.Element;
+export declare const VariantsWithIcons: () => React.JSX.Element;
+export declare const ErrorValidation: () => React.JSX.Element;
+export declare const SuccessValidation: () => React.JSX.Element;
+export declare const WarningValidation: () => React.JSX.Element;

package/dist/src/components/Input/Input.stories.jsx ADDED Viewed

@@ -0,0 +1,250 @@
+import React from "react";
+import { Input, inputVariantConfig } from "./input";
+import { inputType } from "."; // Ensure this exports an object like { text: 'text', email: 'email', ... }
+import { Label } from "../Label/Label";
+import LUIcon from "../Icons/LUIcon";
+import Tooltip from "../ToolTip/Tooltip";
+import { Caption } from "../Typography/Caption/caption";
+export default {
+    title: "Components/Input",
+    component: Input,
+    tags: ["autodocs"],
+    argTypes: {
+        type: {
+            control: {
+                type: "select",
+                labels: Object.keys(inputType),
+            },
+            options: Object.keys(inputType),
+            defaultValue: "text",
+        },
+        variant: {
+            control: {
+                type: "select",
+            },
+            options: Object.keys(inputVariantConfig.variant),
+            defaultValue: "filled",
+        },
+        size: {
+            control: {
+                type: "select",
+            },
+            options: Object.keys(inputVariantConfig.size),
+            defaultValue: "lg",
+        },
+        color: {
+            control: {
+                type: "select",
+            },
+            options: Object.keys(inputVariantConfig.color),
+            defaultValue: "default",
+        },
+        startIcon: {
+            control: "text",
+            description: "Icon to display at the start of the input",
+        },
+        endIcon: {
+            control: "text",
+            description: "Icon to display at the end of the input",
+        },
+        placeholder: {
+            control: "text",
+            defaultValue: "Enter text",
+        },
+        disabled: {
+            control: "boolean",
+            defaultValue: false,
+        },
+        className: {
+            control: "text",
+        },
+    },
+};
+var Template = function (args) { return <Input {...args}/>; };
+export var Default = Template.bind({});
+Default.args = {
+    type: "text",
+    placeholder: "Enter your input",
+    variant: "filled",
+    size: "lg",
+};
+export var WithIcons = function () { return (<div className="space-y-4">
+    <div>
+      <Label variant={"label-md"}>Search with start icon</Label>
+      <Input placeholder="Search..." startIcon="magnifying-glass"/>
+    </div>
+    <div>
+      <Label className="block text-sm font-medium mb-2">
+        Email with end icon
+      </Label>
+      <Input placeholder="Enter email" endIcon="envelope" type="email"/>
+    </div>
+    <div>
+      <Label variant={"label-md"}>Password with both icons</Label>
+      <Input placeholder="Enter password" startIcon="lock" endIcon="eye" type="password"/>
+    </div>
+    <div>
+      <Label variant={"label-sm"}>User input</Label>
+      <Input placeholder="Enter username" startIcon="user"/>
+    </div>
+  </div>); };
+export var IconSizes = function () { return (<div className="space-y-4">
+    <div>
+      <Label variant={"label-sm"}>Small with icons</Label>
+      <Input placeholder="Small size" size="sm" startIcon="magnifying-glass" endIcon="xMark"/>
+    </div>
+    <div>
+      <Label variant={"label-md"}>Medium with icons</Label>
+      <Input placeholder="Medium size" size="md" startIcon="magnifying-glass" endIcon="xMark"/>
+    </div>
+    <div>
+      <Label variant={"label-lg"}>Large with icons</Label>
+      <Input placeholder="Large size" size="lg" startIcon="magnifying-glass" endIcon="xMark"/>
+    </div>
+  </div>); };
+export var Variants = function () { return (<div className="space-y-4">
+    <div>
+      <Label variant={"label-md"}>Filled</Label>
+      <Input placeholder="Filled variant" variant="filled"/>
+    </div>
+    <div>
+      <Label variant={"label-md"}>Outlined</Label>
+      <Input placeholder="Outlined variant" variant="outlined"/>
+    </div>
+  </div>); };
+export var Sizes = function () { return (<div className="space-y-4">
+    <div>
+      <Label variant={"label-md"}>Small</Label>
+      <Input placeholder="Small size" size="sm"/>
+    </div>
+    <div>
+      <Label variant={"label-md"}>Medium</Label>
+      <Input placeholder="Medium size" size="md"/>
+    </div>
+    <div>
+      <Label variant={"label-lg"}>Large (Default)</Label>
+      <Input placeholder="Large size" size="lg"/>
+    </div>
+  </div>); };
+export var VariantsWithIcons = function () { return (<div className="space-y-4">
+    <div>
+      <Label variant={"label-md"}>Filled with icons</Label>
+      <Input placeholder="Filled variant" variant="filled" startIcon="magnifying-glass" endIcon="xMark"/>
+    </div>
+    <div>
+      <Label variant={"label-md"}>Outlined with icons</Label>
+      <Input placeholder="Outlined variant" variant="outlined" startIcon="magnifying-glass" endIcon="xMark"/>
+    </div>
+  </div>); };
+export var ErrorValidation = function () {
+    var _a = React.useState("Steve"), email = _a[0], setEmail = _a[1];
+    var maxLength = 5;
+    var isError = email.length === 5;
+    var characterCount = email.length;
+    var handleEmailChange = function (e) {
+        var newValue = e.target.value;
+        // Restrict typing when exactly 5 characters
+        if (newValue.length <= 5) {
+            setEmail(newValue);
+        }
+    };
+    return (<div className="space-y-4">
+      <div>
+        <div className="flex items-center gap-2 mb-2">
+          <Label variant={"label-md"}>Name</Label>
+          <span className="text-red-600">*</span>
+          <Tooltip title="This is a tooltip for the email input field">
+            <LUIcon variant="padded" size="xs" shape="rounded" icon="question" color="light-blue"/>
+          </Tooltip>
+          <Caption variant="md" className={"ms-auto mb-1 ".concat(isError ? "text-red-600" : "text-gray-500")}>
+            <span className={isError ? "text-red-600" : "text-gray-900"}>
+              {characterCount}
+            </span>
+            /{maxLength}
+          </Caption>
+        </div>
+        <Input color={isError ? "danger" : "default"} placeholder="Enter your email address" variant="filled" type="email" value={email} onChange={handleEmailChange} startIcon="user" endIcon="envelope"/>
+        {email.length > 4 && (<Caption variant="md" className={"mt-1 ".concat(isError ? "text-red-600" : "text-gray-500")}>
+            {isError
+                ? "Email must be longer than 5 characters"
+                : "Please enter a valid email address"}
+          </Caption>)}
+      </div>
+    </div>);
+};
+export var SuccessValidation = function () {
+    var _a = React.useState("john_doe"), username = _a[0], setUsername = _a[1];
+    var maxLength = 20;
+    var isSuccess = username.length >= 6 && username.length <= 15;
+    var characterCount = username.length;
+    var handleUsernameChange = function (e) {
+        var newValue = e.target.value;
+        if (newValue.length <= maxLength) {
+            setUsername(newValue);
+        }
+    };
+    return (<div className="space-y-4">
+      <div>
+        <div className="flex items-center gap-2 mb-2">
+          <Label variant={"label-sm"}>Username</Label>
+          <span className="text-red-600">*</span>
+          <Tooltip title="Username must be 6-15 characters long">
+            <LUIcon variant="padded" size="xs" shape="rounded" icon="question" color="light-blue"/>
+          </Tooltip>
+          <Caption variant="md" className={"ms-auto mb-1 ".concat(isSuccess ? "text-green-600" : "text-gray-500")}>
+            <span className={isSuccess ? "text-green-600" : "text-gray-900"}>
+              {characterCount}
+            </span>
+            /{maxLength}
+          </Caption>
+        </div>
+        <Input color={isSuccess ? "success" : "default"} placeholder="Enter your username" variant="filled" type="text" value={username} onChange={handleUsernameChange} startIcon="user" endIcon={isSuccess ? "check" : "user-gear"}/>
+        <Caption variant="md" className={"mt-1 ".concat(isSuccess ? "text-green-600" : "text-gray-500")}>
+          {isSuccess
+            ? "Great! Username is available"
+            : "Username must be 6-15 characters"}
+        </Caption>
+      </div>
+    </div>);
+};
+export var WarningValidation = function () {
+    var _a = React.useState("pass123"), password = _a[0], setPassword = _a[1];
+    var maxLength = 30;
+    var hasWarning = password.length >= 4 && password.length < 8;
+    var characterCount = password.length;
+    var handlePasswordChange = function (e) {
+        var newValue = e.target.value;
+        if (newValue.length <= maxLength) {
+            setPassword(newValue);
+        }
+    };
+    return (<div className="space-y-4">
+      <div>
+        <div className="flex items-center gap-2 mb-2">
+          <Label variant={"label-md"}>Password</Label>
+          <span className="text-red-600">*</span>
+          <Tooltip title="Password should be at least 8 characters for better security">
+            <LUIcon variant="padded" size="xs" shape="rounded" icon="question" color="light-blue"/>
+          </Tooltip>
+          <Caption variant="md" className={"ms-auto mb-1 ".concat(hasWarning ? "text-yellow-600" : "text-gray-500")}>
+            <span className={hasWarning ? "text-yellow-600" : "text-gray-900"}>
+              {characterCount}
+            </span>
+            /{maxLength}
+          </Caption>
+        </div>
+        <Input color={hasWarning ? "warning" : "default"} placeholder="Enter your password" variant="filled" type="password" value={password} onChange={handlePasswordChange} startIcon="lock" endIcon={hasWarning ? "circle-exclamation" : "eye"}/>
+        <Caption variant="md" className={"mt-1 ".concat(hasWarning ? "text-yellow-600" : "text-gray-500")}>
+          {hasWarning
+            ? "Password is weak. Consider using 8+ characters"
+            : "Enter a secure password"}
+        </Caption>
+      </div>
+    </div>);
+};

package/dist/src/components/Input/input.d.ts CHANGED Viewed

@@ -33,5 +33,5 @@ export interface InputProps extends Omit<React.ComponentProps<"input">, "size" |
     endIcon?: keyof typeof iconList;
     shape?: "rounded" | "square";
 }
-declare function Input({ className, variant, size, type, startIcon, endIcon, shape, color, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
+declare function Input({ className, variant, size, type, startIcon, endIcon, shape, color, ...props }: InputProps): React.JSX.Element;
 export { Input };

package/dist/src/components/Input/{input.js → input.jsx} RENAMED Viewed

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -20,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
 import { cva } from "class-variance-authority";
 import { cn } from "../../lib/utils";
 import LUIcon from "../Icons/LUIcon";
@@ -108,6 +97,14 @@ function Input(_a) {
     var iconSizeClass = getIconSize(size);
     var paddingClass = getPadding(size, !!startIcon, !!endIcon);
     var iconPosition = getIconPosition(size || "md");
-    return (_jsxs("div", { className: "relative", children: [startIcon && (_jsx("div", { className: "absolute ".concat(iconPosition.left, " top-1/2 -translate-y-1/2 pointer-events-none z-10"), children: _jsx(LUIcon, { icon: startIcon, size: iconSizeClass }) })), _jsx("input", __assign({ type: type, "data-slot": "input", className: cn(inputVariants({ variant: variant, size: size, color: color, shape: shape }), paddingClass, className) }, props)), endIcon && (_jsx("div", { className: "absolute ".concat(iconPosition.right, " top-1/2 -translate-y-1/2 pointer-events-none z-10"), children: _jsx(LUIcon, { icon: endIcon, size: iconSizeClass }) }))] }));
+    return (<div className="relative">
+      {startIcon && (<div className={"absolute ".concat(iconPosition.left, " top-1/2 -translate-y-1/2 pointer-events-none z-10")}>
+          <LUIcon icon={startIcon} size={iconSizeClass}/>
+        </div>)}
+      <input type={type} data-slot="input" className={cn(inputVariants({ variant: variant, size: size, color: color, shape: shape }), paddingClass, className)} {...props}/>
+      {endIcon && (<div className={"absolute ".concat(iconPosition.right, " top-1/2 -translate-y-1/2 pointer-events-none z-10")}>
+          <LUIcon icon={endIcon} size={iconSizeClass}/>
+        </div>)}
+    </div>);
 }
 export { Input };

package/dist/src/components/Label/Label.d.ts CHANGED Viewed

@@ -10,5 +10,5 @@ export declare const variant: {
 declare const labelVariants: (props?: ({
     variant?: "label-sm" | "label-xl" | "label-lg" | "label-md" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function Label({ className, variant, ...props }: React.ComponentProps<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>): import("react/jsx-runtime").JSX.Element;
+declare function Label({ className, variant, ...props }: React.ComponentProps<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>): React.JSX.Element;
 export { Label, labelVariants };

package/dist/src/components/Label/{Label.js → Label.jsx} RENAMED Viewed

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -20,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
 import * as LabelPrimitive from "@radix-ui/react-label";
 import { cva } from "class-variance-authority";
 import { cn } from "../../lib/utils";
@@ -38,6 +27,6 @@ var labelVariants = cva("select-none group-data-[disabled=true]:pointer-events-n
 });
 function Label(_a) {
     var className = _a.className, variant = _a.variant, props = __rest(_a, ["className", "variant"]);
-    return (_jsx(LabelPrimitive.Root, __assign({ "data-slot": "label", className: cn(labelVariants({ variant: variant, className: className })) }, props)));
+    return (<LabelPrimitive.Root data-slot="label" className={cn(labelVariants({ variant: variant, className: className }))} {...props}/>);
 }
 export { Label, labelVariants };

package/dist/src/components/Label/{Label.stories.js → Label.stories.jsx} RENAMED Viewed

@@ -1,22 +1,10 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx } from "react/jsx-runtime";
 import { Label, variant } from "./Label";
 export default {
     title: "Components/Label",
     component: Label,
     tags: ["autodocs"],
 };
-var Template = function (args) { return _jsx(Label, __assign({}, args)); };
+var Template = function (args) { return <Label {...args}></Label>; };
 export var _Label = Template.bind({});
 _Label.args = {
     children: "Label",

package/dist/src/components/Modal/Modal.d.ts CHANGED Viewed

@@ -17,11 +17,11 @@ type DialogHeaderProps = React.HTMLAttributes<HTMLDivElement> & {
     size?: keyof typeof sizes;
 };
 declare const DialogHeader: {
-    ({ className, variant, size, ...props }: DialogHeaderProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, variant, size, ...props }: DialogHeaderProps): React.JSX.Element;
     displayName: string;
 };
 declare const DialogBody: {
-    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
     displayName: string;
 };
 type DialogFooterProps = React.HTMLAttributes<HTMLDivElement> & {
@@ -29,7 +29,7 @@ type DialogFooterProps = React.HTMLAttributes<HTMLDivElement> & {
     variant?: keyof typeof footerVariants;
 };
 declare const DialogFooter: {
-    ({ className, size, variant, ...props }: DialogFooterProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, size, variant, ...props }: DialogFooterProps): React.JSX.Element;
     displayName: string;
 };
 declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & {