@liner-fe/prism 1.11.0 → 1.12.0

package/lib/index.mjs

@@ -3742,6 +3742,26 @@ var ICHome = /* @__PURE__ */ __name((props) => {
 import { jsx as jsx79, jsxs as jsxs57 } from "react/jsx-runtime";
 var ICVisibility = /* @__PURE__ */ __name((props) => {
   const { thick = false, fill = false, size = 32, color = "#1E1E1F" } = props;
+  if (fill && thick) {
+    return /* @__PURE__ */ jsxs57("svg", { ...props, width: size, height: size, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48", fill: "none", children: [
+      /* @__PURE__ */ jsx79(
+        "path",
+        {
+          d: "M30 24C30 27.3137 27.3137 30 24 30C20.6863 30 18 27.3137 18 24C18 20.6863 20.6863 18 24 18C27.3137 18 30 20.6863 30 24Z",
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx79(
+        "path",
+        {
+          "fill-rule": "evenodd",
+          "clip-rule": "evenodd",
+          d: "M24 38C36.1503 38 46 26 46 24C46 22 36.1503 10 24 10C11.8497 10 2 22 2 24C2 26 11.8497 38 24 38ZM33 24C33 28.9706 28.9706 33 24 33C19.0294 33 15 28.9706 15 24C15 19.0294 19.0294 15 24 15C28.9706 15 33 19.0294 33 24Z",
+          fill: color
+        }
+      )
+    ] });
+  }
   if (thick) {
     return /* @__PURE__ */ jsxs57("svg", { ...props, width: size, height: size, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
       /* @__PURE__ */ jsx79(
@@ -3764,6 +3784,26 @@ var ICVisibility = /* @__PURE__ */ __name((props) => {
       )
     ] });
   }
+  if (fill) {
+    return /* @__PURE__ */ jsxs57("svg", { ...props, width: size, height: size, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48", fill: "none", children: [
+      /* @__PURE__ */ jsx79(
+        "path",
+        {
+          d: "M29 24C29 26.7614 26.7614 29 24 29C21.2386 29 19 26.7614 19 24C19 21.2386 21.2386 19 24 19C26.7614 19 29 21.2386 29 24Z",
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx79(
+        "path",
+        {
+          "fill-rule": "evenodd",
+          "clip-rule": "evenodd",
+          d: "M24 38C36.1503 38 46 26 46 24C46 22 36.1503 10 24 10C11.8497 10 2 22 2 24C2 26 11.8497 38 24 38ZM33 24C33 28.9706 28.9706 33 24 33C19.0294 33 15 28.9706 15 24C15 19.0294 19.0294 15 24 15C28.9706 15 33 19.0294 33 24Z",
+          fill: color
+        }
+      )
+    ] });
+  }
   return /* @__PURE__ */ jsxs57("svg", { ...props, width: size, height: size, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
     /* @__PURE__ */ jsx79(
       "path",
@@ -3790,6 +3830,60 @@ var ICVisibility = /* @__PURE__ */ __name((props) => {
 import { jsx as jsx80, jsxs as jsxs58 } from "react/jsx-runtime";
 var ICVisibilityOff = /* @__PURE__ */ __name((props) => {
   const { thick = false, fill = false, size = 32, color = "#1E1E1F" } = props;
+  if (fill && thick) {
+    return /* @__PURE__ */ jsxs58("svg", { ...props, width: size, height: size, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+      /* @__PURE__ */ jsx80("path", { d: "M11.2725 8.44336L8.44409 11.2718L36.7284 39.5561L39.5568 36.7276L11.2725 8.44336Z", fill: color }),
+      /* @__PURE__ */ jsx80(
+        "path",
+        {
+          d: "M38.3491 32.6915C43.0339 29.2067 46 25.0978 46 24.0003C46 22.0003 36.1503 10.0003 24 10.0003C21.5361 10.0003 19.1667 10.4938 16.9549 11.2973L21.1264 15.4688C22.0288 15.165 22.9952 15.0003 24 15.0003C28.9706 15.0003 33 19.0297 33 24.0003C33 25.0051 32.8353 25.9715 32.5315 26.8739L38.3491 32.6915Z",
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx80("path", { d: "M24.7076 19.05C26.9028 19.361 28.6393 21.0975 28.9503 23.2927L24.7076 19.05Z", fill: color }),
+      /* @__PURE__ */ jsx80(
+        "path",
+        {
+          d: "M9.65214 15.3082L15.469 21.1251C15.1649 22.028 15 22.9949 15 24.0003C15 28.9709 19.0294 33.0003 24 33.0003C25.0054 33.0003 25.9723 32.8354 26.8752 32.5313L31.0467 36.7027C28.8344 37.5066 26.4645 38.0003 24 38.0003C11.8497 38.0003 2 26.0003 2 24.0003C2 22.9027 4.96667 18.7931 9.65214 15.3082Z",
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx80("path", { d: "M23.2949 28.951L19.0493 24.7054C19.3594 26.9026 21.0977 28.6409 23.2949 28.951Z", fill: color })
+    ] });
+  }
+  if (fill) {
+    return /* @__PURE__ */ jsxs58("svg", { ...props, width: size, height: size, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+      /* @__PURE__ */ jsx80("path", { d: "M11.2725 8.44336L8.44409 11.2718L36.7284 39.5561L39.5568 36.7276L11.2725 8.44336Z", fill: color }),
+      /* @__PURE__ */ jsx80(
+        "path",
+        {
+          d: "M37.9408 32.9904C42.8609 29.4455 46 25.1294 46 24.0003C46 22.0003 36.1503 10.0003 24 10.0003C21.3442 10.0003 18.7982 10.5736 16.441 11.4906L20.6108 15.6603C21.6568 15.2347 22.801 15.0003 24 15.0003C28.9706 15.0003 33 19.0297 33 24.0003C33 25.1993 32.7656 26.3435 32.34 27.3895L37.9408 32.9904Z",
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx80(
+        "path",
+        {
+          d: "M18.0785 23.0275L24.9728 29.9218C24.6562 29.9735 24.3312 30.0003 24 30.0003C20.6863 30.0003 18 27.314 18 24.0003C18 23.6691 18.0268 23.3441 18.0785 23.0275Z",
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx80(
+        "path",
+        {
+          d: "M15 24.0003C15 22.8008 15.2347 21.6561 15.6606 20.6096L10.0603 15.0094C5.13964 18.5544 2 22.8711 2 24.0003C2 26.0003 11.8497 38.0003 24 38.0003C26.6564 38.0003 29.2028 37.4267 31.5604 36.5095L27.3907 32.3397C26.3442 32.7656 25.1995 33.0003 24 33.0003C19.0294 33.0003 15 28.9709 15 24.0003Z",
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx80(
+        "path",
+        {
+          d: "M29.9218 24.9714L23.0289 18.0785C23.345 18.027 23.6694 18.0003 24 18.0003C27.3137 18.0003 30 20.6866 30 24.0003C30 24.3309 29.9733 24.6553 29.9218 24.9714Z",
+          fill: color
+        }
+      )
+    ] });
+  }
   if (thick) {
     return /* @__PURE__ */ jsxs58("svg", { ...props, width: size, height: size, viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
       /* @__PURE__ */ jsx80("path", { d: "M39.5568 36.7276L36.7284 39.5561L8.44409 11.2718L11.2725 8.44336L39.5568 36.7276Z", fill: color }),
@@ -6897,6 +6991,165 @@ var RadioItem = forwardRef7(
 var Radio = Object.assign(RadioRoot, {
   Item: RadioItem
 });
+
+// src/components/Textfield/index.tsx
+import {
+  forwardRef as forwardRef8,
+  useId,
+  useImperativeHandle,
+  useRef as useRef2,
+  useState as useState2
+} from "react";
+
+// src/components/Textfield/style.module.scss
+var style_module_default11 = {
+  "textfield-container": "_textfield-container_117bb_1",
+  "textfield": "_textfield_117bb_1",
+  "label": "_label_117bb_29",
+  "label-out-textfield": "_label-out-textfield_117bb_33",
+  "label-in": "_label-in_117bb_46",
+  "label-out": "_label-out_117bb_33",
+  "input-wrapper": "_input-wrapper_117bb_56",
+  "input": "_input_117bb_56",
+  "label-out-input": "_label-out-input_117bb_93",
+  "input-action-buttons": "_input-action-buttons_117bb_97",
+  "action-button": "_action-button_117bb_103",
+  "error": "_error_117bb_107",
+  "error-message": "_error-message_117bb_123",
+  "error-wrapper": "_error-wrapper_117bb_127",
+  "error-icon": "_error-icon_117bb_136",
+  "footer": "_footer_117bb_140",
+  "character": "_character_117bb_148"
+};
+
+// src/components/Textfield/index.tsx
+import { cva as cva8 } from "class-variance-authority";
+import clsx14 from "clsx";
+import { Fragment as Fragment5, jsx as jsx142, jsxs as jsxs96 } from "react/jsx-runtime";
+var defaultTextfieldVariants = cva8(style_module_default11.textfield);
+var Textfield = forwardRef8((props, ref) => {
+  const {
+    id = useId(),
+    type,
+    label,
+    value: controlledValue,
+    maxCharacter,
+    placeholder = "",
+    error,
+    disabled,
+    button,
+    onChange,
+    onClear,
+    ...rest
+  } = props;
+  const inputRef = useRef2(null);
+  const [value, setValue] = useState2("");
+  const [deidentifiy, setDeidentifiy] = useState2(false);
+  const isControlled = controlledValue !== void 0;
+  const isPassword = type === "password";
+  const isDeidentified = isPassword && deidentifiy;
+  const { text: labelText, type: labelType = "in" } = label;
+  const handleTextfieldClick = /* @__PURE__ */ __name(() => {
+    inputRef.current?.focus();
+  }, "handleTextfieldClick");
+  const handleChange = /* @__PURE__ */ __name((e) => {
+    const { value: value2 } = e.target;
+    if (maxCharacter && value2.length > maxCharacter) {
+      return;
+    }
+    if (!isControlled) {
+      setValue(value2);
+    }
+    onChange?.(e);
+  }, "handleChange");
+  const handleClear = /* @__PURE__ */ __name((e) => {
+    e.stopPropagation();
+    onClear?.();
+    setValue("");
+  }, "handleClear");
+  const handleDeidentify = /* @__PURE__ */ __name((e) => {
+    e.stopPropagation();
+    setDeidentifiy((prev) => !prev);
+  }, "handleDeidentify");
+  useImperativeHandle(ref, () => inputRef.current);
+  return /* @__PURE__ */ jsxs96("div", { className: style_module_default11["textfield-container"], children: [
+    /* @__PURE__ */ jsx142(
+      "div",
+      {
+        className: clsx14(defaultTextfieldVariants(), {
+          [style_module_default11.error]: !!error,
+          [style_module_default11["label-out-textfield"]]: labelType === "out"
+        }),
+        onClick: handleTextfieldClick,
+        children: /* @__PURE__ */ jsxs96("div", { className: style_module_default11["input-wrapper"], children: [
+          /* @__PURE__ */ jsx142(
+            "input",
+            {
+              className: clsx14(style_module_default11.input, {
+                [style_module_default11["label-out-input"]]: labelType === "out"
+              }),
+              type: isDeidentified ? "password" : "text",
+              placeholder,
+              ref: inputRef,
+              disabled,
+              value: isControlled ? controlledValue : value,
+              onChange: handleChange,
+              ...rest
+            }
+          ),
+          /* @__PURE__ */ jsx142(
+            Label,
+            {
+              className: clsx14(style_module_default11.label, {
+                [style_module_default11["label-in"]]: labelType === "in",
+                [style_module_default11["label-out"]]: labelType === "out"
+              }),
+              size: label.type === "out" ? "s" : void 0,
+              htmlFor: id,
+              children: labelText
+            }
+          ),
+          /* @__PURE__ */ jsxs96("div", { className: style_module_default11["input-action-buttons"], children: [
+            value && /* @__PURE__ */ jsx142(
+              IconButton,
+              {
+                className: style_module_default11["action-button"],
+                name: "close-fill",
+                size: "xs",
+                level: "tertiary",
+                thick: true,
+                onClick: handleClear
+              }
+            ),
+            isPassword && /* @__PURE__ */ jsx142(
+              IconButton,
+              {
+                className: style_module_default11["action-button"],
+                name: deidentifiy ? "visibility-off" : "visibility",
+                size: "xs",
+                level: "tertiary",
+                fill: true,
+                onClick: handleDeidentify
+              }
+            ),
+            button && /* @__PURE__ */ jsx142(Button, { size: "m", onClick: button.onClick, children: button.text })
+          ] })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxs96("div", { className: style_module_default11.footer, children: [
+      /* @__PURE__ */ jsx142("div", { className: style_module_default11["error-wrapper"], children: error && /* @__PURE__ */ jsxs96(Fragment5, { children: [
+        /* @__PURE__ */ jsx142(Icon, { className: style_module_default11["error-icon"], name: "exclamationmark-fill", fill: true, thick: true, size: "xs" }),
+        /* @__PURE__ */ jsx142(Caption, { size: 3, type: "normal", weight: "regular", className: style_module_default11["error-message"], children: error })
+      ] }) }),
+      maxCharacter && /* @__PURE__ */ jsxs96(Caption, { className: style_module_default11.character, size: 3, type: "normal", weight: "regular", children: [
+        isControlled ? controlledValue.length : value.length,
+        "/",
+        maxCharacter
+      ] })
+    ] })
+  ] });
+});
 export {
   Button,
   Caption,
@@ -6910,6 +7163,7 @@ export {
   Popover,
   Radio,
   TextButton,
+  Textfield,
   Title2 as Title,
   Toaster,
   Tooltip,