willba-component-library 0.3.10 → 0.3.12

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 (64) hide show
  1. package/lib/assets/IconsSvg.d.ts +1 -2
  2. package/lib/components/Button/Button.d.ts +6 -6
  3. package/lib/components/FilterBar/FilterBar.d.ts +1 -2
  4. package/lib/components/FilterBar/FilterBarTypes.d.ts +3 -13
  5. package/lib/components/FilterBar/components/buttons/select-button/SelectButton.d.ts +1 -2
  6. package/lib/components/FilterBar/components/buttons/tab-button/TabButton.d.ts +1 -2
  7. package/lib/components/FilterBar/components/cards/image-card/ImageCard.d.ts +1 -2
  8. package/lib/components/FilterBar/components/categories/Categories.d.ts +1 -2
  9. package/lib/components/FilterBar/components/common/FilterSectionHeader.d.ts +2 -2
  10. package/lib/components/FilterBar/components/dates/Dates.d.ts +5 -4
  11. package/lib/components/FilterBar/components/divider/Divider.d.ts +1 -2
  12. package/lib/components/FilterBar/components/guests/Guests.d.ts +1 -2
  13. package/lib/components/FilterBar/components/locations/Locations.d.ts +1 -2
  14. package/lib/components/FilterBar/utils/index.d.ts +1 -1
  15. package/lib/components/FilterBar/utils/parseLocations.d.ts +1 -2
  16. package/lib/components/FilterCalendar/FilterCalendar.d.ts +1 -2
  17. package/lib/components/FilterCalendar/components/Footer.d.ts +1 -2
  18. package/lib/core/components/buttons/close-button/CloseButton.d.ts +1 -2
  19. package/lib/core/components/buttons/submit-button/SubmitButton.d.ts +2 -2
  20. package/lib/core/components/calendar/Calendar.d.ts +1 -2
  21. package/lib/index.d.ts +11 -19
  22. package/lib/index.esm.js +346 -359
  23. package/lib/index.esm.js.map +1 -1
  24. package/lib/index.js +431 -444
  25. package/lib/index.js.map +1 -1
  26. package/lib/index.umd.js +433 -447
  27. package/lib/index.umd.js.map +1 -1
  28. package/package.json +1 -1
  29. package/rollup.config.mjs +1 -1
  30. package/src/assets/IconsSvg.tsx +0 -2
  31. package/src/components/Button/Button.stories.tsx +15 -16
  32. package/src/components/Button/Button.tsx +15 -15
  33. package/src/components/FilterBar/FilterBar.css +1 -1
  34. package/src/components/FilterBar/FilterBar.stories.tsx +14 -50
  35. package/src/components/FilterBar/FilterBar.tsx +44 -13
  36. package/src/components/FilterBar/FilterBarTypes.ts +3 -14
  37. package/src/components/FilterBar/components/buttons/select-button/SelectButton.tsx +13 -2
  38. package/src/components/FilterBar/components/buttons/tab-button/TabButton.tsx +0 -2
  39. package/src/components/FilterBar/components/cards/image-card/ImageCard.css +0 -1
  40. package/src/components/FilterBar/components/cards/image-card/ImageCard.tsx +1 -1
  41. package/src/components/FilterBar/components/categories/Categories.tsx +2 -1
  42. package/src/components/FilterBar/components/common/FilterSectionHeader.css +1 -0
  43. package/src/components/FilterBar/components/common/FilterSectionHeader.tsx +2 -1
  44. package/src/components/FilterBar/components/dates/Dates.css +3 -0
  45. package/src/components/FilterBar/components/dates/Dates.tsx +5 -4
  46. package/src/components/FilterBar/components/divider/Divider.tsx +0 -2
  47. package/src/components/FilterBar/components/guests/GuestCount/GuestCount.tsx +1 -1
  48. package/src/components/FilterBar/components/guests/Guests.css +1 -1
  49. package/src/components/FilterBar/components/guests/Guests.tsx +11 -2
  50. package/src/components/FilterBar/components/locations/Locations.css +1 -1
  51. package/src/components/FilterBar/components/locations/Locations.tsx +16 -36
  52. package/src/components/FilterBar/utils/calculateDropdownPosition.tsx +106 -0
  53. package/src/components/FilterBar/utils/index.tsx +1 -1
  54. package/src/components/FilterBar/utils/parseLocations.tsx +3 -7
  55. package/src/components/FilterCalendar/FilterCalendar.stories.tsx +1 -1
  56. package/src/components/FilterCalendar/FilterCalendar.tsx +0 -1
  57. package/src/components/FilterCalendar/components/Footer.tsx +0 -1
  58. package/src/core/components/buttons/close-button/CloseButton.tsx +0 -1
  59. package/src/core/components/buttons/submit-button/SubmitButton.tsx +1 -1
  60. package/src/core/components/calendar/Calendar.tsx +7 -4
  61. package/stories/Button.tsx +14 -11
  62. package/stories/Header.tsx +27 -14
  63. package/stories/Page.tsx +39 -21
  64. package/src/components/FilterBar/utils/getLocalizedContent.tsx +0 -21
