@solibo/solibo-ui 1.1.7 → 1.2.1

package/dist/index-Cv6TtBnd.js

@@ -1,76 +0,0 @@
-import { jsxs as $, Fragment as G, jsx as c } from "react/jsx-runtime";
-import { t as p } from "./classix-DG18itHa.js";
-import { useState as E, useEffect as F } from "react";
-import { i as H } from "./icons-dUP7sKyt.js";
-import { u as U, c as W } from "./use-touched-B999bBr8.js";
-import './assets/index45.css';function k(t) {
-  return t && `${t[0].toLocaleUpperCase()}${t.slice(1)}`;
-}
-function A(t) {
-  const e = k(t);
-  return e && !e.endsWith(":") ? `${e}:` : e;
-}
-const D = "_input_p0mz8_3", J = "_touched_p0mz8_43", K = "_label_p0mz8_48", M = "_inline_p0mz8_69", O = "_code_p0mz8_86", o = {
-  input: D,
-  touched: J,
-  label: K,
-  inline: M,
-  code: O
-};
-function q({
-  className: t,
-  defaultCountryCode: e = "+47",
-  disabled: s = !1,
-  icon: f,
-  label: m,
-  onBlur: P,
-  placeholder: g,
-  ref: v,
-  required: d,
-  style: x,
-  type: n = "text",
-  variant: h = "default",
-  ...z
-}) {
-  const [_, L] = E(""), [a, b] = E(""), {
-    name: B,
-    onChange: l,
-    pattern: S,
-    value: u,
-    ...T
-  } = z, {
-    touched: I,
-    onBlur: V
-  } = U(u === ""), r = f && n !== "radio" && n !== "datetime-local" ? f : void 0, N = m && h === "inline" ? A(m) : m, j = r ? {
-    ...x,
-    "--icon-svg": H(r)
-  } : x, C = W(V, P);
-  F(() => {
-    if (l && n === "tel") {
-      const i = {
-        name: B,
-        value: a ? (_ || e).split(" ").join("") + a.split(" ").join("") : void 0
-      };
-      l({
-        target: i,
-        currentTarget: i
-      });
-    }
-  }, [_, e, B, l, a, n]), F(() => {
-    n === "tel" && !u && (b(""), L(""));
-  }, [n, u]);
-  const w = /* @__PURE__ */ $(G, { children: [
-    /* @__PURE__ */ c("input", { disabled: s, hidden: !0, onChange: l, pattern: void 0, placeholder: g, ref: v, type: n, value: u }),
-    /* @__PURE__ */ c("input", { type: "text", className: p(o.code, o.input), disabled: s, maxLength: 5, onChange: (i) => L(i.target.value), placeholder: e, value: _ }),
-    /* @__PURE__ */ c("input", { ...T, type: "tel", className: p(o.input, t, I && o.touched), "data-icon": r ? "true" : void 0, disabled: s, maxLength: 14, name: void 0, onChange: (i) => b(i.target.value), onBlur: C, pattern: S, required: d, style: j, value: a })
-  ] });
-  return /* @__PURE__ */ $("label", { className: p(o.label, h === "inline" && o.inline), "data-component": "input", children: [
-    N && /* @__PURE__ */ c("span", { "data-required": d && h !== "inline" ? !0 : void 0, children: N }),
-    n === "tel" ? w : /* @__PURE__ */ c("input", { ...z, ref: v, className: p(o.input, t, I && o.touched), "data-icon": r ? "true" : void 0, disabled: s, onBlur: C, placeholder: g, required: d, style: j, type: n })
-  ] });
-}
-export {
-  q as I,
-  A as f
-};
-//# sourceMappingURL=index-Cv6TtBnd.js.map

