@arthurzakharov/ui-kit 1.0.6 → 1.0.8

package/dist/assets/button-Bg4CwXVJ.css

@@ -0,0 +1 @@
+._Button_1npja_1{box-sizing:border-box;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center}._ButtonSizeSm_1npja_10{border-radius:var(--rm-ui-border-radius-sm);padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm)}._ButtonSizeSm_1npja_10 ._ButtonText_1npja_15{font-family:var(--rm-ui-font-family-regular),sans-serif;font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small)}._ButtonSizeMd_1npja_21,._ButtonSizeLg_1npja_22{border-radius:var(--rm-ui-border-radius-md);padding:var(--rm-ui-padding-sm) var(--rm-ui-padding-md)}._ButtonSizeMd_1npja_21 ._ButtonText_1npja_15{font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body)}._ButtonSizeLg_1npja_22 ._ButtonText_1npja_15{font-size:var(--rm-ui-font-size-body-large);line-height:var(--rm-ui-line-height-body-large)}._ButtonColorNext_1npja_37{background-color:var(--rm-ui-next-btn-bg)}._ButtonColorNext_1npja_37 ._ButtonText_1npja_15{color:#fff}._ButtonColorPrevious_1npja_45{background-color:transparent}._ButtonColorPrevious_1npja_45 ._ButtonText_1npja_15{color:var(--rm-ui-color-text-secondary)}._Button_1npja_1:hover{cursor:pointer}._Button_1npja_1:focus{outline-color:var(--rm-ui-color-focus)}._ButtonFullWidth_1npja_61{width:100%}._ButtonText_1npja_15{font-family:var(--rm-ui-font-family-medium),sans-serif}._ButtonInfo_1npja_69{font-family:var(--rm-ui-font-family-regular),sans-serif;font-size:var(--rm-ui-font-size-body-small);line-height:calc(var(--rm-ui-line-height-body-small) - 2px);color:#fff}

package/dist/assets/card-image-DQ9c4G_r.css

@@ -0,0 +1 @@
+._CardImage_dw1xq_1{--font-size: 12px;--line-height: 14px;--img-size: 110px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--rm-ui-padding-xs)}._CardImageContent_dw1xq_13{width:135px;height:130px;padding:6px;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}._CardImageContent_dw1xq_13:hover{cursor:pointer}._CardImageTop_dw1xq_27{position:relative;flex-grow:1}._CardImageWrap_dw1xq_32{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--img-size);height:var(--img-size);background-repeat:no-repeat;background-size:700%}._CardImageBottom_dw1xq_43{flex-basis:calc(var(--line-height) * 2);display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:var(--rm-ui-padding-xs)}

package/dist/assets/card-text-fgHu9TyO.css

@@ -0,0 +1 @@
+._CardText_1eht8_1{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:var(--rm-ui-padding-sm)}._CardTextLabel_1eht8_9{position:relative;padding:var(--rm-ui-padding-md) var(--rm-ui-padding-sm);flex-basis:100%;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--rm-ui-padding-xs)}._CardTextLabel_1eht8_9:hover{cursor:pointer}._CardTextChoice_1eht8_24{display:flex;flex-direction:row;align-items:center;justify-content:center}

package/dist/assets/checkbox-C8mg6gvd.css

@@ -0,0 +1 @@
+._Checkbox_1gskb_1{position:relative;display:inline-flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;gap:var(--rm-ui-padding-xs)}._Checkbox_1gskb_1:hover{cursor:pointer}._CheckboxChoice_1gskb_14{position:relative;left:0;top:3px}._CheckboxContent_1gskb_20{font-family:var(--rm-ui-font-family-regular),sans-serif;font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small);color:var(--rm-ui-color-text-primary)}._CheckboxContent_1gskb_20 button{background-color:transparent;border:none;padding:0;font-family:inherit;font-size:inherit;line-height:inherit;color:var(--rm-ui-color-action)}._CheckboxContent_1gskb_20 button:hover{cursor:pointer;text-decoration:underline}

package/dist/assets/dropdown-Ba3Wegqm.css

