@prijsvrijtechsupport/ui 0.0.48 → 0.0.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist/components/priceBox/styles.css +3 -0
  2. package/dist/components/priceCheck/styles.css +6 -1
  3. package/dist/components/slider/styles.css +3 -0
  4. package/dist/dist/index.css +24 -1
  5. package/dist/dist/index.css.map +1 -1
  6. package/dist/index.cjs +186 -110
  7. package/dist/index.cjs.map +1 -1
  8. package/dist/index.js +186 -111
  9. package/dist/index.js.map +1 -1
  10. package/dist/src/components/hero/Hero.stories.d.ts +2 -0
  11. package/dist/src/components/hero/index.d.ts +3 -1
  12. package/dist/src/components/priceBox/index.d.ts +4 -1
  13. package/dist/src/components/slider/Slider.stories.d.ts +42 -18
  14. package/dist/src/components/slider/index.d.ts +5 -2
  15. package/dist/src/components/toggle/Toggle.stories.d.ts +5 -0
  16. package/dist/src/components/weather/Weather.stories.d.ts +3 -8
  17. package/dist/src/icons/IconImage.d.ts +2 -0
  18. package/dist/src/icons/index.d.ts +1 -0
  19. package/dist/styles/utilities.css +2 -0
  20. package/dist/styles/variables.css +11 -1
  21. package/package.json +3 -1
package/dist/src/components/hero/Hero.stories.d.ts CHANGED
@@ -47,6 +47,8 @@ export declare const Default: import("@storybook/react").ReactStory<import("@sto
47
47
  DeparturePoint: string;
48
48
  DeparturePointHuman: string;
49
49
  };
50
+ buttonText: string;
51
+ warnText: string;
50
52
  priceBoxPosition: string;
51
53
  };
52
54
  }>;
package/dist/src/components/hero/index.d.ts CHANGED
@@ -9,7 +9,9 @@ interface HeroProps {
9
9
  bottomRightImage: string;
10
10
  bottomRightOverlay?: ReactNode;
11
11
  hotel: HotelData;
12
+ buttonText?: string;
13
+ warnText?: string;
12
14
  priceBoxPosition?: "start" | "end";
13
15
  }
14
- export declare const Hero: ({ className, sliderImages, topRightImage, bottomLeftImage, bottomRightImage, bottomRightOverlay, hotel, priceBoxPosition, ...props }: HeroProps) => import("react/jsx-runtime").JSX.Element;
16
+ export declare const Hero: ({ className, sliderImages, topRightImage, bottomLeftImage, bottomRightImage, bottomRightOverlay, warnText, hotel, buttonText, priceBoxPosition, ...props }: HeroProps) => import("react/jsx-runtime").JSX.Element;
15
17
  export {};
package/dist/src/components/priceBox/index.d.ts CHANGED
@@ -15,6 +15,9 @@ export interface PriceBoxProps {
15
15
  noBorder?: boolean;
16
16
  noHover?: boolean;
17
17
  hidePrice?: boolean;
18
+ showButtonIcon?: boolean;
19
+ buttonText?: string;
18
20
  onClick?: (() => void) | undefined;
21
+ warnText?: string;
19
22
  }
20
- export declare const PriceBox: ({ className, hotel, brand, noBorder, noHover, hidePrice, onClick, "data-testid": dataTestId, }: PriceBoxProps) => import("react/jsx-runtime").JSX.Element;
23
+ export declare const PriceBox: ({ className, hotel, brand, noBorder, noHover, hidePrice, warnText, buttonText, showButtonIcon, onClick, "data-testid": dataTestId, }: PriceBoxProps) => import("react/jsx-runtime").JSX.Element;
package/dist/src/components/slider/Slider.stories.d.ts CHANGED
@@ -1,29 +1,30 @@
1
1
  import type { EmblaOptionsType } from "embla-carousel";
2
- import { type SliderProps } from "./index";
3
2
  type StoryArgs = {
4
- className?: string | undefined;
5
- showArrows?: boolean | undefined;
6
- showDots?: boolean | undefined;
7
- dotsPlacement?: "inside" | "outside" | undefined;
8
- slideCount?: number | undefined;
9
- loop?: boolean | undefined;
10
- lazyLoad?: boolean | undefined;
11
- options?: EmblaOptionsType | undefined;
3
+ className: string;
4
+ showArrows: boolean;
5
+ showDots: boolean;
6
+ dotsPlacement: "inside" | "outside";
7
+ roundedFull: boolean;
8
+ slideCount: number;
9
+ loop: boolean;
10
+ lazyLoad: boolean;
11
+ options: EmblaOptionsType;
12
+ plugins: any[];
12
13
  };
