@tipp/ui 1.6.27 → 1.6.29

package/dist/chunk-UARPROHP.js

@@ -0,0 +1,48 @@
+import {
+  __objRest,
+  __spreadValues
+} from "./chunk-N552FDTV.js";
+
+// src/atoms/auto-sizing-input.tsx
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useRef,
+  useState
+} from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var AutoSizingInput = forwardRef(
+  (_a, ref) => {
+    var _b = _a, { value: _value, onChangeValue, onChange } = _b, rest = __objRest(_b, ["value", "onChangeValue", "onChange"]);
+    const [value, setValue] = useState(_value);
+    const [width, setWidth] = useState(0);
+    const span = useRef(null);
+    useEffect(() => {
+      span.current && setWidth(span.current.offsetWidth);
+    }, [value]);
+    const changeHandler = useCallback(
+      (evt) => {
+        onChange == null ? void 0 : onChange(evt);
+        setValue(evt.target.value);
+      },
+      [onChange]
+    );
+    useEffect(() => {
+      setValue(_value || "");
+    }, [_value]);
+    useEffect(() => {
+      onChangeValue == null ? void 0 : onChangeValue(value || "");
+    }, [value, onChangeValue]);
+    return /* @__PURE__ */ jsxs("div", { className: "auto-sizing-input wrapper", style: { width: width + 24 }, children: [
+      /* @__PURE__ */ jsx("input", __spreadValues({ onChange: changeHandler, ref, value }, rest)),
+      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", ref: span, style: rest.style, children: value })
+    ] });
+  }
+);
+AutoSizingInput.displayName = "AutoSizingInput";
+
+export {
+  AutoSizingInput
+};
+//# sourceMappingURL=chunk-UARPROHP.js.map