@@ -0,0 +1 @@
+._Dropdown_cmvnx_1{--transition-time: .2s;--under-chevron: linear-gradient(90deg, rgba(255, 255, 255, 0) -10%, rgba(255, 255, 255, .5411764706) 25%, #fff 50%);--border-radius: 3px;position:relative;font-family:var(--rm-ui-font-family-regular),sans-serif;font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small);color:var(--rm-ui-color-text-primary);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:var(--rm-ui-padding-xxs)}._DropdownBorder_cmvnx_17{position:relative;min-height:60px;flex-grow:1;display:flex;align-items:center;justify-content:flex-start;padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm);overflow:hidden}._DropdownContent_cmvnx_28{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}._DropdownBorder_cmvnx_17:hover{cursor:pointer}._DropdownChevron_cmvnx_39{width:24px;height:24px;transition:transform var(--transition-time) ease-out}._DropdownChevron_cmvnx_39[data-open=false]{transform:rotate(0)}._DropdownChevron_cmvnx_39[data-open=true]{transform:rotate(180deg)}._DropdownChevronWrap_cmvnx_53{position:absolute;z-index:1;right:0;top:50%;transform:translateY(-50%);background:var(--under-chevron);border-radius:10px;width:80px;height:100%;padding-right:var(--rm-ui-padding-sm);display:flex;justify-content:flex-end;align-items:center}._DropdownBox_cmvnx_69{flex-grow:1;border-radius:10px;background-color:var(--rm-ui-grey-50)}._DropdownBoxVisible_cmvnx_75{display:block}._DropdownBoxHidden_cmvnx_79{display:none}._DropdownSearch_cmvnx_83{position:relative;border-bottom:1px var(--rm-ui-grey-300) solid;padding:var(--rm-ui-padding-sm)}._DropdownSearchVisible_cmvnx_89{display:block}._DropdownSearchHidden_cmvnx_93{display:none}._DropdownClose_cmvnx_97{border-top:1px var(--rm-ui-grey-300) solid;padding:var(--rm-ui-padding-sm);display:flex;flex-direction:row;align-items:center;justify-content:flex-end}._DropdownInput_cmvnx_106{width:100%;border-radius:10px;padding:var(--rm-ui-padding-xs) calc(var(--rm-ui-padding-sm) * 2 + 12px) var(--rm-ui-padding-xs) var(--rm-ui-padding-sm);border:1px var(--rm-ui-grey-300) solid;box-sizing:border-box;font-family:var(--rm-ui-font-family-regular),sans-serif;font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body);color:var(--rm-ui-color-text-primary);outline-color:var(--rm-ui-color-accent-primary)}._DropdownGlass_cmvnx_120{position:absolute;z-index:1;right:calc(var(--rm-ui-padding-sm) * 2);top:50%;transform:translateY(-50%);width:24px;height:24px;color:var(--rm-ui-grey-300)}._DropdownChoices_cmvnx_131{list-style:none;margin:0;padding:0;max-height:228px;overflow-y:scroll;border-radius:10px}._DropdownChoice_cmvnx_131{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--rm-ui-padding-sm);padding:6px var(--rm-ui-padding-sm)}._DropdownChoice_cmvnx_131:hover{cursor:pointer;background-color:#fff}._DropdownChoiceNoResult_cmvnx_154{color:var(--rm-ui-grey-600);text-align:center}html[dir=rtl] ._DropdownGlass_cmvnx_120{left:31px;right:initial}html[dir=rtl] ._DropdownChevronWrap_cmvnx_53{left:19px;right:initial}

package/dist/assets/header-CvDToxgv.css

@@ -0,0 +1 @@
+._Header_2g7zf_1{display:flex;flex-direction:row;align-items:center;justify-content:space-between}._HeaderInfo_2g7zf_8{display:flex;flex-direction:column;align-items:flex-end;gap:2px}._HeaderLogo_2g7zf_15{height:var(--rm-ui-header-logo-height);pointer-events:none}._HeaderLogoPlaceholder_2g7zf_20{display:flex;width:var(--rm-ui-header-logo-height);height:var(--rm-ui-header-logo-height)}._HeaderPhoneButton_2g7zf_26{padding:0;border:none;background-color:transparent;display:flex;flex-direction:row;align-items:center;gap:var(--rm-ui-padding-xs);outline-offset:2px;outline-color:var(--rm-ui-color-focus)}._HeaderPhoneButtonIcon_2g7zf_38{width:22px;height:22px;stroke:var(--rm-ui-color-theme-primary);stroke-width:3px}._HeaderPhoneButtonNumber_2g7zf_45,._HeaderDescriptions_2g7zf_46{display:none}@media screen and (min-width:768px){._HeaderPhoneButtonNumber_2g7zf_45{display:flex;font-family:var(--rm-ui-font-family-bold),sans-serif;font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body);letter-spacing:.1px;color:var(--rm-ui-color-theme-primary)}._HeaderDescriptions_2g7zf_46{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--rm-ui-padding-xxs);font-family:var(--rm-ui-font-family-light),sans-serif;font-size:var( --rm-ui-font-size-body-extra-small);line-height:var( --rm-ui-line-height-body-extra-small);color:var(--rm-ui-color-theme-primary)}._HeaderDescriptionsIcon_2g7zf_72{stroke:var(--rm-ui-color-theme-primary);stroke-width:3px}._HeaderDescriptionsIconSm_2g7zf_77{width:10px;height:10px}._HeaderDescriptionsIconMd_2g7zf_82{width:12px;height:12px}}

package/dist/assets/input-3QR47UJ8.css

@@ -0,0 +1 @@
+._Input_1ldi1_1{outline:none;box-sizing:border-box;width:100%;border:none;padding:0;font-family:var(--rm-ui-font-family-medium),sans-serif;font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body);color:var(--rm-ui-color-text-primary)}._Input_1ldi1_1:hover{cursor:pointer}._Input_1ldi1_1:disabled{opacity:.33}._Input_1ldi1_1:disabled,._Input_1ldi1_1:-webkit-autofill,._Input_1ldi1_1:-webkit-autofill:hover,._Input_1ldi1_1:-webkit-autofill:focus,._Input_1ldi1_1:-webkit-autofill:active,._Input_1ldi1_1:autofill,._Input_1ldi1_1:autofill:hover,._Input_1ldi1_1:autofill:focus,._Input_1ldi1_1:autofill:active{background:transparent;transition:background 7200s ease-in-out 0s}._Input_1ldi1_1:-webkit-autofill{animation-name:_autofill-start_1ldi1_1;animation-duration:.1s;-webkit-text-fill-color:var(--rm-ui-color-text-primary)}._Input_1ldi1_1:not(:-webkit-autofill){animation-name:_autofill-cancel_1ldi1_1;animation-duration:.1s}@keyframes _autofill-start_1ldi1_1{}@keyframes _autofill-cancel_1ldi1_1{}

package/dist/assets/label-CCZNUUQp.css

