@leabankab/component-library 8.6.0 → 8.7.0

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 (61) hide show
  1. package/CHANGELOG.md +64 -0
  2. package/dist/component-library.es.js +1925 -1087
  3. package/dist/component-library.es.js.map +1 -1
  4. package/dist/component-library.umd.js +2 -2
  5. package/dist/component-library.umd.js.map +1 -1
  6. package/dist/components/buttons/action-button.d.ts +34 -4
  7. package/dist/components/buttons/button-base.d.ts +5 -2
  8. package/dist/components/buttons/icon-button.d.ts +16 -2
  9. package/dist/components/color-roles.d.ts +7 -1
  10. package/dist/components/data-display/arrow-circle.d.ts +21 -0
  11. package/dist/components/data-display/article-card.d.ts +88 -0
  12. package/dist/components/data-display/avatar.d.ts +33 -0
  13. package/dist/components/data-display/chip.d.ts +8 -3
  14. package/dist/components/data-display/featured-image.d.ts +42 -0
  15. package/dist/components/data-display/index.d.ts +12 -0
  16. package/dist/components/data-display/link-card.d.ts +52 -0
  17. package/dist/components/data-display/media-card.d.ts +102 -0
  18. package/dist/components/data-display/partner-row.d.ts +46 -0
  19. package/dist/components/data-display/rich-text.d.ts +27 -0
  20. package/dist/components/data-display/service-card.d.ts +80 -0
  21. package/dist/components/data-display/star-rating.d.ts +26 -0
  22. package/dist/components/data-display/table.d.ts +93 -0
  23. package/dist/components/data-display/testimonial-card.d.ts +43 -0
  24. package/dist/components/data-display/use-star-rating-labels.d.ts +5 -0
  25. package/dist/components/data-display/use-video-player-labels.d.ts +2 -0
  26. package/dist/components/data-display/video-player.d.ts +22 -0
  27. package/dist/components/data-display/website-card.d.ts +10 -0
  28. package/dist/components/feedback/index.d.ts +1 -0
  29. package/dist/components/feedback/skeleton.d.ts +22 -0
  30. package/dist/components/navigation/breadcrumbs.d.ts +38 -0
  31. package/dist/components/navigation/index.d.ts +3 -0
  32. package/dist/components/navigation/pagination-dots.d.ts +34 -0
  33. package/dist/components/navigation/pagination.d.ts +37 -0
  34. package/dist/components/navigation/use-breadcrumbs-labels.d.ts +2 -0
  35. package/dist/components/navigation/use-pagination-labels.d.ts +7 -0
  36. package/dist/components/surfaces/accordion.d.ts +5 -1
  37. package/dist/components/surfaces/index.d.ts +1 -0
  38. package/dist/components/surfaces/panel.d.ts +30 -0
  39. package/dist/components/typography/link.d.ts +14 -1
  40. package/dist/cookie-consent-react.cjs +1 -1
  41. package/dist/cookie-consent-react.cjs.map +1 -1
  42. package/dist/cookie-consent-react.mjs +22 -22
  43. package/dist/cookie-consent-react.mjs.map +1 -1
  44. package/dist/cookie-consent.css +1 -1
  45. package/dist/date-picker.cjs +1 -1
  46. package/dist/date-picker.cjs.map +1 -1
  47. package/dist/date-picker.mjs +216 -203
  48. package/dist/date-picker.mjs.map +1 -1
  49. package/dist/index.css +1 -1
  50. package/dist/index.d.ts +1 -1
  51. package/dist/tailwind.css +16 -0
  52. package/dist/theme/index.d.ts +1 -1
  53. package/dist/theme/token-types.d.ts +13 -3
  54. package/dist/theme/tokens/breakpoints.d.ts +20 -0
  55. package/dist/theme/tokens/font-family.d.ts +6 -0
  56. package/dist/theme/tokens/index.d.ts +1 -0
  57. package/dist/theme/tokens/shadows.d.ts +6 -0
  58. package/dist/theme/tokens/text-styles.d.ts +8 -0
  59. package/dist/theme/tokens/widths.d.ts +10 -0
  60. package/dist/theme/types.d.ts +9 -1
  61. package/package.json +1 -1
