@cupra/ui-react 2.0.0-canary.4 → 2.0.0-canary.41

package/dist/types/components/MediaControl/MediaControl.d.ts

@@ -0,0 +1,10 @@
+import type { ReactElement } from 'react';
+import '@cupra/ui-kit/react/ds-media-control';
+import type { DsMediaControlAttrs } from '@cupra/ui-kit/react/types/ds-media-control';
+type MediaControlProps = DsMediaControlAttrs & {
+    className?: string;
+    onPlay?: (event: CustomEvent) => void;
+    onPause?: (event: CustomEvent) => void;
+};
+export declare function MediaControl(props: MediaControlProps): ReactElement;
+export {};

package/dist/types/components/MediaControl/stories/CupraDiagonal.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const Sizes: Story;

package/dist/{components → types/components}/PickerItem/stories/CupraDiagonal.stories.d.ts

@@ -6,7 +6,9 @@ export declare const WithBorder: Story;
 export declare const WithoutBorder: Story;
 export declare const SmallWithBorder: Story;
 export declare const MediumWithBorder: Story;
+export declare const LargeWithBorder: Story;
 export declare const SmallWithoutBorder: Story;
 export declare const MediumWithoutBorder: Story;
+export declare const LargeWithoutBorder: Story;
 export declare const ResponsiveSize: Story;
 export declare const Selected: Story;

package/dist/types/components/SecondaryNavigation/stories/CupraDiagonal.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const SingleActionButton: Story;
+export declare const KeepDropdownButtonText: Story;

package/dist/{components → types/components}/Text/Text.d.ts

@@ -1,9 +1,9 @@
 import { DsTextAttrs } from '@cupra/ui-kit/react/types/ds-text';
-import { type ReactElement } from 'react';
+import { type ReactElement, ReactNode } from 'react';
 import '@cupra/ui-kit/react/ds-text';
 type TextProps = DsTextAttrs & {
     className?: string;
-    children: JSX.Element | JSX.Element[] | string;
+    children: ReactNode | string;
 };
 export declare function Text(props: TextProps): ReactElement;
 export {};

package/dist/types/components/Text/stories/CupraDiagonal.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const TwoInlineTexts: Story;

package/dist/{components → types/components}/index.d.ts

@@ -1,6 +1,8 @@
 export * from './Accordion/Accordion';
 export * from './Badge/Badge';
 export * from './BasicCard/BasicCard';
+export * from './BasicCardImage/BasicCardImage';
+export * from './BasicCardHeader/BasicCardHeader';
 export * from './BasicCardSection/BasicCardSection';
 export * from './Bullets/Bullets';
 export * from './Button/Button';
@@ -12,6 +14,7 @@ export * from './Currency/Currency';
 export * from './Dialog/Dialog';
 export * from './DialogBody/DialogBody';
 export * from './DialogFooter/DialogFooter';
+export * from './DialogFullscreen/DialogFullscreen';
 export * from './DialogHeader/DialogHeader';
 export * from './Divider/Divider';
 export * from './Drawer/Drawer';
@@ -19,11 +22,14 @@ export * from './Hyperlink/Hyperlink';
 export * from './Icon/Icon';
 export * from './IconButton/IconButton';
 export * from './Input/Input';
+export * from './List/List';
+export * from './ListItem/ListItem';
 export * from './LinkButton/LinkButton';
 export * from './Loader/Loader';
 export * from './Logo/Logo';
 export * from './MainTitle/MainTitle';
 export * from './MapPin/MapPin';
+export * from './MediaControl/MediaControl';
 export * from './Modal/Modal';
 export * from './PasswordInput/PasswordInput';
 export * from './PickerItem/PickerItem';
@@ -49,8 +55,10 @@ export * from './ToggleSwitch/ToggleSwitch';
 export * from './Tooltip/Tooltip';
 export * from './Toast/Toast';
 export * from './ToastMessage/ToastMessage';
+export * from './InlineAlert/InlineAlert';
 export * from './Avatar/Avatar';
 export * from './StaticBox/StaticBox';
 export * from './Stepper/Stepper';
 export * from './InteractiveCard/InteractiveCard';
 export * from './SidebarNavigation/SidebarNavigation';
+export * from './MediaControl/MediaControl';

package/package.json

@@ -1,22 +1,29 @@
 {
   "name": "@cupra/ui-react",
-  "version": "2.0.0-canary.4",
+  "version": "2.0.0-canary.41",
   "description": "React components library",
   "author": "SEAT S.A.",
   "license": "SEAT S.A. Library EULA 1.0",
   "type": "module",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "main": "dist/cjs/index.cjs",
+  "module": "dist/esm/index.js",
+  "types": "dist/types/index.d.ts",
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.cjs"
     },
     "./*": {
-      "import": "./dist/components/*/*.js",
-      "types": "./dist/components/*/*.d.ts"
+      "types": "./dist/types/components/*/*.d.ts",
+      "import": "./dist/esm/components/*/*.js",
+      "require": "./dist/cjs/components/*/*.cjs"
     },
