@banzamel/mineralui 0.1.0

package/dist/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),q=n.createContext({}),tr={primary:"--mineral-primary",primaryDark:"--mineral-primary-dark",primaryLight:"--mineral-primary-light",dark:"--mineral-dark",darkLight:"--mineral-dark-light",surface:"--mineral-surface",text:"--mineral-text",textSecondary:"--mineral-text-secondary",textHeading:"--mineral-text-heading",border:"--mineral-border",borderHover:"--mineral-border-hover",borderFocus:"--mineral-border-focus",success:"--mineral-success",error:"--mineral-error",warning:"--mineral-warning",info:"--mineral-info",fontFamily:"--mineral-font-family",radiusSm:"--mineral-radius-sm",radiusMd:"--mineral-radius-md",radiusLg:"--mineral-radius-lg"};function sr({theme:a,children:x}){const t=n.useRef(null);return n.useEffect(()=>{if(!t.current)return;const c=t.current;for(const[g,s]of Object.entries(a)){const _=tr[g];_&&s&&c.style.setProperty(_,s)}},[a]),e.jsx(q.Provider,{value:a,children:e.jsx("div",{ref:t,children:x})})}function or(){return n.useContext(q)}function l(...a){return a.filter(Boolean).join(" ")}const ar="_wrapper_1tprv_2",cr="_fullWidth_1tprv_10",ir="_label_1tprv_15",lr="_focused_1tprv_22",dr="_labelError_1tprv_26",ur="_labelSuccess_1tprv_30",_r="_required_1tprv_34",pr="_inputContainer_1tprv_40",mr="_outlined_1tprv_50",vr="_disabled_1tprv_56",fr="_filled_1tprv_66",hr="_underlined_1tprv_82",br="_inputError_1tprv_98",xr="_inputSuccess_1tprv_106",gr="_colorWarning_1tprv_115",jr="_colorInfo_1tprv_120",yr="_sm_1tprv_126",Sr="_md_1tprv_132",Ir="_lg_1tprv_138",Cr="_rounded_1tprv_145",Nr="_input_1tprv_40",kr="_startIcon_1tprv_178",wr="_endIcon_1tprv_186",Er="_clearBtn_1tprv_195",Mr="_spinner_1tprv_214",Rr="_spin_1tprv_214",Wr="_helperText_1tprv_232",Tr="_errorTextMsg_1tprv_238",Or="_charCount_1tprv_245",qr="_charCountOver_1tprv_252",Pr="_bottomRow_1tprv_257",r={wrapper:ar,fullWidth:cr,label:ir,focused:lr,labelError:dr,labelSuccess:ur,required:_r,inputContainer:pr,outlined:mr,disabled:vr,filled:fr,underlined:hr,inputError:br,inputSuccess:xr,colorWarning:gr,colorInfo:jr,sm:yr,md:Sr,lg:Ir,rounded:Cr,input:Nr,startIcon:kr,endIcon:wr,clearBtn:Er,spinner:Mr,spin:Rr,helperText:Wr,errorTextMsg:Tr,charCount:Or,charCountOver:qr,bottomRow:Pr},$r=n.forwardRef(function({type:x="text",value:t,defaultValue:c,name:g,id:s,placeholder:_,disabled:j=!1,readOnly:P=!1,required:I=!1,autoFocus:$=!1,autoComplete:B,variant:H="outlined",size:D="md",color:C,fullWidth:F=!1,rounded:z=!1,label:N,helperText:p,errorText:i,startIcon:k,endIcon:w,clearable:A=!1,error:G=!1,success:E=!1,maxLength:m,showCharCount:M=!1,onChange:v,onFocus:f,onBlur:h,onKeyDown:J,onClear:b,loading:y=!1,className:K,style:L,inputClassName:Q,labelClassName:U},d){const[R,W]=n.useState(!1),[V,T]=n.useState((c==null?void 0:c.toString())??""),O=n.useRef(null),S=t!==void 0?t.toString():V,u=G||!!i,X=S.length>0,Y=n.useCallback(o=>{W(!0),f==null||f(o)},[f]),Z=n.useCallback(o=>{W(!1),h==null||h(o)},[h]),rr=n.useCallback(o=>{t===void 0&&T(o.target.value),v==null||v(o)},[v,t]),er=n.useCallback(()=>{t===void 0&&T(""),b==null||b();const o=(d==null?void 0:d.current)??O.current;o==null||o.focus()},[b,d]),nr=l(r.inputContainer,r[H],r[D],R&&r.focused,u&&r.inputError,E&&!u&&r.inputSuccess,C==="warning"&&r.colorWarning,C==="info"&&r.colorInfo,j&&r.disabled,z&&r.rounded);return e.jsxs("div",{className:l(r.wrapper,F&&r.fullWidth,K),style:L,children:[N&&e.jsx("label",{htmlFor:s,className:l(r.label,R&&r.focused,u&&r.labelError,E&&!u&&r.labelSuccess,I&&r.required,U),children:N}),e.jsxs("div",{className:nr,children:[k&&e.jsx("span",{className:r.startIcon,children:k}),e.jsx("input",{ref:d??O,type:x,value:t,defaultValue:t===void 0?c:void 0,name:g,id:s,placeholder:_,disabled:j,readOnly:P,required:I,autoFocus:$,autoComplete:B,maxLength:m,className:l(r.input,Q),onChange:rr,onFocus:Y,onBlur:Z,onKeyDown:J,"aria-invalid":u||void 0,"aria-describedby":i?`${s}-error`:p?`${s}-helper`:void 0}),y&&e.jsx("span",{className:r.spinner}),A&&X&&!y&&!j&&e.jsx("button",{type:"button",className:r.clearBtn,onClick:er,tabIndex:-1,"aria-label":"Clear input",children:"✕"}),w&&!y&&e.jsx("span",{className:r.endIcon,children:w})]}),(i||p||M)&&e.jsxs("div",{className:r.bottomRow,children:[e.jsxs("span",{children:[i&&e.jsx("span",{id:s?`${s}-error`:void 0,className:r.errorTextMsg,role:"alert",children:i}),!i&&p&&e.jsx("span",{id:s?`${s}-helper`:void 0,className:r.helperText,children:p})]}),M&&m&&e.jsxs("span",{className:l(r.charCount,S.length>m&&r.charCountOver),children:[S.length,"/",m]})]})]})});exports.Input=$r;exports.MineralThemeProvider=sr;exports.cn=l;exports.useTheme=or;
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../src/theme/ThemeProvider.tsx","../src/utils/cn.ts","../src/components/Input/Input.tsx"],"sourcesContent":["import { createContext, useContext, useEffect, useRef, type ReactNode } from 'react';\nimport type { MineralTheme } from './types';\n\nconst ThemeContext = createContext<MineralTheme>({});\n\nconst themeToVarMap: Record<keyof MineralTheme, string> = {\n  primary: '--mineral-primary',\n  primaryDark: '--mineral-primary-dark',\n  primaryLight: '--mineral-primary-light',\n  dark: '--mineral-dark',\n  darkLight: '--mineral-dark-light',\n  surface: '--mineral-surface',\n  text: '--mineral-text',\n  textSecondary: '--mineral-text-secondary',\n  textHeading: '--mineral-text-heading',\n  border: '--mineral-border',\n  borderHover: '--mineral-border-hover',\n  borderFocus: '--mineral-border-focus',\n  success: '--mineral-success',\n  error: '--mineral-error',\n  warning: '--mineral-warning',\n  info: '--mineral-info',\n  fontFamily: '--mineral-font-family',\n  radiusSm: '--mineral-radius-sm',\n  radiusMd: '--mineral-radius-md',\n  radiusLg: '--mineral-radius-lg',\n};\n\ninterface MineralThemeProviderProps {\n  theme: MineralTheme;\n  children: ReactNode;\n}\n\nexport function MineralThemeProvider({ theme, children }: MineralThemeProviderProps) {\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!ref.current) return;\n    const el = ref.current;\n\n    for (const [key, value] of Object.entries(theme)) {\n      const varName = themeToVarMap[key as keyof MineralTheme];\n      if (varName && value) {\n        el.style.setProperty(varName, value);\n      }\n    }\n  }, [theme]);\n\n  return (\n    <ThemeContext.Provider value={theme}>\n      <div ref={ref}>{children}</div>\n    </ThemeContext.Provider>\n  );\n}\n\nexport function useTheme(): MineralTheme {\n  return useContext(ThemeContext);\n}\n","/**\n * Łączy klasy CSS, odfiltrowując falsy wartości.\n * Lekki zamiennik clsx/classnames — zero dependencies.\n */\nexport function cn(...classes: (string | undefined | null | false)[]): string {\n  return classes.filter(Boolean).join(' ');\n}\n","import {useState, useRef, useCallback, forwardRef} from 'react';\nimport type {InputProps} from './Input.types';\nimport {cn} from '../../utils/cn';\nimport styles from './Input.module.css';\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(function Input(\n    {\n        type = 'text',\n        value,\n        defaultValue,\n        name,\n        id,\n        placeholder,\n        disabled = false,\n        readOnly = false,\n        required = false,\n        autoFocus = false,\n        autoComplete,\n        variant = 'outlined',\n        size = 'md',\n        color,\n        fullWidth = false,\n        rounded = false,\n        label,\n        helperText,\n        errorText,\n        startIcon,\n        endIcon,\n        clearable = false,\n        error = false,\n        success = false,\n        maxLength,\n        showCharCount = false,\n        onChange,\n        onFocus,\n        onBlur,\n        onKeyDown,\n        onClear,\n        loading = false,\n        className,\n        style,\n        inputClassName,\n        labelClassName,\n    },\n    ref,\n) {\n    const [focused, setFocused] = useState(false);\n    const [internalValue, setInternalValue] = useState(defaultValue?.toString() ?? '');\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const currentValue = value !== undefined ? value.toString() : internalValue;\n    const hasError = error || !!errorText;\n    const hasContent = currentValue.length > 0;\n\n    const handleFocus = useCallback(\n        (e: React.FocusEvent<HTMLInputElement>) => {\n            setFocused(true);\n            onFocus?.(e);\n        },\n        [onFocus],\n    );\n\n    const handleBlur = useCallback(\n        (e: React.FocusEvent<HTMLInputElement>) => {\n            setFocused(false);\n            onBlur?.(e);\n        },\n        [onBlur],\n    );\n\n    const handleChange = useCallback(\n        (e: React.ChangeEvent<HTMLInputElement>) => {\n            if (value === undefined) {\n                setInternalValue(e.target.value);\n            }\n            onChange?.(e);\n        },\n        [onChange, value],\n    );\n\n    const handleClear = useCallback(() => {\n        if (value === undefined) {\n            setInternalValue('');\n        }\n        onClear?.();\n        // Focus input after clear\n        const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current;\n        input?.focus();\n    }, [onClear, ref]);\n\n    const containerClasses = cn(\n        styles.inputContainer,\n        styles[variant],\n        styles[size],\n        focused && styles.focused,\n        hasError && styles.inputError,\n        success && !hasError && styles.inputSuccess,\n        color === 'warning' && styles.colorWarning,\n        color === 'info' && styles.colorInfo,\n        disabled && styles.disabled,\n        rounded && styles.rounded,\n    );\n\n    return (\n        <div\n            className={cn(styles.wrapper, fullWidth && styles.fullWidth, className)}\n            style={style}\n        >\n            {label && (\n                <label\n                    htmlFor={id}\n                    className={cn(\n                        styles.label,\n                        focused && styles.focused,\n                        hasError && styles.labelError,\n                        success && !hasError && styles.labelSuccess,\n                        required && styles.required,\n                        labelClassName,\n                    )}\n                >\n                    {label}\n                </label>\n            )}\n\n            <div className={containerClasses}>\n                {startIcon && <span className={styles.startIcon}>{startIcon}</span>}\n\n                <input\n                    ref={ref ?? inputRef}\n                    type={type}\n                    value={value}\n                    defaultValue={value === undefined ? defaultValue : undefined}\n                    name={name}\n                    id={id}\n                    placeholder={placeholder}\n                    disabled={disabled}\n                    readOnly={readOnly}\n                    required={required}\n                    autoFocus={autoFocus}\n                    autoComplete={autoComplete}\n                    maxLength={maxLength}\n                    className={cn(styles.input, inputClassName)}\n                    onChange={handleChange}\n                    onFocus={handleFocus}\n                    onBlur={handleBlur}\n                    onKeyDown={onKeyDown}\n                    aria-invalid={hasError || undefined}\n                    aria-describedby={\n                        errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined\n                    }\n                />\n\n                {loading && <span className={styles.spinner}/>}\n\n                {clearable && hasContent && !loading && !disabled && (\n                    <button\n                        type=\"button\"\n                        className={styles.clearBtn}\n                        onClick={handleClear}\n                        tabIndex={-1}\n                        aria-label=\"Clear input\"\n                    >\n                        ✕\n                    </button>\n                )}\n\n                {endIcon && !loading && <span className={styles.endIcon}>{endIcon}</span>}\n            </div>\n\n            {(errorText || helperText || showCharCount) && (\n                <div className={styles.bottomRow}>\n          <span>\n            {errorText && (\n                <span id={id ? `${id}-error` : undefined} className={styles.errorTextMsg} role=\"alert\">\n                {errorText}\n              </span>\n            )}\n              {!errorText && helperText && (\n                  <span id={id ? `${id}-helper` : undefined} className={styles.helperText}>\n                {helperText}\n              </span>\n              )}\n          </span>\n                    {showCharCount && maxLength && (\n                        <span\n                            className={cn(\n                                styles.charCount,\n                                currentValue.length > maxLength && styles.charCountOver,\n                            )}\n                        >\n              {currentValue.length}/{maxLength}\n            </span>\n                    )}\n                </div>\n            )}\n        </div>\n    );\n});\n"],"names":["ThemeContext","createContext","themeToVarMap","MineralThemeProvider","theme","children","ref","useRef","useEffect","el","key","value","varName","jsx","useTheme","useContext","cn","classes","Input","forwardRef","type","defaultValue","name","id","placeholder","disabled","readOnly","required","autoFocus","autoComplete","variant","size","color","fullWidth","rounded","label","helperText","errorText","startIcon","endIcon","clearable","error","success","maxLength","showCharCount","onChange","onFocus","onBlur","onKeyDown","onClear","loading","className","style","inputClassName","labelClassName","focused","setFocused","useState","internalValue","setInternalValue","inputRef","currentValue","hasError","hasContent","handleFocus","useCallback","e","handleBlur","handleChange","handleClear","input","containerClasses","styles","jsxs"],"mappings":"wIAGMA,EAAeC,EAAAA,cAA4B,EAAE,EAE7CC,GAAoD,CACxD,QAAS,oBACT,YAAa,yBACb,aAAc,0BACd,KAAM,iBACN,UAAW,uBACX,QAAS,oBACT,KAAM,iBACN,cAAe,2BACf,YAAa,yBACb,OAAQ,mBACR,YAAa,yBACb,YAAa,yBACb,QAAS,oBACT,MAAO,kBACP,QAAS,oBACT,KAAM,iBACN,WAAY,wBACZ,SAAU,sBACV,SAAU,sBACV,SAAU,qBACZ,EAOO,SAASC,GAAqB,CAAE,MAAAC,EAAO,SAAAC,GAAuC,CACnF,MAAMC,EAAMC,EAAAA,OAAuB,IAAI,EAEvCC,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAI,CAACF,EAAI,QAAS,OAClB,MAAMG,EAAKH,EAAI,QAEf,SAAW,CAACI,EAAKC,CAAK,IAAK,OAAO,QAAQP,CAAK,EAAG,CAChD,MAAMQ,EAAUV,GAAcQ,CAAyB,EACnDE,GAAWD,GACbF,EAAG,MAAM,YAAYG,EAASD,CAAK,CAEvC,CACF,EAAG,CAACP,CAAK,CAAC,EAGRS,EAAAA,IAACb,EAAa,SAAb,CAAsB,MAAOI,EAC5B,SAAAS,EAAAA,IAAC,MAAA,CAAI,IAAAP,EAAW,SAAAD,CAAA,CAAS,CAAA,CAC3B,CAEJ,CAEO,SAASS,IAAyB,CACvC,OAAOC,EAAAA,WAAWf,CAAY,CAChC,CCrDO,SAASgB,KAAMC,EAAwD,CAC5E,OAAOA,EAAQ,OAAO,OAAO,EAAE,KAAK,GAAG,CACzC,ioCCDaC,GAAQC,EAAAA,WAAyC,SAC1D,CACI,KAAAC,EAAO,OACP,MAAAT,EACA,aAAAU,EACA,KAAAC,EACA,GAAAC,EACA,YAAAC,EACA,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,UAAAC,EAAY,GACZ,aAAAC,EACA,QAAAC,EAAU,WACV,KAAAC,EAAO,KACP,MAAAC,EACA,UAAAC,EAAY,GACZ,QAAAC,EAAU,GACV,MAAAC,EACA,WAAAC,EACA,UAAAC,EACA,UAAAC,EACA,QAAAC,EACA,UAAAC,EAAY,GACZ,MAAAC,EAAQ,GACR,QAAAC,EAAU,GACV,UAAAC,EACA,cAAAC,EAAgB,GAChB,SAAAC,EACA,QAAAC,EACA,OAAAC,EACA,UAAAC,EACA,QAAAC,EACA,QAAAC,EAAU,GACV,UAAAC,EACA,MAAAC,EACA,eAAAC,EACA,eAAAC,CACJ,EACAhD,EACF,CACE,KAAM,CAACiD,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAK,EACtC,CAACC,EAAeC,CAAgB,EAAIF,EAAAA,UAASpC,GAAA,YAAAA,EAAc,aAAc,EAAE,EAC3EuC,EAAWrD,EAAAA,OAAyB,IAAI,EAExCsD,EAAelD,IAAU,OAAYA,EAAM,WAAa+C,EACxDI,EAAWrB,GAAS,CAAC,CAACJ,EACtB0B,EAAaF,EAAa,OAAS,EAEnCG,EAAcC,EAAAA,YACfC,GAA0C,CACvCV,EAAW,EAAI,EACfV,GAAA,MAAAA,EAAUoB,EACd,EACA,CAACpB,CAAO,CAAA,EAGNqB,EAAaF,EAAAA,YACdC,GAA0C,CACvCV,EAAW,EAAK,EAChBT,GAAA,MAAAA,EAASmB,EACb,EACA,CAACnB,CAAM,CAAA,EAGLqB,GAAeH,EAAAA,YAChBC,GAA2C,CACpCvD,IAAU,QACVgD,EAAiBO,EAAE,OAAO,KAAK,EAEnCrB,GAAA,MAAAA,EAAWqB,EACf,EACA,CAACrB,EAAUlC,CAAK,CAAA,EAGd0D,GAAcJ,EAAAA,YAAY,IAAM,CAC9BtD,IAAU,QACVgD,EAAiB,EAAE,EAEvBV,GAAA,MAAAA,IAEA,MAAMqB,GAAShE,GAAA,YAAAA,EAA2C,UAAWsD,EAAS,QAC9EU,GAAA,MAAAA,EAAO,OACX,EAAG,CAACrB,EAAS3C,CAAG,CAAC,EAEXiE,GAAmBvD,EACrBwD,EAAO,eACPA,EAAO1C,CAAO,EACd0C,EAAOzC,CAAI,EACXwB,GAAWiB,EAAO,QAClBV,GAAYU,EAAO,WACnB9B,GAAW,CAACoB,GAAYU,EAAO,aAC/BxC,IAAU,WAAawC,EAAO,aAC9BxC,IAAU,QAAUwC,EAAO,UAC3B/C,GAAY+C,EAAO,SACnBtC,GAAWsC,EAAO,OAAA,EAGtB,OACIC,EAAAA,KAAC,MAAA,CACG,UAAWzD,EAAGwD,EAAO,QAASvC,GAAauC,EAAO,UAAWrB,CAAS,EACtE,MAAAC,EAEC,SAAA,CAAAjB,GACGtB,EAAAA,IAAC,QAAA,CACG,QAASU,EACT,UAAWP,EACPwD,EAAO,MACPjB,GAAWiB,EAAO,QAClBV,GAAYU,EAAO,WACnB9B,GAAW,CAACoB,GAAYU,EAAO,aAC/B7C,GAAY6C,EAAO,SACnBlB,CAAA,EAGH,SAAAnB,CAAA,CAAA,EAITsC,EAAAA,KAAC,MAAA,CAAI,UAAWF,GACX,SAAA,CAAAjC,GAAazB,EAAAA,IAAC,OAAA,CAAK,UAAW2D,EAAO,UAAY,SAAAlC,EAAU,EAE5DzB,EAAAA,IAAC,QAAA,CACG,IAAKP,GAAOsD,EACZ,KAAAxC,EACA,MAAAT,EACA,aAAcA,IAAU,OAAYU,EAAe,OACnD,KAAAC,EACA,GAAAC,EACA,YAAAC,EACA,SAAAC,EACA,SAAAC,EACA,SAAAC,EACA,UAAAC,EACA,aAAAC,EACA,UAAAc,EACA,UAAW3B,EAAGwD,EAAO,MAAOnB,CAAc,EAC1C,SAAUe,GACV,QAASJ,EACT,OAAQG,EACR,UAAAnB,EACA,eAAcc,GAAY,OAC1B,mBACIzB,EAAY,GAAGd,CAAE,SAAWa,EAAa,GAAGb,CAAE,UAAY,MAAA,CAAA,EAIjE2B,GAAWrC,EAAAA,IAAC,OAAA,CAAK,UAAW2D,EAAO,QAAQ,EAE3ChC,GAAauB,GAAc,CAACb,GAAW,CAACzB,GACrCZ,EAAAA,IAAC,SAAA,CACG,KAAK,SACL,UAAW2D,EAAO,SAClB,QAASH,GACT,SAAU,GACV,aAAW,cACd,SAAA,GAAA,CAAA,EAKJ9B,GAAW,CAACW,GAAWrC,EAAAA,IAAC,QAAK,UAAW2D,EAAO,QAAU,SAAAjC,CAAA,CAAQ,CAAA,EACtE,GAEEF,GAAaD,GAAcQ,WACxB,MAAA,CAAI,UAAW4B,EAAO,UAC7B,SAAA,CAAAC,OAAC,OAAA,CACE,SAAA,CAAApC,GACGxB,EAAAA,IAAC,OAAA,CAAK,GAAIU,EAAK,GAAGA,CAAE,SAAW,OAAW,UAAWiD,EAAO,aAAc,KAAK,QAC9E,SAAAnC,EACH,EAEC,CAACA,GAAaD,GACXvB,EAAAA,IAAC,QAAK,GAAIU,EAAK,GAAGA,CAAE,UAAY,OAAW,UAAWiD,EAAO,WAC9D,SAAApC,CAAA,CACH,CAAA,EAEJ,EACWQ,GAAiBD,GACd8B,EAAAA,KAAC,OAAA,CACG,UAAWzD,EACPwD,EAAO,UACPX,EAAa,OAASlB,GAAa6B,EAAO,aAAA,EAG3D,SAAA,CAAAX,EAAa,OAAO,IAAElB,CAAA,CAAA,CAAA,CACzB,CAAA,CAEI,CAAA,CAAA,CAAA,CAIhB,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,95 @@
+import { ChangeEvent } from 'react';
+import { CSSProperties } from 'react';
+import { FocusEvent as FocusEvent_2 } from 'react';
+import { ForwardRefExoticComponent } from 'react';
+import { JSX as JSX_2 } from 'react/jsx-runtime';
+import { KeyboardEvent as KeyboardEvent_2 } from 'react';
+import { ReactNode } from 'react';
+import { RefAttributes } from 'react';
+
+/**
+ * Łączy klasy CSS, odfiltrowując falsy wartości.
+ * Lekki zamiennik clsx/classnames — zero dependencies.
+ */
+export declare function cn(...classes: (string | undefined | null | false)[]): string;
+
+export declare const Input: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputProps {
+    type?: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'search' | 'date' | 'datetime-local' | 'time';
+    value?: string | number;
+    defaultValue?: string | number;
+    name?: string;
+    id?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    required?: boolean;
+    autoFocus?: boolean;
+    autoComplete?: string;
+    variant?: InputVariant;
+    size?: MineralSize;
+    color?: MineralColor;
+    fullWidth?: boolean;
+    rounded?: boolean;
+    label?: string;
+    helperText?: string;
+    errorText?: string;
+    startIcon?: ReactNode;
+    endIcon?: ReactNode;
+    clearable?: boolean;
+    error?: boolean;
+    success?: boolean;
+    maxLength?: number;
+    showCharCount?: boolean;
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    onFocus?: (e: FocusEvent_2<HTMLInputElement>) => void;
+    onBlur?: (e: FocusEvent_2<HTMLInputElement>) => void;
+    onKeyDown?: (e: KeyboardEvent_2<HTMLInputElement>) => void;
+    onClear?: () => void;
+    loading?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    inputClassName?: string;
+    labelClassName?: string;
+}
+
+export declare type InputVariant = 'outlined' | 'filled' | 'underlined';
+
+export declare type MineralColor = 'primary' | 'success' | 'error' | 'warning' | 'info';
+
+export declare type MineralSize = 'sm' | 'md' | 'lg';
+
+export declare interface MineralTheme {
+    primary?: string;
+    primaryDark?: string;
+    primaryLight?: string;
+    dark?: string;
+    darkLight?: string;
+    surface?: string;
+    text?: string;
+    textSecondary?: string;
+    textHeading?: string;
+    border?: string;
+    borderHover?: string;
+    borderFocus?: string;
+    success?: string;
+    error?: string;
+    warning?: string;
+    info?: string;
+    fontFamily?: string;
+    radiusSm?: string;
+    radiusMd?: string;
+    radiusLg?: string;
+}
+
+export declare function MineralThemeProvider({ theme, children }: MineralThemeProviderProps): JSX_2.Element;
+
+declare interface MineralThemeProviderProps {
+    theme: MineralTheme;
+    children: ReactNode;
+}
+
+export declare function useTheme(): MineralTheme;
+
+export { }

package/dist/index.js

@@ -0,0 +1,235 @@
+import { jsx as s, jsxs as d } from "react/jsx-runtime";
+import { useRef as P, useEffect as ar, useContext as cr, createContext as ir, forwardRef as lr, useState as q, useCallback as g } from "react";
+const B = ir({}), dr = {
+  primary: "--mineral-primary",
+  primaryDark: "--mineral-primary-dark",
+  primaryLight: "--mineral-primary-light",
+  dark: "--mineral-dark",
+  darkLight: "--mineral-dark-light",
+  surface: "--mineral-surface",
+  text: "--mineral-text",
+  textSecondary: "--mineral-text-secondary",
+  textHeading: "--mineral-text-heading",
+  border: "--mineral-border",
+  borderHover: "--mineral-border-hover",
+  borderFocus: "--mineral-border-focus",
+  success: "--mineral-success",
+  error: "--mineral-error",
+  warning: "--mineral-warning",
+  info: "--mineral-info",
+  fontFamily: "--mineral-font-family",
+  radiusSm: "--mineral-radius-sm",
+  radiusMd: "--mineral-radius-md",
+  radiusLg: "--mineral-radius-lg"
+};
+function Gr({ theme: o, children: y }) {
+  const n = P(null);
+  return ar(() => {
+    if (!n.current) return;
+    const a = n.current;
+    for (const [I, e] of Object.entries(o)) {
+      const p = dr[I];
+      p && e && a.style.setProperty(p, e);
+    }
+  }, [o]), /* @__PURE__ */ s(B.Provider, { value: o, children: /* @__PURE__ */ s("div", { ref: n, children: y }) });
+}
+function Jr() {
+  return cr(B);
+}
+function _(...o) {
+  return o.filter(Boolean).join(" ");
+}
+const _r = "_wrapper_1tprv_2", pr = "_fullWidth_1tprv_10", ur = "_label_1tprv_15", mr = "_focused_1tprv_22", fr = "_labelError_1tprv_26", vr = "_labelSuccess_1tprv_30", hr = "_required_1tprv_34", br = "_inputContainer_1tprv_40", gr = "_outlined_1tprv_50", yr = "_disabled_1tprv_56", Ir = "_filled_1tprv_66", Nr = "_underlined_1tprv_82", Sr = "_inputError_1tprv_98", wr = "_inputSuccess_1tprv_106", xr = "_colorWarning_1tprv_115", Cr = "_colorInfo_1tprv_120", Er = "_sm_1tprv_126", kr = "_md_1tprv_132", Wr = "_lg_1tprv_138", Mr = "_rounded_1tprv_145", Rr = "_input_1tprv_40", Or = "_startIcon_1tprv_178", jr = "_endIcon_1tprv_186", Tr = "_clearBtn_1tprv_195", $r = "_spinner_1tprv_214", qr = "_spin_1tprv_214", Pr = "_helperText_1tprv_232", Br = "_errorTextMsg_1tprv_238", Hr = "_charCount_1tprv_245", Dr = "_charCountOver_1tprv_252", Fr = "_bottomRow_1tprv_257", r = {
+  wrapper: _r,
+  fullWidth: pr,
+  label: ur,
+  focused: mr,
+  labelError: fr,
+  labelSuccess: vr,
+  required: hr,
+  inputContainer: br,
+  outlined: gr,
+  disabled: yr,
+  filled: Ir,
+  underlined: Nr,
+  inputError: Sr,
+  inputSuccess: wr,
+  colorWarning: xr,
+  colorInfo: Cr,
+  sm: Er,
+  md: kr,
+  lg: Wr,
+  rounded: Mr,
+  input: Rr,
+  startIcon: Or,
+  endIcon: jr,
+  clearBtn: Tr,
+  spinner: $r,
+  spin: qr,
+  helperText: Pr,
+  errorTextMsg: Br,
+  charCount: Hr,
+  charCountOver: Dr,
+  bottomRow: Fr
+}, Kr = lr(function({
+  type: y = "text",
+  value: n,
+  defaultValue: a,
+  name: I,
+  id: e,
+  placeholder: p,
+  disabled: N = !1,
+  readOnly: H = !1,
+  required: x = !1,
+  autoFocus: D = !1,
+  autoComplete: F,
+  variant: z = "outlined",
+  size: A = "md",
+  color: C,
+  fullWidth: G = !1,
+  rounded: J = !1,
+  label: E,
+  helperText: u,
+  errorText: c,
+  startIcon: k,
+  endIcon: W,
+  clearable: K = !1,
+  error: L = !1,
+  success: M = !1,
+  maxLength: m,
+  showCharCount: R = !1,
+  onChange: f,
+  onFocus: v,
+  onBlur: h,
+  onKeyDown: Q,
+  onClear: b,
+  loading: S = !1,
+  className: U,
+  style: V,
+  inputClassName: X,
+  labelClassName: Y
+}, i) {
+  const [O, j] = q(!1), [Z, T] = q((a == null ? void 0 : a.toString()) ?? ""), $ = P(null), w = n !== void 0 ? n.toString() : Z, l = L || !!c, rr = w.length > 0, nr = g(
+    (t) => {
+      j(!0), v == null || v(t);
+    },
+    [v]
+  ), er = g(
+    (t) => {
+      j(!1), h == null || h(t);
+    },
+    [h]
+  ), tr = g(
+    (t) => {
+      n === void 0 && T(t.target.value), f == null || f(t);
+    },
+    [f, n]
+  ), sr = g(() => {
+    n === void 0 && T(""), b == null || b();
+    const t = (i == null ? void 0 : i.current) ?? $.current;
+    t == null || t.focus();
+  }, [b, i]), or = _(
+    r.inputContainer,
+    r[z],
+    r[A],
+    O && r.focused,
+    l && r.inputError,
+    M && !l && r.inputSuccess,
+    C === "warning" && r.colorWarning,
+    C === "info" && r.colorInfo,
+    N && r.disabled,
+    J && r.rounded
+  );
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      className: _(r.wrapper, G && r.fullWidth, U),
+      style: V,
+      children: [
+        E && /* @__PURE__ */ s(
+          "label",
+          {
+            htmlFor: e,
+            className: _(
+              r.label,
+              O && r.focused,
+              l && r.labelError,
+              M && !l && r.labelSuccess,
+              x && r.required,
+              Y
+            ),
+            children: E
+          }
+        ),
+        /* @__PURE__ */ d("div", { className: or, children: [
+          k && /* @__PURE__ */ s("span", { className: r.startIcon, children: k }),
+          /* @__PURE__ */ s(
+            "input",
+            {
+              ref: i ?? $,
+              type: y,
+              value: n,
+              defaultValue: n === void 0 ? a : void 0,
+              name: I,
+              id: e,
+              placeholder: p,
+              disabled: N,
+              readOnly: H,
+              required: x,
+              autoFocus: D,
+              autoComplete: F,
+              maxLength: m,
+              className: _(r.input, X),
+              onChange: tr,
+              onFocus: nr,
+              onBlur: er,
+              onKeyDown: Q,
+              "aria-invalid": l || void 0,
+              "aria-describedby": c ? `${e}-error` : u ? `${e}-helper` : void 0
+            }
+          ),
+          S && /* @__PURE__ */ s("span", { className: r.spinner }),
+          K && rr && !S && !N && /* @__PURE__ */ s(
+            "button",
+            {
+              type: "button",
+              className: r.clearBtn,
+              onClick: sr,
+              tabIndex: -1,
+              "aria-label": "Clear input",
+              children: "✕"
+            }
+          ),
+          W && !S && /* @__PURE__ */ s("span", { className: r.endIcon, children: W })
+        ] }),
+        (c || u || R) && /* @__PURE__ */ d("div", { className: r.bottomRow, children: [
+          /* @__PURE__ */ d("span", { children: [
+            c && /* @__PURE__ */ s("span", { id: e ? `${e}-error` : void 0, className: r.errorTextMsg, role: "alert", children: c }),
+            !c && u && /* @__PURE__ */ s("span", { id: e ? `${e}-helper` : void 0, className: r.helperText, children: u })
+          ] }),
+          R && m && /* @__PURE__ */ d(
+            "span",
+            {
+              className: _(
+                r.charCount,
+                w.length > m && r.charCountOver
+              ),
+              children: [
+                w.length,
+                "/",
+                m
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+});
+export {
+  Kr as Input,
+  Gr as MineralThemeProvider,
+  _ as cn,
+  Jr as useTheme
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/theme/ThemeProvider.tsx","../src/utils/cn.ts","../src/components/Input/Input.tsx"],"sourcesContent":["import { createContext, useContext, useEffect, useRef, type ReactNode } from 'react';\nimport type { MineralTheme } from './types';\n\nconst ThemeContext = createContext<MineralTheme>({});\n\nconst themeToVarMap: Record<keyof MineralTheme, string> = {\n  primary: '--mineral-primary',\n  primaryDark: '--mineral-primary-dark',\n  primaryLight: '--mineral-primary-light',\n  dark: '--mineral-dark',\n  darkLight: '--mineral-dark-light',\n  surface: '--mineral-surface',\n  text: '--mineral-text',\n  textSecondary: '--mineral-text-secondary',\n  textHeading: '--mineral-text-heading',\n  border: '--mineral-border',\n  borderHover: '--mineral-border-hover',\n  borderFocus: '--mineral-border-focus',\n  success: '--mineral-success',\n  error: '--mineral-error',\n  warning: '--mineral-warning',\n  info: '--mineral-info',\n  fontFamily: '--mineral-font-family',\n  radiusSm: '--mineral-radius-sm',\n  radiusMd: '--mineral-radius-md',\n  radiusLg: '--mineral-radius-lg',\n};\n\ninterface MineralThemeProviderProps {\n  theme: MineralTheme;\n  children: ReactNode;\n}\n\nexport function MineralThemeProvider({ theme, children }: MineralThemeProviderProps) {\n  const ref = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!ref.current) return;\n    const el = ref.current;\n\n    for (const [key, value] of Object.entries(theme)) {\n      const varName = themeToVarMap[key as keyof MineralTheme];\n      if (varName && value) {\n        el.style.setProperty(varName, value);\n      }\n    }\n  }, [theme]);\n\n  return (\n    <ThemeContext.Provider value={theme}>\n      <div ref={ref}>{children}</div>\n    </ThemeContext.Provider>\n  );\n}\n\nexport function useTheme(): MineralTheme {\n  return useContext(ThemeContext);\n}\n","/**\n * Łączy klasy CSS, odfiltrowując falsy wartości.\n * Lekki zamiennik clsx/classnames — zero dependencies.\n */\nexport function cn(...classes: (string | undefined | null | false)[]): string {\n  return classes.filter(Boolean).join(' ');\n}\n","import {useState, useRef, useCallback, forwardRef} from 'react';\nimport type {InputProps} from './Input.types';\nimport {cn} from '../../utils/cn';\nimport styles from './Input.module.css';\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(function Input(\n    {\n        type = 'text',\n        value,\n        defaultValue,\n        name,\n        id,\n        placeholder,\n        disabled = false,\n        readOnly = false,\n        required = false,\n        autoFocus = false,\n        autoComplete,\n        variant = 'outlined',\n        size = 'md',\n        color,\n        fullWidth = false,\n        rounded = false,\n        label,\n        helperText,\n        errorText,\n        startIcon,\n        endIcon,\n        clearable = false,\n        error = false,\n        success = false,\n        maxLength,\n        showCharCount = false,\n        onChange,\n        onFocus,\n        onBlur,\n        onKeyDown,\n        onClear,\n        loading = false,\n        className,\n        style,\n        inputClassName,\n        labelClassName,\n    },\n    ref,\n) {\n    const [focused, setFocused] = useState(false);\n    const [internalValue, setInternalValue] = useState(defaultValue?.toString() ?? '');\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const currentValue = value !== undefined ? value.toString() : internalValue;\n    const hasError = error || !!errorText;\n    const hasContent = currentValue.length > 0;\n\n    const handleFocus = useCallback(\n        (e: React.FocusEvent<HTMLInputElement>) => {\n            setFocused(true);\n            onFocus?.(e);\n        },\n        [onFocus],\n    );\n\n    const handleBlur = useCallback(\n        (e: React.FocusEvent<HTMLInputElement>) => {\n            setFocused(false);\n            onBlur?.(e);\n        },\n        [onBlur],\n    );\n\n    const handleChange = useCallback(\n        (e: React.ChangeEvent<HTMLInputElement>) => {\n            if (value === undefined) {\n                setInternalValue(e.target.value);\n            }\n            onChange?.(e);\n        },\n        [onChange, value],\n    );\n\n    const handleClear = useCallback(() => {\n        if (value === undefined) {\n            setInternalValue('');\n        }\n        onClear?.();\n        // Focus input after clear\n        const input = (ref as React.RefObject<HTMLInputElement>)?.current ?? inputRef.current;\n        input?.focus();\n    }, [onClear, ref]);\n\n    const containerClasses = cn(\n        styles.inputContainer,\n        styles[variant],\n        styles[size],\n        focused && styles.focused,\n        hasError && styles.inputError,\n        success && !hasError && styles.inputSuccess,\n        color === 'warning' && styles.colorWarning,\n        color === 'info' && styles.colorInfo,\n        disabled && styles.disabled,\n        rounded && styles.rounded,\n    );\n\n    return (\n        <div\n            className={cn(styles.wrapper, fullWidth && styles.fullWidth, className)}\n            style={style}\n        >\n            {label && (\n                <label\n                    htmlFor={id}\n                    className={cn(\n                        styles.label,\n                        focused && styles.focused,\n                        hasError && styles.labelError,\n                        success && !hasError && styles.labelSuccess,\n                        required && styles.required,\n                        labelClassName,\n                    )}\n                >\n                    {label}\n                </label>\n            )}\n\n            <div className={containerClasses}>\n                {startIcon && <span className={styles.startIcon}>{startIcon}</span>}\n\n                <input\n                    ref={ref ?? inputRef}\n                    type={type}\n                    value={value}\n                    defaultValue={value === undefined ? defaultValue : undefined}\n                    name={name}\n                    id={id}\n                    placeholder={placeholder}\n                    disabled={disabled}\n                    readOnly={readOnly}\n                    required={required}\n                    autoFocus={autoFocus}\n                    autoComplete={autoComplete}\n                    maxLength={maxLength}\n                    className={cn(styles.input, inputClassName)}\n                    onChange={handleChange}\n                    onFocus={handleFocus}\n                    onBlur={handleBlur}\n                    onKeyDown={onKeyDown}\n                    aria-invalid={hasError || undefined}\n                    aria-describedby={\n                        errorText ? `${id}-error` : helperText ? `${id}-helper` : undefined\n                    }\n                />\n\n                {loading && <span className={styles.spinner}/>}\n\n                {clearable && hasContent && !loading && !disabled && (\n                    <button\n                        type=\"button\"\n                        className={styles.clearBtn}\n                        onClick={handleClear}\n                        tabIndex={-1}\n                        aria-label=\"Clear input\"\n                    >\n                        ✕\n                    </button>\n                )}\n\n                {endIcon && !loading && <span className={styles.endIcon}>{endIcon}</span>}\n            </div>\n\n            {(errorText || helperText || showCharCount) && (\n                <div className={styles.bottomRow}>\n          <span>\n            {errorText && (\n                <span id={id ? `${id}-error` : undefined} className={styles.errorTextMsg} role=\"alert\">\n                {errorText}\n              </span>\n            )}\n              {!errorText && helperText && (\n                  <span id={id ? `${id}-helper` : undefined} className={styles.helperText}>\n                {helperText}\n              </span>\n              )}\n          </span>\n                    {showCharCount && maxLength && (\n                        <span\n                            className={cn(\n                                styles.charCount,\n                                currentValue.length > maxLength && styles.charCountOver,\n                            )}\n                        >\n              {currentValue.length}/{maxLength}\n            </span>\n                    )}\n                </div>\n            )}\n        </div>\n    );\n});\n"],"names":["ThemeContext","createContext","themeToVarMap","MineralThemeProvider","theme","children","ref","useRef","useEffect","el","key","value","varName","jsx","useTheme","useContext","cn","classes","Input","forwardRef","type","defaultValue","name","id","placeholder","disabled","readOnly","required","autoFocus","autoComplete","variant","size","color","fullWidth","rounded","label","helperText","errorText","startIcon","endIcon","clearable","error","success","maxLength","showCharCount","onChange","onFocus","onBlur","onKeyDown","onClear","loading","className","style","inputClassName","labelClassName","focused","setFocused","useState","internalValue","setInternalValue","inputRef","currentValue","hasError","hasContent","handleFocus","useCallback","e","handleBlur","handleChange","handleClear","input","containerClasses","styles","jsxs"],"mappings":"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"}

package/dist/styles.css

@@ -0,0 +1 @@
+*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}input,button,textarea,select{font:inherit;color:inherit;background:none;border:none;outline:none}:root{--mineral-primary: #00A5DE;--mineral-primary-dark: #0084B4;--mineral-primary-light: #33B7E5;--mineral-dark: #0f172a;--mineral-dark-light: #1e293b;--mineral-surface: #1a1a2e;--mineral-text: #e2e8f0;--mineral-text-secondary: #64748b;--mineral-text-heading: #ffffff;--mineral-border: rgba(255, 255, 255, .05);--mineral-border-hover: rgba(255, 255, 255, .1);--mineral-border-focus: #00A5DE;--mineral-success: #22C55E;--mineral-error: #EF4444;--mineral-warning: #F59E0B;--mineral-info: #3B82F6;--mineral-font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;--mineral-font-size-xs: .75rem;--mineral-font-size-sm: .875rem;--mineral-font-size-md: 1rem;--mineral-font-size-lg: 1.125rem;--mineral-spacing-xs: 4px;--mineral-spacing-sm: 8px;--mineral-spacing-md: 12px;--mineral-spacing-lg: 16px;--mineral-spacing-xl: 24px;--mineral-radius-sm: 6px;--mineral-radius-md: 8px;--mineral-radius-lg: 10px;--mineral-radius-xl: 16px;--mineral-radius-full: 9999px;--mineral-transition-fast: .15s ease;--mineral-transition-base: .3s ease;--mineral-shadow-sm: 0 1px 2px rgba(0, 0, 0, .2);--mineral-shadow-md: 0 4px 12px rgba(0, 0, 0, .3);--mineral-shadow-focus: 0 0 0 3px color-mix(in oklch, var(--mineral-primary), transparent 70%);--mineral-popover-bg: rgba(30, 41, 59, .95);--mineral-popover-border: rgba(255, 255, 255, .08);--mineral-popover-shadow: 0 8px 32px rgba(0, 0, 0, .4);--mineral-popover-backdrop-blur: 12px;--mineral-option-hover-bg: rgba(255, 255, 255, .05);--mineral-option-selected-bg: rgba(0, 165, 222, .15);--mineral-option-active-bg: rgba(0, 165, 222, .25);--mineral-z-popover: 1000;--mineral-z-modal: 1100}._wrapper_1tprv_2{display:inline-flex;flex-direction:column;gap:var(--mineral-spacing-xs);font-family:var(--mineral-font-family);position:relative}._fullWidth_1tprv_10{width:100%}._label_1tprv_15{font-size:var(--mineral-font-size-sm);color:var(--mineral-text-secondary);font-weight:500;transition:color var(--mineral-transition-fast)}._label_1tprv_15._focused_1tprv_22{color:var(--mineral-primary)}._label_1tprv_15._labelError_1tprv_26{color:var(--mineral-error)}._label_1tprv_15._labelSuccess_1tprv_30{color:var(--mineral-success)}._required_1tprv_34:after{content:" *";color:var(--mineral-error)}._inputContainer_1tprv_40{display:flex;align-items:center;position:relative;transition:border-color var(--mineral-transition-base),box-shadow var(--mineral-transition-base),background-color var(--mineral-transition-base)}._outlined_1tprv_50{border:1px solid var(--mineral-border);border-radius:var(--mineral-radius-md);background:transparent}._outlined_1tprv_50:hover:not(._disabled_1tprv_56){border-color:var(--mineral-border-hover)}._outlined_1tprv_50._focused_1tprv_22{border-color:var(--mineral-border-focus);box-shadow:var(--mineral-shadow-focus)}._filled_1tprv_66{border:none;border-bottom:2px solid var(--mineral-border);border-radius:var(--mineral-radius-md) var(--mineral-radius-md) 0 0;background:var(--mineral-surface)}._filled_1tprv_66:hover:not(._disabled_1tprv_56){background:color-mix(in oklch,var(--mineral-surface),white 3%)}._filled_1tprv_66._focused_1tprv_22{border-bottom-color:var(--mineral-primary)}._underlined_1tprv_82{border:none;border-bottom:1px solid var(--mineral-border);border-radius:0;background:transparent}._underlined_1tprv_82:hover:not(._disabled_1tprv_56){border-bottom-color:var(--mineral-border-hover)}._underlined_1tprv_82._focused_1tprv_22{border-bottom:2px solid var(--mineral-primary)}._inputError_1tprv_98{border-color:var(--mineral-error)!important}._inputError_1tprv_98._focused_1tprv_22{box-shadow:0 0 0 3px color-mix(in oklch,var(--mineral-error),transparent 70%)}._inputSuccess_1tprv_106{border-color:var(--mineral-success)!important}._inputSuccess_1tprv_106._focused_1tprv_22{box-shadow:0 0 0 3px color-mix(in oklch,var(--mineral-success),transparent 70%)}._colorWarning_1tprv_115._focused_1tprv_22{border-color:var(--mineral-warning);box-shadow:0 0 0 3px color-mix(in oklch,var(--mineral-warning),transparent 70%)}._colorInfo_1tprv_120._focused_1tprv_22{border-color:var(--mineral-info);box-shadow:0 0 0 3px color-mix(in oklch,var(--mineral-info),transparent 70%)}._sm_1tprv_126{height:32px;padding:0 var(--mineral-spacing-sm);font-size:var(--mineral-font-size-xs)}._md_1tprv_132{height:40px;padding:0 var(--mineral-spacing-md);font-size:var(--mineral-font-size-sm)}._lg_1tprv_138{height:48px;padding:0 var(--mineral-spacing-lg);font-size:var(--mineral-font-size-md)}._rounded_1tprv_145{border-radius:var(--mineral-radius-full)}._disabled_1tprv_56{opacity:.5;cursor:not-allowed}._input_1tprv_40{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--mineral-text);font-family:inherit;font-size:inherit}._input_1tprv_40::-moz-placeholder{color:var(--mineral-text-secondary);opacity:.6}._input_1tprv_40::placeholder{color:var(--mineral-text-secondary);opacity:.6}._input_1tprv_40:disabled{cursor:not-allowed}._startIcon_1tprv_178{display:flex;align-items:center;margin-right:var(--mineral-spacing-sm);color:var(--mineral-text-secondary);flex-shrink:0}._endIcon_1tprv_186{display:flex;align-items:center;margin-left:var(--mineral-spacing-sm);color:var(--mineral-text-secondary);flex-shrink:0}._clearBtn_1tprv_195{display:flex;align-items:center;justify-content:center;margin-left:var(--mineral-spacing-xs);padding:2px;cursor:pointer;color:var(--mineral-text-secondary);border-radius:var(--mineral-radius-sm);transition:color var(--mineral-transition-fast),background-color var(--mineral-transition-fast);flex-shrink:0}._clearBtn_1tprv_195:hover{color:var(--mineral-text);background-color:#ffffff0d}._spinner_1tprv_214{width:16px;height:16px;border:2px solid var(--mineral-border);border-top-color:var(--mineral-primary);border-radius:50%;animation:_spin_1tprv_214 .6s linear infinite;margin-left:var(--mineral-spacing-sm);flex-shrink:0}@keyframes _spin_1tprv_214{to{transform:rotate(360deg)}}._helperText_1tprv_232{font-size:var(--mineral-font-size-xs);color:var(--mineral-text-secondary);margin-top:2px}._errorTextMsg_1tprv_238{font-size:var(--mineral-font-size-xs);color:var(--mineral-error);margin-top:2px}._charCount_1tprv_245{font-size:var(--mineral-font-size-xs);color:var(--mineral-text-secondary);text-align:right;margin-top:2px}._charCount_1tprv_245._charCountOver_1tprv_252{color:var(--mineral-error)}._bottomRow_1tprv_257{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--mineral-spacing-sm)}

package/package.json

@@ -0,0 +1,215 @@
+{
+  "name": "@banzamel/mineralui",
+  "version": "0.1.0",
+  "description": "Modern React UI component framework with mineral dark aesthetic",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.cjs"
+      }
+    },
+    "./styles.css": "./dist/styles.css"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "sideEffects": [
+    "*.css"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "lint": "eslint src/",
+    "prepublishOnly": "npm run build"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.1.0",
+    "@types/node": "^25.5.0",
+    "@types/react": "^18.3.0",
+    "@types/react-dom": "^18.3.0",
+    "autoprefixer": "^10.4.20",
+    "jsdom": "^26.0.0",
+    "postcss": "^8.5.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "typescript": "^5.7.0",
+    "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.3.0",
+    "vitest": "^3.0.0"
+  },
+  "keywords": [
+    "react",
+    "ui",
+    "components",
+    "framework",
+    "dark-mode",
+    "mineral",
+    "typescript"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": ""
+  },
+  "dependencies": {
+    "acorn": "^8.16.0",
+    "agent-base": "^7.1.4",
+    "ajv": "^8.18.0",
+    "ajv-draft-04": "^1.0.0",
+    "ajv-formats": "^3.0.1",
+    "alien-signals": "^0.4.14",
+    "ansi-regex": "^5.0.1",
+    "ansi-styles": "^5.2.0",
+    "argparse": "^1.0.10",
+    "aria-query": "^5.3.0",
+    "assertion-error": "^2.0.1",
+    "balanced-match": "^4.0.4",
+    "baseline-browser-mapping": "^2.10.8",
+    "brace-expansion": "^5.0.4",
+    "browserslist": "^4.28.1",
+    "cac": "^6.7.14",
+    "caniuse-lite": "^1.0.30001780",
+    "chai": "^5.3.3",
+    "check-error": "^2.1.3",
+    "compare-versions": "^6.1.1",
+    "confbox": "^0.2.4",
+    "css.escape": "^1.5.1",
+    "cssstyle": "^4.6.0",
+    "csstype": "^3.2.3",
+    "data-urls": "^5.0.0",
+    "de-indent": "^1.0.2",
+    "debug": "^4.4.3",
+    "decimal.js": "^10.6.0",
+    "deep-eql": "^5.0.2",
+    "dequal": "^2.0.3",
+    "diff": "^8.0.3",
+    "dom-accessibility-api": "^0.5.16",
+    "electron-to-chromium": "^1.5.313",
+    "entities": "^6.0.1",
+    "es-module-lexer": "^1.7.0",
+    "esbuild": "^0.25.12",
+    "escalade": "^3.2.0",
+    "estree-walker": "^2.0.2",
+    "expect-type": "^1.3.0",
+    "exsolve": "^1.0.8",
+    "fast-deep-equal": "^3.1.3",
+    "fast-uri": "^3.1.0",
+    "fdir": "^6.5.0",
+    "fraction.js": "^5.3.4",
+    "fs-extra": "^11.3.4",
+    "function-bind": "^1.1.2",
+    "graceful-fs": "^4.2.11",
+    "has-flag": "^4.0.0",
+    "hasown": "^2.0.2",
+    "he": "^1.2.0",
+    "html-encoding-sniffer": "^4.0.0",
+    "http-proxy-agent": "^7.0.2",
+    "https-proxy-agent": "^7.0.6",
+    "iconv-lite": "^0.6.3",
+    "import-lazy": "^4.0.0",
+    "indent-string": "^4.0.0",
+    "is-core-module": "^2.16.1",
+    "is-potential-custom-element-name": "^1.0.1",
+    "jju": "^1.4.0",
+    "js-tokens": "^4.0.0",
+    "json-schema-traverse": "^1.0.0",
+    "jsonfile": "^6.2.0",
+    "kolorist": "^1.8.0",
+    "local-pkg": "^1.1.2",
+    "lodash": "^4.17.23",
+    "loose-envify": "^1.4.0",
+    "loupe": "^3.2.1",
+    "lru-cache": "^10.4.3",
+    "lz-string": "^1.5.0",
+    "magic-string": "^0.30.21",
+    "min-indent": "^1.0.1",
+    "minimatch": "^10.2.3",
+    "mlly": "^1.8.1",
+    "ms": "^2.1.3",
+    "muggle-string": "^0.4.1",
+    "nanoid": "^3.3.11",
+    "node-releases": "^2.0.36",
+    "nwsapi": "^2.2.23",
+    "parse5": "^7.3.0",
+    "path-browserify": "^1.0.1",
+    "path-parse": "^1.0.7",
+    "pathe": "^2.0.3",
+    "pathval": "^2.0.1",
+    "picocolors": "^1.1.1",
+    "picomatch": "^4.0.3",
+    "pkg-types": "^2.3.0",
+    "postcss-value-parser": "^4.2.0",
+    "pretty-format": "^27.5.1",
+    "punycode": "^2.3.1",
+    "quansync": "^0.2.11",
+    "react-is": "^17.0.2",
+    "redent": "^3.0.0",
+    "require-from-string": "^2.0.2",
+    "resolve": "^1.22.11",
+    "rollup": "^4.59.0",
+    "rrweb-cssom": "^0.8.0",
+    "safer-buffer": "^2.1.2",
+    "saxes": "^6.0.0",
+    "scheduler": "^0.23.2",
+    "semver": "^7.5.4",
+    "siginfo": "^2.0.0",
+    "source-map": "^0.6.1",
+    "source-map-js": "^1.2.1",
+    "sprintf-js": "^1.0.3",
+    "stackback": "^0.0.2",
+    "std-env": "^3.10.0",
+    "string-argv": "^0.3.2",
+    "strip-indent": "^3.0.0",
+    "strip-json-comments": "^3.1.1",
+    "strip-literal": "^3.1.0",
+    "supports-color": "^8.1.1",
+    "supports-preserve-symlinks-flag": "^1.0.0",
+    "symbol-tree": "^3.2.4",
+    "tinybench": "^2.9.0",
+    "tinyexec": "^0.3.2",
+    "tinyglobby": "^0.2.15",
+    "tinypool": "^1.1.1",
+    "tinyrainbow": "^2.0.0",
+    "tinyspy": "^4.0.4",
+    "tldts": "^6.1.86",
+    "tldts-core": "^6.1.86",
+    "tough-cookie": "^5.1.2",
+    "tr46": "^5.1.1",
+    "ufo": "^1.6.3",
+    "undici-types": "^7.18.2",
+    "universalify": "^2.0.1",
+    "update-browserslist-db": "^1.2.3",
+    "vite-node": "^3.2.4",
+    "vscode-uri": "^3.1.0",
+    "w3c-xmlserializer": "^5.0.0",
+    "webidl-conversions": "^7.0.0",
+    "whatwg-encoding": "^3.1.1",
+    "whatwg-mimetype": "^4.0.0",
+    "whatwg-url": "^14.2.0",
+    "why-is-node-running": "^2.3.0",
+    "ws": "^8.19.0",
+    "xml-name-validator": "^5.0.0",
+    "xmlchars": "^2.2.0",
+    "yallist": "^4.0.0"
+  },
+  "author": "Rafał Polak"
+}