@@ -0,0 +1 @@
+._Label_1vr4d_1{font-family:var(--rm-ui-font-family-regular),sans-serif;transition:color .15s ease-out}._LabelPositionIdle_1vr4d_6{font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body)}._LabelPositionActive_1vr4d_11{font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small)}._LabelStateIdle_1vr4d_16{color:var(--rm-ui-color-text-secondary)}._LabelStateError_1vr4d_20{color:var(--rm-ui-color-error)}._LabelStateSuccess_1vr4d_24{color:var(--rm-ui-color-success)}

package/dist/assets/main-BgL82qFL.css

@@ -0,0 +1 @@
+:root{--rm-ui-padding-xxs: 4px;--rm-ui-padding-xs: 8px;--rm-ui-padding-sm: 12px;--rm-ui-padding-md: 16px;--rm-ui-padding-lg: 24px;--rm-ui-padding-xl: 32px;--rm-ui-padding-xxl: 40px;--rm-ui-padding-xxxl: 48px;--rm-ui-border-radius-sm: 8px;--rm-ui-border-radius-md: 12px;--rm-ui-border-radius-lg: 16px;--rm-ui-border-radius-xl: 24px;--rm-ui-font-size-body-extra-small: 12px;--rm-ui-line-height-body-extra-small: 16px;--rm-ui-font-size-body-small: 14px;--rm-ui-line-height-body-small: 20px;--rm-ui-font-size-body: 16px;--rm-ui-line-height-body: 24px;--rm-ui-font-size-body-large: 20px;--rm-ui-line-height-body-large: 30px;--rm-ui-font-size-hl5: 14px;--rm-ui-line-height-hl5: 22px;--rm-ui-font-size-hl4: 18px;--rm-ui-line-height-hl4: 24px;--rm-ui-font-size-hl3: 20px;--rm-ui-line-height-hl3: 30px;--rm-ui-font-size-hl2: 24px;--rm-ui-line-height-hl2: 32px;--rm-ui-font-size-hl1: 28px;--rm-ui-line-height-hl1: 36px;--rm-ui-font-family-light: "Lato Light", sans-serif;--rm-ui-font-family-light-i: "Lato Light Italic", sans-serif;--rm-ui-font-family-regular: "Lato Regular", sans-serif;--rm-ui-font-family-regular-i: "Lato Regular Italic", sans-serif;--rm-ui-font-family-medium: "Lato Bold", sans-serif;--rm-ui-font-family-medium-i: "Lato Bold Italic", sans-serif;--rm-ui-font-family-bold: "Lato Black", sans-serif;--rm-ui-font-family-bold-i: "Lato Black Italic", sans-serif;--rm-ui-grey-950: #0a0a0a;--rm-ui-grey-900: #171717;--rm-ui-grey-800: #262626;--rm-ui-grey-700: #404040;--rm-ui-grey-600: #525252;--rm-ui-grey-500: #737373;--rm-ui-grey-400: #a3a3a3;--rm-ui-grey-300: #d4d4d4;--rm-ui-grey-200: #e5e5e5;--rm-ui-grey-100: #f5f5f5;--rm-ui-grey-50: #fafafa;--rm-ui-color-text-primary: var(--rm-ui-grey-800);--rm-ui-color-text-secondary: var(--rm-ui-grey-500);--rm-ui-color-accent-primary: #23bf96;--rm-ui-color-accent-secondary: #23bf96;--rm-ui-color-theme-primary: #302677;--rm-ui-color-theme-secondary: #302677;--rm-ui-color-action: #006cff;--rm-ui-color-inverted: #ffffff;--rm-ui-color-error: #dc2626;--rm-ui-color-success: #00b649;--rm-ui-color-focus: #ff8d02;--rm-ui-color-link: #ff8206;--rm-ui-certifications-color: #b1b4c7;--rm-ui-certifications-size: 20px;--rm-ui-card-background: #ffffff;--rm-ui-next-btn-bg: #23bf96;--rm-ui-next-btn-bg-hover: #3adbb1;--rm-ui-header-logo-height: 30px}

package/dist/assets/radio-BkD7BKk0.css

@@ -0,0 +1 @@
+._Radio_1wc8m_1{display:inline-flex}._RadioOrientationHorizontal_1wc8m_5{flex-direction:row;gap:var(--rm-ui-padding-lg)}._RadioOrientationVertical_1wc8m_10{flex-direction:column;gap:var(--rm-ui-padding-xxs)}._RadioLabel_1wc8m_15{position:relative;display:inline-flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--rm-ui-padding-xs)}._RadioLabel_1wc8m_15:hover{cursor:pointer}

package/dist/assets/radio-text-DIB67n3r.css

@@ -0,0 +1 @@
+._RadioText_9i5dh_1{position:relative;display:flex;align-items:center;justify-content:center}._RadioTextSizeMd_9i5dh_8{font-size:12px;line-height:14px}._RadioTextSizeLg_9i5dh_13{font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body)}._RadioTextOneLine_9i5dh_18,._RadioTextOneLine_9i5dh_18 ._RadioTextContent_9i5dh_19{white-space:nowrap}._RadioTextContent_9i5dh_19{display:flex;align-items:center;justify-content:flex-start;color:var(--rm-ui-color-text-primary);text-align:left;white-space:pre-wrap}._RadioTextContent_9i5dh_19[data-checked=false]{font-family:var(--rm-ui-font-family-regular),sans-serif}._RadioTextContent_9i5dh_19[data-checked=true]{font-family:var(--rm-ui-font-family-medium),sans-serif}

