@cupra/ui-react 1.0.0-canary.15 → 1.0.0-canary.17

package/README.md

@@ -116,7 +116,10 @@ npm install @cupra/ui-react@0.1.4-canary.2
 
 ## Usage
 
-Wrap your React app with the `ThemeProvider`.  
+Import components via subpaths. Do not import from the package index:
+- @cupra/ui-react → React wrappers built on top of the Web Components (e.g. `import { Button } from '@cupra/ui-react/Button'`)
+
+Wrap your React app with `ThemeProvider`.  
 The provider requires **three props**:
 
 | Prop       | Type    | Required | Description                                   |
@@ -130,7 +133,9 @@ If `loadFonts` or `loadStyles` are `false`, you must manually include `<link>` t
 ### Option A — Manual CSS and font links
 
 ```tsx
-import { ThemeProvider, Button, Icon } from '@cupra/ui-react';
+import { ThemeProvider } from '@cupra/ui-react/ThemeProvider';
+import { Button } from '@cupra/ui-react/Button';
+import { Icon } from '@cupra/ui-react/Icon';
 
 export function App() {
     return (
@@ -149,7 +154,8 @@ export function App() {
 ### Option B — Provider loads assets automatically
 
 ```tsx
-import { ThemeProvider, Button } from '@cupra/ui-react';
+import { ThemeProvider } from '@cupra/ui-react/ThemeProvider';
+import { Button } from '@cupra/ui-react/Button';
 
 export function App() {
     return (

package/dist/components/Accordion/Accordion.d.ts

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

package/dist/components/Accordion/Accordion.js

@@ -0,0 +1,8 @@
+import { jsx as o } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-accordion";
+const n = ({ children: t, ...r }) => /* @__PURE__ */ o("ds-accordion-react", { ...r, children: t }), e = ({ children: t }) => /* @__PURE__ */ o("div", { slot: "title", children: t }), c = ({ children: t }) => /* @__PURE__ */ o("div", { slot: "content", children: t });
+n.Title = e;
+n.Content = c;
+export {
+  n as Accordion
+};

package/dist/components/Avatar/Avatar.d.ts

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

package/dist/components/Avatar/Avatar.js

@@ -0,0 +1,12 @@
+import { jsx as m } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import { isValidElement as n, cloneElement as s } from "react";
+import { useHandleEvent as c } from "../../hooks/useHandleEvent.js";
+import "@cupra/ui-kit/react/ds-avatar";
+function E(t) {
+  const { className: r, onClick: e, image: o, ...a } = t, { ref: i } = c({ click: e }), l = o && n(o) ? s(o, { slot: "media", ...o.props }) : null;
+  return /* @__PURE__ */ m("ds-avatar-react", { ref: i, class: r, ...a, children: l });
+}
+export {
+  E as Avatar
+};

package/dist/components/Bullets/Bullets.d.ts

@@ -1,5 +1,5 @@
 import { DsBulletsAttrs } from '@cupra/ui-kit/react/types/ds-bullets';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-bullets';
 import { type ReactElement } from 'react';
 export interface BulletsProps extends DsBulletsAttrs {
     className?: string;

package/dist/components/Bullets/Bullets.js

@@ -0,0 +1,6 @@
+import { jsx as s } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-bullets";
+const o = ({ className: t, ...r }) => /* @__PURE__ */ s("ds-bullets-react", { class: t, ...r });
+export {
+  o as Bullets
+};

package/dist/components/Button/Button.d.ts

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

package/dist/components/Button/Button.js

@@ -0,0 +1,21 @@
+import { jsx as c } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as m } from "../../hooks/useHandleEvent.js";
+import "@cupra/ui-kit/react/ds-button";
+function d(o) {
+  const { className: r, children: i, onClick: s, size: t, ...e } = o, { ref: n } = m({ click: s });
+  return /* @__PURE__ */ c(
+    "ds-button-react",
+    {
+      ref: n,
+      size: typeof t == "string" ? t : JSON.stringify(t),
+      class: r,
+      ...e,
+      children: i
+    }
+  );
+}
+export {
+  d as Button
+};

package/dist/components/CarouselIndicator/CarouselIndicator.d.ts

@@ -1,6 +1,6 @@
 import { DsCarouselIndicatorAttrs } from '@cupra/ui-kit/react/types/ds-carousel-indicator';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-carousel-indicator';
 type CarouselIndicatorProps = DsCarouselIndicatorAttrs & {
     className?: string;
 };

package/dist/components/CarouselIndicator/CarouselIndicator.js

@@ -0,0 +1,9 @@
+import { jsx as t } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-carousel-indicator";
+function i(r) {
+  const { className: o, children: c, ...s } = r;
+  return /* @__PURE__ */ t("ds-carousel-indicator-react", { class: o, ...s });
+}
+export {
+  i as CarouselIndicator
+};

package/dist/components/Checkbox/Checkbox.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-checkbox';
 import { DsCheckboxAttrs } from '@cupra/ui-kit/react/types/ds-checkbox';
 interface CheckboxProps extends DsCheckboxAttrs {
     onChange?: (event: CustomEvent) => void;

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,12 @@
+import { jsx as c } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as m } from "../../hooks/useHandleEvent.js";
+import "@cupra/ui-kit/react/ds-checkbox";
+function x({ onChange: o, children: r, ...t }) {
+  const { ref: e } = m({ change: o });
+  return /* @__PURE__ */ c("ds-checkbox-react", { ref: e, ...t, children: r });
+}
+export {
+  x as Checkbox
+};

package/dist/components/Chip/Chip.d.ts

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

package/dist/components/Chip/Chip.js

@@ -0,0 +1,9 @@
+import { jsx as c } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-chip";
+function p(r) {
+  const { className: o, children: s, ...t } = r;
+  return /* @__PURE__ */ c("ds-chip-react", { class: o, ...t, children: s });
+}
+export {
+  p as Chip
+};

package/dist/components/Chips/Chips.d.ts

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

package/dist/components/Chips/Chips.js

@@ -0,0 +1,14 @@
+import { jsx as c } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-chips";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as i } from "../../hooks/useHandleEvent.js";
+function f(r) {
+  const { className: o, children: s, onChange: t, ...e } = r, { ref: n } = i({
+    "ds-chips:change": t
+  });
+  return /* @__PURE__ */ c("ds-chips-react", { ref: n, class: o, ...e, children: s });
+}
+export {
+  f as Chips
+};

package/dist/components/Currency/Currency.d.ts

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

package/dist/components/Currency/Currency.js

@@ -0,0 +1,9 @@
+import { jsx as s } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-currency";
+function n(r) {
+  const { className: c, ...o } = r;
+  return /* @__PURE__ */ s("ds-currency-react", { class: c, ...o });
+}
+export {
+  n as Currency
+};

package/dist/components/Dialog/Dialog.d.ts

@@ -1,6 +1,6 @@
 import { DsDialogAttrs } from '@cupra/ui-kit/react/types/ds-dialog';
 import { type ReactNode } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-dialog';
 type DialogProps = DsDialogAttrs & {
     className?: string;
     withPortal?: boolean;

package/dist/components/Dialog/Dialog.js

@@ -0,0 +1,16 @@
+import { jsx as t } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-dialog";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as c } from "../../hooks/useHandleEvent.js";
+function g(e) {
+  const { className: n, children: l, onClose: s, withPortal: i, ...o } = e, { ref: a } = c({
+    "ds-dialog:close": s
+  });
+  if (!o.open) return null;
+  const r = /* @__PURE__ */ t("ds-dialog-react", { ref: a, class: n, ...o, children: l });
+  return i ? /* @__PURE__ */ t("ds-portal-react", { style: { display: "none" }, children: r }) : r;
+}
+export {
+  g as Dialog
+};

package/dist/components/DialogBody/DialogBody.d.ts

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

package/dist/components/DialogBody/DialogBody.js

@@ -0,0 +1,9 @@
+import { jsx as a } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-dialog-body";
+function i(o) {
+  const { className: r, children: s, ...t } = o;
+  return /* @__PURE__ */ a("ds-dialog-body-react", { class: r, ...t, children: s });
+}
+export {
+  i as DialogBody
+};

package/dist/components/DialogFooter/DialogFooter.d.ts

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

package/dist/components/DialogFooter/DialogFooter.js

@@ -0,0 +1,9 @@
+import { jsx as s } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-dialog-footer";
+function i(o) {
+  const { className: r, children: t, ...e } = o;
+  return /* @__PURE__ */ s("ds-dialog-footer-react", { class: r, ...e, children: t });
+}
+export {
+  i as DialogFooter
+};

package/dist/components/DialogHeader/DialogHeader.d.ts

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

package/dist/components/DialogHeader/DialogHeader.js

@@ -0,0 +1,9 @@
+import { jsx as s } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-dialog-header";
+function i(r) {
+  const { className: e, children: o, ...a } = r;
+  return /* @__PURE__ */ s("ds-dialog-header-react", { class: e, ...a, children: o });
+}
+export {
+  i as DialogHeader
+};

package/dist/components/Divider/Divider.d.ts

@@ -1,6 +1,6 @@
 import { DsDividerAttrs } from '@cupra/ui-kit/react/types/ds-divider';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-divider';
 export interface DividerProps extends DsDividerAttrs {
     className?: string;
 }

package/dist/components/Divider/Divider.js

@@ -0,0 +1,8 @@
+import { jsx as t } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-divider";
+function d({ className: r, ...i }) {
+  return /* @__PURE__ */ t("ds-divider-react", { class: r, ...i });
+}
+export {
+  d as Divider
+};

package/dist/components/Hyperlink/Hyperlink.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-hyperlink';
 import { DsHyperlinkAttrs } from '@cupra/ui-kit/react/types/ds-hyperlink';
 export type HyperlinkProps = DsHyperlinkAttrs & {
     children: JSX.Element | JSX.Element[] | string;

package/dist/components/Hyperlink/Hyperlink.js

@@ -0,0 +1,12 @@
+import { jsx as i } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-hyperlink";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as n } from "../../hooks/useHandleEvent.js";
+function s({ children: r, onClick: t, ...o }) {
+  const { ref: e } = n({ click: t });
+  return /* @__PURE__ */ i("ds-hyperlink-react", { ref: e, ...o, children: r });
+}
+export {
+  s as Hyperlink
+};

package/dist/components/Icon/Icon.d.ts

@@ -1,6 +1,6 @@
 import { DsIconAttrs } from '@cupra/ui-kit/react/types/ds-icon';
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-icon';
 export interface IconProps extends DsIconAttrs {
     className?: string;
 }

package/dist/components/Icon/Icon.js

@@ -0,0 +1,9 @@
+import { jsx as e } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-icon";
+function a(o) {
+  const { "icon-name": n, className: c, ...r } = o;
+  return /* @__PURE__ */ e("ds-icon-react", { "icon-name": n, class: c, ...r });
+}
+export {
+  a as Icon
+};

package/dist/components/IconButton/IconButton.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-icon-button';
 import { type DsIconButtonAttrs } from '@cupra/ui-kit/react/types/ds-icon-button';
 type IconButtonProps = DsIconButtonAttrs & {
     className?: string;

package/dist/components/IconButton/IconButton.js

@@ -0,0 +1,20 @@
+import { jsx as e } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-icon-button";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as c } from "../../hooks/useHandleEvent.js";
+function u(o) {
+  const { className: r, onClick: i, size: t, ...n } = o, { ref: s } = c({ click: i });
+  return /* @__PURE__ */ e(
+    "ds-icon-button-react",
+    {
+      ref: s,
+      size: typeof t == "string" ? t : JSON.stringify(t),
+      class: r,
+      ...n
+    }
+  );
+}
+export {
+  u as IconButton
+};

package/dist/components/Input/Input.d.ts

@@ -1,5 +1,5 @@
 import { DsInputAttrs } from '@cupra/ui-kit/react/types/ds-input';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-input';
 import { ChangeEvent, FormEvent, ForwardRefExoticComponent, KeyboardEvent, RefAttributes } from 'react';
 type InputProps = DsInputAttrs & {
     className?: string;

package/dist/components/Input/Input.js

@@ -0,0 +1,14 @@
+import { jsx as m } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-input";
+import { useHandleEvent as s } from "../../hooks/useHandleEvent.js";
+import { forwardRef as i, useImperativeHandle as u } from "react";
+const c = i(
+  ({ className: e, onInput: t, onKeyDown: n, onChange: o, ...p }, a) => {
+    const { ref: r } = s({ input: t, keydown: n, change: o });
+    return u(a, () => r.current, []), /* @__PURE__ */ m("ds-input-react", { ref: r, class: e, ...p });
+  }
+);
+c.displayName = "Input";
+export {
+  c as Input
+};

package/dist/components/InteractiveCard/InteractiveCard.d.ts

@@ -1,5 +1,5 @@
 import type { ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-interactive-card';
 import type { DsInteractiveCardAttrs } from '@cupra/ui-kit/react/types/ds-interactive-card';
 type Children = JSX.Element | JSX.Element[] | string;
 type InteractiveCardProps = DsInteractiveCardAttrs & {

package/dist/components/InteractiveCard/InteractiveCard.js

@@ -0,0 +1,27 @@
+import { jsx as r } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as u } from "../../hooks/useHandleEvent.js";
+import "@cupra/ui-kit/react/ds-interactive-card";
+function e(t) {
+  const { className: d, children: v, onClick: m, ...C } = t, { ref: p } = u({ click: m });
+  return /* @__PURE__ */ r("ds-interactive-card-react", { ref: p, class: d, ...C, children: v });
+}
+const a = ({ children: t }) => /* @__PURE__ */ r("div", { slot: "title", children: t }), i = ({ children: t }) => /* @__PURE__ */ r("div", { slot: "subtitle", children: t }), n = ({ children: t }) => /* @__PURE__ */ r("div", { slot: "meta", children: t }), o = ({ children: t }) => /* @__PURE__ */ r("div", { slot: "content", children: t }), l = ({ children: t }) => /* @__PURE__ */ r("div", { slot: "cta", children: t }), s = ({ children: t }) => /* @__PURE__ */ r("div", { slot: "error-title", children: t }), c = ({ children: t }) => /* @__PURE__ */ r("div", { slot: "error-text", children: t });
+e.Title = a;
+e.Subtitle = i;
+e.Meta = n;
+e.Content = o;
+e.Cta = l;
+e.ErrorTitle = s;
+e.ErrorText = c;
+a.displayName = "InteractiveCard.Title";
+i.displayName = "InteractiveCard.Subtitle";
+n.displayName = "InteractiveCard.Meta";
+o.displayName = "InteractiveCard.Content";
+l.displayName = "InteractiveCard.Cta";
+s.displayName = "InteractiveCard.ErrorTitle";
+c.displayName = "InteractiveCard.ErrorText";
+export {
+  e as InteractiveCard
+};

package/dist/components/LinkButton/LinkButton.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-link-button';
 import { DsLinkButtonAttrs } from '@cupra/ui-kit/react/types/ds-link-button';
 type LinkButtonProps = DsLinkButtonAttrs & {
     children: JSX.Element | JSX.Element[] | string;

package/dist/components/LinkButton/LinkButton.js

@@ -0,0 +1,12 @@
+import { jsx as i } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-link-button";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+import { useHandleEvent as e } from "../../hooks/useHandleEvent.js";
+function s({ children: t, onClick: o, ...r }) {
+  const { ref: n } = e({ click: o });
+  return /* @__PURE__ */ i("ds-link-button-react", { ref: n, ...r, children: t });
+}
+export {
+  s as LinkButton
+};

package/dist/components/Loader/Loader.d.ts

@@ -1,5 +1,8 @@
 import { type ReactElement } from 'react';
-import '@cupra/ui-kit/react';
+import '@cupra/ui-kit/react/ds-loader-bar';
+import '@cupra/ui-kit/react/ds-loader-dots';
+import '@cupra/ui-kit/react/ds-loader-logo';
+import '@cupra/ui-kit/react/ds-loader-spinner';
 import { DsLoaderBarsAttrs } from '@cupra/ui-kit/react/types/ds-loader-bar';
 import { DsLoaderDotsAttrs } from '@cupra/ui-kit/react/types/ds-loader-dots';
 import { DsLoaderLogoAttrs } from '@cupra/ui-kit/react/types/ds-loader-logo';

package/dist/components/Loader/Loader.js

@@ -0,0 +1,27 @@
+import { jsx as o } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-loader-bar";
+import "@cupra/ui-kit/react/ds-loader-dots";
+import "@cupra/ui-kit/react/ds-loader-logo";
+import "@cupra/ui-kit/react/ds-loader-spinner";
+function t(r) {
+  return /* @__PURE__ */ o("ds-loader-logo-react", { ...r });
+}
+function e(r) {
+  return /* @__PURE__ */ o("ds-loader-bar-react", { ...r });
+}
+function n(r) {
+  return /* @__PURE__ */ o("ds-loader-dots-react", { ...r });
+}
+function d(r) {
+  return /* @__PURE__ */ o("ds-loader-spinner-react", { ...r, children: r.text && /* @__PURE__ */ o("div", { slot: "text", children: r.text }) });
+}
+const u = {
+  Logo: t,
+  Bar: e,
+  Dots: n,
+  Spinner: d
+};
+export {
+  u as Loader,
+  t as LoaderLogo
+};

package/dist/components/Logo/Logo.d.ts

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

package/dist/components/Logo/Logo.js

@@ -0,0 +1,9 @@
+import { jsx as t } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/ds-logo";
+function a(o) {
+  const { className: r, children: c, ...s } = o;
+  return /* @__PURE__ */ t("ds-logo-react", { class: r, ...s });
+}
+export {
+  a as Logo
+};

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

@@ -0,0 +1,12 @@
+import { jsx as n } from "react/jsx-runtime";
+import "@cupra/ui-kit/react/utils/breakpoints";
+import "react";
+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 {
+  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

@@ -0,0 +1,50 @@
+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 "@cupra/ui-kit/react/ds-modal";
+function e() {
+}
+const C = p.div`
+    margin: 0;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+`;
+function l(t) {
+  const {
+    children: o,
+    onClickCloseButton: i = e,
+    onClickConfirmButton: s = e,
+    onClickCancelButton: u = e,
+    className: a,
+    withPortal: m,
+    ...r
+  } = t, { ref: d } = f({
+    "click-close-button": i,
+    "click-confirm-button": s,
+    "click-cancel-button": u
+  });
+  if (!r.open) return null;
+  const c = /* @__PURE__ */ n("ds-modal-react", { ref: d, class: a, ...r, children: o });
+  return m ? /* @__PURE__ */ n("ds-portal-react", { style: { display: "none" }, children: c }) : c;
+}
+function h({ children: t }) {
+  return /* @__PURE__ */ n("div", { slot: "title", children: t });
+}
+function k({ className: t = "", children: o }) {
+  return /* @__PURE__ */ n("div", { slot: "content", className: `ds-scroll ${t}`.trim(), children: o });
+}
+function b({ children: t }) {
+  return /* @__PURE__ */ n(C, { slot: "content", children: t });
+}
+l.Title = h;
+l.Content = k;
+l.FullScreenContent = b;
+export {
+  l as Modal
+};

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;