@@ -1,9 +1,8 @@
1
- import React from 'react';
2
1
  type Icon = 'spinner' | 'warning';
3
2
  type Props = {
4
3
  fill?: string;
5
4
  size?: number;
6
5
  icon: Icon;
7
6
  };
8
- export declare const IconsSvg: ({ fill, size, icon }: Props) => React.JSX.Element | null;
7
+ export declare const IconsSvg: ({ fill, size, icon }: Props) => import("react/jsx-runtime").JSX.Element | null;
9
8
  export {};
@@ -1,10 +1,10 @@
1
- import React from "react";
2
- import "./button.css";
1
+ import { MouseEvent } from 'react';
2
+ import './button.css';
3
3
  export interface ButtonProps {
4
4
  /**
5
5
  * Is this the principal call to action on the page?
6
6
  */
7
- type?: "primary" | "secondary";
7
+ type?: 'primary' | 'secondary';
8
8
  /**
9
9
  * What background color to use
10
10
  */
@@ -12,7 +12,7 @@ export interface ButtonProps {
12
12
  /**
13
13
  * How large should the button be?
14
14
  */
15
- size?: "small" | "medium" | "large";
15
+ size?: 'small' | 'medium' | 'large';
16
16
  /**
17
17
  * Button contents
18
18
  */
@@ -20,10 +20,10 @@ export interface ButtonProps {
20
20
  /**
21
21
  * Optional click handler
22
22
  */
23
- onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
23
+ onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
24
24
  }
25
25
  /**
26
26
  * Primary UI component for user interaction
27
27
  */
28
- declare const Button: ({ type, textColor, size, onClick, label, }: ButtonProps) => React.JSX.Element;
28
+ declare const Button: ({ type, textColor, size, onClick, label, }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
29
29
  export default Button;
@@ -1,5 +1,4 @@
1
- import React from 'react';
2
1
  import '../../themes/Default.css';
3
2
  import { FilterBarTypes } from './FilterBarTypes';
4
3
  import './FilterBar.css';
5
- export default function FilterBar({ language, ageCategories, redirectUrl, palette, onSubmit, fullWidth, disableCalendarDates, mode, tabs, outerLoading, locations, }: FilterBarTypes): React.JSX.Element;
4
+ export default function FilterBar({ language, ageCategories, redirectUrl, palette, onSubmit, fullWidth, disableCalendarDates, mode, tabs, outerLoading, locations, }: FilterBarTypes): import("react/jsx-runtime").JSX.Element;
@@ -44,20 +44,11 @@ export declare enum Pages {
44
44
  EVENTS = "/events",
45
45
  SALES = "/sales"
46
46
  }
47
- type Translations = {
48
- en: string;
49
- fi: string;
50
- [key: string]: string;
51
- };
52
- export type LocaleTranslation = Array<{
53
- content: string;
54
- locale: string;
55
- }>;
56
47
  export type Tab = {
57
48
  path: string;
58
49
  default?: boolean;
59
50
  order: number;
60
- label?: Translations;
51
+ label?: string;
61
52
  };
62
53
  export type Locations = {
63
54
  multiSelect: boolean;
@@ -66,8 +57,7 @@ export type Locations = {
66
57
  };
67
58
  export type Location = {
68
59
  id: number;
69
- label: LocaleTranslation;
70
- description?: LocaleTranslation | null;
60
+ label: string;
61
+ description?: string | null;
71
62
  imageUrl?: string | null;
72
63
  };
73
- export {};
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import './SelectButton.css';
3
2
  type Props = {
4
3
  label: string;
@@ -9,5 +8,5 @@ type Props = {
9
8
  ariaExpanded?: boolean;
10
9
  ariaControls?: string;
11
10
  };
12
- export declare const SelectButton: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
11
+ export declare const SelectButton: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLButtonElement>>;
13
12
  export {};
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import './TabButton.css';
3
2
  type Props = {
4
3
  onClick?: () => void;
@@ -6,5 +5,5 @@ type Props = {
6
5
  active?: boolean;
7
6
  mode?: string;
8
7
  };
9
- export declare const TabButton: ({ onClick, label, active, mode }: Props) => React.JSX.Element;
8
+ export declare const TabButton: ({ onClick, label, active, mode }: Props) => import("react/jsx-runtime").JSX.Element;
10
9
  export {};
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import './ImageCard.css';
3
2
  type Props = {
4
3
  title?: string;
@@ -7,5 +6,5 @@ type Props = {
7
6
  isSelected: boolean;
8
7
  onClick?: () => void;
9
8
  };
10
- export declare const ImageCard: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
9
+ export declare const ImageCard: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLDivElement>>;
11
10
  export {};
@@ -1,8 +1,7 @@
1
- import React from 'react';
2
1
  import './Categories.css';
3
2
  type Props = {
4
3
  categories: any;
5
4
  setCategories: any;
6
5
  };
7
- export declare const Categories: ({ categories, setCategories }: Props) => React.JSX.Element;
6
+ export declare const Categories: ({ categories, setCategories }: Props) => import("react/jsx-runtime").JSX.Element;
8
7
  export {};
@@ -1,8 +1,8 @@
1
- import React, { ReactNode } from 'react';
1
+ import { ReactNode } from 'react';
2
2
  import './FilterSectionHeader.css';
3
3
  type Props = {
4
4
  title: string;
5
5
  action?: ReactNode;
6
6
  };
7
- export declare const FilterSectionHeader: ({ title, action }: Props) => React.JSX.Element;
7
+ export declare const FilterSectionHeader: ({ title, action }: Props) => import("react/jsx-runtime").JSX.Element;
8
8
  export {};
@@ -1,8 +1,9 @@
1
- import React from 'react';
1
+ import { RefObject } from 'react';
2
2
  import { DateRange } from 'react-day-picker';
3
3
  import { DisableCalendarDates } from '../../../../core/components/calendar/CalendarTypes';
4
+ import './Dates.css';
4
5
  type Props = {
5
- ref: React.RefObject<HTMLDivElement>;
6
+ ref: RefObject<HTMLDivElement>;
6
7
  onClose?: () => void;
7
8
  autoFocus?: boolean;
8
9
  calendarRange: DateRange | undefined;
@@ -10,7 +11,7 @@ type Props = {
10
11
  disableCalendarDates?: DisableCalendarDates;
11
12
  selectedPath?: string;
12
13
  language?: string;
13
- filtersRef?: React.RefObject<HTMLDivElement>;
14
+ filtersRef?: RefObject<HTMLDivElement>;
14
15
  };
15
- export declare const Dates: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
16
+ export declare const Dates: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
16
17
  export {};
@@ -1,3 +1,2 @@
1
- import React from 'react';
2
1
  import './Divider.css';
3
- export declare const Divider: () => React.JSX.Element;
2
+ export declare const Divider: () => import("react/jsx-runtime").JSX.Element;
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import { AgeCategoryCount, AgeCategoryType } from '../../FilterBarTypes';
3
2
  import './Guests.css';
4
3
  type Props = {
@@ -8,5 +7,5 @@ type Props = {
8
7
  autoFocus?: boolean;
9
8
  onClose?: () => void;
10
9
  };
11
- export declare const Guests: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
10
+ export declare const Guests: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLDivElement>>;
12
11
  export {};
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import './Locations.css';
3
2
  import { Location } from '../../FilterBarTypes';
4
3
  type Props = {
@@ -10,5 +9,5 @@ type Props = {
10
9
  multiSelect?: boolean;
11
10
  onClose?: () => void;
12
11
  };
13
- export declare const Locations: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
12
+ export declare const Locations: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLDivElement>>;
14
13
  export {};
@@ -1,3 +1,3 @@
1
1
  export { parseGuests } from './parseGuests';
2
2
  export { parseLocations } from './parseLocations';
3
- export { getLocalizedContent } from './getLocalizedContent';
3
+ export { calculateDropdownPosition } from './calculateDropdownPosition';
@@ -1,9 +1,8 @@
1
1
  import { Location } from '../FilterBarTypes';
2
2
  type Props = {
3
3
  selectedLocations: Location[];
4
- language: string;
5
4
  locationsPlaceholder: string;
6
5
  locationsSelectedLabel?: string;
7
6
  };
8
- export declare const parseLocations: ({ selectedLocations, language, locationsPlaceholder, locationsSelectedLabel, }: Props) => string;
7
+ export declare const parseLocations: ({ selectedLocations, locationsPlaceholder, locationsSelectedLabel, }: Props) => string;
9
8
  export {};
@@ -1,5 +1,4 @@
1
- import React from 'react';
2
1
  import '../../themes/Default.css';
3
2
  import { FilterCalendarTypes } from './FilterCalendarTypes';
4
3
  import './FilterCalendar.css';
5
- export default function FilterCalendar({ calendarOffset, language, palette, onSubmit, disableCalendarDates: outerDisableCalendarDates, toggleCalendar, loadingData, setToggleCalendar, requestDates, showFeedback, noActiveSelection, rangeContext: outerRangeContext, }: FilterCalendarTypes): React.JSX.Element;
4
+ export default function FilterCalendar({ calendarOffset, language, palette, onSubmit, disableCalendarDates: outerDisableCalendarDates, toggleCalendar, loadingData, setToggleCalendar, requestDates, showFeedback, noActiveSelection, rangeContext: outerRangeContext, }: FilterCalendarTypes): import("react/jsx-runtime").JSX.Element;
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import { DateRange } from 'react-day-picker';
3
2
  import { Palette } from '../../../themes/useTheme';
4
3
  export declare const Footer: ({ calendarHasError, calendarRange, handleClearDates, language, palette, }: {
@@ -7,4 +6,4 @@ export declare const Footer: ({ calendarHasError, calendarRange, handleClearDate
7
6
  handleClearDates: () => void;
8
7
  language?: string;
9
8
  palette: Palette;
10
- }) => React.JSX.Element;
9
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -1,7 +1,6 @@
1
- import React from 'react';
2
1
  import './CloseButton.css';
3
2
  interface CloseButtonPropsType {
4
3
  handleClose: () => void;
5
4
  }
6
- export declare const CloseButton: ({ handleClose }: CloseButtonPropsType) => React.JSX.Element;
5
+ export declare const CloseButton: ({ handleClose }: CloseButtonPropsType) => import("react/jsx-runtime").JSX.Element;
7
6
  export {};
@@ -1,4 +1,4 @@
1
- import React, { ReactNode } from 'react';
1
+ import { ReactNode } from 'react';
2
2
  import './SubmitButton.css';
3
3
  type SubmitButtonVariant = 'text' | 'full';
4
4
  type Props = {
@@ -9,5 +9,5 @@ type Props = {
9
9
  isLoading?: boolean;
10
10
  variant?: SubmitButtonVariant;
11
11
  };
12
- export declare const SubmitButton: ({ onClick, startIcon, label, disabled, isLoading, variant, }: Props) => React.JSX.Element;
12
+ export declare const SubmitButton: ({ onClick, startIcon, label, disabled, isLoading, variant, }: Props) => import("react/jsx-runtime").JSX.Element;
13
13
  export {};
@@ -1,5 +1,4 @@
1
- import React from 'react';
2
1
  import { CalendarTypes } from './CalendarTypes';
3
2
  import 'react-day-picker/dist/style.css';
4
3
  import './Calendar.css';
5
- export declare const Calendar: React.ForwardRefExoticComponent<CalendarTypes & React.RefAttributes<HTMLDivElement>>;
4
+ export declare const Calendar: import("react").ForwardRefExoticComponent<CalendarTypes & import("react").RefAttributes<HTMLDivElement>>;
package/lib/index.d.ts CHANGED
@@ -1,11 +1,12 @@
1
- import React from 'react';
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { MouseEvent } from 'react';
2
3
  import { DateRange, Matcher } from 'react-day-picker';
3
4
 
4
5
  interface ButtonProps {
5
6
  /**
6
7
  * Is this the principal call to action on the page?
7
8
  */
8
- type?: "primary" | "secondary";
9
+ type?: 'primary' | 'secondary';
9
10
  /**
10
11
  * What background color to use
11
12
  */
@@ -13,7 +14,7 @@ interface ButtonProps {
13
14
  /**
14
15
  * How large should the button be?
15
16
  */
16
- size?: "small" | "medium" | "large";
17
+ size?: 'small' | 'medium' | 'large';
17
18
  /**
18
19
  * Button contents
19
20
  */
@@ -21,12 +22,12 @@ interface ButtonProps {
21
22
  /**
22
23
  * Optional click handler
23
24
  */
24
- onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
25
+ onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
25
26
  }
26
27
  /**
27
28
  * Primary UI component for user interaction
28
29
  */
29
- declare const Button: ({ type, textColor, size, onClick, label, }: ButtonProps) => React.JSX.Element;
30
+ declare const Button: ({ type, textColor, size, onClick, label, }: ButtonProps) => react_jsx_runtime.JSX.Element;
30
31
 
31
32
  type Palette = {
32
33
  primary: string;
@@ -102,20 +103,11 @@ type AgeCategoryType = {
102
103
  type Filters = {
103
104
  [key: string]: string;
104
105
  };
105
- type Translations = {
106
- en: string;
107
- fi: string;
108
- [key: string]: string;
109
- };
110
- type LocaleTranslation = Array<{
111
- content: string;
112
- locale: string;
113
- }>;
114
106
  type Tab = {
115
107
  path: string;
116
108
  default?: boolean;
117
109
  order: number;
118
- label?: Translations;
110
+ label?: string;
119
111
  };
120
112
  type Locations = {
121
113
  multiSelect: boolean;
@@ -124,12 +116,12 @@ type Locations = {
124
116
  };
125
117
  type Location = {
126
118
  id: number;
127
- label: LocaleTranslation;
128
- description?: LocaleTranslation | null;
119
+ label: string;
120
+ description?: string | null;
129
121
  imageUrl?: string | null;
130
122
  };
131
123
 
132
- declare function FilterBar({ language, ageCategories, redirectUrl, palette, onSubmit, fullWidth, disableCalendarDates, mode, tabs, outerLoading, locations, }: FilterBarTypes): React.JSX.Element;
124
+ declare function FilterBar({ language, ageCategories, redirectUrl, palette, onSubmit, fullWidth, disableCalendarDates, mode, tabs, outerLoading, locations, }: FilterBarTypes): react_jsx_runtime.JSX.Element;
133
125
 
134
126
  interface FilterCalendarTypes extends Partial<CalendarTypes> {
135
127
  palette: Palette;
@@ -138,6 +130,6 @@ interface FilterCalendarTypes extends Partial<CalendarTypes> {
138
130
  setToggleCalendar: (val: boolean) => void;
139
131
  }
140
132
 
141
- declare function FilterCalendar({ calendarOffset, language, palette, onSubmit, disableCalendarDates: outerDisableCalendarDates, toggleCalendar, loadingData, setToggleCalendar, requestDates, showFeedback, noActiveSelection, rangeContext: outerRangeContext, }: FilterCalendarTypes): React.JSX.Element;
133
+ declare function FilterCalendar({ calendarOffset, language, palette, onSubmit, disableCalendarDates: outerDisableCalendarDates, toggleCalendar, loadingData, setToggleCalendar, requestDates, showFeedback, noActiveSelection, rangeContext: outerRangeContext, }: FilterCalendarTypes): react_jsx_runtime.JSX.Element;
142
134
 
143
135
  export { Button, FilterBar, FilterBarTypes, FilterCalendar, FilterCalendarTypes };