package/dist/chunk-UARPROHP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/auto-sizing-input.tsx"],"sourcesContent":["import type { DetailedHTMLProps } from 'react';\nimport React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nexport interface AutoSizingInputProps\n  extends DetailedHTMLProps<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HTMLInputElement\n  > {\n  value?: string;\n  onChangeValue?: (value: string) => void;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n}\n\nexport const AutoSizingInput = forwardRef<\n  HTMLInputElement,\n  AutoSizingInputProps\n>(\n  (\n    { value: _value, onChangeValue, onChange, ...rest },\n    ref\n  ): React.ReactNode => {\n    const [value, setValue] = useState(_value);\n    const [width, setWidth] = useState(0);\n    const span = useRef<HTMLSpanElement>(null);\n\n    useEffect(() => {\n      span.current && setWidth(span.current.offsetWidth);\n    }, [value]);\n\n    const changeHandler = useCallback<\n      React.ChangeEventHandler<HTMLInputElement>\n    >(\n      (evt) => {\n        onChange?.(evt);\n        setValue(evt.target.value);\n      },\n      [onChange]\n    );\n\n    useEffect(() => {\n      setValue(_value || '');\n    }, [_value]);\n\n    useEffect(() => {\n      onChangeValue?.(value || '');\n    }, [value, onChangeValue]);\n\n    return (\n      <div className=\"auto-sizing-input wrapper\" style={{ width: width + 24 }}>\n        <input onChange={changeHandler} ref={ref} value={value} {...rest} />\n        <span aria-hidden=\"true\" ref={span} style={rest.style}>\n          {value}\n        </span>\n      </div>\n    );\n  }\n);\n\nAutoSizingInput.displayName = 'AutoSizingInput';\n"],"mappings":";;;;;;AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AA+CD,SACE,KADF;AAnCC,IAAM,kBAAkB;AAAA,EAI7B,CACE,IACA,QACoB;AAFpB,iBAAE,SAAO,QAAQ,eAAe,SAxBpC,IAwBI,IAA6C,iBAA7C,IAA6C,CAA3C,SAAe,iBAAe;AAGhC,UAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,MAAM;AACzC,UAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,CAAC;AACpC,UAAM,OAAO,OAAwB,IAAI;AAEzC,cAAU,MAAM;AACd,WAAK,WAAW,SAAS,KAAK,QAAQ,WAAW;AAAA,IACnD,GAAG,CAAC,KAAK,CAAC;AAEV,UAAM,gBAAgB;AAAA,MAGpB,CAAC,QAAQ;AACP,6CAAW;AACX,iBAAS,IAAI,OAAO,KAAK;AAAA,MAC3B;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AAEA,cAAU,MAAM;AACd,eAAS,UAAU,EAAE;AAAA,IACvB,GAAG,CAAC,MAAM,CAAC;AAEX,cAAU,MAAM;AACd,qDAAgB,SAAS;AAAA,IAC3B,GAAG,CAAC,OAAO,aAAa,CAAC;AAEzB,WACE,qBAAC,SAAI,WAAU,6BAA4B,OAAO,EAAE,OAAO,QAAQ,GAAG,GACpE;AAAA,0BAAC,0BAAM,UAAU,eAAe,KAAU,SAAkB,KAAM;AAAA,MAClE,oBAAC,UAAK,eAAY,QAAO,KAAK,MAAM,OAAO,KAAK,OAC7C,iBACH;AAAA,OACF;AAAA,EAEJ;AACF;AAEA,gBAAgB,cAAc;","names":[]}

package/dist/icon.js

@@ -54,6 +54,15 @@ import {
   VideoIcon
 } from "./chunk-HLFG5ZTU.js";
 import "./chunk-7WVKYXIG.js";
+import {
+  TriangleArrowUpIcon
+} from "./chunk-NDUKDKGB.js";
+import {
+  CameraDisabledIcon
+} from "./chunk-T6CF4F7J.js";
+import {
+  CameraIcon
+} from "./chunk-A75U32HT.js";
 import {
   TriangleArrowDownIcon
 } from "./chunk-BSTJBBEX.js";
@@ -66,15 +75,6 @@ import {
 import {
   PhoneRingIcon
 } from "./chunk-UFYNSPJQ.js";
-import {
-  TriangleArrowUpIcon
-} from "./chunk-NDUKDKGB.js";
-import {
-  CameraDisabledIcon
-} from "./chunk-T6CF4F7J.js";
-import {
-  CameraIcon
-} from "./chunk-A75U32HT.js";
 import "./chunk-N552FDTV.js";
 export {
   ArchiveIcon,

package/dist/icons/index.js

@@ -1,4 +1,13 @@
 import "../chunk-7WVKYXIG.js";
+import {
+  TriangleArrowUpIcon
+} from "../chunk-NDUKDKGB.js";
+import {
+  CameraDisabledIcon
+} from "../chunk-T6CF4F7J.js";
+import {
+  CameraIcon
+} from "../chunk-A75U32HT.js";
 import {
   TriangleArrowDownIcon
 } from "../chunk-BSTJBBEX.js";
@@ -11,15 +20,6 @@ import {
 import {
   PhoneRingIcon
 } from "../chunk-UFYNSPJQ.js";
-import {
-  TriangleArrowUpIcon
-} from "../chunk-NDUKDKGB.js";
-import {
-  CameraDisabledIcon
-} from "../chunk-T6CF4F7J.js";
-import {
-  CameraIcon
-} from "../chunk-A75U32HT.js";
 import "../chunk-N552FDTV.js";
 export {
   CameraDisabledIcon,

package/dist/index.cjs

@@ -613,7 +613,7 @@ function Content2(props) {
     }, rest), {
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_themes19.Flex, { gap: "2", justify: "between", width: "100%", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Title, { asChild: true, children: typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Heading2, { align: "center", mb: "2", variant: "heading3", children: title }) : title }),
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Title, { asChild: true, children: typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Heading2, { mb: "2", variant: "heading3", children: title }) : title }),
           !hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RadixDialog.Close, { asChild: true, className: "DialogClose", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_themes18.IconButton, { color: "gray", variant: "ghost", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_icons.Cross1Icon, {}) }) })
         ] }),
         children,
@@ -1600,7 +1600,7 @@ var AutoSizingInput = (0, import_react19.forwardRef)(
     }, [value, onChangeValue]);
     return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "auto-sizing-input wrapper", style: { width: width + 24 }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("input", __spreadValues({ onChange: changeHandler, ref, value }, rest)),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { "aria-hidden": "true", ref: span, children: value })
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { "aria-hidden": "true", ref: span, style: rest.style, children: value })
     ] });
   }
 );