package/dist/assets/text-Dt0DeN-I.css

@@ -0,0 +1 @@
+._Text_1ble1_1{box-sizing:border-box;position:relative;flex-grow:1;height:58px;padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm);display:flex;flex-direction:row;justify-content:stretch;align-items:flex-end}._Text_1ble1_1:hover{cursor:pointer}._TextLabel_1ble1_17{position:absolute;left:var(--rm-ui-padding-sm);transition:top .15s ease-out}._TextLabelIdle_1ble1_23{top:50%;transform:translateY(-50%)}._TextLabelActive_1ble1_28{top:var(--rm-ui-padding-xs);transform:translateY(0)}

package/dist/assets/textarea-86fWKmQJ.css

@@ -0,0 +1 @@
+._Textarea_e95r3_1{resize:none;outline:none;box-sizing:border-box;width:100%;border:none;border-radius:10px;padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm);font-family:var(--rm-ui-font-family-medium),sans-serif;font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body);color:var(--rm-ui-color-text-primary)}._Textarea_e95r3_1:hover{cursor:pointer}._Textarea_e95r3_1:disabled{opacity:.33}._Textarea_e95r3_1:disabled,._Textarea_e95r3_1:-webkit-autofill,._Textarea_e95r3_1:-webkit-autofill:hover,._Textarea_e95r3_1:-webkit-autofill:focus,._Textarea_e95r3_1:-webkit-autofill:active,._Textarea_e95r3_1:autofill,._Textarea_e95r3_1:autofill:hover,._Textarea_e95r3_1:autofill:focus,._Textarea_e95r3_1:autofill:active{background:transparent;transition:background 7200s ease-in-out 0s}._Textarea_e95r3_1:-webkit-autofill{animation-name:_autofill-start_e95r3_1;animation-duration:.1s;-webkit-text-fill-color:var(--rm-ui-grey-500)}._Textarea_e95r3_1:not(:-webkit-autofill){animation-name:_autofill-cancel_e95r3_1;animation-duration:.1s}@keyframes _autofill-start_e95r3_1{}@keyframes _autofill-cancel_e95r3_1{}

package/dist/components/certifications/certifications.component.d.ts