@@ -0,0 +1,26 @@
1
+ import { ComponentProps } from 'react';
2
+ export type StarRatingProps = Omit<ComponentProps<"span">, "children"> & {
3
+ /**
4
+ * How many stars, from 0 to `max`. Rounded to a whole star and kept within
5
+ * the range.
6
+ */
7
+ rating: number;
8
+ /**
9
+ * The best rating there is, for the accessible name: "4 av 5 stjerner".
10
+ * @default 5
11
+ */
12
+ max?: number;
13
+ };
14
+ /**
15
+ * A read-only rating in stars, as on the website's testimonials. Only the
16
+ * stars of the rating are drawn (a 4 is four stars), in the colour of the
17
+ * text around it.
18
+ *
19
+ * ```tsx
20
+ * <StarRating rating={4} />
21
+ * ```
22
+ *
23
+ * It is one image to a screen reader, named "4 av 5 stjerner" in the
24
+ * `LeaProvider` language; pass `aria-label` for other words.
25
+ */
26
+ export declare function StarRating({ rating, max, className, ...rest }: StarRatingProps): import("react").JSX.Element;
@@ -0,0 +1,93 @@
1
+ import { useRender } from '@base-ui/react/use-render';
2
+ import { Ref } from 'react';
3
+ export type TableSize = "sm" | "lg";
4
+ export type TableCellAlign = "start" | "center" | "end";
5
+ export type TableProps = Omit<useRender.ComponentProps<"table">, "ref"> & {
6
+ /** The rendered element: the `<table>`, or the element passed to `render`. */
7
+ ref?: Ref<HTMLTableElement>;
8
+ /**
9
+ * `"lg"`: 16px text and 16px around it, rows 53px tall with their line.
10
+ * `"sm"`: 14px text and 8px around it, for a narrow column. Left out, the
11
+ * table is `lg` and turns `sm` below 640px, as on the website.
12
+ */
13
+ size?: TableSize;
14
+ };
15
+ /**
16
+ * A plain data table, as the website's price tables: a 1px line under every
17
+ * row, no stripes and no column lines. The first column is aligned to the
18
+ * start, the last to the end and the ones between to the centre; text wraps
19
+ * inside its cell.
20
+ *
21
+ * ```tsx
22
+ * <Table aria-label="Priseksempler">
23
+ * <TableHead>
24
+ * <TableRow>
25
+ * <TableHeaderCell>Beløp</TableHeaderCell>
26
+ * <TableHeaderCell>Pr. måned</TableHeaderCell>
27
+ * </TableRow>
28
+ * </TableHead>
29
+ * <TableBody>
30
+ * <TableRow>
31
+ * <TableCell>50 000 kr</TableCell>
32
+ * <TableCell>1 060 kr</TableCell>
33
+ * </TableRow>
34
+ * </TableBody>
35
+ * </Table>
36
+ * ```
37
+ *
38
+ * The header row is optional: the live price tables have none. The parts
39
+ * render the native table elements, so they nest only as a table's do. Name
40
+ * the table with `aria-label`, or `aria-labelledby` pointing at the heading
41
+ * above it.
42
+ *
43
+ * The table sits in a box of its own that scrolls sideways when the table is
44
+ * wider than its column, as on the website. While it scrolls, the box can be
45
+ * focused, so it scrolls from the keyboard too, and carries the table's name.
46
+ * `className`, `style` and `ref` are the table's.
47
+ */
48
+ export declare function Table({ render, ref, className, size, ...rest }: TableProps): import("react").JSX.Element;
49
+ export type TableHeadProps = Omit<useRender.ComponentProps<"thead">, "ref"> & {
50
+ /** The rendered element: the `<thead>`, or the element passed to `render`. */
51
+ ref?: Ref<HTMLTableSectionElement>;
52
+ };
53
+ /** The header row group, `<thead>`. Leave it out for a table without one. */
54
+ export declare function TableHead({ render, ref, ...rest }: TableHeadProps): import("react").JSX.Element;
55
+ export type TableBodyProps = Omit<useRender.ComponentProps<"tbody">, "ref"> & {
56
+ /** The rendered element: the `<tbody>`, or the element passed to `render`. */
57
+ ref?: Ref<HTMLTableSectionElement>;
58
+ };
59
+ /** The rows of data, `<tbody>`. */
60
+ export declare function TableBody({ render, ref, ...rest }: TableBodyProps): import("react").JSX.Element;
61
+ export type TableRowProps = Omit<useRender.ComponentProps<"tr">, "ref"> & {
62
+ /** The rendered element: the `<tr>`, or the element passed to `render`. */
63
+ ref?: Ref<HTMLTableRowElement>;
64
+ };
65
+ /** A row, `<tr>`, with the 1px line under it. */
66
+ export declare function TableRow({ render, ref, className, ...rest }: TableRowProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
67
+ type CellAlignProps = {
68
+ /**
69
+ * Where the text sits in the cell. Left out, the first cell of a row is at
70
+ * the start, the last at the end and the others in the centre. (It stands
71
+ * in for HTML's obsolete `align` attribute, and is written as
72
+ * `data-align`.)
73
+ */
74
+ align?: TableCellAlign;
75
+ };
76
+ export type TableHeaderCellProps = Omit<useRender.ComponentProps<"th">, "ref" | "align"> & CellAlignProps & {
77
+ /** The rendered element: the `<th>`, or the element passed to `render`. */
78
+ ref?: Ref<HTMLTableCellElement>;
79
+ };
80
+ /**
81
+ * A header cell, `<th>`, in semibold. In `TableHead` it heads its column
82
+ * (`scope="col"`). At the start of a row in `TableBody` it heads the row
83
+ * (`scope="row"`), so a screen reader reads the label with each value of a
84
+ * label / value table.
85
+ */
86
+ export declare function TableHeaderCell({ render, ref, className, align, scope, ...rest }: TableHeaderCellProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
87
+ export type TableCellProps = Omit<useRender.ComponentProps<"td">, "ref" | "align"> & CellAlignProps & {
88
+ /** The rendered element: the `<td>`, or the element passed to `render`. */
89
+ ref?: Ref<HTMLTableCellElement>;
90
+ };
91
+ /** A data cell, `<td>`. */
92
+ export declare function TableCell({ render, ref, className, align, ...rest }: TableCellProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
93
+ export {};
@@ -0,0 +1,43 @@
1
+ import { ComponentProps, ReactElement, ReactNode } from 'react';
2
+ export type TestimonialCardProps = Omit<ComponentProps<"figure">, "children"> & {
3
+ /**
4
+ * What the customer said, without quotation marks: the card adds them. A
5
+ * string becomes one paragraph; pass `<p>` elements for several.
6
+ */
7
+ quote: ReactNode;
8
+ /** Who said it. */
9
+ name: ReactNode;
10
+ /** A line under the name, such as the position and the company. */
11
+ meta?: ReactNode;
12
+ /** Stars above the quote, from 0 to 5. Left out, no stars are shown. */
13
+ rating?: number;
14
+ /**
15
+ * A photo of the person. Without one, the avatar is a grey disc. It is
16
+ * decoration: the name is beside it.
17
+ */
18
+ avatarSrc?: string;
19
+ /**
20
+ * The image element for the photo instead of an `<img>`, such as
21
+ * `next/image`, as `Avatar`'s `imageRender`. Pass `avatarSrc` as well.
22
+ */
23
+ avatarImageRender?: ReactElement;
24
+ };
25
+ /**
26
+ * A customer review, as in the website's carousel of reviews: stars, the
27
+ * quote and who said it, on a white card with 32px corners.
28
+ *
29
+ * ```tsx
30
+ * <TestimonialCard
31
+ * rating={5}
32
+ * quote="Rask og enkel prosess. Jeg fikk svar samme dag."
33
+ * name="Kari Nordmann"
34
+ * meta="Kunde, Oslo"
35
+ * avatarSrc="/kunder/kari.jpg"
36
+ * />
37
+ * ```
38
+ *
39
+ * It is a `figure`: the quote is a `blockquote`, and the person a
40
+ * `figcaption`. 64px inside, 32px below 768px. It takes the width it is
41
+ * given and grows with the quote.
42
+ */
43
+ export declare function TestimonialCard({ quote, name, meta, rating, avatarSrc, avatarImageRender, className, ...rest }: TestimonialCardProps): import("react").JSX.Element;
@@ -0,0 +1,5 @@
1
+ /**
2
+ * The accessible name of `StarRating`. `{rating}` and `{max}` are replaced
3
+ * with the numbers.
4
+ */
5
+ export declare const useStarRatingLabels: () => Record<"label", string>;
@@ -0,0 +1,2 @@
1
+ /** The names of `VideoPlayer`'s button, for a paused and a playing video. */
2
+ export declare const useVideoPlayerLabels: () => Record<"play" | "pause", string>;
@@ -0,0 +1,22 @@
1
+ import { ComponentProps } from 'react';
2
+ export type VideoPlayerProps = Omit<ComponentProps<"div">, "children"> & {
3
+ /** The video file. It plays without sound, so it should need none. */
4
+ src: string;
5
+ /** A still to show before the video starts, and while it is paused. */
6
+ poster?: string;
7
+ };
8
+ /**
9
+ * A silent video that plays in a loop, with the website's 64px corners and a
10
+ * play / pause button centred under it, 16 : 9 at the width it is given.
11
+ *
12
+ * ```tsx
13
+ * <VideoPlayer src="/video/lea-bank.mp4" poster="/video/lea-bank.jpg" />
14
+ * ```
15
+ *
16
+ * It starts on its own once the page has loaded, unless the visitor has
17
+ * asked for reduced motion: then it waits for the button. The button is named
18
+ * "Spill av video" or "Sett video på pause" in the `LeaProvider` language.
19
+ * The video itself is hidden from screen readers, as decoration: anything it
20
+ * tells has to be in the text around it.
21
+ */
22
+ export declare function VideoPlayer({ src, poster, className, ...rest }: VideoPlayerProps): import("react").JSX.Element;
@@ -0,0 +1,10 @@
1
+ import { ReactElement } from 'react';
2
+ /**
3
+ * A `render` element carrying `href` (an `<a>`, Next.js `Link`) or `to`
4
+ * (React Router `Link`) makes a website card one link, as `ButtonRoot` reads
5
+ * a link. Internal: not exported from the package.
6
+ */
7
+ export declare const isLinkElement: (render: unknown) => render is ReactElement<{
8
+ href?: unknown;
9
+ to?: unknown;
10
+ }>;
@@ -5,3 +5,4 @@ export * from './global-alert';
5
5
  export * from './simple-dialog';
6
6
  export * from './simple-drawer';
7
7
  export * from './toast';
8
+ export * from './skeleton';
@@ -0,0 +1,22 @@
1
+ import { useRender } from '@base-ui/react/use-render';
2
+ import { Ref } from 'react';
3
+ export type SkeletonProps = Omit<useRender.ComponentProps<"div">, "ref" | "children"> & {
4
+ /** The rendered element: the `<div>`, or the element passed to `render`. */
5
+ ref?: Ref<HTMLElement>;
6
+ };
7
+ /**
8
+ * A grey block that pulses where content is on its way, as the website's
9
+ * loading page. Size it to the content it stands for, with `style` or a class:
10
+ *
11
+ * ```tsx
12
+ * <div role="status" aria-label="Laster innhold">
13
+ * <Skeleton style={{ width: "40%", height: 80 }} />
14
+ * <Skeleton style={{ height: 480 }} />
15
+ * </div>
16
+ * ```
17
+ *
18
+ * It is hidden from screen readers. Put the blocks in an element with
19
+ * `role="status"` and a name, so a screen reader hears that the page is
20
+ * loading. Under reduced motion it stays still.
21
+ */
22
+ export declare function Skeleton({ render, ref, className, ...rest }: SkeletonProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
@@ -0,0 +1,38 @@
1
+ import { ComponentProps, ReactElement, ReactNode } from 'react';
2
+ export type BreadcrumbsItem = {
3
+ /** The text of the crumb. */
4
+ label: ReactNode;
5
+ /** Where the crumb leads. */
6
+ href?: string;
7
+ /**
8
+ * A router link to render instead of an `<a>`, carrying its own `href`:
9
+ * `<NextLink href="/lan" />`.
10
+ */
11
+ render?: ReactElement;
12
+ };
13
+ export type BreadcrumbsProps = Omit<ComponentProps<"nav">, "children"> & {
14
+ /**
15
+ * The way from the start page to this page, in order. The last item is the
16
+ * current page: it is plain text marked `aria-current="page"`, whatever it
17
+ * is given. An item before it without `href` or `render` is plain text too.
18
+ */
19
+ items: BreadcrumbsItem[];
20
+ };
21
+ /**
22
+ * Where the page sits on the website: a `nav` with a translated name around a
23
+ * list of links, the last one the current page.
24
+ *
25
+ * ```tsx
26
+ * <Breadcrumbs
27
+ * items={[
28
+ * { label: "Hjem", href: "/" },
29
+ * { label: "Lån", render: <NextLink href="/lan" /> },
30
+ * { label: "Forbrukslån" },
31
+ * ]}
32
+ * />
33
+ * ```
34
+ *
35
+ * The separators are hidden from screen readers; the list says how many
36
+ * steps there are. Renders nothing without items.
37
+ */
38
+ export declare function Breadcrumbs({ items, className, ...rest }: BreadcrumbsProps): import("react").JSX.Element | null;
@@ -4,3 +4,6 @@ export * from './progress-circle';
4
4
  export * from './step-progress';
5
5
  export * as Tabs from './tabs';
6
6
  export * from './use-stepper-labels';
7
+ export * from './breadcrumbs';
8
+ export * from './pagination';
9
+ export * from './pagination-dots';
@@ -0,0 +1,34 @@
1
+ import { ComponentProps } from 'react';
2
+ export type PaginationDotsProps = Omit<ComponentProps<"div">, "children" | "onChange" | "defaultValue"> & {
3
+ /** How many pages there are. */
4
+ count: number;
5
+ /** The current page, counted from 1. Pass it to control the dots. */
6
+ value?: number;
7
+ /**
8
+ * The page shown first when the dots are not controlled.
9
+ * @default 1
10
+ */
11
+ defaultValue?: number;
12
+ /** Called with the page number when a dot is pressed. */
13
+ onValueChange?: (page: number) => void;
14
+ /**
15
+ * The accessible name of each dot, when "Gå til side 3" does not say
16
+ * enough: `getItemLabel={(page) => "Vis omtale " + page}`.
17
+ */
18
+ getItemLabel?: (page: number) => string;
19
+ };
20
+ /**
21
+ * A row of dots, one per page, for a carousel or a paged list (the website's
22
+ * testimonials and partners). The current page is black.
23
+ *
24
+ * ```tsx
25
+ * <PaginationDots count={4} value={page} onValueChange={setPage} />
26
+ * ```
27
+ *
28
+ * Each dot is a button named "Gå til side 3" in the `LeaProvider` language,
29
+ * the current one marked `aria-current`, in a group named "Sider". The dots
30
+ * are 8px, 8px apart, and each answers to a 16 × 24 area around it. Put them
31
+ * beside previous and next buttons, which are easier to hit. Renders nothing
32
+ * for a single page.
33
+ */
34
+ export declare function PaginationDots({ count, value: valueProp, defaultValue, onValueChange, getItemLabel, className, ...rest }: PaginationDotsProps): import("react").JSX.Element | null;
@@ -0,0 +1,37 @@
1
+ import { ComponentProps, ReactElement } from 'react';
2
+ export type PaginationProps = Omit<ComponentProps<"nav">, "children" | "onChange" | "defaultValue"> & {
3
+ /** How many pages there are. */
4
+ count: number;
5
+ /** The current page, counted from 1. Pass it to control the pagination. */
6
+ value?: number;
7
+ /**
8
+ * The page shown first when the pagination is not controlled.
9
+ * @default 1
10
+ */
11
+ defaultValue?: number;
12
+ /** Called with the page number when another page is chosen. */
13
+ onValueChange?: (page: number) => void;
14
+ /**
15
+ * Renders the pages as links instead of buttons: return the link to a page,
16
+ * with its `href`. An `<a>` or a router link:
17
+ * `renderLink={(page) => <NextLink href={`/okonomiguiden?side=${page}`} />}`.
18
+ * Previous and next become links too, and plain text where there is no
19
+ * page to go to.
20
+ */
21
+ renderLink?: (page: number) => ReactElement;
22
+ };
23
+ /**
24
+ * Numbered pages with previous and next, for a list too long for one page (the
25
+ * website's blog and job lists). From eight pages it shows the first, the last
26
+ * and the current page with its neighbours.
27
+ *
28
+ * ```tsx
29
+ * const [page, setPage] = useState(1);
30
+ * <Pagination count={12} value={page} onValueChange={setPage} />
31
+ * ```
32
+ *
33
+ * Wrapped in a `nav` with a translated name; the current page carries
34
+ * `aria-current="page"`, and each number is named "Side 3" in the
35
+ * `LeaProvider` language. Renders nothing for a single page.
36
+ */
37
+ export declare function Pagination({ count, value: valueProp, defaultValue, onValueChange, renderLink, className, ...rest }: PaginationProps): import("react").JSX.Element | null;
@@ -0,0 +1,2 @@
1
+ /** The accessible name of the `nav` around `Breadcrumbs`. */
2
+ export declare const useBreadcrumbsLabels: () => Record<"label", string>;
@@ -0,0 +1,7 @@
1
+ /**
2
+ * The words of `Pagination` and `PaginationDots`. `{page}` is replaced with
3
+ * the page number.
4
+ */
5
+ export declare const usePaginationLabels: () => Record<"label" | "page" | "next" | "previous" | "goToPage", string>;
6
+ /** Puts the page number into a label from `usePaginationLabels`. */
7
+ export declare const withPage: (label: string, page: number) => string;
@@ -1,5 +1,5 @@
1
1
  import { Accordion as BaseAccordion } from '@base-ui/react/accordion';
2
- export type Variant = "outline" | "solid" | "divided" | "ghost";
2
+ export type Variant = "outline" | "solid" | "divided" | "ghost" | "card";
3
3
  export type IconPosition = "start" | "end";
4
4
  export type RootProps = BaseAccordion.Root.Props & {
5
5
  /**
@@ -12,6 +12,10 @@ export type RootProps = BaseAccordion.Root.Props & {
12
12
  * Suits long FAQ lists.
13
13
  * - `"ghost"` — no border or fill; only the hover tint shows. Use it on
14
14
  * tinted backgrounds.
15
+ * - `"card"` — borderless white cards with larger corners, for a list of
16
+ * questions on a grey (`bg.subtle`) section of the website. Spaced as the
17
+ * website's FAQ: 16px apart and inside, with 18px semibold titles (16px
18
+ * below 768px).
15
19
  * @default "outline"
16
20
  */
17
21
  variant?: Variant;
@@ -1,2 +1,3 @@
1
1
  export * as Accordion from './accordion';
2
2
  export * from './simple-accordion';
3
+ export * from './panel';
@@ -0,0 +1,30 @@
1
+ import { useRender } from '@base-ui/react/use-render';
2
+ import { Ref } from 'react';
3
+ export type PanelSize = "sm" | "lg";
4
+ export type PanelProps = Omit<useRender.ComponentProps<"div">, "ref"> & {
5
+ /** The rendered element: the `<div>`, or the element passed to `render`. */
6
+ ref?: Ref<HTMLElement>;
7
+ /**
8
+ * `"lg"`: 64px corners and 64px inside. `"sm"`: 32px corners and 32px
9
+ * inside, for a narrow column such as the content beside a `SideNav`. Left
10
+ * out, the panel is `lg` and turns `sm` below 768px, as on the website.
11
+ */
12
+ size?: PanelSize;
13
+ };
14
+ /**
15
+ * The website's white box: a white surface with large round corners and
16
+ * generous room inside, around text, a table or a form on a grey, beige or
17
+ * dark section. What is inside stacks with 16px between.
18
+ *
19
+ * ```tsx
20
+ * <Panel>
21
+ * <Text render={<h2 />} textStyle="heading-xl">Priseksempler</Text>
22
+ * <Table>…</Table>
23
+ * </Panel>
24
+ * ```
25
+ *
26
+ * It is always white, so it disappears on a white section: put it on a
27
+ * coloured one. It takes the width it is given. Renders a `div`; pass
28
+ * `render` for another element, e.g. `render={<section />}`.
29
+ */
30
+ export declare function Panel({ render, ref, className, size, ...rest }: PanelProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
@@ -10,6 +10,15 @@ export type LinkProps = Omit<useRender.ComponentProps<"a">, "ref" | "color"> & {
10
10
  * @default "secondary"
11
11
  */
12
12
  color?: LinkColor;
13
+ /**
14
+ * Adds a chevron after the text, for a link that stands on its own as a call
15
+ * to action, as on the website. On hover the chevron slides to the right and
16
+ * the text turns purple (`secondary`) or light purple (`contrast`). Checked
17
+ * for contrast on white, `bg.subtle`, `bg.muted` and the status tints
18
+ * (`secondary`), and on `bg.contrast` and `bg.contrast-accent` (`contrast`).
19
+ * @default false
20
+ */
21
+ arrow?: boolean;
13
22
  /** The rendered element: the `<a>`, or the element passed to `render`. */
14
23
  ref?: Ref<HTMLElement>;
15
24
  };
@@ -28,5 +37,9 @@ export type LinkProps = Omit<useRender.ComponentProps<"a">, "ref" | "color"> & {
28
37
  * For an action that only looks like a link, render a button:
29
38
  * `<Link render={<button type="button" />} onClick={…}>`. For a link that
30
39
  * looks like a button, use `Button` with `render`.
40
+ *
41
+ * With `arrow`, the link is a call to action of its own, sized by the text
42
+ * around it: `<Text textStyle="body-lg"><Link arrow href="/lan">Se alle
43
+ * lån</Link></Text>`.
31
44
  */
32
- export declare function Link({ color, render, ref, className, ...rest }: LinkProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
45
+ export declare function Link({ color, arrow, render, ref, className, ...rest }: LinkProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
@@ -1,2 +1,2 @@
1
- "use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});require('./cookie-consent.css');const e=require("./cookie-consent-core-fntGUdFt.cjs");let t=require("react"),n=require("@base-ui/react/button"),r=require("@base-ui/react/use-render"),i=require("react/jsx-runtime"),a=require("@base-ui/react/dialog"),o=require("lucide-react"),s=require("@base-ui/react/switch"),c=require("@base-ui/react/accordion");var l=(e,t)=>n=>[e,typeof t==`function`?t(n):t].filter(Boolean).join(` `),u={Button:`_Button_1d72q_1`,IconButton:`_IconButton_1d72q_125`,Spinner:`_Spinner_1d72q_150`,"button-spin":`_button-spin_1d72q_1`,SrOnly:`_SrOnly_1d72q_168`},d=e=>(0,t.isValidElement)(e)&&(e.props.href!=null||e.props.to!=null),f=e=>e.preventDefault();function p({loading:e=!1,disabled:t,className:a,render:o,nativeButton:s,focusableWhenDisabled:c,ref:l,...u}){let p=!!(t||e),m=d(o),h={"aria-busy":e||void 0,"data-loading":e||void 0};return(0,r.useRender)({enabled:m,render:m?o:void 0,ref:l,defaultTagName:`a`,props:{...u,...h,"aria-disabled":p||void 0,"data-disabled":p?``:void 0,className:typeof a==`function`?a({disabled:p}):a,onClick:p?f:u.onClick}})||(0,i.jsx)(n.Button,{...u,...h,ref:l,render:o,nativeButton:s,focusableWhenDisabled:c,disabled:p,className:a})}function m({variant:e=`solid`,color:t=`primary`,size:n=`md`,className:r,...a}){return(0,i.jsx)(p,{...a,"data-variant":e,"data-color":t,"data-size":n,className:l(u.Button,r)})}function h({startIcon:e,endIcon:t,loading:n=!1,loadingLabel:r,children:a,...o}){return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(m,{...o,loading:n,"data-start-icon":n||e!=null||void 0,"data-end-icon":t!=null||void 0,children:[n?(0,i.jsx)(`span`,{className:u.Spinner,"aria-hidden":!0}):e,a,t]}),r!=null&&(0,i.jsx)(`span`,{role:`status`,className:u.SrOnly,children:n?r:null})]})}var g={Backdrop:`_Backdrop_1mady_8`,Viewport:`_Viewport_1mady_22`,Popup:`_Popup_1mady_38`,Header:`_Header_1mady_78`,Title:`_Title_1mady_88`,Description:`_Description_1mady_97`,Content:`_Content_1mady_111`,Footer:`_Footer_1mady_119`,CloseButton:`_CloseButton_1mady_135`},_=(0,t.createContext)(`no`),v=()=>(0,t.useContext)(_);function y(e){return function(){let t=v(),n={};return Object.keys(e).forEach(r=>{let i=e[r];n[r]=i[t]??i.no}),n}}var b=y({close:{no:`Lukk`,se:`Stäng`,fi:`Sulje`,es:`Cerrar`}}),x=a.Dialog.Root;a.Dialog.Trigger;var S=a.Dialog.Portal;function C({className:e,...t}){return(0,i.jsx)(a.Dialog.Backdrop,{...t,className:l(g.Backdrop,e)})}function w({className:e,...t}){return(0,i.jsx)(a.Dialog.Viewport,{...t,className:l(g.Viewport,e)})}function T({size:e=`sm`,fullScreenOnMobile:t,className:n,...r}){return(0,i.jsx)(a.Dialog.Popup,{...r,"data-size":e,"data-full-screen-on-mobile":t||void 0,className:l(g.Popup,n)})}function E({className:e,...t}){return(0,i.jsx)(`div`,{...t,className:[g.Header,e].filter(Boolean).join(` `)})}function D({className:e,...t}){return(0,i.jsx)(a.Dialog.Title,{...t,className:l(g.Title,e)})}function O({className:e,...t}){return(0,i.jsx)(a.Dialog.Description,{...t,className:l(g.Description,e)})}function k({className:e,...t}){return(0,i.jsx)(`div`,{...t,className:[g.Content,e].filter(Boolean).join(` `)})}function A({className:e,...t}){return(0,i.jsx)(`div`,{...t,className:[g.Footer,e].filter(Boolean).join(` `)})}a.Dialog.Close;function j({label:e,className:t,...n}){let r=b();return(0,i.jsx)(a.Dialog.Close,{...n,"aria-label":e??r.close,className:l(g.CloseButton,t),children:(0,i.jsx)(o.X,{size:20,"aria-hidden":!0})})}var M={Switch:`_Switch_9c9ji_7`,Thumb:`_Thumb_9c9ji_36`};function N({className:e,...t}){return(0,i.jsx)(s.Switch.Root,{...t,className:l(M.Switch,e),children:(0,i.jsx)(s.Switch.Thumb,{className:M.Thumb})})}var P={Root:`_Root_18gqk_13`,Item:`_Item_18gqk_10`,Header:`_Header_18gqk_10`,Trigger:`_Trigger_18gqk_95`,Label:`_Label_18gqk_136`,Icon:`_Icon_18gqk_140`,Panel:`_Panel_18gqk_158`,Content:`_Content_18gqk_169`};function F({variant:e=`outline`,iconPosition:t=`end`,className:n,...r}){return(0,i.jsx)(c.Accordion.Root,{...r,"data-variant":e,"data-icon-position":t,className:l(P.Root,n)})}function I({className:e,...t}){return(0,i.jsx)(c.Accordion.Item,{...t,className:l(P.Item,e)})}function L({className:e,...t}){return(0,i.jsx)(c.Accordion.Header,{...t,className:l(P.Header,e)})}function R({children:e,className:t,...n}){return(0,i.jsxs)(c.Accordion.Trigger,{...n,className:l(P.Trigger,t),children:[(0,i.jsx)(`span`,{className:P.Label,children:e}),(0,i.jsx)(o.ChevronDown,{className:P.Icon,size:20,"aria-hidden":!0})]})}function z({children:e,className:t,...n}){return(0,i.jsx)(c.Accordion.Panel,{...n,className:l(P.Panel,t),children:(0,i.jsx)(`div`,{className:P.Content,children:e})})}var B={Intro:`_Intro_nxwj4_7`,Categories:`_Categories_nxwj4_39`,CategoryDescription:`_CategoryDescription_nxwj4_43`,Actions:`_Actions_nxwj4_52`,Save:`_Save_nxwj4_63`},V=`https://relative.invalid`;function H(e,t){try{return new URL(e,t)}catch{return null}}function U(e){let t=e.trim();if(!t)return!1;let n=H(t);return n?n.protocol===`https:`||n.protocol===`mailto:`:H(t,V)?.origin===V}function W({href:e,resolveHref:t=e=>e,children:n}){let r=t(e);return!r||!U(r)?(0,i.jsx)(i.Fragment,{children:n}):(0,i.jsx)(`a`,{href:r.trim(),target:`_blank`,rel:`noopener noreferrer`,children:n})}function G({node:e}){let t=e.text;return e.underline&&(t=(0,i.jsx)(`u`,{children:t})),e.italic&&(t=(0,i.jsx)(`em`,{children:t})),e.bold&&(t=(0,i.jsx)(`strong`,{children:t})),(0,i.jsx)(i.Fragment,{children:t})}function K({nodes:e,resolveHref:t}){return(0,i.jsx)(i.Fragment,{children:(e??[]).map((e,n)=>e.type===`text`?(0,i.jsx)(G,{node:e},n):e.type===`link`?(0,i.jsx)(W,{href:e.url??``,resolveHref:t,children:(e.children??[]).filter(e=>e.type===`text`).map((e,t)=>(0,i.jsx)(G,{node:e},t))},n):null)})}function q({node:e,resolveHref:t}){let n=e.format===`ordered`?`ol`:`ul`;return(0,i.jsx)(n,{children:(e.children??[]).map((e,n)=>e.type===`list`?(0,i.jsx)(`li`,{children:(0,i.jsx)(q,{node:e,resolveHref:t})},n):e.type===`list-item`?(0,i.jsx)(`li`,{children:(0,i.jsx)(K,{nodes:e.children,resolveHref:t})},n):null)})}function J({nodes:e,resolveHref:t}){return(0,i.jsx)(i.Fragment,{children:e.map((e,n)=>{switch(e.type){case`paragraph`:return(0,i.jsx)(`p`,{children:(0,i.jsx)(K,{nodes:e.children,resolveHref:t})},n);case`heading`:return(0,i.jsx)(`p`,{children:(0,i.jsx)(`strong`,{children:(0,i.jsx)(K,{nodes:e.children,resolveHref:t})})},n);case`list`:return(0,i.jsx)(q,{node:e,resolveHref:t},n);default:return null}})})}function Y(e){return{necessary:!0,preferences:e?.preferences??!1,analytics:e?.analytics??!1,marketing:e?.marketing??!1}}function X({category:e,copy:n,checked:r,onCheckedChange:a}){let o=(0,t.useId)(),s=(0,t.useId)(),{title:c,description:l}=n.categories[e];return(0,i.jsxs)(I,{value:e,children:[(0,i.jsxs)(L,{children:[(0,i.jsx)(R,{children:(0,i.jsx)(`span`,{id:o,children:c})}),(0,i.jsx)(N,{"aria-labelledby":o,"aria-describedby":l?s:void 0,checked:r,disabled:e===`necessary`,onCheckedChange:a})]}),(0,i.jsx)(z,{keepMounted:!0,children:l&&(0,i.jsx)(`p`,{id:s,className:B.CategoryDescription,children:l})})]})}function Z({open:n,consent:r,copy:a,resolveHref:o,onAcceptAll:s,onAcceptNecessary:c,onSave:l,onClose:u}){let d=r!==null,[f,p]=(0,t.useState)(()=>Y(r)),[m,g]=(0,t.useState)(n);return n!==m&&(g(n),n&&p(Y(r))),(0,i.jsx)(x,{open:n,onOpenChange:e=>{!e&&d&&u()},disablePointerDismissal:!d,children:(0,i.jsxs)(S,{children:[(0,i.jsx)(C,{}),(0,i.jsx)(w,{children:(0,i.jsxs)(T,{fullScreenOnMobile:!0,size:`md`,children:[(0,i.jsxs)(E,{children:[(0,i.jsx)(D,{children:a.modalTitle}),d&&(0,i.jsx)(j,{label:a.closeIconLabel})]}),(0,i.jsxs)(k,{children:[(0,i.jsx)(O,{render:(0,i.jsx)(`div`,{}),className:B.Intro,children:(0,i.jsx)(J,{nodes:a.intro,resolveHref:o})}),(0,i.jsx)(F,{variant:`solid`,iconPosition:`start`,multiple:!0,className:B.Categories,children:e.l.map(e=>(0,i.jsx)(X,{category:e,copy:a,checked:f[e],onCheckedChange:t=>p(n=>({...n,[e]:t}))},e))})]}),(0,i.jsxs)(A,{className:B.Actions,children:[(0,i.jsx)(h,{onClick:s,color:`secondary`,size:`sm`,children:a.btnAcceptAll}),(0,i.jsx)(h,{onClick:c,color:`secondary`,size:`sm`,children:a.btnAcceptNecessary}),(0,i.jsx)(h,{variant:`outline`,color:`secondary`,size:`sm`,className:B.Save,onClick:()=>l(e.l.filter(e=>f[e])),children:a.btnSaveSettings})]})]})})]})})}var Q=(0,t.createContext)(null);function $({market:n,copy:r,resolveHref:a,children:o}){let{consent:s,settingsOpen:c,ready:l}=(0,t.useSyncExternalStore)(e.c,e.i,e.r);(0,t.useEffect)(()=>{e.a({market:n})},[]);let u=(0,t.useMemo)(()=>({consent:s,openSettings:e.o}),[s]);return(0,i.jsxs)(Q.Provider,{value:u,children:[o,l&&(0,i.jsx)(Z,{open:c,consent:s,copy:r,resolveHref:a,onAcceptAll:()=>e.s(`all`),onAcceptNecessary:()=>e.s([]),onSave:e.s,onClose:e.t})]})}function ee(){let e=(0,t.useContext)(Q);if(!e)throw Error(`useCookieConsent must be used inside a CookieConsentProvider.`);return e}exports.CookieConsentProvider=$,exports.useCookieConsent=ee;
1
+ "use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});require('./cookie-consent.css');const e=require("./cookie-consent-core-fntGUdFt.cjs");let t=require("react"),n=require("@base-ui/react/button"),r=require("@base-ui/react/use-render"),i=require("react/jsx-runtime"),a=require("@base-ui/react/dialog"),o=require("lucide-react"),s=require("@base-ui/react/switch"),c=require("@base-ui/react/accordion");var l=(e,t)=>n=>[e,typeof t==`function`?t(n):t].filter(Boolean).join(` `),u={Button:`_Button_dq81c_1`,IconButton:`_IconButton_dq81c_141`,Spinner:`_Spinner_dq81c_172`,"button-spin":`_button-spin_dq81c_1`,SrOnly:`_SrOnly_dq81c_190`},d=e=>(0,t.isValidElement)(e)&&(e.props.href!=null||e.props.to!=null),f=e=>e.preventDefault();function p({loading:e=!1,disabled:t,className:a,render:o,nativeButton:s,focusableWhenDisabled:c,ref:l,...u}){let p=!!(t||e),m=d(o),h={"aria-busy":e||void 0,"data-loading":e||void 0};return(0,r.useRender)({enabled:m,render:m?o:void 0,ref:l,defaultTagName:`a`,props:{...u,...h,"aria-disabled":p||void 0,"data-disabled":p?``:void 0,className:typeof a==`function`?a({disabled:p}):a,onClick:p?f:u.onClick}})||(0,i.jsx)(n.Button,{...u,...h,ref:l,render:o,nativeButton:s,focusableWhenDisabled:c,disabled:p,className:a})}function m({variant:e=`solid`,color:t=`primary`,size:n=`md`,className:r,...a}){return(0,i.jsx)(p,{...a,"data-variant":e,"data-color":t,"data-size":n,className:l(u.Button,r)})}function h({startIcon:e,endIcon:t,loading:n=!1,loadingLabel:r,children:a,...o}){return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(m,{...o,loading:n,"data-start-icon":n||e!=null||void 0,"data-end-icon":t!=null||void 0,children:[n?(0,i.jsx)(`span`,{className:u.Spinner,"aria-hidden":!0}):e,a,t]}),r!=null&&(0,i.jsx)(`span`,{role:`status`,className:u.SrOnly,children:n?r:null})]})}var g={Backdrop:`_Backdrop_1do7v_8`,Viewport:`_Viewport_1do7v_22`,Popup:`_Popup_1do7v_38`,Header:`_Header_1do7v_78`,Title:`_Title_1do7v_88`,Description:`_Description_1do7v_97`,Content:`_Content_1do7v_111`,Footer:`_Footer_1do7v_119`,CloseButton:`_CloseButton_1do7v_135`},_=(0,t.createContext)(`no`),v=()=>(0,t.useContext)(_);function y(e){return function(){let t=v(),n={};return Object.keys(e).forEach(r=>{let i=e[r];n[r]=i[t]??i.no}),n}}var b=y({close:{no:`Lukk`,se:`Stäng`,fi:`Sulje`,es:`Cerrar`}}),x=a.Dialog.Root;a.Dialog.Trigger;var S=a.Dialog.Portal;function C({className:e,...t}){return(0,i.jsx)(a.Dialog.Backdrop,{...t,className:l(g.Backdrop,e)})}function w({className:e,...t}){return(0,i.jsx)(a.Dialog.Viewport,{...t,className:l(g.Viewport,e)})}function T({size:e=`sm`,fullScreenOnMobile:t,className:n,...r}){return(0,i.jsx)(a.Dialog.Popup,{...r,"data-size":e,"data-full-screen-on-mobile":t||void 0,className:l(g.Popup,n)})}function E({className:e,...t}){return(0,i.jsx)(`div`,{...t,className:[g.Header,e].filter(Boolean).join(` `)})}function D({className:e,...t}){return(0,i.jsx)(a.Dialog.Title,{...t,className:l(g.Title,e)})}function O({className:e,...t}){return(0,i.jsx)(a.Dialog.Description,{...t,className:l(g.Description,e)})}function k({className:e,...t}){return(0,i.jsx)(`div`,{...t,className:[g.Content,e].filter(Boolean).join(` `)})}function A({className:e,...t}){return(0,i.jsx)(`div`,{...t,className:[g.Footer,e].filter(Boolean).join(` `)})}a.Dialog.Close;function j({label:e,className:t,...n}){let r=b();return(0,i.jsx)(a.Dialog.Close,{...n,"aria-label":e??r.close,className:l(g.CloseButton,t),children:(0,i.jsx)(o.X,{size:20,"aria-hidden":!0})})}var M={Switch:`_Switch_9c9ji_7`,Thumb:`_Thumb_9c9ji_36`};function N({className:e,...t}){return(0,i.jsx)(s.Switch.Root,{...t,className:l(M.Switch,e),children:(0,i.jsx)(s.Switch.Thumb,{className:M.Thumb})})}var P={Root:`_Root_oibl2_13`,Item:`_Item_oibl2_10`,Header:`_Header_oibl2_10`,Trigger:`_Trigger_oibl2_108`,Label:`_Label_oibl2_149`,Icon:`_Icon_oibl2_153`,Panel:`_Panel_oibl2_171`,Content:`_Content_oibl2_182`};function F({variant:e=`outline`,iconPosition:t=`end`,className:n,...r}){return(0,i.jsx)(c.Accordion.Root,{...r,"data-variant":e,"data-icon-position":t,className:l(P.Root,n)})}function I({className:e,...t}){return(0,i.jsx)(c.Accordion.Item,{...t,className:l(P.Item,e)})}function L({className:e,...t}){return(0,i.jsx)(c.Accordion.Header,{...t,className:l(P.Header,e)})}function R({children:e,className:t,...n}){return(0,i.jsxs)(c.Accordion.Trigger,{...n,className:l(P.Trigger,t),children:[(0,i.jsx)(`span`,{className:P.Label,children:e}),(0,i.jsx)(o.ChevronDown,{className:P.Icon,size:20,"aria-hidden":!0})]})}function z({children:e,className:t,...n}){return(0,i.jsx)(c.Accordion.Panel,{...n,className:l(P.Panel,t),children:(0,i.jsx)(`div`,{className:P.Content,children:e})})}var B={Intro:`_Intro_nxwj4_7`,Categories:`_Categories_nxwj4_39`,CategoryDescription:`_CategoryDescription_nxwj4_43`,Actions:`_Actions_nxwj4_52`,Save:`_Save_nxwj4_63`},V=`https://relative.invalid`;function H(e,t){try{return new URL(e,t)}catch{return null}}function U(e){let t=e.trim();if(!t)return!1;let n=H(t);return n?n.protocol===`https:`||n.protocol===`mailto:`:H(t,V)?.origin===V}function W({href:e,resolveHref:t=e=>e,children:n}){let r=t(e);return!r||!U(r)?(0,i.jsx)(i.Fragment,{children:n}):(0,i.jsx)(`a`,{href:r.trim(),target:`_blank`,rel:`noopener noreferrer`,children:n})}function G({node:e}){let t=e.text;return e.underline&&(t=(0,i.jsx)(`u`,{children:t})),e.italic&&(t=(0,i.jsx)(`em`,{children:t})),e.bold&&(t=(0,i.jsx)(`strong`,{children:t})),(0,i.jsx)(i.Fragment,{children:t})}function K({nodes:e,resolveHref:t}){return(0,i.jsx)(i.Fragment,{children:(e??[]).map((e,n)=>e.type===`text`?(0,i.jsx)(G,{node:e},n):e.type===`link`?(0,i.jsx)(W,{href:e.url??``,resolveHref:t,children:(e.children??[]).filter(e=>e.type===`text`).map((e,t)=>(0,i.jsx)(G,{node:e},t))},n):null)})}function q({node:e,resolveHref:t}){let n=e.format===`ordered`?`ol`:`ul`;return(0,i.jsx)(n,{children:(e.children??[]).map((e,n)=>e.type===`list`?(0,i.jsx)(`li`,{children:(0,i.jsx)(q,{node:e,resolveHref:t})},n):e.type===`list-item`?(0,i.jsx)(`li`,{children:(0,i.jsx)(K,{nodes:e.children,resolveHref:t})},n):null)})}function J({nodes:e,resolveHref:t}){return(0,i.jsx)(i.Fragment,{children:e.map((e,n)=>{switch(e.type){case`paragraph`:return(0,i.jsx)(`p`,{children:(0,i.jsx)(K,{nodes:e.children,resolveHref:t})},n);case`heading`:return(0,i.jsx)(`p`,{children:(0,i.jsx)(`strong`,{children:(0,i.jsx)(K,{nodes:e.children,resolveHref:t})})},n);case`list`:return(0,i.jsx)(q,{node:e,resolveHref:t},n);default:return null}})})}function Y(e){return{necessary:!0,preferences:e?.preferences??!1,analytics:e?.analytics??!1,marketing:e?.marketing??!1}}function X({category:e,copy:n,checked:r,onCheckedChange:a}){let o=(0,t.useId)(),s=(0,t.useId)(),{title:c,description:l}=n.categories[e];return(0,i.jsxs)(I,{value:e,children:[(0,i.jsxs)(L,{children:[(0,i.jsx)(R,{children:(0,i.jsx)(`span`,{id:o,children:c})}),(0,i.jsx)(N,{"aria-labelledby":o,"aria-describedby":l?s:void 0,checked:r,disabled:e===`necessary`,onCheckedChange:a})]}),(0,i.jsx)(z,{keepMounted:!0,children:l&&(0,i.jsx)(`p`,{id:s,className:B.CategoryDescription,children:l})})]})}function Z({open:n,consent:r,copy:a,resolveHref:o,onAcceptAll:s,onAcceptNecessary:c,onSave:l,onClose:u}){let d=r!==null,[f,p]=(0,t.useState)(()=>Y(r)),[m,g]=(0,t.useState)(n);return n!==m&&(g(n),n&&p(Y(r))),(0,i.jsx)(x,{open:n,onOpenChange:e=>{!e&&d&&u()},disablePointerDismissal:!d,children:(0,i.jsxs)(S,{children:[(0,i.jsx)(C,{}),(0,i.jsx)(w,{children:(0,i.jsxs)(T,{fullScreenOnMobile:!0,size:`md`,children:[(0,i.jsxs)(E,{children:[(0,i.jsx)(D,{children:a.modalTitle}),d&&(0,i.jsx)(j,{label:a.closeIconLabel})]}),(0,i.jsxs)(k,{children:[(0,i.jsx)(O,{render:(0,i.jsx)(`div`,{}),className:B.Intro,children:(0,i.jsx)(J,{nodes:a.intro,resolveHref:o})}),(0,i.jsx)(F,{variant:`solid`,iconPosition:`start`,multiple:!0,className:B.Categories,children:e.l.map(e=>(0,i.jsx)(X,{category:e,copy:a,checked:f[e],onCheckedChange:t=>p(n=>({...n,[e]:t}))},e))})]}),(0,i.jsxs)(A,{className:B.Actions,children:[(0,i.jsx)(h,{onClick:s,color:`secondary`,size:`sm`,children:a.btnAcceptAll}),(0,i.jsx)(h,{onClick:c,color:`secondary`,size:`sm`,children:a.btnAcceptNecessary}),(0,i.jsx)(h,{variant:`outline`,color:`secondary`,size:`sm`,className:B.Save,onClick:()=>l(e.l.filter(e=>f[e])),children:a.btnSaveSettings})]})]})})]})})}var Q=(0,t.createContext)(null);function $({market:n,copy:r,resolveHref:a,children:o}){let{consent:s,settingsOpen:c,ready:l}=(0,t.useSyncExternalStore)(e.c,e.i,e.r);(0,t.useEffect)(()=>{e.a({market:n})},[]);let u=(0,t.useMemo)(()=>({consent:s,openSettings:e.o}),[s]);return(0,i.jsxs)(Q.Provider,{value:u,children:[o,l&&(0,i.jsx)(Z,{open:c,consent:s,copy:r,resolveHref:a,onAcceptAll:()=>e.s(`all`),onAcceptNecessary:()=>e.s([]),onSave:e.s,onClose:e.t})]})}function ee(){let e=(0,t.useContext)(Q);if(!e)throw Error(`useCookieConsent must be used inside a CookieConsentProvider.`);return e}exports.CookieConsentProvider=$,exports.useCookieConsent=ee;
2
2
  //# sourceMappingURL=cookie-consent-react.cjs.map