@cupra/ui-react 1.0.0-canary.2 → 1.0.0-canary.20

package/dist/components/MapPin/MapPin.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-map-pin';
 import { type DsMapPinAttrs } from '@cupra/ui-kit/react/types/ds-map-pin';
 type MapPinProps = DsMapPinAttrs & {
     onChange?: (event: CustomEvent) => void;

package/dist/components/MapPin/MapPin.js

@@ -1,11 +1,12 @@
-import { jsx as o } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
-import { useHandleEvent as e } from "../../hooks/useHandleEvent.js";
-import "../../packages/ui-kit/dist-react/index.js";
-function c({ onChange: r, ...t }) {
-  const { ref: n } = e({ change: r });
-  return /* @__PURE__ */ o("ds-map-pin-react", { ref: n, ...t });
+import { useHandleEvent as p } from "../../hooks/useHandleEvent.js";
+import "@cupra/ui-kit/react/ds-map-pin";
+function f({ onChange: r, ...t }) {
+  const { ref: o } = p({ change: r });
+  return /* @__PURE__ */ n("ds-map-pin-react", { ref: o, ...t });
 }
 export {
-  c as MapPin
+  f as MapPin
 };

package/dist/components/Modal/Modal.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-modal';
 import { DsModalAttrs } from '@cupra/ui-kit/react/types/ds-modal';
 type Children = JSX.Element | JSX.Element[] | string;
 interface ModalProps extends DsModalAttrs {

package/dist/components/Modal/Modal.js

@@ -1,8 +1,9 @@
 import { jsx as n } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
 import { useHandleEvent as f } from "../../hooks/useHandleEvent.js";
 import p from "../../node_modules/.pnpm/styled-components@6.1.19_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/styled-components/dist/styled-components.browser.esm.js";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-modal";
 function e() {
 }
 const C = p.div`

package/dist/components/PasswordInput/PasswordInput.d.ts

@@ -1,6 +1,6 @@
 import { DsPasswordInputAttrs } from '@cupra/ui-kit/react/types/ds-password-input';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-password-input';
 type PasswordInputProps = DsPasswordInputAttrs & {
     className?: string;
     onChange?: (event: typeof InputEvent) => void;

package/dist/components/PasswordInput/PasswordInput.js

@@ -1,42 +1,40 @@
-import { jsxs as g, jsx as r } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import { jsxs as x, jsx as i } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-password-input";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
-import { useHandleEvent as x } from "../../hooks/useHandleEvent.js";
-function H(n) {
+import { useHandleEvent as b } from "../../hooks/useHandleEvent.js";
+function L(l) {
   const {
-    className: t,
-    children: b,
-    onChange: o,
-    onInput: s,
+    className: d,
+    children: w,
+    onChange: c,
+    onInput: u,
     inputId: e,
-    placeHolder: a,
-    value: p,
-    label: l,
-    required: i,
-    disabled: d,
-    pattern: c,
-    maxLength: u,
-    minLength: h,
-    ...m
-  } = n, { ref: f } = x({ change: o, input: s });
-  return /* @__PURE__ */ g("ds-password-input-react", { ref: f, class: t, ...m, children: [
-    /* @__PURE__ */ r("label", { htmlFor: e, children: l }),
-    /* @__PURE__ */ r(
-      "input",
-      {
-        id: e,
-        type: "password",
-        placeholder: a,
-        value: p,
-        required: i,
-        disabled: d,
-        minLength: h,
-        maxLength: u,
-        pattern: c
-      }
-    )
+    placeHolder: r,
+    value: t,
+    label: m,
+    required: n,
+    disabled: o,
+    pattern: p,
+    maxLength: s,
+    minLength: a,
+    ...h
+  } = l, { ref: f } = b({ change: c, input: u }), g = {
+    type: "password",
+    ...!!e && { id: e },
+    ...!!r && { placeholder: r },
+    ...!!t && { value: t },
+    ...!!n && { required: n },
+    ...!!o && { disabled: o },
+    ...!!a && { minLength: a },
+    ...!!s && { maxLength: s },
+    ...!!p && { pattern: p }
+  };
+  return /* @__PURE__ */ x("ds-password-input-react", { ref: f, class: d, ...h, children: [
+    /* @__PURE__ */ i("label", { htmlFor: e, children: m }),
+    /* @__PURE__ */ i("input", { ...g })
   ] });
 }
 export {
-  H as PasswordInput
+  L as PasswordInput
 };

package/dist/components/PickerItem/PickerItem.d.ts

@@ -1,5 +1,5 @@
 import type { ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-picker-item';
 import type { DsPickerItemAttrs } from '@cupra/ui-kit/react/types/ds-picker-item';
 type PickerItemProps = DsPickerItemAttrs & {
     className?: string;

package/dist/components/PickerItem/PickerItem.js

@@ -1,5 +1,5 @@
 import { jsx as n } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-picker-item";
 import { useHandleEvent as m } from "../../hooks/useHandleEvent.js";
 function a(r) {
   const { className: i, children: t, onClick: s, size: e, ...c } = r, { ref: o } = m({

package/dist/components/Radio/Radio.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-radio';
 import { DsRadioAttrs } from '@cupra/ui-kit/react/types/ds-radio';
 import { DsRadioGroupAttrs } from '@cupra/ui-kit/react/types/ds-radio-group';
 type Children = JSX.Element | JSX.Element[] | string;

package/dist/components/Radio/Radio.js

@@ -1,14 +1,15 @@
 import { jsx as s } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
 import { useHandleEvent as e } from "../../hooks/useHandleEvent.js";
-import "../../packages/ui-kit/dist-react/index.js";
-const c = ({ children: o, onChange: r, className: t, ...a }) => {
+import "@cupra/ui-kit/react/ds-radio";
+const i = ({ children: o, onChange: r, className: t, ...a }) => {
   const { ref: n } = e({ change: r });
   return /* @__PURE__ */ s("ds-radio-group-react", { ref: n, class: t, ...a, children: o });
-}, i = ({ children: o, className: r, ...t }) => /* @__PURE__ */ s("ds-radio-react", { class: r, ...t, children: o }), f = {
-  Group: c,
-  Button: i
+}, c = ({ children: o, className: r, ...t }) => /* @__PURE__ */ s("ds-radio-react", { class: r, ...t, children: o }), l = {
+  Group: i,
+  Button: c
 };
 export {
-  f as Radio
+  l as Radio
 };

package/dist/components/RadioButton/RadioButton.d.ts

@@ -1,6 +1,6 @@
 import type { DsRadioButtonAttrs } from '@cupra/ui-kit/react/types/ds-radio-button';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-radio-button';
 type RadioButtonProps = DsRadioButtonAttrs & {
     onChange?: (event: CustomEvent) => void;
     className?: string;

package/dist/components/RadioButton/RadioButton.js

@@ -1,5 +1,5 @@
 import { jsx as a } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-radio-button";
 import { useHandleEvent as c } from "../../hooks/useHandleEvent.js";
 function p(o) {
   const { className: t, children: r, onChange: n, ...e } = o, { ref: s } = c({ change: n });

package/dist/components/RadioButtonGroup/RadioButtonGroup.d.ts

@@ -1,6 +1,6 @@
 import type { DsRadioButtonGroupAttrs } from '@cupra/ui-kit/react/types/ds-radio-button-group';
 import { type ReactElement, type ReactNode } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-radio-button-group';
 export type RadioButtonGroupProps = DsRadioButtonGroupAttrs & {
     onChange?: (event: CustomEvent) => void;
     className?: string;

package/dist/components/RadioButtonGroup/RadioButtonGroup.js

@@ -1,5 +1,5 @@
 import { jsx as a } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-radio-button-group";
 import { useHandleEvent as c } from "../../hooks/useHandleEvent.js";
 function m(o) {
   const { className: r, children: t, onChange: n, ...e } = o, { ref: s } = c({ change: n });

package/dist/components/Search/Search.d.ts

@@ -1,6 +1,6 @@
 import { DsSearchAttrs } from '@cupra/ui-kit/react/types/ds-search';
 import { type ChangeEvent } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-search';
 type SearchProps = DsSearchAttrs & {
     className?: string;
     onInput?: (event: ChangeEvent<HTMLInputElement>) => void;

package/dist/components/Search/Search.js

@@ -1,6 +1,6 @@
 import { jsx as s } from "react/jsx-runtime";
 import { forwardRef as t } from "react";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-search";
 const c = t(({ onInput: r, className: a, ...e }, o) => /* @__PURE__ */ s("ds-search-react", { ref: o, class: a, onInput: r, ...e }));
 c.displayName = "Search";
 export {

package/dist/components/SearchInput/SearchInput.d.ts

@@ -1,6 +1,6 @@
 import { DsSearchInputAttrs } from '@cupra/ui-kit/react/types/ds-search-input';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-search-input';
 type SearchInputProps = DsSearchInputAttrs & {
     className?: string;
     onChange?: (event: typeof InputEvent) => void;

package/dist/components/SearchInput/SearchInput.js

@@ -1,17 +1,18 @@
 import { jsx as t } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-search-input";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
 import { useHandleEvent as g } from "../../hooks/useHandleEvent.js";
-function H(e) {
+function I(e) {
   const {
     className: n,
     children: x,
     onChange: r,
     onInput: o,
     onClickPositionButton: i,
-    placeHolder: a,
+    placeHolder: p,
     type: P,
-    value: p,
+    value: a,
     label: c,
     required: l,
     disabled: s,
@@ -30,8 +31,8 @@ function H(e) {
     {
       type: "text",
       "aria-label": c,
-      placeholder: a,
-      value: p,
+      placeholder: p,
+      value: a,
       required: l,
       disabled: s,
       minLength: d,
@@ -42,5 +43,5 @@ function H(e) {
   ) });
 }
 export {
-  H as SearchInput
+  I as SearchInput
 };

package/dist/components/SecondaryNavigation/SecondaryNavigation.d.ts

@@ -1,6 +1,6 @@
 import { DsSecondaryNavigationAttrs } from '@cupra/ui-kit/react/types/ds-secondary-navigation';
 import { type ReactElement, type ReactNode } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-secondary-navigation';
 type SecondaryNavigationProps = DsSecondaryNavigationAttrs & {
     className?: string;
     children?: ReactNode;

package/dist/components/SecondaryNavigation/SecondaryNavigation.js

@@ -1,5 +1,6 @@
 import { jsx as o } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-secondary-navigation";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
 import { useHandleEvent as a } from "../../hooks/useHandleEvent.js";
 function n(t) {

package/dist/components/SegmentedControl/SegmentedControl.d.ts

@@ -1,6 +1,6 @@
 import { DsSegmentedControlAttrs } from '@cupra/ui-kit/react/types/ds-segmented-control';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-segmented-control';
 type SegmentedControlProps = DsSegmentedControlAttrs & {
     onChange?: (event: CustomEvent) => void;
     className?: string;

package/dist/components/SegmentedControl/SegmentedControl.js

@@ -1,11 +1,12 @@
-import { jsx as c } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import { jsx as m } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-segmented-control";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
-import { useHandleEvent as m } from "../../hooks/useHandleEvent.js";
-function d(e) {
-  const { onChange: o, className: r, children: t, ...n } = e, { ref: s } = m({ change: o });
-  return /* @__PURE__ */ c("ds-segmented-control-react", { ref: s, class: r, ...n, children: t });
+import { useHandleEvent as c } from "../../hooks/useHandleEvent.js";
+function f(e) {
+  const { onChange: o, className: r, children: t, ...n } = e, { ref: s } = c({ change: o });
+  return /* @__PURE__ */ m("ds-segmented-control-react", { ref: s, class: r, ...n, children: t });
 }
 export {
-  d as SegmentedControl
+  f as SegmentedControl
 };

package/dist/components/Select/Select.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-select';
 import { DsSelectAttrs } from '@cupra/ui-kit/react/types/ds-select';
 type Children = JSX.Element | JSX.Element[] | string;
 interface SelectProps extends DsSelectAttrs {

package/dist/components/Select/Select.js

@@ -1,5 +1,5 @@
 import { jsx as r } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-select";
 const s = ({ children: t, ...e }) => /* @__PURE__ */ r("ds-select-react", { ...e, children: t });
 export {
   s as Select

package/dist/components/Selection/Selection.d.ts

@@ -1,6 +1,6 @@
 import { DsSelectionAttrs } from '@cupra/ui-kit/react/types/ds-selection';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-selection';
 type SelectionProps = DsSelectionAttrs & {
     className?: string;
 };

package/dist/components/Selection/Selection.js

@@ -1,5 +1,5 @@
 import { jsx as t } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-selection";
 function i(e) {
   const { className: o, children: s, ...r } = e;
   return /* @__PURE__ */ t("ds-selection-react", { class: o, ...r });

package/dist/components/SidebarNavigation/SidebarNavigation.d.ts

@@ -1,5 +1,5 @@
 import { DsSidebarNavigationAttrs } from '@cupra/ui-kit/react/types/ds-sidebar-navigation';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-sidebar-navigation';
 import { type ReactElement, type ReactNode } from 'react';
 export type SidebarNavigationProps = DsSidebarNavigationAttrs & {
     className?: string;

package/dist/components/SidebarNavigation/SidebarNavigation.js

@@ -1,5 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-sidebar-navigation";
 function s(t) {
   const { className: i, children: r, ...n } = t;
   return /* @__PURE__ */ e("ds-sidebar-navigation-react", { class: i, ...n, children: r });

package/dist/components/Slider/Slider.d.ts

@@ -1,6 +1,6 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
-import { DsSliderAttrs } from '@cupra/ui-kit/components/ds-slider/ds-slider.types';
+import '@cupra/ui-kit/react/ds-slider';
+import { DsSliderAttrs } from '@cupra/ui-kit/react/types/ds-slider';
 type SliderProps = DsSliderAttrs & {
     className?: string;
 };

package/dist/components/Slider/Slider.js

@@ -1,5 +1,5 @@
 import { jsx as t } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-slider";
 function l(s) {
   const { className: e, children: o, size: r, ...i } = s;
   return /* @__PURE__ */ t(

package/dist/components/StaticBox/StaticBox.d.ts

@@ -1,5 +1,5 @@
 import type { ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-static-box';
 import type { DsStaticBoxAttrs } from '@cupra/ui-kit/react/types/ds-static-box';
 type StaticBoxProps = DsStaticBoxAttrs & {
     className?: string;

package/dist/components/StaticBox/StaticBox.js

@@ -1,20 +1,21 @@
 import { jsx as n } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
 import { useHandleEvent as c } from "../../hooks/useHandleEvent.js";
-import "../../packages/ui-kit/dist-react/index.js";
-function l(r) {
-  const { className: o, children: s, size: t, ...e } = r, { ref: i } = c({});
+import "@cupra/ui-kit/react/ds-static-box";
+function x(r) {
+  const { className: o, children: s, size: t, ...i } = r, { ref: e } = c({});
   return /* @__PURE__ */ n(
     "ds-static-box-react",
     {
-      ref: i,
+      ref: e,
       size: typeof t == "string" ? t : JSON.stringify(t),
       class: o,
-      ...e,
+      ...i,
       children: s
     }
   );
 }
 export {
-  l as StaticBox
+  x as StaticBox
 };

package/dist/components/Stepper/Stepper.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-stepper';
 import type { DsStepperAttrs } from '@cupra/ui-kit/react/types/ds-stepper';
 type StepperProps = DsStepperAttrs & {
     className?: string;

package/dist/components/Stepper/Stepper.js

@@ -1,5 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-stepper";
 const o = ({ className: r, ...t }) => /* @__PURE__ */ e("ds-stepper-react", { class: r, ...t });
 export {
   o as Stepper

package/dist/components/Tabs/Tabs.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-tabs';
 import { DsTabsAttrs } from '@cupra/ui-kit/react/types/ds-tabs';
 type Children = JSX.Element | JSX.Element[] | string;
 interface CustomParams {

package/dist/components/Tabs/Tabs.js

@@ -1,19 +1,20 @@
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as r } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
 import { useHandleEvent as i } from "../../hooks/useHandleEvent.js";
-import "../../packages/ui-kit/dist-react/index.js";
-function r({ children: t, onChange: e, ...o }) {
+import "@cupra/ui-kit/react/ds-tabs";
+function n({ children: t, onChange: e, ...o }) {
   const { ref: a } = i({ change: e });
-  return /* @__PURE__ */ n("ds-tabs-react", { ref: a, ...o, children: t });
+  return /* @__PURE__ */ r("ds-tabs-react", { ref: a, ...o, children: t });
 }
 function l({ children: t }) {
-  return /* @__PURE__ */ n("div", { role: "tab", slot: "tab", children: t });
+  return /* @__PURE__ */ r("div", { role: "tab", slot: "tab", children: t });
 }
-function s({ children: t }) {
-  return /* @__PURE__ */ n("div", { role: "tabpanel", slot: "panel", children: t });
+function p({ children: t }) {
+  return /* @__PURE__ */ r("div", { role: "tabpanel", slot: "panel", children: t });
 }
-r.Tab = l;
-r.Panel = s;
+n.Tab = l;
+n.Panel = p;
 export {
-  r as Tabs
+  n as Tabs
 };

package/dist/components/Tag/Tag.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-tag';
 import { DsTagAttrs } from '@cupra/ui-kit/react/types/ds-tag';
 type Children = JSX.Element | JSX.Element[] | string;
 interface TabsProps extends DsTagAttrs {

package/dist/components/Tag/Tag.js

@@ -1,11 +1,12 @@
-import { jsx as s } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
-import { useHandleEvent as i } from "../../hooks/useHandleEvent.js";
-import "../../packages/ui-kit/dist-react/index.js";
-function f(o) {
-  const { children: r, onClickIcon: t, className: c, ...n } = o, { ref: e } = i({ clickicon: t });
-  return /* @__PURE__ */ s("ds-tag-react", { ref: e, class: c, ...n, children: r });
+import { useHandleEvent as s } from "../../hooks/useHandleEvent.js";
+import "@cupra/ui-kit/react/ds-tag";
+function d(o) {
+  const { children: r, onClickIcon: t, className: c, ...n } = o, { ref: e } = s({ clickicon: t });
+  return /* @__PURE__ */ i("ds-tag-react", { ref: e, class: c, ...n, children: r });
 }
 export {
-  f as Tag
+  d as Tag
 };

package/dist/components/Text/Text.d.ts

@@ -1,6 +1,6 @@
 import { DsTextAttrs } from '@cupra/ui-kit/react/types/ds-text';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-text';
 type TextProps = DsTextAttrs & {
     className?: string;
     children: JSX.Element | JSX.Element[] | string;

package/dist/components/Text/Text.js

@@ -1,5 +1,5 @@
 import { jsx as s } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-text";
 function a(t) {
   const { className: r, children: e, ...o } = t;
   return /* @__PURE__ */ s("ds-text-react", { class: r, ...o, children: e });

package/dist/components/TextInput/TextInput.d.ts

@@ -1,6 +1,6 @@
 import { DsTextInputAttrs } from '@cupra/ui-kit/react/types/ds-text-input';
 import { ChangeEvent, FormEvent, KeyboardEvent, type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-text-input';
 type TextInputProps = DsTextInputAttrs & {
     type?: 'text' | 'email' | 'number' | 'url' | 'tel';
     className?: string;

package/dist/components/TextInput/TextInput.js

@@ -1,26 +1,27 @@
 import { jsxs as y, jsx as t } from "react/jsx-runtime";
-import "../../packages/ui-kit/dist-react/index.js";
+import "@cupra/ui-kit/react/ds-text-input";
+import "@cupra/ui-kit/react/utils/breakpoints";
 import "react";
 import { useHandleEvent as b } from "../../hooks/useHandleEvent.js";
-function L(n) {
+function k(n) {
   const {
     className: r,
     children: I,
     onChange: o,
-    onInput: l,
-    onKeyDown: p,
+    onInput: p,
+    onKeyDown: i,
     inputId: e,
-    placeHolder: i,
+    placeHolder: l,
     type: a,
     value: d,
     label: s,
     required: c,
-    disabled: u,
-    pattern: h,
-    maxLength: m,
+    disabled: m,
+    pattern: u,
+    maxLength: h,
     minLength: x,
     ...f
-  } = n, { ref: g } = b({ change: o, input: l, keydown: p });
+  } = n, { ref: g } = b({ change: o, input: p, keydown: i });
   return /* @__PURE__ */ y("ds-text-input-react", { ref: g, class: r, ...f, children: [
     /* @__PURE__ */ t("label", { htmlFor: e, children: s }),
     /* @__PURE__ */ t(
@@ -28,17 +29,17 @@ function L(n) {
       {
         id: e,
         type: a || "text",
-        placeholder: i,
+        placeholder: l,
         value: d,
         required: c,
-        disabled: u,
+        disabled: m,
         minLength: x,
-        maxLength: m,
-        pattern: h
+        maxLength: h,
+        pattern: u
       }
     )
   ] });
 }
 export {
-  L as TextInput
+  k as TextInput
 };

package/dist/components/Textarea/Textarea.d.ts

@@ -1,6 +1,6 @@
 import { DsTextareaAttrs } from '@cupra/ui-kit/react/types/ds-textarea';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-textarea';
 type TextareaProps = DsTextareaAttrs & {
     className?: string;
     onChange?: (event: typeof InputEvent) => void;