@@ -1,2 +1,6 @@
-import { CertificationsProps } from './certifications.types';
+type CertificationIcon = 'free' | 'gdpr' | 'ssl';
+type CertificationsProps = Readonly<{
+    icons?: CertificationIcon[];
+}>;
 export declare const Certifications: ({ icons }: CertificationsProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/control/components/box/box.component.d.ts

@@ -1,2 +1,10 @@
-import { BoxProps } from './box.types';
+import { State } from '../../types';
+import { PropsWithChildren } from 'react';
+export interface BoxProps extends PropsWithChildren {
+    state?: State;
+    focused?: boolean;
+    checked?: boolean;
+    className?: string;
+    onClick?: () => void;
+}
 export declare const Box: import('react').ForwardRefExoticComponent<BoxProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/control/components/box/box.component.js

@@ -1,32 +1,32 @@
 import { jsx as d } from "react/jsx-runtime";
 import { forwardRef as _ } from "react";
-import S from "clsx";
-import '../../../../assets/box-b_yPaNPs.css';const l = "_Box_1tiwz_1", i = "_BoxChecked_1tiwz_15", n = "_BoxStateIdle_1tiwz_21", u = "_BoxFocused_1tiwz_25", m = "_BoxStateError_1tiwz_30", f = "_BoxStateSuccess_1tiwz_34", o = {
-  Box: l,
-  BoxChecked: i,
+import l from "clsx";
+import '../../../../assets/box-b_yPaNPs.css';const i = "_Box_1tiwz_1", S = "_BoxChecked_1tiwz_15", n = "_BoxStateIdle_1tiwz_21", u = "_BoxFocused_1tiwz_25", m = "_BoxStateError_1tiwz_30", f = "_BoxStateSuccess_1tiwz_34", o = {
+  Box: i,
+  BoxChecked: S,
   BoxStateIdle: n,
   BoxFocused: u,
   BoxStateError: m,
   BoxStateSuccess: f
-}, k = _((c, s) => {
-  const { children: x, className: r, focused: B, checked: a = !1, state: t = "idle", onClick: e } = c;
+}, z = _((e, c) => {
+  const { children: s, className: x, focused: r, checked: B = !1, state: t = "idle", onClick: a } = e;
   return /* @__PURE__ */ d(
     "div",
     {
       "data-testid": "box",
-      ref: s,
-      className: S(o.Box, r, {
-        [o.BoxFocused]: B,
-        [o.BoxChecked]: a,
+      ref: c,
+      className: l(o.Box, x, {
+        [o.BoxFocused]: r,
+        [o.BoxChecked]: B,
         [o.BoxStateIdle]: t === "idle",
         [o.BoxStateError]: t === "error",
         [o.BoxStateSuccess]: t === "success"
       }),
-      onClick: () => e == null ? void 0 : e.call(null),
-      children: x
+      onClick: () => a?.call(null),
+      children: s
     }
   );
 });
 export {
-  k as Box
+  z as Box
 };

package/dist/components/control/components/button/button.component.d.ts

@@ -1,2 +1,13 @@
-import { ButtonProps } from './button.types';
+import { PropsWithChildren } from 'react';
+export interface ButtonProps extends PropsWithChildren {
+    color: 'next' | 'previous';
+    size: 'sm' | 'md' | 'lg';
+    type: 'submit' | 'reset' | 'button';
+    disabled?: boolean;
+    info?: string;
+    fullWidth?: boolean;
+    onClick?: () => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+}
 export declare const Button: (props: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/control/components/button/button.component.js

@@ -1,53 +1,53 @@
-import { jsxs as d, jsx as s } from "react/jsx-runtime";
-import h from "clsx";
-import { containsHtml as m } from "../../utils/utils.js";
-import '../../../../assets/button-XGvsKGqH.css';const S = "_Button_hr1uu_1", x = "_ButtonSizeSm_hr1uu_10", z = "_ButtonText_hr1uu_15", f = "_ButtonSizeMd_hr1uu_21", p = "_ButtonSizeLg_hr1uu_22", C = "_ButtonColorNext_hr1uu_37", N = "_ButtonColorPrevious_hr1uu_45", g = "_ButtonFullWidth_hr1uu_61", I = "_ButtonInfo_hr1uu_69", t = {
+import { jsxs as d, jsx as u } from "react/jsx-runtime";
+import m from "clsx";
+import { containsHtml as p } from "../../utils/utils.js";
+import '../../../../assets/button-Bg4CwXVJ.css';const S = "_Button_1npja_1", x = "_ButtonSizeSm_1npja_10", z = "_ButtonText_1npja_15", f = "_ButtonSizeMd_1npja_21", j = "_ButtonSizeLg_1npja_22", C = "_ButtonColorNext_1npja_37", h = "_ButtonColorPrevious_1npja_45", N = "_ButtonFullWidth_1npja_61", g = "_ButtonInfo_1npja_69", t = {
   Button: S,
   ButtonSizeSm: x,
   ButtonText: z,
   ButtonSizeMd: f,
-  ButtonSizeLg: p,
+  ButtonSizeLg: j,
   ButtonColorNext: C,
-  ButtonColorPrevious: N,
-  ButtonFullWidth: g,
-  ButtonInfo: I
-}, T = (r) => {
+  ButtonColorPrevious: h,
+  ButtonFullWidth: N,
+  ButtonInfo: g
+}, L = (e) => {
   const {
-    children: i,
-    color: B,
+    children: s,
+    color: l,
     size: n,
-    type: _,
-    disabled: c = !1,
+    type: B,
+    disabled: i = !1,
     info: o = "",
     fullWidth: a = !1,
-    onClick: u,
-    onFocus: l,
-    onBlur: e
-  } = r;
+    onClick: c,
+    onFocus: r,
+    onBlur: _
+  } = e;
   return /* @__PURE__ */ d(
     "button",
     {
       "data-testid": "button",
-      type: _,
-      disabled: c,
-      className: h(t.Button, {
+      type: B,
+      disabled: i,
+      className: m(t.Button, {
         [t.ButtonSizeSm]: n === "sm",
         [t.ButtonSizeMd]: n === "md",
         [t.ButtonSizeLg]: n === "lg",
-        [t.ButtonColorNext]: B === "next",
-        [t.ButtonColorPrevious]: B === "previous",
+        [t.ButtonColorNext]: l === "next",
+        [t.ButtonColorPrevious]: l === "previous",
         [t.ButtonFullWidth]: a
       }),
-      onClick: () => u == null ? void 0 : u.call(null),
-      onFocus: () => l == null ? void 0 : l.call(null),
-      onBlur: () => e == null ? void 0 : e.call(null),
+      onClick: () => c?.call(null),
+      onFocus: () => r?.call(null),
+      onBlur: () => _?.call(null),
       children: [
-        /* @__PURE__ */ s("span", { className: t.ButtonText, children: i }),
-        m(o) && o ? /* @__PURE__ */ s("span", { className: t.ButtonInfo, dangerouslySetInnerHTML: { __html: o } }) : /* @__PURE__ */ s("span", { className: t.ButtonInfo, children: o })
+        /* @__PURE__ */ u("span", { className: t.ButtonText, children: s }),
+        p(o) && o ? /* @__PURE__ */ u("span", { className: t.ButtonInfo, dangerouslySetInnerHTML: { __html: o } }) : /* @__PURE__ */ u("span", { className: t.ButtonInfo, children: o })
       ]
     }
   );
 };
 export {
-  T as Button
+  L as Button
 };

package/dist/components/control/components/card-image/card-image.component.d.ts

@@ -1,2 +1,7 @@
-import { CardImageProps } from './card-image.types';
+import { Interactive, RadioChoice, ChoiceValue, State } from '../../types';
+export interface CardImageProps extends Interactive<ChoiceValue> {
+    sprite: string;
+    choices: RadioChoice[];
+    state?: State;
+}
 export declare const CardImage: (props: CardImageProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/control/components/card-image/card-image.component.js

@@ -1,7 +1,59 @@
-import "react/jsx-runtime";
-import { c as a } from "../../../../index-DtupH5zG.js";
-import "../../hooks/useChoice/useChoice.hook.js";
-import "../../utils/utils.js";
+import { jsx as a, jsxs as g } from "react/jsx-runtime";
+import { Box as f } from "../box/box.component.js";
+import { Choice as q } from "../choice/choice.component.js";
+import { HiddenInput as w } from "../hidden-input/hidden-input.component.js";
+import { RadioLabel as B } from "../radio-label/radio-label.component.js";
+import { RadioText as N } from "../radio-text/radio-text.component.js";
+import { useChoice as T } from "../../hooks/useChoice/useChoice.hook.js";
+import { getChoiceId as b } from "../../utils/utils.js";
+import '../../../../assets/card-image-DQ9c4G_r.css';const W = "_CardImage_dw1xq_1", j = "_CardImageContent_dw1xq_13", y = "_CardImageTop_dw1xq_27", R = "_CardImageWrap_dw1xq_32", $ = "_CardImageBottom_dw1xq_43", r = {
+  CardImage: W,
+  CardImageContent: j,
+  CardImageTop: y,
+  CardImageWrap: R,
+  CardImageBottom: $
+}, J = (l) => {
+  const { sprite: I, choices: p, state: c = "idle", id: d, value: t, disabled: n, onChange: _ } = l, { type: i, onChoiceChange: v } = T(t, d, _);
+  return /* @__PURE__ */ a("div", { className: r.CardImage, children: p.map((e, h, u) => {
+    const m = b(d, e.value, h);
+    return /* @__PURE__ */ a(B, { id: m, value: t, state: c, choice: e, choices: u, children: ({ focused: s, hovered: x, checked: o, state: C }) => /* @__PURE__ */ a(f, { state: C, checked: o, focused: s, children: /* @__PURE__ */ g("div", { className: r.CardImageContent, children: [
+      /* @__PURE__ */ a(
+        w,
+        {
+          type: i,
+          id: m,
+          name: d,
+          value: e.value,
+          checked: o,
+          disabled: n,
+          onChange: () => v(e.value)
+        }
+      ),
+      /* @__PURE__ */ a("div", { className: r.CardImageTop, children: /* @__PURE__ */ a(
+        "div",
+        {
+          "data-image": e.icon,
+          style: { backgroundImage: `url(${I})` },
+          className: r.CardImageWrap
+        }
+      ) }),
+      /* @__PURE__ */ g("div", { className: r.CardImageBottom, children: [
+        /* @__PURE__ */ a("div", { children: /* @__PURE__ */ a(
+          q,
+          {
+            type: i,
+            state: C,
+            checked: o,
+            focused: s,
+            hovered: x,
+            disabled: n
+          }
+        ) }),
+        /* @__PURE__ */ a(N, { size: "md", checked: o, children: e.label })
+      ] })
+    ] }) }) }, m);
+  }) });
+};
 export {
-  a as CardImage
+  J as CardImage
 };

package/dist/components/control/components/card-text/card-text.component.d.ts

@@ -1,2 +1,6 @@
-import { CardTextProps } from './card-text.types';
+import { Interactive, RadioChoice, ChoiceValue, State } from '../../types';
+export interface CardTextProps extends Interactive<ChoiceValue> {
+    choices: RadioChoice[];
+    state?: State;
+}
 export declare const CardText: (props: CardTextProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/control/components/card-text/card-text.component.js

@@ -1,7 +1,47 @@
-import "react/jsx-runtime";
-import { b as i } from "../../../../index-DtupH5zG.js";
-import "../../hooks/useChoice/useChoice.hook.js";
-import "../../utils/utils.js";
+import { jsx as e, jsxs as v } from "react/jsx-runtime";
+import { Box as b } from "../box/box.component.js";
+import { Choice as g } from "../choice/choice.component.js";
+import { HiddenInput as L } from "../hidden-input/hidden-input.component.js";
+import { RadioLabel as I } from "../radio-label/radio-label.component.js";
+import { RadioText as N } from "../radio-text/radio-text.component.js";
+import { useChoice as j } from "../../hooks/useChoice/useChoice.hook.js";
+import { getChoiceId as R } from "../../utils/utils.js";
+import '../../../../assets/card-text-fgHu9TyO.css';const y = "_CardText_1eht8_1", z = "_CardTextLabel_1eht8_9", B = "_CardTextChoice_1eht8_24", i = {
+  CardText: y,
+  CardTextLabel: z,
+  CardTextChoice: B
+}, J = (m) => {
+  const { choices: x, state: c = "idle", id: r, value: d, disabled: n = !1, onChange: h } = m, { type: l, onChoiceChange: T } = j(d, r, h);
+  return /* @__PURE__ */ e("div", { className: i.CardText, children: x.map((t, p, _) => {
+    const o = R(r, t.value, p);
+    return /* @__PURE__ */ e(I, { id: o, value: d, state: c, choice: t, choices: _, children: ({ focused: s, hovered: f, checked: a, state: C }) => /* @__PURE__ */ e(b, { state: C, checked: a, focused: s, children: /* @__PURE__ */ v("div", { className: i.CardTextLabel, children: [
+      /* @__PURE__ */ e(
+        L,
+        {
+          type: l,
+          id: o,
+          name: r,
+          value: t.value,
+          checked: a,
+          disabled: n,
+          onChange: (H, u) => T(t.value, u)
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: i.CardTextChoice, children: /* @__PURE__ */ e(
+        g,
+        {
+          type: l,
+          state: C,
+          checked: a,
+          focused: s,
+          hovered: f,
+          disabled: n
+        }
+      ) }),
+      /* @__PURE__ */ e(N, { size: "lg", checked: a, children: t.label })
+    ] }) }) }, o);
+  }) });
+};
 export {
-  i as CardText
+  J as CardText
 };

package/dist/components/control/components/checkbox/checkbox.component.d.ts

@@ -1,2 +1,6 @@
-import { CheckboxProps } from './checkbox.types';
+import { PropsWithChildren } from 'react';
+import { Interactive, State } from '../../types';
+export interface CheckboxProps extends PropsWithChildren, Interactive<boolean> {
+    state?: State;
+}
 export declare const Checkbox: (props: CheckboxProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/control/components/checkbox/checkbox.component.js

@@ -1,7 +1,51 @@
-import "react/jsx-runtime";
-import "usehooks-ts";
-import { C as i } from "../../../../index-DtupH5zG.js";
-import "../../../../utils/converter/converter.js";
+import { jsxs as v, jsx as c } from "react/jsx-runtime";
+import { useToggle as a } from "usehooks-ts";
+import { Choice as _ } from "../choice/choice.component.js";
+import { HiddenInput as B } from "../hidden-input/hidden-input.component.js";
+import { Converter as F } from "../../../../utils/converter/converter.js";
+import '../../../../assets/checkbox-C8mg6gvd.css';const I = "_Checkbox_1gskb_1", N = "_CheckboxChoice_1gskb_14", j = "_CheckboxContent_1gskb_20", s = {
+  Checkbox: I,
+  CheckboxChoice: N,
+  CheckboxContent: j
+}, D = (i) => {
+  const { children: u, state: k = "idle", id: o, value: n, disabled: e = !1, onChange: l, onFocus: b, onBlur: x } = i, [r, h] = a(!1), [d, C] = a(!1), m = (t) => {
+    e || r || (t.preventDefault(), l(!n, o));
+  }, p = (t) => {
+    e || (t.stopPropagation(), l(!n, o));
+  }, f = () => {
+    e || (h(), b?.call(null, o));
+  }, g = () => {
+    e || (h(), x?.call(null, o));
+  };
+  return /* @__PURE__ */ v(
+    "label",
+    {
+      htmlFor: o,
+      className: s.Checkbox,
+      onClick: m,
+      onFocus: f,
+      onBlur: g,
+      onMouseEnter: () => C(),
+      onMouseLeave: () => C(),
+      children: [
+        /* @__PURE__ */ c(
+          B,
+          {
+            type: "checkbox",
+            id: o,
+            name: o,
+            value: F.Boolean.ToBooleanString(n),
+            checked: n,
+            disabled: e,
+            onChange: p
+          }
+        ),
+        /* @__PURE__ */ c("div", { className: s.CheckboxChoice, children: /* @__PURE__ */ c(_, { type: "checkbox", state: k, checked: n, focused: r, hovered: d, disabled: e }) }),
+        /* @__PURE__ */ c("div", { className: s.CheckboxContent, children: u })
+      ]
+    }
+  );
+};
 export {
-  i as Checkbox
+  D as Checkbox
 };

package/dist/components/control/components/choice/choice.component.d.ts

@@ -1,2 +1,9 @@
-import { ChoiceProps } from './choice.types';
+export interface ChoiceProps {
+    type: 'radio' | 'checkbox';
+    checked: boolean;
+    state?: 'idle' | 'error' | 'success';
+    focused?: boolean;
+    hovered?: boolean;
+    disabled?: boolean;
+}
 export declare const Choice: (props: ChoiceProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/control/components/dropdown/dropdown.component.d.ts

@@ -1,2 +1,15 @@
-import { DropdownProps } from './dropdown.types';
+import { QuestionChoice } from '../../types';
+export interface DropdownProps {
+    choices: QuestionChoice[];
+    value: QuestionChoice[];
+    label?: string;
+    placeholder?: string;
+    noResult?: string;
+    isSearchHidden?: boolean;
+    multiple?: boolean;
+    closeButton?: string;
+    onChange: (values: QuestionChoice[]) => void;
+    onOpen?: (height: number, width: number) => void;
+    onClose?: () => void;
+}
 export declare const Dropdown: (props: DropdownProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/control/components/dropdown/dropdown.component.js

@@ -1,11 +1,97 @@
-import "react/jsx-runtime";
-import "react";
-import "usehooks-ts";
-import "lucide-react";
-import "clsx";
-import { D as e } from "../../../../index-DtupH5zG.js";
-import "../../utils/utils.js";
-import "../../../../utils/converter/converter.js";
+import { jsxs as r, jsx as n } from "react/jsx-runtime";
+import { useRef as u, useState as C, useEffect as N, useMemo as K } from "react";
+import { useBoolean as M, useResizeObserver as T, useOnClickOutside as E } from "usehooks-ts";
+import { ChevronDown as $, Search as q } from "lucide-react";
+import R from "clsx";
+import { Box as k } from "../box/box.component.js";
+import { Button as J } from "../button/button.component.js";
+import { Choice as P } from "../choice/choice.component.js";
+import { Label as Q } from "../label/label.component.js";
+import { RadioText as v } from "../radio-text/radio-text.component.js";
+import { clickHasNode as U } from "../../utils/utils.js";
+import { Converter as X } from "../../../../utils/converter/converter.js";
+import '../../../../assets/dropdown-Ba3Wegqm.css';const Y = "_Dropdown_cmvnx_1", Z = "_DropdownBorder_cmvnx_17", oo = "_DropdownContent_cmvnx_28", eo = "_DropdownChevron_cmvnx_39", no = "_DropdownChevronWrap_cmvnx_53", ro = "_DropdownBox_cmvnx_69", co = "_DropdownBoxVisible_cmvnx_75", so = "_DropdownBoxHidden_cmvnx_79", io = "_DropdownSearch_cmvnx_83", lo = "_DropdownSearchVisible_cmvnx_89", to = "_DropdownSearchHidden_cmvnx_93", po = "_DropdownClose_cmvnx_97", ao = "_DropdownInput_cmvnx_106", ho = "_DropdownGlass_cmvnx_120", wo = "_DropdownChoices_cmvnx_131", Do = "_DropdownChoice_cmvnx_131", mo = "_DropdownChoiceNoResult_cmvnx_154", e = {
+  Dropdown: Y,
+  DropdownBorder: Z,
+  DropdownContent: oo,
+  DropdownChevron: eo,
+  DropdownChevronWrap: no,
+  DropdownBox: ro,
+  DropdownBoxVisible: co,
+  DropdownBoxHidden: so,
+  DropdownSearch: io,
+  DropdownSearchVisible: lo,
+  DropdownSearchHidden: to,
+  DropdownClose: po,
+  DropdownInput: ao,
+  DropdownGlass: ho,
+  DropdownChoices: wo,
+  DropdownChoice: Do,
+  DropdownChoiceNoResult: mo
+}, ko = (c) => {
+  const { choices: x = [], value: a = [], isSearchHidden: H = !1, multiple: l = !1, onChange: h, onOpen: z, onClose: V } = c, y = c.label || "", I = c.placeholder || "Wählen Sie Ihre private Krankenversicherung...", O = c.noResult || "Keine Versicherung gefunden.", W = c.closeButton || "Schließen", f = u(null), w = u(null), B = u(null), { value: t, setFalse: D, toggle: A } = M(!1), [m, G] = C(""), [s, L] = C({ width: 0, height: 0 }), [p, S] = C([]);
+  T({
+    ref: w,
+    onResize: (o) => L({ width: o.width || 0, height: o.height || 0 })
+  }), E(w, (o) => {
+    U(o, f) || (l && h(p), D());
+  }), N(() => S(Array.isArray(a) ? a : []), [a]), N(() => {
+    t && s.width && s.height ? (B.current?.focus(), z?.call(null, s.height, s.width)) : V?.call(null);
+  }, [t, s]);
+  const j = (o, d) => {
+    S((i) => i.some(({ value: _ }) => _ === o) ? i.filter(({ value: _ }) => _ !== o) : [...i, { value: o, label: d }]);
+  }, F = () => {
+    D(), h(p);
+  }, b = K(
+    () => x.filter(({ label: o }) => o.toLowerCase().includes(m.toLowerCase())),
+    [m, x]
+  );
+  return /* @__PURE__ */ r("div", { className: e.Dropdown, children: [
+    /* @__PURE__ */ n(k, { ref: f, onClick: A, children: /* @__PURE__ */ r("div", { className: e.DropdownBorder, children: [
+      /* @__PURE__ */ r("div", { className: e.DropdownContent, children: [
+        /* @__PURE__ */ n(Q, { position: "active", children: y }),
+        /* @__PURE__ */ n(v, { size: "lg", checked: !0, oneLine: !0, children: X.Answer.FromArrayToMultiple(p.map(({ label: o }) => o)) || I })
+      ] }),
+      /* @__PURE__ */ n("div", { className: e.DropdownChevronWrap, children: /* @__PURE__ */ n($, { "data-open": t, className: e.DropdownChevron }) })
+    ] }) }),
+    /* @__PURE__ */ n(k, { ref: w, className: t ? e.DropdownBoxVisible : e.DropdownBoxHidden, children: /* @__PURE__ */ r("div", { className: e.DropdownBox, children: [
+      /* @__PURE__ */ r("div", { className: R(e.DropdownSearch, H ? e.DropdownSearchHidden : e.DropdownSearchVisible), children: [
+        /* @__PURE__ */ n(
+          "input",
+          {
+            ref: B,
+            value: m,
+            type: "text",
+            className: e.DropdownInput,
+            onChange: (o) => G(o.target.value)
+          }
+        ),
+        /* @__PURE__ */ n(q, { className: e.DropdownGlass })
+      ] }),
+      /* @__PURE__ */ n("ul", { className: e.DropdownChoices, children: b.length ? b.map(({ value: o, label: d }, i) => /* @__PURE__ */ r(
+        "li",
+        {
+          className: e.DropdownChoice,
+          onClick: () => {
+            l ? j(o, d) : (D(), h([{ value: o, label: d }]));
+          },
+          children: [
+            l && /* @__PURE__ */ n(
+              P,
+              {
+                type: "checkbox",
+                checked: p.some((g) => g.value === o)
+              }
+            ),
+            /* @__PURE__ */ n(v, { size: "lg", checked: !1, children: d })
+          ]
+        },
+        o + i
+      )) : /* @__PURE__ */ n("li", { className: R(e.DropdownChoice, e.DropdownChoiceNoResult), children: /* @__PURE__ */ n(v, { size: "lg", checked: !1, children: O }) }) }),
+      l && /* @__PURE__ */ n("div", { className: e.DropdownClose, children: /* @__PURE__ */ n(J, { color: "next", size: "sm", type: "button", onClick: () => F(), children: W }) })
+    ] }) })
+  ] });
+};
 export {
-  e as Dropdown
+  ko as Dropdown
 };

package/dist/components/control/components/hidden-input/hidden-input.component.d.ts

@@ -1,2 +1,12 @@
-import { HiddenInputProps } from './hidden-input.types';
+import { ChangeEvent } from 'react';
+import { InputChangeSource } from '../../types';
+export interface HiddenInputProps {
+    id: string;
+    value: string;
+    name: string;
+    type: 'radio' | 'checkbox';
+    checked: boolean;
+    disabled?: boolean;
+    onChange: (e: ChangeEvent<HTMLInputElement>, source?: InputChangeSource) => void;
+}
 export declare const HiddenInput: (props: HiddenInputProps) => import("react/jsx-runtime").JSX.Element;