package/dist/index-Cv6TtBnd.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-Cv6TtBnd.js","sources":["../src/utils/text.ts","../src/components/input/index.tsx"],"sourcesContent":["export function capitalizeFirstLetter(value: string): string {\n  return value ? `${value[0].toLocaleUpperCase()}${value.slice(1)}` : value;\n}\n\nexport function formatInlineLabel(value: string): string {\n  const label = capitalizeFirstLetter(value);\n  return label && !label.endsWith(':') ? `${label}:` : label;\n}\n","import cx from 'classix';\nimport { useEffect, useState } from 'react';\n\nimport { IconName, iconSVG } from '@/components/icon/icons.ts';\nimport { composeEventHandlers } from '@/utils/compose-event-handlers';\nimport { formatInlineLabel } from '@/utils/text';\nimport { useTouched } from '@/utils/use-touched';\n\nimport styles from './styles.module.css';\n\nexport type InputProps = React.ComponentPropsWithRef<'input'> & {\n  defaultCountryCode?: string;\n  disabled?: boolean;\n  icon?: IconName;\n  label?: string;\n  onClick?: React.MouseEventHandler<HTMLInputElement>;\n  placeholder?: string;\n  variant?: 'default' | 'inline';\n  type?:\n    | 'date'\n    | 'datetime-local'\n    | 'email'\n    | 'number'\n    | 'password'\n    | 'radio'\n    | 'search'\n    | 'tel'\n    | 'text';\n};\n\nexport function Input({\n  className,\n  defaultCountryCode = '+47',\n  disabled = false,\n  icon,\n  label,\n  onBlur: onBlurProp,\n  placeholder,\n  ref,\n  required,\n  style,\n  type = 'text',\n  variant = 'default',\n  ...props\n}: InputProps) {\n  const [countryCode, setCountryCode] = useState('');\n  const [phoneNumber, setPhoneNumber] = useState('');\n  const { name, onChange, pattern, value, ...restProps } = props;\n  const { touched, onBlur } = useTouched(value === '');\n  const inputIcon = icon && type !== 'radio' && type !== 'datetime-local' ? icon : undefined;\n  const displayLabel = label && variant === 'inline' ? formatInlineLabel(label) : label;\n\n  type withVars =\n    | (React.CSSProperties & {\n        '--icon-svg'?: string;\n      })\n    | undefined;\n\n  const withVars: withVars = inputIcon\n    ? {\n        ...style,\n        '--icon-svg': iconSVG(inputIcon),\n      }\n    : style;\n  const handleBlur = composeEventHandlers(onBlur, onBlurProp);\n\n  useEffect(() => {\n    if (onChange && type === 'tel') {\n      const target = {\n        name,\n        value: phoneNumber\n          ? (countryCode || defaultCountryCode).split(' ').join('') +\n            phoneNumber.split(' ').join('')\n          : undefined,\n      } as unknown as HTMLInputElement;\n\n      onChange({ target, currentTarget: target } as React.ChangeEvent<HTMLInputElement>);\n    }\n  }, [countryCode, defaultCountryCode, name, onChange, phoneNumber, type]);\n\n  useEffect(() => {\n    if (type === 'tel' && !value) {\n      setPhoneNumber('');\n      setCountryCode('');\n    }\n  }, [type, value]);\n\n  const telephoneInput = (\n    <>\n      <input\n        disabled={disabled}\n        hidden\n        onChange={onChange}\n        pattern={undefined}\n        placeholder={placeholder}\n        ref={ref}\n        type={type}\n        value={value}\n      />\n      <input\n        type='text'\n        className={cx(styles.code, styles.input)}\n        disabled={disabled}\n        maxLength={5}\n        onChange={(e) => setCountryCode(e.target.value)}\n        placeholder={defaultCountryCode}\n        value={countryCode}\n      />\n      <input\n        {...restProps}\n        type='tel'\n        className={cx(styles.input, className, touched && styles.touched)}\n        data-icon={inputIcon ? 'true' : undefined}\n        disabled={disabled}\n        maxLength={14}\n        name={undefined}\n        onChange={(e) => setPhoneNumber(e.target.value)}\n        onBlur={handleBlur}\n        pattern={pattern}\n        required={required}\n        style={withVars}\n        value={phoneNumber}\n      />\n    </>\n  );\n\n  return (\n    <label className={cx(styles.label, variant === 'inline' && styles.inline)}>\n      {displayLabel && (\n        <span data-required={required && variant !== 'inline' ? true : undefined}>\n          {displayLabel}\n        </span>\n      )}\n      {type === 'tel' ? (\n        telephoneInput\n      ) : (\n        <input\n          {...props}\n          ref={ref}\n          className={cx(styles.input, className, touched && styles.touched)}\n          data-icon={inputIcon ? 'true' : undefined}\n          disabled={disabled}\n          onBlur={handleBlur}\n          placeholder={placeholder}\n          required={required}\n          style={withVars}\n          type={type}\n        />\n      )}\n    </label>\n  );\n}\n"],"names":["capitalizeFirstLetter","value","toLocaleUpperCase","slice","formatInlineLabel","label","endsWith","Input","className","defaultCountryCode","disabled","icon","onBlur","onBlurProp","placeholder","ref","required","style","type","variant","props","countryCode","setCountryCode","useState","phoneNumber","setPhoneNumber","name","onChange","pattern","restProps","touched","useTouched","inputIcon","undefined","displayLabel","withVars","iconSVG","handleBlur","composeEventHandlers","useEffect","target","split","join","currentTarget","telephoneInput","jsxs","Fragment","jsx","cx","styles","code","input","e","inline"],"mappings":"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"}