@tetjana/flowmakers-ds 0.1.0 → 0.1.2

package/dist/components/Button.d.ts

@@ -1,15 +1,15 @@
-import React from 'react';
+import type { ButtonHTMLAttributes, ReactNode, FC } from 'react';
 import './Button.css';
 export type ButtonVariant = 'primary' | 'hero' | 'secondary' | 'secondary-large' | 'ghost' | 'ghost-icon';
 export type ButtonSize = 'sm' | 'md' | 'lg';
 export type ButtonState = 'default' | 'hover' | 'pressed' | 'focused' | 'disabled';
-export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: ButtonVariant;
     size?: ButtonSize;
-    leftIcon?: React.ReactNode;
-    rightIcon?: React.ReactNode;
-    children?: React.ReactNode;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    children?: ReactNode;
     fullWidth?: boolean;
 }
-export declare const Button: React.FC<ButtonProps>;
+export declare const Button: FC<ButtonProps>;
 export default Button;

package/dist/components/Checkbox.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { type FC } from 'react';
 import './Checkbox.css';
 export type CheckboxState = 'idle' | 'clicked' | 'disabled';
 export type CheckboxSelection = 'on' | 'off' | 'mixed';
@@ -12,5 +12,5 @@ export interface CheckboxProps {
     label?: string;
     className?: string;
 }
-export declare const Checkbox: React.FC<CheckboxProps>;
+export declare const Checkbox: FC<CheckboxProps>;
 export default Checkbox;

package/dist/components/Footer.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FC } from 'react';
 import './Footer.css';
 export type FooterVariant = 'light' | 'dark';
 export interface FooterLink {
@@ -16,12 +16,7 @@ export interface FooterProps {
     onCtaClick?: () => void;
     sections?: FooterSection[];
     copyright?: string;
-    socials?: {
-        twitter?: string;
-        instagram?: string;
-        facebook?: string;
-    };
     className?: string;
 }
-export declare const Footer: React.FC<FooterProps>;
+export declare const Footer: FC<FooterProps>;
 export default Footer;

package/dist/components/Header.d.ts

@@ -1,13 +1,13 @@
-import React from 'react';
+import type { ReactNode, FC } from 'react';
 import './Header.css';
 export type HeaderColor = 'purple' | 'grey';
 export interface HeaderProps {
     title: string;
     subtitle?: string;
     color?: HeaderColor;
-    leftSlot?: React.ReactNode;
-    rightSlot?: React.ReactNode;
+    leftSlot?: ReactNode;
+    rightSlot?: ReactNode;
     className?: string;
 }
-export declare const Header: React.FC<HeaderProps>;
+export declare const Header: FC<HeaderProps>;
 export default Header;

package/dist/components/Input.d.ts

@@ -1,14 +1,14 @@
-import React from 'react';
+import type { InputHTMLAttributes, ReactNode, FC } from 'react';
 import './Input.css';
 export type InputState = 'default' | 'hover' | 'focused' | 'filled' | 'error' | 'success';
-export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
     label?: string;
     placeholder?: string;
     state?: InputState;
     errorMessage?: string;
     successMessage?: string;
-    leftIcon?: React.ReactNode;
-    rightIcon?: React.ReactNode;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
 }
-export declare const Input: React.FC<InputProps>;
+export declare const Input: FC<InputProps>;
 export default Input;

package/dist/components/Tag.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
+import type { ReactNode, FC } from 'react';
 import './Tag.css';
 export type TagColor = 'grey' | 'green' | 'yellow' | 'purple' | 'pink';
 export interface TagProps {
-    children: React.ReactNode;
+    children: ReactNode;
     color?: TagColor;
     className?: string;
 }
-export declare const Tag: React.FC<TagProps>;
+export declare const Tag: FC<TagProps>;
 export default Tag;