-    "./hooks/*": "./dist/hooks/*.js"
+    "./hooks/*": {
+      "types": "./dist/types/hooks/*.d.ts",
+      "import": "./dist/esm/hooks/*.js",
+      "require": "./dist/cjs/hooks/*.cjs"
+    }
   },
   "files": [
     "LICENSE",
@@ -44,7 +51,8 @@
   "peerDependencies": {
     "react": ">= 18.3.1 < 20",
     "react-dom": ">= 18.3.1 < 20",
-    "@cupra/ui-kit": "1.1.0-canary.4"
+    "@cupra/ui-kit": "2.0.0-canary.34",
+    "typescript": ">=5.0.0"
   },
   "dependencies": {
     "styled-components": "^6.1.16"
@@ -66,13 +74,13 @@
     "storybook": "^8.6.15",
     "typescript": "^5.8.2",
     "vite": "^6.4.1",
-    "@cupra/ui-kit": "1.1.0-canary.4"
+    "@cupra/ui-kit": "2.0.0-canary.34"
   },
   "scripts": {
-    "build": "rm -rf dist && tsc --declaration --emitDeclarationOnly && vite build --emptyOutDir false",
-    "test": "npx vitest run",
+    "build": "rm -rf dist && pnpm --filter @cupra/ui-kit build:react && tsc --declaration --emitDeclarationOnly && BUILD_FORMAT=esm vite build --emptyOutDir false && BUILD_FORMAT=cjs vite build --emptyOutDir false",
+    "test": "vitest run",
     "generate-licenses": "npx generate-license-file --input package.json --output THIRD_PARTY_LICENSES.MD --overwrite --ci",
-    "storybook": "storybook dev -p 6006",
+    "storybook": "pnpm --filter ui-kit build:react:dev && storybook dev -p 6006",
     "build-storybook:cupra-diagonal": "storybook build --output-dir dist-storybook/cupra-diagonal"
   }
 }

package/dist/components/SecondaryNavigation/SecondaryNavigation.js

@@ -1,17 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-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 e(t) {
-  const { className: o, children: r, onSelect: s, ...i } = t, { ref: c } = a({
-    "ds-secondary-navigation:select": s
-  });
-  return /* @__PURE__ */ n("ds-secondary-navigation-react", { ref: c, class: o, ...i, children: r });
-}
-const m = ({ children: t, ...o }) => /* @__PURE__ */ n("a", { slot: "items", ...o, children: t }), d = ({ children: t }) => /* @__PURE__ */ n("div", { slot: "actions", children: t });
-e.Item = m;
-e.Actions = d;
-export {
-  e as SecondaryNavigation
-};

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

@@ -1,5 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-declare const meta: Meta;
-export default meta;
-type Story = StoryObj;
-export declare const Default: Story;

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

@@ -1,5 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-declare const meta: Meta;
-export default meta;
-type Story = StoryObj;
-export declare const Default: Story;

package/dist/index.js