13
14
  export declare const Default: import("@storybook/react").ReactStory<import("@storybook/react").ReactTypes & import("@storybook/addon-docs").DocsTypes & import("@storybook/addon-a11y").A11yTypes & {
14
15
  csf4: true;
15
16
  } & {
16
- args: SliderProps & StoryArgs;
17
+ args: StoryArgs;
17
18
  } & {
18
19
  args: {
19
20
  className: unknown;
20
21
  showArrows: unknown;
21
22
  showDots: unknown;
22
23
  dotsPlacement: unknown;
23
- slideCount: unknown;
24
- loop: unknown;
24
+ roundedFull: unknown;
25
25
  lazyLoad: unknown;
26
26
  options: unknown;
27
+ square: unknown;
27
28
  };
28
29
  }, {
29
30
  args: {
@@ -34,6 +35,17 @@ export declare const Default: import("@storybook/react").ReactStory<import("@sto
34
35
  slideCount: number;
35
36
  loop: false;
36
37
  lazyLoad: false;
38
+ plugins: {
39
+ name: string;
40
+ options: Partial<import("embla-carousel").CreateOptionsType<{
41
+ active: boolean;
42
+ breakpoints: {
43
+ [key: string]: Omit<Partial</*elided*/ any>, "breakpoints">;
44
+ };
45
+ }>>;
46
+ init: (embla: import("embla-carousel").EmblaCarouselType, OptionsHandler: import("embla-carousel").OptionsHandlerType) => void;
47
+ destroy: () => void;
48
+ }[];
37
49
  options: {
38
50
  align: "start";
39
51
  axis: "x";
@@ -52,17 +64,17 @@ export declare const Default: import("@storybook/react").ReactStory<import("@sto
52
64
  export declare const ImageLazyLoad: import("@storybook/react").ReactStory<import("@storybook/react").ReactTypes & import("@storybook/addon-docs").DocsTypes & import("@storybook/addon-a11y").A11yTypes & {
53
65
  csf4: true;
54
66
  } & {
55
- args: SliderProps & StoryArgs;
67
+ args: StoryArgs;
56
68
  } & {
57
69
  args: {
58
70
  className: unknown;
59
71
  showArrows: unknown;
60
72
  showDots: unknown;
61
73
  dotsPlacement: unknown;
62
- slideCount: unknown;
63
- loop: unknown;
74
+ roundedFull: unknown;
64
75
  lazyLoad: unknown;
65
76
  options: unknown;
77
+ square: unknown;
66
78
  };
67
79
  }, {
68
80
  args: {
@@ -70,6 +82,17 @@ export declare const ImageLazyLoad: import("@storybook/react").ReactStory<import
70
82
  showArrows: true;
71
83
  showDots: true;
72
84
  dotsPlacement: "inside";
85
+ plugins: {
86
+ name: string;
87
+ options: Partial<import("embla-carousel").CreateOptionsType<{
88
+ active: boolean;
89
+ breakpoints: {
90
+ [key: string]: Omit<Partial</*elided*/ any>, "breakpoints">;
91
+ };
92
+ }>>;
93
+ init: (embla: import("embla-carousel").EmblaCarouselType, OptionsHandler: import("embla-carousel").OptionsHandlerType) => void;
94
+ destroy: () => void;
95
+ }[];
73
96
  loop: true;
74
97
  lazyLoad: true;
75
98
  options: {
@@ -81,17 +104,17 @@ export declare const ImageLazyLoad: import("@storybook/react").ReactStory<import
81
104
  export declare const WithOverlay: import("@storybook/react").ReactStory<import("@storybook/react").ReactTypes & import("@storybook/addon-docs").DocsTypes & import("@storybook/addon-a11y").A11yTypes & {
82
105
  csf4: true;
83
106
  } & {
84
- args: SliderProps & StoryArgs;
107
+ args: StoryArgs;
85
108
  } & {
86
109
  args: {
87
110
  className: unknown;
88
111
  showArrows: unknown;
89
112
  showDots: unknown;
90
113
  dotsPlacement: unknown;
91
- slideCount: unknown;
92
- loop: unknown;
114
+ roundedFull: unknown;
93
115
  lazyLoad: unknown;
94
116
  options: unknown;
117
+ square: unknown;
95
118
  };
96
119
  }, {
97
120
  args: {
@@ -102,6 +125,7 @@ export declare const WithOverlay: import("@storybook/react").ReactStory<import("
102
125
  slideCount: number;
103
126
  loop: true;
104
127
  lazyLoad: false;
128
+ square: boolean;
105
129
  options: {
106
130
  align: "center";
107
131
  loop: true;
package/dist/src/components/slider/index.d.ts CHANGED
@@ -2,17 +2,20 @@ import { type HTMLAttributes, type ReactNode } from "react";
2
2
  import type { EmblaOptionsType, EmblaPluginType } from "embla-carousel";
3
3
  export interface SliderProps extends HTMLAttributes<HTMLDivElement> {
4
4
  className?: string | undefined;
5
- slides: ReactNode[];
5
+ slides?: ReactNode[];
6
6
  options?: EmblaOptionsType | undefined;
7
7
  plugins?: EmblaPluginType[] | undefined;
8
8
  lazyLoad?: boolean | undefined;
9
9
  showArrows?: boolean | undefined;
10
10
  showDots?: boolean | undefined;
11
11
  dotsPlacement?: "inside" | "outside" | undefined;
12
+ roundedFull?: boolean | undefined;
13
+ showLike?: boolean | undefined;
12
14
  overlay?: ReactNode;
13
15
  overlayClassName?: string | undefined;
14
16
  viewportClassName?: string;
15
17
  containerClassName?: string;
16
18
  slideClassName?: string;
19
+ square?: boolean | undefined;
17
20
  }
18
- export declare function Slider({ slides, options, plugins, lazyLoad, showArrows, showDots, dotsPlacement, overlay, overlayClassName, className, viewportClassName, containerClassName, slideClassName, ...props }: SliderProps): import("react/jsx-runtime").JSX.Element;
21
+ export declare function Slider({ slides, options, plugins, lazyLoad, showArrows, showDots, roundedFull, showLike, dotsPlacement, overlay, overlayClassName, className, viewportClassName, containerClassName, slideClassName, square, ...props }: SliderProps): import("react/jsx-runtime").JSX.Element;
package/dist/src/components/toggle/Toggle.stories.d.ts CHANGED
@@ -40,6 +40,7 @@ export declare const Disabled: import("@storybook/react").ReactStory<import("@st
40
40
  };
41
41
  }, {
42
42
  render: (args: TransportToggleProps) => import("react/jsx-runtime").JSX.Element;
43
+ decorators: ((story: any) => import("react/jsx-runtime").JSX.Element)[];
43
44
  args: {
44
45
  options: {
45
46
  id: string;
@@ -64,6 +65,7 @@ export declare const Loading: import("@storybook/react").ReactStory<import("@sto
64
65
  };
65
66
  }, {
66
67
  render: (args: TransportToggleProps) => import("react/jsx-runtime").JSX.Element;
68
+ decorators: ((story: any) => import("react/jsx-runtime").JSX.Element)[];
67
69
  args: {
68
70
  options: {
69
71
  id: string;
@@ -88,6 +90,7 @@ export declare const DisabledPlane: import("@storybook/react").ReactStory<import
88
90
  };
89
91
  }, {
90
92
  render: (args: TransportToggleProps) => import("react/jsx-runtime").JSX.Element;
93
+ decorators: ((story: any) => import("react/jsx-runtime").JSX.Element)[];
91
94
  args: {
92
95
  options: {
93
96
  id: string;
@@ -113,6 +116,7 @@ export declare const DisabledCar: import("@storybook/react").ReactStory<import("
113
116
  };
114
117
  }, {
115
118
  render: (args: TransportToggleProps) => import("react/jsx-runtime").JSX.Element;
119
+ decorators: ((story: any) => import("react/jsx-runtime").JSX.Element)[];
116
120
  args: {
117
121
  options: {
118
122
  id: string;
@@ -138,6 +142,7 @@ export declare const NoSingleDisabled: import("@storybook/react").ReactStory<imp
138
142
  };
139
143
  }, {
140
144
  render: (args: TransportToggleProps) => import("react/jsx-runtime").JSX.Element;
145
+ decorators: ((story: any) => import("react/jsx-runtime").JSX.Element)[];
141
146
  args: {
142
147
  options: {
143
148
  id: string;
package/dist/src/components/weather/Weather.stories.d.ts CHANGED
@@ -14,7 +14,7 @@ export declare const Default: import("@storybook/react").ReactStory<import("@sto
14
14
  title: string;
15
15
  weatherItems: {
16
16
  icon: import("react/jsx-runtime").JSX.Element | null;
17
- temperature: number;
17
+ temperature: string;
18
18
  temperature_percent: number;
19
19
  month: number;
20
20
  }[];
@@ -33,16 +33,11 @@ export declare const Vertical: import("@storybook/react").ReactStory<import("@st
33
33
  className: string;
34
34
  direction: string;
35
35
  title: string;
36
- weatherItems: ({
37
- icon: import("react/jsx-runtime").JSX.Element | null;
38
- temperature: number;
39
- temperature_percent: number;
40
- month: number;
41
- } | {
36
+ weatherItems: {
42
37
  icon: import("react/jsx-runtime").JSX.Element | null;
43
38
  temperature: string;
44
39
  temperature_percent: number;
45
40
  month: number;
46
- })[];
41
+ }[];
47
42
  };
48
43
  }>;
package/dist/src/icons/IconImage.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import { type SVGProps } from "react";
2
+ export declare const IconImage: ({ className, ...props }: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
package/dist/src/icons/index.d.ts CHANGED
@@ -67,3 +67,4 @@ export * from "./IconWatched";
67
67
  export * from "./IconPresent";
68
68
  export * from "./IconIce";
69
69
  export * from "./IconCocktail";
70
+ export * from "./IconImage";
package/dist/styles/utilities.css CHANGED
@@ -35,6 +35,8 @@
35
35
  @import '../components/matrixTable/styles.css';
36
36
  @import '../components/pageNavigation/styles.css';
37
37
  @import '../components/calendar/styles.css';
38
+ @import '../components/slider/styles.css';
39
+ @import '../components/priceBox/styles.css';
38
40
 
39
41
  @utility transition-max-height {
40
42
  transition: max-height 0.3s ease-in-out;
package/dist/styles/variables.css CHANGED
@@ -333,6 +333,10 @@
333
333
  --fontWeight-price-text: 400;
334
334
  --price-background: var(--prijsvrij-alternative);
335
335
  --price-background-back: #ffbf2b;
336
+ --fontSize-price-check: 24px;
337
+ --letterSpacing-price-check: -.02em;
338
+
339
+ --priceBox-warnText-text-align: start;
336
340
 
337
341
 
338
342
  /* Buttons */
@@ -399,6 +403,8 @@
399
403
  --price-minus-bottom: 10px;
400
404
  --price-price-margin-top: 0;
401
405
 
406
+ --slider-selected-index-bg: #ff7801;
407
+
402
408
  --color-calendar-selected: #029a02;
403
409
 
404
410
  --toggle-active-background-color: var(--prijsvrij-primary);
@@ -626,6 +632,10 @@
626
632
  --price-minus-right: 5px;
627
633
  --price-minus-bottom: 10px;
628
634
  --price-price-margin-top: -8px;
635
+ --fontSize-price-check: 32px;
636
+ --letterSpacing-price-check: -.02em;
637
+
638
+ --priceBox-warnText-text-align: end;
629
639
 
630
640
  --color-calendar-selected: #029a02;
631
641
 
@@ -636,7 +646,7 @@
636
646
  --toggle-font-family: var(--font-lato), sans-serif;
637
647
  --toggle-inactive-shadow-color: var(--color-dark-600);
638
648
 
639
-
649
+ --slider-selected-index-bg: var(--dreizen-secondary);
640
650
 
641
651
  --filter-button-background-color: var(--dreizen-primary);
642
652
  --filter-button-background-hover-color: var(--dreizen-dark-600);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@prijsvrijtechsupport/ui",
3
- "version": "0.0.48",
3
+ "version": "0.0.49",
4
4
  "description": "A UI component library",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -98,7 +98,9 @@
98
98
  "clsx": "^2.1.1",
99
99
  "date-fns": "^4.1.0",
100
100
  "embla-carousel": "^8.5.2",
101
+ "embla-carousel-auto-height": "^8.6.0",
101
102
  "embla-carousel-react": "^8.5.2",
103
+ "embla-carousel-ssr": "^9.0.0-rc02",
102
104
  "moment": "^2.30.1",
103
105
  "react-day-picker": "^9.9.0",
104
106
  "react-intersection-observer": "^10.0.3",