package/dist/components/Toggle.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FC } from 'react';
 import './Toggle.css';
 export interface ToggleProps {
     checked: boolean;
@@ -7,5 +7,5 @@ export interface ToggleProps {
     label?: string;
     className?: string;
 }
-export declare const Toggle: React.FC<ToggleProps>;
+export declare const Toggle: FC<ToggleProps>;
 export default Toggle;

package/dist/index.cjs.js

@@ -6,7 +6,7 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var I;function ee(){if(I)return x;I=1;var l=Symbol.for("react.transitional.element"),c=Symbol.for("react.fragment");function s(n,a,o){var m=null;if(o!==void 0&&(m=""+o),a.key!==void 0&&(m=""+a.key),"key"in a){o={};for(var _ in a)_!=="key"&&(o[_]=a[_])}else o=a;return a=o.ref,{$$typeof:l,type:n,key:m,ref:a!==void 0?a:null,props:o}}return x.Fragment=c,x.jsx=s,x.jsxs=s,x}var j={};/**
+ */var I;function ee(){if(I)return x;I=1;var l=Symbol.for("react.transitional.element"),c=Symbol.for("react.fragment");function a(n,s,o){var m=null;if(o!==void 0&&(m=""+o),s.key!==void 0&&(m=""+s.key),"key"in s){o={};for(var _ in s)_!=="key"&&(o[_]=s[_])}else o=s;return s=o.ref,{$$typeof:l,type:n,key:m,ref:s!==void 0?s:null,props:o}}return x.Fragment=c,x.jsx=a,x.jsxs=a,x}var j={};/**
  * @license React
  * react-jsx-runtime.development.js
  *
@@ -14,9 +14,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var M;function re(){return M||(M=1,process.env.NODE_ENV!=="production"&&function(){function l(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===Z?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case k:return"Fragment";case U:return"Profiler";case W:return"StrictMode";case G:return"Suspense";case J:return"SuspenseList";case H:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case B:return"Portal";case z:return e.displayName||"Context";case V:return(e._context.displayName||"Context")+".Consumer";case q:var t=e.render;return e=e.displayName,e||(e=t.displayName||t.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case X:return t=e.displayName||null,t!==null?t:l(e.type)||"Memo";case R:t=e._payload,e=e._init;try{return l(e(t))}catch{}}return null}function c(e){return""+e}function s(e){try{c(e);var t=!1}catch{t=!0}if(t){t=console;var i=t.error,f=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return i.call(t,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",f),c(e)}}function n(e){if(e===k)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===R)return"<...>";try{var t=l(e);return t?"<"+t+">":"<...>"}catch{return"<...>"}}function a(){var e=g.A;return e===null?null:e.getOwner()}function o(){return Error("react-stack-top-frame")}function m(e){if(C.call(e,"key")){var t=Object.getOwnPropertyDescriptor(e,"key").get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function _(e,t){function i(){$||($=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}i.isReactWarning=!0,Object.defineProperty(e,"key",{get:i,configurable:!0})}function d(){var e=l(this.type);return Y[e]||(Y[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function p(e,t,i,f,N,w){var u=i.ref;return e={$$typeof:S,type:e,key:t,props:i,_owner:f},(u!==void 0?u:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:d}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:N}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:w}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function b(e,t,i,f,N,w){var u=t.children;if(u!==void 0)if(f)if(Q(u)){for(f=0;f<u.length;f++)v(u[f]);Object.freeze&&Object.freeze(u)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else v(u);if(C.call(t,"key")){u=l(e);var h=Object.keys(t).filter(function(K){return K!=="key"});f=0<h.length?"{key: someKey, "+h.join(": ..., ")+": ...}":"{key: someKey}",D[u+f]||(h=0<h.length?"{"+h.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+ */var M;function re(){return M||(M=1,process.env.NODE_ENV!=="production"&&function(){function l(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===Z?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case k:return"Fragment";case U:return"Profiler";case W:return"StrictMode";case G:return"Suspense";case J:return"SuspenseList";case H:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case B:return"Portal";case q:return e.displayName||"Context";case V:return(e._context.displayName||"Context")+".Consumer";case z:var t=e.render;return e=e.displayName,e||(e=t.displayName||t.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case X:return t=e.displayName||null,t!==null?t:l(e.type)||"Memo";case R:t=e._payload,e=e._init;try{return l(e(t))}catch{}}return null}function c(e){return""+e}function a(e){try{c(e);var t=!1}catch{t=!0}if(t){t=console;var i=t.error,f=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return i.call(t,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",f),c(e)}}function n(e){if(e===k)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===R)return"<...>";try{var t=l(e);return t?"<"+t+">":"<...>"}catch{return"<...>"}}function s(){var e=g.A;return e===null?null:e.getOwner()}function o(){return Error("react-stack-top-frame")}function m(e){if(C.call(e,"key")){var t=Object.getOwnPropertyDescriptor(e,"key").get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function _(e,t){function i(){$||($=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}i.isReactWarning=!0,Object.defineProperty(e,"key",{get:i,configurable:!0})}function d(){var e=l(this.type);return Y[e]||(Y[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function p(e,t,i,f,N,w){var u=i.ref;return e={$$typeof:S,type:e,key:t,props:i,_owner:f},(u!==void 0?u:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:d}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:N}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:w}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function b(e,t,i,f,N,w){var u=t.children;if(u!==void 0)if(f)if(Q(u)){for(f=0;f<u.length;f++)v(u[f]);Object.freeze&&Object.freeze(u)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else v(u);if(C.call(t,"key")){u=l(e);var h=Object.keys(t).filter(function(K){return K!=="key"});f=0<h.length?"{key: someKey, "+h.join(": ..., ")+": ...}":"{key: someKey}",D[u+f]||(h=0<h.length?"{"+h.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,f,u,h,u),D[u+f]=!0)}if(u=null,i!==void 0&&(s(i),u=""+i),m(t)&&(s(t.key),u=""+t.key),"key"in t){i={};for(var y in t)y!=="key"&&(i[y]=t[y])}else i=t;return u&&_(i,typeof e=="function"?e.displayName||e.name||"Unknown":e),p(e,u,i,a(),N,w)}function v(e){P(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===R&&(e._payload.status==="fulfilled"?P(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function P(e){return typeof e=="object"&&e!==null&&e.$$typeof===S}var E=O,S=Symbol.for("react.transitional.element"),B=Symbol.for("react.portal"),k=Symbol.for("react.fragment"),W=Symbol.for("react.strict_mode"),U=Symbol.for("react.profiler"),V=Symbol.for("react.consumer"),z=Symbol.for("react.context"),q=Symbol.for("react.forward_ref"),G=Symbol.for("react.suspense"),J=Symbol.for("react.suspense_list"),X=Symbol.for("react.memo"),R=Symbol.for("react.lazy"),H=Symbol.for("react.activity"),Z=Symbol.for("react.client.reference"),g=E.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,Q=Array.isArray,T=console.createTask?console.createTask:function(){return null};E={react_stack_bottom_frame:function(e){return e()}};var $,Y={},F=E.react_stack_bottom_frame.bind(E,o)(),L=T(n(o)),D={};j.Fragment=k,j.jsx=function(e,t,i){var f=1e4>g.recentlyCreatedOwnerStacks++;return b(e,t,i,!1,f?Error("react-stack-top-frame"):F,f?T(n(e)):L)},j.jsxs=function(e,t,i){var f=1e4>g.recentlyCreatedOwnerStacks++;return b(e,t,i,!0,f?Error("react-stack-top-frame"):F,f?T(n(e)):L)}}()),j}process.env.NODE_ENV==="production"?A.exports=ee():A.exports=re();var r=A.exports;const te=({variant:l="primary",size:c="md",leftIcon:s,rightIcon:n,children:a,fullWidth:o=!1,disabled:m,className:_="",...d})=>{const p=["fm-btn",`fm-btn--${l}`,`fm-btn--${c}`,o?"fm-btn--full":"",m?"fm-btn--disabled":"",_].filter(Boolean).join(" ");return r.jsxs("button",{className:p,disabled:m,...d,children:[s&&r.jsx("span",{className:"fm-btn__icon fm-btn__icon--left",children:s}),a&&r.jsx("span",{className:"fm-btn__label",children:a}),n&&r.jsx("span",{className:"fm-btn__icon fm-btn__icon--right",children:n})]})},ae=({label:l,placeholder:c,state:s="default",errorMessage:n,successMessage:a,leftIcon:o,rightIcon:m,className:_="",disabled:d,...p})=>{const b=["fm-input-wrapper",`fm-input-wrapper--${s}`,d?"fm-input-wrapper--disabled":"",_].filter(Boolean).join(" ");return r.jsxs("div",{className:b,children:[l&&r.jsx("label",{className:"fm-input__label",children:l}),r.jsxs("div",{className:"fm-input__field",children:[o&&r.jsx("span",{className:"fm-input__icon fm-input__icon--left",children:o}),r.jsx("input",{className:"fm-input__el",placeholder:c,disabled:d,...p}),m&&r.jsx("span",{className:"fm-input__icon fm-input__icon--right",children:m})]}),s==="error"&&n&&r.jsx("p",{className:"fm-input__message fm-input__message--error",children:n}),s==="success"&&a&&r.jsx("p",{className:"fm-input__message fm-input__message--success",children:a})]})},se=({children:l,color:c="grey",className:s=""})=>{const n=["fm-tag",`fm-tag--${c}`,s].filter(Boolean).join(" ");return r.jsx("span",{className:n,children:l})},ne=({checked:l,onChange:c,disabled:s,label:n,className:a=""})=>r.jsxs("label",{className:["fm-toggle",s?"fm-toggle--disabled":"",a].filter(Boolean).join(" "),children:[r.jsx("input",{type:"checkbox",className:"fm-toggle__input",checked:l,onChange:o=>c(o.target.checked),disabled:s}),r.jsx("span",{className:"fm-toggle__track",children:r.jsx("span",{className:"fm-toggle__thumb"})}),n&&r.jsx("span",{className:"fm-toggle__label",children:n})]}),oe=({checked:l=!1,indeterminate:c=!1,onChange:s,disabled:n,size:a="small",label:o,className:m=""})=>{const _=O.useRef(null);return O.useEffect(()=>{_.current&&(_.current.indeterminate=c)},[c]),r.jsxs("label",{className:["fm-checkbox",`fm-checkbox--${a}`,n?"fm-checkbox--disabled":"",m].filter(Boolean).join(" "),children:[r.jsx("input",{ref:_,type:"checkbox",className:"fm-checkbox__input",checked:l,onChange:d=>s==null?void 0:s(d.target.checked),disabled:n}),r.jsxs("span",{className:"fm-checkbox__box",children:[l&&!c&&r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",children:r.jsx("path",{d:"M1 4L3.5 6.5L9 1",stroke:"white",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),c&&r.jsx("span",{className:"fm-checkbox__minus"})]}),o&&r.jsx("span",{className:"fm-checkbox__label",children:o})]})},le=({title:l,subtitle:c,color:s="purple",leftSlot:n,rightSlot:a,className:o=""})=>{const m=["fm-header",`fm-header--${s}`,o].filter(Boolean).join(" ");return r.jsxs("div",{className:m,children:[n&&r.jsx("div",{className:"fm-header__slot fm-header__slot--left",children:n}),r.jsxs("div",{className:"fm-header__title-block",children:[r.jsx("h4",{className:"fm-header__title",children:l}),c&&r.jsx("p",{className:"fm-header__subtitle",children:c})]}),a&&r.jsx("div",{className:"fm-header__slot fm-header__slot--right",children:a})]})},ce=({variant:l="light",headline:c="Є ідеї чи пропозиції?",ctaLabel:s="Написати нам",onCtaClick:n,sections:a=[],copyright:o="© 2024 Made by FlowMakers. All rights reserved",className:m=""})=>{const _=["fm-footer",`fm-footer--${l}`,m].filter(Boolean).join(" ");return r.jsxs("footer",{className:_,children:[r.jsxs("div",{className:"fm-footer__top",children:[r.jsxs("div",{className:"fm-footer__cta-block",children:[r.jsx("h3",{className:"fm-footer__headline",children:c}),r.jsx("button",{className:"fm-footer__cta-btn",onClick:n,children:s})]}),r.jsx("div",{className:"fm-footer__sections",children:a.map((d,p)=>r.jsxs("div",{className:"fm-footer__section",children:[r.jsx("p",{className:"fm-footer__section-title",children:d.title}),r.jsx("ul",{className:"fm-footer__section-links",children:d.links.map((b,v)=>r.jsx("li",{children:r.jsx("a",{href:b.href,className:"fm-footer__link",children:b.label})},v))})]},p))})]}),r.jsx("div",{className:"fm-footer__bottom",children:r.jsx("p",{className:"fm-footer__copyright",children:o})})]})};exports.Button=te;exports.Checkbox=oe;exports.Footer=ce;exports.Header=le;exports.Input=ae;exports.Tag=se;exports.Toggle=ne;
+  <%s key={someKey} {...props} />`,f,u,h,u),D[u+f]=!0)}if(u=null,i!==void 0&&(a(i),u=""+i),m(t)&&(a(t.key),u=""+t.key),"key"in t){i={};for(var y in t)y!=="key"&&(i[y]=t[y])}else i=t;return u&&_(i,typeof e=="function"?e.displayName||e.name||"Unknown":e),p(e,u,i,s(),N,w)}function v(e){P(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===R&&(e._payload.status==="fulfilled"?P(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function P(e){return typeof e=="object"&&e!==null&&e.$$typeof===S}var E=O,S=Symbol.for("react.transitional.element"),B=Symbol.for("react.portal"),k=Symbol.for("react.fragment"),W=Symbol.for("react.strict_mode"),U=Symbol.for("react.profiler"),V=Symbol.for("react.consumer"),q=Symbol.for("react.context"),z=Symbol.for("react.forward_ref"),G=Symbol.for("react.suspense"),J=Symbol.for("react.suspense_list"),X=Symbol.for("react.memo"),R=Symbol.for("react.lazy"),H=Symbol.for("react.activity"),Z=Symbol.for("react.client.reference"),g=E.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,Q=Array.isArray,T=console.createTask?console.createTask:function(){return null};E={react_stack_bottom_frame:function(e){return e()}};var $,Y={},F=E.react_stack_bottom_frame.bind(E,o)(),L=T(n(o)),D={};j.Fragment=k,j.jsx=function(e,t,i){var f=1e4>g.recentlyCreatedOwnerStacks++;return b(e,t,i,!1,f?Error("react-stack-top-frame"):F,f?T(n(e)):L)},j.jsxs=function(e,t,i){var f=1e4>g.recentlyCreatedOwnerStacks++;return b(e,t,i,!0,f?Error("react-stack-top-frame"):F,f?T(n(e)):L)}}()),j}process.env.NODE_ENV==="production"?A.exports=ee():A.exports=re();var r=A.exports;const te=({variant:l="primary",size:c="md",leftIcon:a,rightIcon:n,children:s,fullWidth:o=!1,disabled:m,className:_="",...d})=>{const p=["fm-btn",`fm-btn--${l}`,`fm-btn--${c}`,o?"fm-btn--full":"",m?"fm-btn--disabled":"",_].filter(Boolean).join(" ");return r.jsxs("button",{className:p,disabled:m,...d,children:[a&&r.jsx("span",{className:"fm-btn__icon fm-btn__icon--left",children:a}),s&&r.jsx("span",{className:"fm-btn__label",children:s}),n&&r.jsx("span",{className:"fm-btn__icon fm-btn__icon--right",children:n})]})},se=({label:l,placeholder:c,state:a="default",errorMessage:n,successMessage:s,leftIcon:o,rightIcon:m,className:_="",disabled:d,...p})=>{const b=["fm-input-wrapper",`fm-input-wrapper--${a}`,d?"fm-input-wrapper--disabled":"",_].filter(Boolean).join(" ");return r.jsxs("div",{className:b,children:[l&&r.jsx("label",{className:"fm-input__label",children:l}),r.jsxs("div",{className:"fm-input__field",children:[o&&r.jsx("span",{className:"fm-input__icon fm-input__icon--left",children:o}),r.jsx("input",{className:"fm-input__el",placeholder:c,disabled:d,...p}),m&&r.jsx("span",{className:"fm-input__icon fm-input__icon--right",children:m})]}),a==="error"&&n&&r.jsx("p",{className:"fm-input__message fm-input__message--error",children:n}),a==="success"&&s&&r.jsx("p",{className:"fm-input__message fm-input__message--success",children:s})]})},ae=({children:l,color:c="grey",className:a=""})=>{const n=["fm-tag",`fm-tag--${c}`,a].filter(Boolean).join(" ");return r.jsx("span",{className:n,children:l})},ne=({checked:l,onChange:c,disabled:a,label:n,className:s=""})=>r.jsxs("label",{className:["fm-toggle",a?"fm-toggle--disabled":"",s].filter(Boolean).join(" "),children:[r.jsx("input",{type:"checkbox",className:"fm-toggle__input",checked:l,onChange:o=>c(o.target.checked),disabled:a}),r.jsx("span",{className:"fm-toggle__track",children:r.jsx("span",{className:"fm-toggle__thumb"})}),n&&r.jsx("span",{className:"fm-toggle__label",children:n})]}),oe=({checked:l=!1,indeterminate:c=!1,onChange:a,disabled:n,size:s="small",label:o,className:m=""})=>{const _=O.useRef(null);return O.useEffect(()=>{_.current&&(_.current.indeterminate=c)},[c]),r.jsxs("label",{className:["fm-checkbox",`fm-checkbox--${s}`,n?"fm-checkbox--disabled":"",m].filter(Boolean).join(" "),children:[r.jsx("input",{ref:_,type:"checkbox",className:"fm-checkbox__input",checked:l,onChange:d=>a==null?void 0:a(d.target.checked),disabled:n}),r.jsxs("span",{className:"fm-checkbox__box",children:[l&&!c&&r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",children:r.jsx("path",{d:"M1 4L3.5 6.5L9 1",stroke:"white",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),c&&r.jsx("span",{className:"fm-checkbox__minus"})]}),o&&r.jsx("span",{className:"fm-checkbox__label",children:o})]})},le=({title:l,subtitle:c,color:a="purple",leftSlot:n,rightSlot:s,className:o=""})=>{const m=["fm-header",`fm-header--${a}`,o].filter(Boolean).join(" ");return r.jsxs("div",{className:m,children:[n&&r.jsx("div",{className:"fm-header__slot fm-header__slot--left",children:n}),r.jsxs("div",{className:"fm-header__title-block",children:[r.jsx("h4",{className:"fm-header__title",children:l}),c&&r.jsx("p",{className:"fm-header__subtitle",children:c})]}),s&&r.jsx("div",{className:"fm-header__slot fm-header__slot--right",children:s})]})},ce=({variant:l="light",headline:c="Є ідеї чи пропозиції?",ctaLabel:a="Написати нам",onCtaClick:n,sections:s=[],copyright:o="© 2024 Made by FlowMakers. All rights reserved",className:m=""})=>{const _=["fm-footer",`fm-footer--${l}`,m].filter(Boolean).join(" ");return r.jsxs("footer",{className:_,children:[r.jsxs("div",{className:"fm-footer__top",children:[r.jsxs("div",{className:"fm-footer__cta-block",children:[r.jsx("h3",{className:"fm-footer__headline",children:c}),r.jsx("button",{className:"fm-footer__cta-btn",onClick:n,children:a})]}),r.jsx("div",{className:"fm-footer__sections",children:s.map((d,p)=>r.jsxs("div",{className:"fm-footer__section",children:[r.jsx("p",{className:"fm-footer__section-title",children:d.title}),r.jsx("ul",{className:"fm-footer__section-links",children:d.links.map((b,v)=>r.jsx("li",{children:r.jsx("a",{href:b.href,className:"fm-footer__link",children:b.label})},v))})]},p))})]}),r.jsx("div",{className:"fm-footer__bottom",children:r.jsx("p",{className:"fm-footer__copyright",children:o})})]})};exports.Button=te;exports.Checkbox=oe;exports.Footer=ce;exports.Header=le;exports.Input=se;exports.Tag=ae;exports.Toggle=ne;

package/dist/index.esm.js

@@ -1,5 +1,5 @@
-import O from "react";
-var A = { exports: {} }, x = {};
+import K, { useRef as ee, useEffect as re } from "react";
+var O = { exports: {} }, x = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -9,10 +9,10 @@ var A = { exports: {} }, x = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var I;
-function ee() {
-  if (I) return x;
-  I = 1;
+var D;
+function te() {
+  if (D) return x;
+  D = 1;
   var l = Symbol.for("react.transitional.element"), c = Symbol.for("react.fragment");
   function a(n, s, o) {
     var m = null;
@@ -41,42 +41,42 @@ var j = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var M;
-function re() {
-  return M || (M = 1, process.env.NODE_ENV !== "production" && function() {
+var I;
+function se() {
+  return I || (I = 1, process.env.NODE_ENV !== "production" && function() {
     function l(e) {
       if (e == null) return null;
       if (typeof e == "function")
-        return e.$$typeof === Z ? null : e.displayName || e.name || null;
+        return e.$$typeof === H ? null : e.displayName || e.name || null;
       if (typeof e == "string") return e;
       switch (e) {
         case k:
           return "Fragment";
-        case U:
-          return "Profiler";
         case B:
+          return "Profiler";
+        case W:
           return "StrictMode";
-        case J:
-          return "Suspense";
         case q:
+          return "Suspense";
+        case G:
           return "SuspenseList";
-        case H:
+        case X:
           return "Activity";
       }
       if (typeof e == "object")
         switch (typeof e.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), e.$$typeof) {
-          case W:
+          case M:
             return "Portal";
-          case z:
-            return e.displayName || "Context";
           case V:
+            return e.displayName || "Context";
+          case U:
             return (e._context.displayName || "Context") + ".Consumer";
-          case G:
+          case z:
             var t = e.render;
             return e = e.displayName, e || (e = t.displayName || t.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
-          case X:
+          case J:
             return t = e.displayName || null, t !== null ? t : l(e.type) || "Memo";
           case R:
             t = e._payload, e = e._init;
@@ -126,7 +126,7 @@ function re() {
       return Error("react-stack-top-frame");
     }
     function m(e) {
-      if (C.call(e, "key")) {
+      if (S.call(e, "key")) {
         var t = Object.getOwnPropertyDescriptor(e, "key").get;
         if (t && t.isReactWarning) return !1;
       }
@@ -134,7 +134,7 @@ function re() {
     }
     function _(e, t) {
       function i() {
-        $ || ($ = !0, console.error(
+        C || (C = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
           t
         ));
@@ -146,14 +146,14 @@ function re() {
     }
     function d() {
       var e = l(this.type);
-      return Y[e] || (Y[e] = !0, console.error(
+      return $[e] || ($[e] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), e = this.props.ref, e !== void 0 ? e : null;
     }
     function p(e, t, i, f, N, w) {
       var u = i.ref;
       return e = {
-        $$typeof: S,
+        $$typeof: P,
         type: e,
         key: t,
         props: i,
@@ -187,7 +187,7 @@ function re() {
       var u = t.children;
       if (u !== void 0)
         if (f)
-          if (Q(u)) {
+          if (Z(u)) {
             for (f = 0; f < u.length; f++)
               v(u[f]);
             Object.freeze && Object.freeze(u);
@@ -196,12 +196,12 @@ function re() {
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
         else v(u);
-      if (C.call(t, "key")) {
+      if (S.call(t, "key")) {
         u = l(e);
-        var b = Object.keys(t).filter(function(K) {
-          return K !== "key";
+        var b = Object.keys(t).filter(function(Q) {
+          return Q !== "key";
         });
-        f = 0 < b.length ? "{key: someKey, " + b.join(": ..., ") + ": ...}" : "{key: someKey}", D[u + f] || (b = 0 < b.length ? "{" + b.join(": ..., ") + ": ...}" : "{}", console.error(
+        f = 0 < b.length ? "{key: someKey, " + b.join(": ..., ") + ": ...}" : "{key: someKey}", L[u + f] || (b = 0 < b.length ? "{" + b.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
@@ -212,7 +212,7 @@ React keys must be passed directly to JSX without using spread:
           u,
           b,
           u
-        ), D[u + f] = !0);
+        ), L[u + f] = !0);
       }
       if (u = null, i !== void 0 && (a(i), u = "" + i), m(t) && (a(t.key), u = "" + t.key), "key" in t) {
         i = {};
@@ -232,12 +232,12 @@ React keys must be passed directly to JSX without using spread:
       );
     }
     function v(e) {
-      P(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === R && (e._payload.status === "fulfilled" ? P(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+      A(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === R && (e._payload.status === "fulfilled" ? A(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
     }
-    function P(e) {
-      return typeof e == "object" && e !== null && e.$$typeof === S;
+    function A(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === P;
     }
-    var E = O, S = Symbol.for("react.transitional.element"), W = Symbol.for("react.portal"), k = Symbol.for("react.fragment"), B = Symbol.for("react.strict_mode"), U = Symbol.for("react.profiler"), V = Symbol.for("react.consumer"), z = Symbol.for("react.context"), G = Symbol.for("react.forward_ref"), J = Symbol.for("react.suspense"), q = Symbol.for("react.suspense_list"), X = Symbol.for("react.memo"), R = Symbol.for("react.lazy"), H = Symbol.for("react.activity"), Z = Symbol.for("react.client.reference"), T = E.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, C = Object.prototype.hasOwnProperty, Q = Array.isArray, g = console.createTask ? console.createTask : function() {
+    var E = K, P = Symbol.for("react.transitional.element"), M = Symbol.for("react.portal"), k = Symbol.for("react.fragment"), W = Symbol.for("react.strict_mode"), B = Symbol.for("react.profiler"), U = Symbol.for("react.consumer"), V = Symbol.for("react.context"), z = Symbol.for("react.forward_ref"), q = Symbol.for("react.suspense"), G = Symbol.for("react.suspense_list"), J = Symbol.for("react.memo"), R = Symbol.for("react.lazy"), X = Symbol.for("react.activity"), H = Symbol.for("react.client.reference"), T = E.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, S = Object.prototype.hasOwnProperty, Z = Array.isArray, g = console.createTask ? console.createTask : function() {
       return null;
     };
     E = {
@@ -245,10 +245,10 @@ React keys must be passed directly to JSX without using spread:
         return e();
       }
     };
-    var $, Y = {}, F = E.react_stack_bottom_frame.bind(
+    var C, $ = {}, Y = E.react_stack_bottom_frame.bind(
       E,
       o
-    )(), L = g(n(o)), D = {};
+    )(), F = g(n(o)), L = {};
     j.Fragment = k, j.jsx = function(e, t, i) {
       var f = 1e4 > T.recentlyCreatedOwnerStacks++;
       return h(
@@ -256,8 +256,8 @@ React keys must be passed directly to JSX without using spread:
         t,
         i,
         !1,
-        f ? Error("react-stack-top-frame") : F,
-        f ? g(n(e)) : L
+        f ? Error("react-stack-top-frame") : Y,
+        f ? g(n(e)) : F
       );
     }, j.jsxs = function(e, t, i) {
       var f = 1e4 > T.recentlyCreatedOwnerStacks++;
@@ -266,15 +266,15 @@ React keys must be passed directly to JSX without using spread:
         t,
         i,
         !0,
-        f ? Error("react-stack-top-frame") : F,
-        f ? g(n(e)) : L
+        f ? Error("react-stack-top-frame") : Y,
+        f ? g(n(e)) : F
       );
     };
   }()), j;
 }
-process.env.NODE_ENV === "production" ? A.exports = ee() : A.exports = re();
-var r = A.exports;
-const se = ({
+process.env.NODE_ENV === "production" ? O.exports = te() : O.exports = se();
+var r = O.exports;
+const ne = ({
   variant: l = "primary",
   size: c = "md",
   leftIcon: a,
@@ -298,7 +298,7 @@ const se = ({
     s && /* @__PURE__ */ r.jsx("span", { className: "fm-btn__label", children: s }),
     n && /* @__PURE__ */ r.jsx("span", { className: "fm-btn__icon fm-btn__icon--right", children: n })
   ] });
-}, ae = ({
+}, oe = ({
   label: l,
   placeholder: c,
   state: a = "default",
@@ -334,10 +334,10 @@ const se = ({
     a === "error" && n && /* @__PURE__ */ r.jsx("p", { className: "fm-input__message fm-input__message--error", children: n }),
     a === "success" && s && /* @__PURE__ */ r.jsx("p", { className: "fm-input__message fm-input__message--success", children: s })
   ] });
-}, ne = ({ children: l, color: c = "grey", className: a = "" }) => {
+}, le = ({ children: l, color: c = "grey", className: a = "" }) => {
   const n = ["fm-tag", `fm-tag--${c}`, a].filter(Boolean).join(" ");
   return /* @__PURE__ */ r.jsx("span", { className: n, children: l });
-}, oe = ({ checked: l, onChange: c, disabled: a, label: n, className: s = "" }) => /* @__PURE__ */ r.jsxs("label", { className: ["fm-toggle", a ? "fm-toggle--disabled" : "", s].filter(Boolean).join(" "), children: [
+}, ce = ({ checked: l, onChange: c, disabled: a, label: n, className: s = "" }) => /* @__PURE__ */ r.jsxs("label", { className: ["fm-toggle", a ? "fm-toggle--disabled" : "", s].filter(Boolean).join(" "), children: [
   /* @__PURE__ */ r.jsx(
     "input",
     {
@@ -350,7 +350,7 @@ const se = ({
   ),
   /* @__PURE__ */ r.jsx("span", { className: "fm-toggle__track", children: /* @__PURE__ */ r.jsx("span", { className: "fm-toggle__thumb" }) }),
   n && /* @__PURE__ */ r.jsx("span", { className: "fm-toggle__label", children: n })
-] }), le = ({
+] }), ie = ({
   checked: l = !1,
   indeterminate: c = !1,
   onChange: a,
@@ -359,8 +359,8 @@ const se = ({
   label: o,
   className: m = ""
 }) => {
-  const _ = O.useRef(null);
-  return O.useEffect(() => {
+  const _ = ee(null);
+  return re(() => {
     _.current && (_.current.indeterminate = c);
   }, [c]), /* @__PURE__ */ r.jsxs("label", { className: ["fm-checkbox", `fm-checkbox--${s}`, n ? "fm-checkbox--disabled" : "", m].filter(Boolean).join(" "), children: [
     /* @__PURE__ */ r.jsx(
@@ -380,7 +380,7 @@ const se = ({
     ] }),
     o && /* @__PURE__ */ r.jsx("span", { className: "fm-checkbox__label", children: o })
   ] });
-}, ce = ({
+}, fe = ({
   title: l,
   subtitle: c,
   color: a = "purple",
@@ -397,7 +397,7 @@ const se = ({
     ] }),
     s && /* @__PURE__ */ r.jsx("div", { className: "fm-header__slot fm-header__slot--right", children: s })
   ] });
-}, ie = ({
+}, ue = ({
   variant: l = "light",
   headline: c = "Є ідеї чи пропозиції?",
   ctaLabel: a = "Написати нам",
@@ -422,11 +422,11 @@ const se = ({
   ] });
 };
 export {
-  se as Button,
-  le as Checkbox,
-  ie as Footer,
-  ce as Header,
-  ae as Input,
-  ne as Tag,
-  oe as Toggle
+  ne as Button,
+  ie as Checkbox,
+  ue as Footer,
+  fe as Header,
+  oe as Input,
+  le as Tag,
+  ce as Toggle
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tetjana/flowmakers-ds",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "FlowMakers UI Design System — React components",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",