@@ -1,124 +0,0 @@
-import { Accordion as t } from "./components/Accordion/Accordion.js";
-import { Badge as x } from "./components/Badge/Badge.js";
-import { BasicCard as f } from "./components/BasicCard/BasicCard.js";
-import { BasicCardSection as i } from "./components/BasicCardSection/BasicCardSection.js";
-import { Bullets as d } from "./components/Bullets/Bullets.js";
-import { Button as c } from "./components/Button/Button.js";
-import { CarouselIndicator as u } from "./components/CarouselIndicator/CarouselIndicator.js";
-import { Checkbox as B } from "./components/Checkbox/Checkbox.js";
-import { Chip as T } from "./components/Chip/Chip.js";
-import { Chips as C } from "./components/Chips/Chips.js";
-import { Currency as h } from "./components/Currency/Currency.js";
-import { Dialog as L } from "./components/Dialog/Dialog.js";
-import { DialogBody as R } from "./components/DialogBody/DialogBody.js";
-import { DialogFooter as y } from "./components/DialogFooter/DialogFooter.js";
-import { DialogHeader as P } from "./components/DialogHeader/DialogHeader.js";
-import { Divider as H } from "./components/Divider/Divider.js";
-import { Drawer as E } from "./components/Drawer/Drawer.js";
-import { Hyperlink as z } from "./components/Hyperlink/Hyperlink.js";
-import { Icon as G } from "./components/Icon/Icon.js";
-import { IconButton as j } from "./components/IconButton/IconButton.js";
-import { Input as J } from "./components/Input/Input.js";
-import { LinkButton as Q } from "./components/LinkButton/LinkButton.js";
-import { Loader as V, LoaderLogo as W } from "./components/Loader/Loader.js";
-import { Logo as Y } from "./components/Logo/Logo.js";
-import { MainTitle as _ } from "./components/MainTitle/MainTitle.js";
-import { MapPin as oo } from "./components/MapPin/MapPin.js";
-import { Modal as eo } from "./components/Modal/Modal.js";
-import { PasswordInput as po } from "./components/PasswordInput/PasswordInput.js";
-import { PickerItem as mo } from "./components/PickerItem/PickerItem.js";
-import { Radio as ao } from "./components/Radio/Radio.js";
-import { RadioButton as no } from "./components/RadioButton/RadioButton.js";
-import { RadioButtonGroup as co } from "./components/RadioButtonGroup/RadioButtonGroup.js";
-import { Rating as uo } from "./components/Rating/Rating.js";
-import { Search as Bo } from "./components/Search/Search.js";
-import { SearchInput as To } from "./components/SearchInput/SearchInput.js";
-import { SecondaryNavigation as Co } from "./components/SecondaryNavigation/SecondaryNavigation.js";
-import { SegmentedControl as ho } from "./components/SegmentedControl/SegmentedControl.js";
-import { Select as Lo } from "./components/Select/Select.js";
-import { Selection as Ro } from "./components/Selection/Selection.js";
-import { Slider as yo } from "./components/Slider/Slider.js";
-import { Tabs as Po } from "./components/Tabs/Tabs.js";
-import { Tag as Ho } from "./components/Tag/Tag.js";
-import { Text as Eo } from "./components/Text/Text.js";
-import { TextInput as zo } from "./components/TextInput/TextInput.js";
-import { Textarea as Go } from "./components/Textarea/Textarea.js";
-import { ThemeProvider as jo } from "./components/ThemeProvider/ThemeProvider.js";
-import { ToggleButton as Jo } from "./components/ToggleButton/ToggleButton.js";
-import { ToggleSwitch as Qo } from "./components/ToggleSwitch/ToggleSwitch.js";
-import { Tooltip as Vo } from "./components/Tooltip/Tooltip.js";
-import { Toast as Xo } from "./components/Toast/Toast.js";
-import { ToastMessage as Zo } from "./components/ToastMessage/ToastMessage.js";
-import { Avatar as $o } from "./components/Avatar/Avatar.js";
-import { StaticBox as rr } from "./components/StaticBox/StaticBox.js";
-import { Stepper as tr } from "./components/Stepper/Stepper.js";
-import { InteractiveCard as xr } from "./components/InteractiveCard/InteractiveCard.js";
-import { SidebarNavigation as fr } from "./components/SidebarNavigation/SidebarNavigation.js";
-import { useBreakpoint as ir } from "./hooks/useBreakpoint.js";
-import { useEventListeners as dr } from "./hooks/useEventListeners.js";
-import { useHandleEvent as cr } from "./hooks/useHandleEvent.js";
-import "react";
-import { useResizeObserver as ur } from "./hooks/useResizeObserver/useResizeObserver.js";
-export {
-  t as Accordion,
-  $o as Avatar,
-  x as Badge,
-  f as BasicCard,
-  i as BasicCardSection,
-  d as Bullets,
-  c as Button,
-  u as CarouselIndicator,
-  B as Checkbox,
-  T as Chip,
-  C as Chips,
-  h as Currency,
-  L as Dialog,
-  R as DialogBody,
-  y as DialogFooter,
-  P as DialogHeader,
-  H as Divider,
-  E as Drawer,
-  z as Hyperlink,
-  G as Icon,
-  j as IconButton,
-  J as Input,
-  xr as InteractiveCard,
-  Q as LinkButton,
-  V as Loader,
-  W as LoaderLogo,
-  Y as Logo,
-  _ as MainTitle,
-  oo as MapPin,
-  eo as Modal,
-  po as PasswordInput,
-  mo as PickerItem,
-  ao as Radio,
-  no as RadioButton,
-  co as RadioButtonGroup,
-  uo as Rating,
-  Bo as Search,
-  To as SearchInput,
-  Co as SecondaryNavigation,
-  ho as SegmentedControl,
-  Lo as Select,
-  Ro as Selection,
-  fr as SidebarNavigation,
-  yo as Slider,
-  rr as StaticBox,
-  tr as Stepper,
-  Po as Tabs,
-  Ho as Tag,
-  Eo as Text,
-  zo as TextInput,
-  Go as Textarea,
-  jo as ThemeProvider,
-  Xo as Toast,
-  Zo as ToastMessage,
-  Jo as ToggleButton,
-  Qo as ToggleSwitch,
-  Vo as Tooltip,
-  ir as useBreakpoint,
-  dr as useEventListeners,
-  cr as useHandleEvent,
-  ur as useResizeObserver
-};