@uninspired/cookie-banner 0.0.8 → 0.0.10

package/dist/script/style.css

@@ -1 +1 @@
-._root_hw69b_1{all:unset;cursor:pointer;will-change:background-color;transition:background-color .15s ease-in-out;font-size:var(--cb-font-size-caption);line-height:var(--cb-line-height-caption);font-family:var(--cb-font-family-caption);letter-spacing:var(--cb-letter-spacing-caption);font-weight:var(--cb-font-weight-caption-bold);padding:var(--cb-space-xs) var(--cb-space-sm);border-radius:var(--cb-radius-md);display:flex;flex-direction:row;align-items:center}._root_hw69b_1._neutral_hw69b_17{background-color:var(--cb-color-button-neutral-background);color:var(--cb-color-button-neutral-foreground)}._root_hw69b_1._neutral_hw69b_17:hover{background-color:var(--cb-color-button-neutral-background-hover)}._root_hw69b_1._neutral_hw69b_17:active{background-color:var(--cb-color-button-neutral-background-active)}._root_hw69b_1._brand_hw69b_30{background-color:var(--cb-color-button-brand-background);color:var(--cb-color-button-brand-foreground)}._root_hw69b_1._brand_hw69b_30:hover{background-color:var(--cb-color-button-brand-background-hover)}._root_hw69b_1._brand_hw69b_30:active{background-color:var(--cb-color-button-brand-background-active)}._root_hw69b_1._ghost_hw69b_43{background-color:var(--cb-color-button-ghost-background);color:var(--cb-color-button-ghost-foreground)}._root_hw69b_1._ghost_hw69b_43:hover{background-color:var(--cb-color-button-ghost-background-hover)}._root_hw69b_1._ghost_hw69b_43:active{background-color:var(--cb-color-button-ghost-background-active)}._root_14l5h_1{color:var(--cb-color-text-default)}._root_14l5h_1._muted_14l5h_4{color:var(--cb-color-text-muted)}._root_14l5h_1._body_14l5h_8{font-size:var(--cb-font-size-body);font-family:var(--cb-font-family-body);line-height:var(--cb-line-height-body);letter-spacing:var(--cb-letter-spacing-body)}._root_14l5h_1._body_14l5h_8._normal_14l5h_14{font-weight:var(--cb-font-weight-body-normal)}._root_14l5h_1._body_14l5h_8._bold_14l5h_18{font-weight:var(--cb-font-weight-body-bold)}._root_14l5h_1._caption_14l5h_23{font-size:var(--cb-font-size-caption);font-family:var(--cb-font-family-caption);line-height:var(--cb-line-height-caption);letter-spacing:var(--cb-letter-spacing-caption)}._root_14l5h_1._caption_14l5h_23._normal_14l5h_14{font-weight:var(--cb-font-weight-caption-normal)}._root_14l5h_1._caption_14l5h_23._bold_14l5h_18{font-weight:var(--cb-font-weight-caption-bold)}._root_14l5h_1 a{all:unset;color:var(--cb-color-text-link);cursor:pointer;text-decoration:none}._root_14l5h_1 a:hover{color:var(--cb-color-text-link-hover);text-decoration:underline}@keyframes _contentShow_1wsw7_1{0%{opacity:0;transform:translate(-100px)}to{opacity:1;transform:translate(0)}}@keyframes _slideDown_1wsw7_1{0%{max-height:var(--cb-size-settings-max-height);overflow:auto}1%{max-height:var(--cb-size-settings-max-height);overflow:hidden}to{max-height:0;overflow:hidden}}@keyframes _slideUp_1wsw7_1{0%{max-height:0;overflow:hidden}99%{max-height:var(--cb-size-settings-max-height);overflow:hidden}to{max-height:var(--cb-size-settings-max-height);overflow:auto}}._root_1wsw7_42{display:flex;flex-direction:column;gap:var(--cb-space-md);padding:var(--cb-space-md);background-color:var(--cb-color-background-default);box-shadow:var(--cb-shadow-lg);border-radius:var(--cb-radius-md);overflow:hidden;animation:_contentShow_1wsw7_1 .15s cubic-bezier(.16,1,.3,1)}._root_1wsw7_42._noTarget_1wsw7_53{position:fixed;bottom:var(--cb-space-md);left:var(--cb-space-md);width:100%;max-width:var(--cb-size-banner-max-width)}._root_1wsw7_42 ._collapsible_1wsw7_62{display:contents}._root_1wsw7_42 ._collapsible_1wsw7_62 ._header_1wsw7_65{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:var(--cb-space-md)}._root_1wsw7_42 ._collapsible_1wsw7_62 ._header_1wsw7_65 ._heading_1wsw7_72{display:flex;flex-direction:column;align-items:flex-start}._root_1wsw7_42 ._collapsible_1wsw7_62 ._header_1wsw7_65 ._chevron_1wsw7_78{transform:rotate(0);will-change:transform;transition:transform .15s ease-out}._root_1wsw7_42 ._collapsible_1wsw7_62 ._header_1wsw7_65 ._chevron_1wsw7_78._open_1wsw7_83{transform:rotate(180deg)}._root_1wsw7_42 ._collapsible_1wsw7_62 ._settings_1wsw7_89{display:flex;flex-direction:column;background-color:var(--cb-color-background-muted);border-radius:var(--cb-radius-md);overflow:hidden;will-change:max-height,overflow;animation:_slideDown_1wsw7_1 .25s ease-out}._root_1wsw7_42 ._collapsible_1wsw7_62 ._settings_1wsw7_89[data-state=open]{animation:_slideUp_1wsw7_1 .25s ease-out}._root_1wsw7_42 ._collapsible_1wsw7_62 ._footer_1wsw7_103{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--cb-space-md)}._root_1wsw7_42 ._collapsible_1wsw7_62 ._footer_1wsw7_103 ._actions_1wsw7_113{display:flex;flex-direction:row;align-items:center;gap:var(--cb-space-md)}:root{--cb-color-background-default: var(--cb-color-neutral-0);--cb-color-background-muted: var(--cb-color-neutral-50);--cb-color-text-default: var(--cb-color-neutral-900);--cb-color-text-muted: var(--cb-color-neutral-500);--cb-color-text-link: var(--cb-color-brand-600);--cb-color-text-link-hover: var(--cb-color-brand-700);--cb-color-border-neutral: var(--cb-color-neutral-200);--cb-color-border-brand: var(--cb-color-brand-200);--cb-color-switch-background-neutral: var(--cb-color-neutral-100);--cb-color-switch-background-light: var(--cb-color-brand-500);--cb-color-switch-background-brand: var(--cb-color-brand-600);--cb-color-switch-background-disabled: var(--cb-color-neutral-300);--cb-color-switch-thumb-background-neutral: var(--cb-color-neutral-0);--cb-color-button-neutral-background: var(--cb-color-neutral-100);--cb-color-button-neutral-background-hover: var(--cb-color-neutral-200);--cb-color-button-neutral-background-active: var(--cb-color-neutral-100);--cb-color-button-neutral-foreground: var(--cb-color-neutral-700);--cb-color-button-brand-background: var(--cb-color-brand-100);--cb-color-button-brand-background-hover: var(--cb-color-brand-200);--cb-color-button-brand-background-active: var(--cb-color-brand-100);--cb-color-button-brand-foreground: var(--cb-color-brand-700);--cb-color-button-ghost-background: rgba(0, 0, 0, 0);--cb-color-button-ghost-background-hover: var(--cb-color-neutral-200);--cb-color-button-ghost-background-active: var(--cb-color-neutral-100);--cb-color-button-ghost-foreground: var(--cb-color-neutral-700)}
+._root_hw69b_1{all:unset;cursor:pointer;will-change:background-color;transition:background-color .15s ease-in-out;font-size:var(--cb-font-size-caption);line-height:var(--cb-line-height-caption);font-family:var(--cb-font-family-caption);letter-spacing:var(--cb-letter-spacing-caption);font-weight:var(--cb-font-weight-caption-bold);padding:var(--cb-space-xs) var(--cb-space-sm);border-radius:var(--cb-radius-md);display:flex;flex-direction:row;align-items:center}._root_hw69b_1._neutral_hw69b_17{background-color:var(--cb-color-button-neutral-background);color:var(--cb-color-button-neutral-foreground)}._root_hw69b_1._neutral_hw69b_17:hover{background-color:var(--cb-color-button-neutral-background-hover)}._root_hw69b_1._neutral_hw69b_17:active{background-color:var(--cb-color-button-neutral-background-active)}._root_hw69b_1._brand_hw69b_30{background-color:var(--cb-color-button-brand-background);color:var(--cb-color-button-brand-foreground)}._root_hw69b_1._brand_hw69b_30:hover{background-color:var(--cb-color-button-brand-background-hover)}._root_hw69b_1._brand_hw69b_30:active{background-color:var(--cb-color-button-brand-background-active)}._root_hw69b_1._ghost_hw69b_43{background-color:var(--cb-color-button-ghost-background);color:var(--cb-color-button-ghost-foreground)}._root_hw69b_1._ghost_hw69b_43:hover{background-color:var(--cb-color-button-ghost-background-hover)}._root_hw69b_1._ghost_hw69b_43:active{background-color:var(--cb-color-button-ghost-background-active)}._root_14l5h_1{color:var(--cb-color-text-default)}._root_14l5h_1._muted_14l5h_4{color:var(--cb-color-text-muted)}._root_14l5h_1._body_14l5h_8{font-size:var(--cb-font-size-body);font-family:var(--cb-font-family-body);line-height:var(--cb-line-height-body);letter-spacing:var(--cb-letter-spacing-body)}._root_14l5h_1._body_14l5h_8._normal_14l5h_14{font-weight:var(--cb-font-weight-body-normal)}._root_14l5h_1._body_14l5h_8._bold_14l5h_18{font-weight:var(--cb-font-weight-body-bold)}._root_14l5h_1._caption_14l5h_23{font-size:var(--cb-font-size-caption);font-family:var(--cb-font-family-caption);line-height:var(--cb-line-height-caption);letter-spacing:var(--cb-letter-spacing-caption)}._root_14l5h_1._caption_14l5h_23._normal_14l5h_14{font-weight:var(--cb-font-weight-caption-normal)}._root_14l5h_1._caption_14l5h_23._bold_14l5h_18{font-weight:var(--cb-font-weight-caption-bold)}._root_14l5h_1 a{all:unset;color:var(--cb-color-text-link);cursor:pointer;text-decoration:none}._root_14l5h_1 a:hover{color:var(--cb-color-text-link-hover);text-decoration:underline}@keyframes _contentShow_2wcp0_1{0%{opacity:0;transform:translate(-100px)}to{opacity:1;transform:translate(0)}}@keyframes _contentHide_2wcp0_1{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-100px)}}@keyframes _slideDown_2wcp0_1{0%{max-height:var(--cb-size-settings-max-height);overflow:auto}1%{max-height:var(--cb-size-settings-max-height);overflow:hidden}to{max-height:0;overflow:hidden}}@keyframes _slideUp_2wcp0_1{0%{max-height:0;overflow:hidden}99%{max-height:var(--cb-size-settings-max-height);overflow:hidden}to{max-height:var(--cb-size-settings-max-height);overflow:auto}}._root_2wcp0_53{display:none;visibility:hidden;flex-direction:column;gap:var(--cb-space-md);padding:var(--cb-space-md);background-color:var(--cb-color-background-default);box-shadow:var(--cb-shadow-lg);border-radius:var(--cb-radius-md);overflow:hidden;will-change:opacity,transform;animation:_contentHide_2wcp0_1 .15s cubic-bezier(.16,1,.3,1)}._root_2wcp0_53._open_2wcp0_66{visibility:visible;display:flex;animation:_contentShow_2wcp0_1 .15s cubic-bezier(.16,1,.3,1)}._root_2wcp0_53._noTarget_2wcp0_72{position:fixed;bottom:var(--cb-space-md);left:var(--cb-space-md);width:100%;max-width:var(--cb-size-banner-max-width)}._root_2wcp0_53 ._collapsible_2wcp0_81{display:contents}._root_2wcp0_53 ._collapsible_2wcp0_81 ._header_2wcp0_84{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:var(--cb-space-md)}._root_2wcp0_53 ._collapsible_2wcp0_81 ._header_2wcp0_84 ._heading_2wcp0_91{display:flex;flex-direction:column;align-items:flex-start}._root_2wcp0_53 ._collapsible_2wcp0_81 ._header_2wcp0_84 ._chevron_2wcp0_97{transform:rotate(0);will-change:transform;transition:transform .15s ease-out}._root_2wcp0_53 ._collapsible_2wcp0_81 ._header_2wcp0_84 ._chevron_2wcp0_97._open_2wcp0_66{transform:rotate(180deg)}._root_2wcp0_53 ._collapsible_2wcp0_81 ._settings_2wcp0_108{display:flex;flex-direction:column;background-color:var(--cb-color-background-muted);border-radius:var(--cb-radius-md);overflow:hidden;will-change:max-height,overflow;animation:_slideDown_2wcp0_1 .25s ease-out}._root_2wcp0_53 ._collapsible_2wcp0_81 ._settings_2wcp0_108[data-state=open]{animation:_slideUp_2wcp0_1 .25s ease-out}._root_2wcp0_53 ._collapsible_2wcp0_81 ._footer_2wcp0_122{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--cb-space-md)}._root_2wcp0_53 ._collapsible_2wcp0_81 ._footer_2wcp0_122 ._actions_2wcp0_132{display:flex;flex-direction:row;align-items:center;gap:var(--cb-space-md)}@keyframes _slideDown_mqtha_1{0%{height:0}to{height:var(--radix-accordion-content-height)}}@keyframes _slideUp_mqtha_1{0%{height:var(--radix-accordion-content-height)}to{height:0}}._root_mqtha_19{display:flex;flex-direction:column;overflow:hidden}._root_mqtha_19 ._header_mqtha_24{all:unset;display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--cb-space-sm) var(--cb-space-md);cursor:pointer}._root_mqtha_19 ._header_mqtha_24 ._label_mqtha_33{display:flex;flex-direction:column;width:100%}._root_mqtha_19 ._header_mqtha_24 ._actions_mqtha_39{display:flex;flex-direction:row;align-items:center;gap:var(--cb-space-sm)}._root_mqtha_19 ._header_mqtha_24 ._actions_mqtha_39 ._chevron_mqtha_45{color:var(--cb-color-text-default);transition:transform .15s ease-out;will-change:transform;transform:rotate(0)}._root_mqtha_19 ._header_mqtha_24 ._actions_mqtha_39 ._chevron_mqtha_45._open_mqtha_51{transform:rotate(180deg)}._root_mqtha_19 ._description_mqtha_58{padding:var(--cb-space-xs) var(--cb-space-md);max-width:96ch;overflow:hidden}._root_mqtha_19 ._description_mqtha_58[data-state=open]{animation:_slideDown_mqtha_1 .15s ease-out}._root_mqtha_19 ._description_mqtha_58[data-state=closed]{animation:_slideUp_mqtha_1 .15s ease-out}._root_dibqz_1{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--cb-space-sm)}._root_dibqz_1 ._switch_dibqz_8{width:32px;height:20px;padding:2px;border-width:1px;border-style:solid;border-color:var(--cb-color-border-neutral);border-radius:9999px;will-change:background-color;transition:background-color .15s ease-out;background-color:var(--cb-color-switch-background-neutral);position:relative}._root_dibqz_1 ._switch_dibqz_8[data-state=checked]{background-color:var(--cb-color-switch-background-brand)}._root_dibqz_1 ._switch_dibqz_8[data-disabled]{cursor:not-allowed;background-color:var(--cb-color-switch-background-disabled)}._root_dibqz_1 ._switch_dibqz_8:not([data-disabled]){cursor:pointer}._root_dibqz_1 ._switch_dibqz_8:not([data-disabled]):hover{background-color:var(--cb-color-switch-background-light)}._root_dibqz_1 ._switch_dibqz_8 ._thumb_dibqz_38{width:14px;height:14px;position:absolute;left:0;top:0;background-color:var(--cb-color-switch-thumb-background-neutral);box-shadow:var(--cb-shadow-sm);border-radius:9999px;transition:transform .15s ease-out;transform:translate(2px) translateY(2px);will-change:transform}._root_dibqz_1 ._switch_dibqz_8 ._thumb_dibqz_38[data-state=checked]{transform:translate(14px) translateY(2px)}:root{--cb-color-background-default: var(--cb-color-neutral-0);--cb-color-background-muted: var(--cb-color-neutral-50);--cb-color-text-default: var(--cb-color-neutral-900);--cb-color-text-muted: var(--cb-color-neutral-500);--cb-color-text-link: var(--cb-color-brand-600);--cb-color-text-link-hover: var(--cb-color-brand-700);--cb-color-border-neutral: var(--cb-color-neutral-200);--cb-color-border-brand: var(--cb-color-brand-200);--cb-color-switch-background-neutral: var(--cb-color-neutral-100);--cb-color-switch-background-light: var(--cb-color-brand-500);--cb-color-switch-background-brand: var(--cb-color-brand-600);--cb-color-switch-background-disabled: var(--cb-color-neutral-300);--cb-color-switch-thumb-background-neutral: var(--cb-color-neutral-0);--cb-color-button-neutral-background: var(--cb-color-neutral-100);--cb-color-button-neutral-background-hover: var(--cb-color-neutral-200);--cb-color-button-neutral-background-active: var(--cb-color-neutral-100);--cb-color-button-neutral-foreground: var(--cb-color-neutral-700);--cb-color-button-brand-background: var(--cb-color-brand-100);--cb-color-button-brand-background-hover: var(--cb-color-brand-200);--cb-color-button-brand-background-active: var(--cb-color-brand-100);--cb-color-button-brand-foreground: var(--cb-color-brand-700);--cb-color-button-ghost-background: rgba(0, 0, 0, 0);--cb-color-button-ghost-background-hover: var(--cb-color-neutral-200);--cb-color-button-ghost-background-active: var(--cb-color-neutral-100);--cb-color-button-ghost-foreground: var(--cb-color-neutral-700)}

package/package.json

@@ -4,7 +4,7 @@
   "author": "Chris Kolb <chris@uninspired.studio>",
   "license": "MIT",
   "private": false,
-  "version": "0.0.8",
+  "version": "0.0.10",
   "type": "module",
   "exports": {
     "./react": {
@@ -38,9 +38,7 @@
   "peerDependencies": {
     "react": "^18",
     "react-dom": "^18",
-    "preact": "^10.28.4"
-  },
-  "dependencies": {
+    "preact": "^10.28.4",
     "@radix-ui/react-accordion": "^1.2.12",
     "@radix-ui/react-collapsible": "^1.1.12",
     "@radix-ui/react-dialog": "^1.1.15",

package/dist/components/Banner/Banner.js

@@ -1,38 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
-import { useMemo, useState } from "react";
-import { cls, clx } from "../../utils/classes";
-import { Button } from "../Button";
-import { Text } from "../Text";
-import classes from "./Banner.module.css";
-import {} from "../BannerItem";
-// import { BannerItem, type BannerItemOptions } from "../BannerItem";
-// import { Root as AccordionRoot } from "@radix-ui/react-accordion";
-import { ChevronUp } from "lucide-react";
-import { SelectionProvider, useSelection, } from "../../contexts/SelectionContext";
-import { Root as DialogRoot, Content as DialogContent, Title as DialogTitle, Description as DialogDescription, Close as DialogClose, } from "@radix-ui/react-dialog";
-import { Root as CollapsibleRoot, Trigger as CollapsibleTrigger,
-// Content as CollapsibleContent,
- } from "@radix-ui/react-collapsible";
-import "../../styles/variables.css";
-const BannerContent = ({ noTarget = true, heading = "We use cookies.", subheading = "Please define your selection below.", selectLabel = "Select", hideLabel = "Hide", saveLabel = "Save selection", declineLabel = "Decline all", defaultSettingsOpen = true, privacyPolicy,
-// items,
- }) => {
-    const { onSave, onDeclineAll, selectionTaken } = useSelection();
-    // const [openItem, setOpenItem] = useState<string | undefined>(undefined);
-    const [settingsOpen, setSettingsOpen] = useState(defaultSettingsOpen);
-    return (_jsx(DialogRoot, { open: !selectionTaken, children: _jsx(DialogContent, { className: cls(classes.root, noTarget ? classes.noTarget : ""), children: _jsxs(CollapsibleRoot, { open: settingsOpen, onOpenChange: setSettingsOpen, className: classes.collapsible, children: [_jsxs("div", { className: classes.header, children: [_jsxs("div", { className: classes.heading, children: [_jsx(DialogTitle, { asChild: true, children: _jsx(Text, { weight: "bold", children: heading }) }), _jsx(DialogDescription, { asChild: true, children: _jsx(Text, { size: "caption", color: "muted", children: subheading }) })] }), _jsx(CollapsibleTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", children: [settingsOpen ? hideLabel : selectLabel, "\u00A0", _jsx(ChevronUp, { size: 12, className: clx({
-                                                [classes.chevron]: true,
-                                                [classes.open]: settingsOpen,
-                                            }) })] }) })] }), _jsxs("div", { className: classes.footer, children: [_jsx("div", { className: classes.legal, children: privacyPolicy && (_jsx(Text, { size: "caption", children: _jsx("a", { href: privacyPolicy.url, target: "_blank", children: privacyPolicy.label }) })) }), _jsxs("div", { className: classes.actions, children: [_jsx(DialogClose, { asChild: true, children: _jsx(Button, { variant: "neutral", onClick: () => onDeclineAll(), children: declineLabel }) }), _jsx(DialogClose, { asChild: true, children: _jsx(Button, { variant: "brand", onClick: () => onSave(), children: saveLabel }) })] })] })] }) }) }));
-};
-export const Banner = ({ localStorageKey = "cb-selection", items, ...rest }) => {
-    const selectionItems = useMemo(() => items
-        .filter((item) => !item.required)
-        .map((item) => ({
-        value: item.value,
-        script: item.script,
-        defaultSelected: item.defaultSelected,
-        required: item.required,
-    })), [items]);
-    return (_jsx(SelectionProvider, { items: selectionItems, localStorageKey: localStorageKey, children: _jsx(BannerContent, { items: items, ...rest }) }));
-};

package/dist/components/Banner/index.js

@@ -1 +0,0 @@
-export * from "./Banner";

package/dist/components/BannerItem/BannerItem.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
-import classes from "./BannerItem.module.css";
-import {} from "../../utils/scriptDefinition";
-import { Text } from "../Text";
-import { Item, Trigger, Content } from "@radix-ui/react-accordion";
-import { ChevronDown } from "lucide-react";
-import { clx } from "../../utils/classes";
-import { Switch } from "../Switch";
-import { useEffect, useMemo } from "react";
-import { useSelection } from "../../contexts/SelectionContext";
-export const BannerItem = ({ value, label, sublabel, required = false, description, openItem, }) => {
-    const { toggleSelection, selection } = useSelection();
-    const selected = useMemo(() => selection?.[value] ?? false, [selection, value]);
-    useEffect(() => {
-        toggleSelection(value, selected);
-    }, [value, selected]);
-    const checked = useMemo(() => (required ? true : selected), [required, selected]);
-    const onCheckedChange = useMemo(() => (checked) => required ? () => { } : toggleSelection(value, checked), [required, toggleSelection, value]);
-    const disabled = useMemo(() => required, [required]);
-    return (_jsxs(Item, { value: value, className: classes.root, children: [_jsxs("div", { className: classes.header, children: [_jsx(Trigger, { asChild: true, children: _jsxs("div", { className: classes.label, children: [_jsx(Text, { weight: "bold", children: label }), sublabel && (_jsx(Text, { size: "caption", color: "muted", children: sublabel }))] }) }), _jsxs("div", { className: classes.actions, children: [_jsx(Switch, { checked: checked, onCheckedChange: onCheckedChange, disabled: disabled }), _jsx(Trigger, { asChild: true, children: _jsx(ChevronDown, { size: 16, className: clx({
-                                        [classes.chevron]: true,
-                                        [classes.open]: openItem === value,
-                                    }) }) })] })] }), description && (_jsx(Content, { className: classes.description, children: _jsx(Text, { size: "caption", dangerouslySetInnerHTML: { __html: description } }) }))] }));
-};

package/dist/components/BannerItem/index.js

@@ -1 +0,0 @@
-export * from "./BannerItem";

package/dist/components/Button/Button.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import classes from "./Button.module.css";
-import { cls } from "../../utils/classes";
-export const Button = ({ variant = "neutral", ...rest }) => {
-    return _jsx("button", { className: cls(classes.root, classes[variant]), ...rest });
-};

package/dist/components/Button/index.js

@@ -1 +0,0 @@
-export * from "./Button";

package/dist/components/Switch/Switch.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
-import { Root, Thumb, } from "@radix-ui/react-switch";
-import classes from "./Switch.module.css";
-import { Text } from "../Text";
-export const Switch = ({ label, id, ...rest }) => {
-    return (_jsxs("div", { className: classes.root, children: [label && (_jsx(Text, { className: classes.label, as: "label", htmlFor: id, children: label })), _jsx(Root, { className: classes.switch, ...rest, children: _jsx(Thumb, { className: classes.thumb }) })] }));
-};

package/dist/components/Switch/index.js

@@ -1 +0,0 @@
-export * from "./Switch";

package/dist/components/Text/Text.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import { cls } from "../../utils/classes";
-import classes from "./Text.module.css";
-export const Text = ({ as = "span", size = "body", weight = "normal", color = "default", ...rest }) => {
-    const Component = as ?? "span";
-    return (
-    // @ts-ignore
-    _jsx(Component, { className: cls(classes.root, classes[size], classes[weight], classes[color]), ...rest }));
-};

package/dist/components/Text/index.js

@@ -1 +0,0 @@
-export * from "./Text";

package/dist/contexts/SelectionContext.js

@@ -1,101 +0,0 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import { createContext, useCallback, useContext, useEffect, useMemo, useState, } from "react";
-import { selectionSchema } from "../utils/selection";
-import { scriptDefinitionSchema } from "../utils/scriptDefinition";
-export const SelectionContext = createContext(null);
-export const SelectionProvider = ({ children, items, localStorageKey, }) => {
-    function getLsSelection(localStorageKey) {
-        const storedSelection = localStorage.getItem(localStorageKey);
-        if (!storedSelection)
-            return null;
-        const { success, data } = selectionSchema.safeParse(JSON.parse(storedSelection));
-        if (!success)
-            return null;
-        return data;
-    }
-    const defaultSelection = useMemo(() => Object.fromEntries(items.map((item) => [item.value, item.defaultSelected ?? false])), [items]);
-    const [selection, setSelection] = useState(getLsSelection(localStorageKey) ?? defaultSelection);
-    const [savedSelection, setSavedSelection] = useState(getLsSelection(localStorageKey));
-    function toggleSelection(key, value) {
-        const newSelection = selection
-            ? { ...selection, [key]: value }
-            : { [key]: value };
-        setSelection(newSelection);
-    }
-    useEffect(() => {
-        let selectedValues = [];
-        if (savedSelection !== null) {
-            selectedValues = Object.entries(savedSelection)
-                .filter(([_, value]) => value)
-                .map(([key]) => key);
-        }
-        const mountedItems = items.filter((item) => selectedValues.includes(item.value));
-        for (const item of items) {
-            const elem = document.head.querySelector(`#${item.value}`);
-            if (!elem)
-                continue;
-            elem.remove();
-        }
-        for (const item of mountedItems) {
-            const elem = document.createElement("script");
-            elem.id = item.value;
-            if (!item.script) {
-                if (!item.required)
-                    console.warn("CookieBanner: Missing script for", item.value);
-                continue;
-            }
-            const { success, data: script } = scriptDefinitionSchema.safeParse(item.script);
-            if (!success) {
-                console.error("CookieBanner: Invalid script definition for", item.value);
-                continue;
-            }
-            elem.type = script.type ?? "text/javascript";
-            elem.async = script.async ?? false;
-            elem.defer = script.defer ?? false;
-            switch (script.variant) {
-                case "inline":
-                    elem.textContent = script.content;
-                    break;
-                case "remote":
-                    elem.src = script.src;
-                    elem.crossOrigin = script.crossorigin ?? null;
-                    elem.integrity = script.integrity ?? "";
-                    break;
-            }
-            document.head.appendChild(elem);
-        }
-    }, [savedSelection, items]);
-    function saveSelection(newSelection) {
-        setSavedSelection(newSelection);
-        localStorage.setItem(localStorageKey, JSON.stringify(newSelection));
-    }
-    const onDeclineAll = useCallback(() => {
-        const newSelection = Object.fromEntries(items.map((item) => [item.value, false]));
-        setSelection(newSelection);
-        saveSelection(newSelection);
-    }, [items]);
-    const onSave = useCallback(() => {
-        saveSelection(selection);
-    }, [selection]);
-    const selectionTaken = useMemo(() => {
-        if (!savedSelection)
-            return false;
-        const selectedKeys = Object.keys(savedSelection);
-        const itemKeys = items.map((item) => item.value);
-        return itemKeys.every((key) => selectedKeys.includes(key));
-    }, [savedSelection, items]);
-    return (_jsx(SelectionContext.Provider, { value: {
-            selection,
-            toggleSelection,
-            onDeclineAll,
-            onSave,
-            selectionTaken,
-        }, children: children }));
-};
-export function useSelection() {
-    const context = useContext(SelectionContext);
-    if (!context) {
-        throw new Error("useSelection must be used within a SelectionProvider");
-    }
-    return context;
-}

package/dist/react.js

@@ -1 +0,0 @@
-export { Banner } from "./components/Banner";

package/dist/script.js

@@ -1 +0,0 @@
-export { mountBanner } from "./utils/mountBanner";

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

@@ -1,21 +0,0 @@
-import { type BannerItemOptions } from "../BannerItem";
-import "../../styles/variables.css";
-export interface BannerOptions {
-    localStorageKey?: string;
-    heading?: string;
-    subheading?: string;
-    selectLabel?: string;
-    hideLabel?: string;
-    saveLabel?: string;
-    declineLabel?: string;
-    defaultSettingsOpen?: boolean;
-    privacyPolicy?: {
-        label: string;
-        url: string;
-    };
-    items: BannerItemOptions[];
-}
-export interface BannerProps extends BannerOptions {
-    noTarget?: boolean;
-}
-export declare const Banner: ({ localStorageKey, items, ...rest }: BannerProps) => import("preact").JSX.Element;

package/dist/types/components/Banner/index.d.ts

@@ -1 +0,0 @@
-export * from "./Banner";

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

@@ -1,23 +0,0 @@
-import { type ScriptDefinition } from "../../utils/scriptDefinition";
-interface BannerItemOptionsBase {
-    value: string;
-    label: string;
-    defaultSelected?: boolean;
-    sublabel?: string;
-    required?: boolean;
-    description?: string;
-}
-interface BannerItemOptionsRequired extends BannerItemOptionsBase {
-    required: true;
-    script: undefined;
-}
-interface BannerItemOptionsOptional extends BannerItemOptionsBase {
-    required: false;
-    script: ScriptDefinition;
-}
-export type BannerItemOptions = BannerItemOptionsRequired | BannerItemOptionsOptional;
-export interface BannerItemProps extends Omit<BannerItemOptions, "script"> {
-    openItem?: string;
-}
-export declare const BannerItem: ({ value, label, sublabel, required, description, openItem, }: BannerItemProps) => import("preact").JSX.Element;
-export {};

package/dist/types/components/BannerItem/index.d.ts

@@ -1 +0,0 @@
-export * from "./BannerItem";

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

@@ -1,5 +0,0 @@
-import type { HTMLAttributes } from "react";
-export interface ButtonProps extends HTMLAttributes<HTMLButtonElement> {
-    variant?: "neutral" | "brand" | "ghost";
-}
-export declare const Button: ({ variant, ...rest }: ButtonProps) => import("preact").JSX.Element;

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

@@ -1 +0,0 @@
-export * from "./Button";

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

@@ -1,5 +0,0 @@
-import { type SwitchProps as RadixSwitchProps } from "@radix-ui/react-switch";
-export interface SwitchProps extends RadixSwitchProps {
-    label?: string;
-}
-export declare const Switch: ({ label, id, ...rest }: SwitchProps) => import("preact").JSX.Element;

package/dist/types/components/Switch/index.d.ts

@@ -1 +0,0 @@
-export * from "./Switch";

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

@@ -1,8 +0,0 @@
-import type { JSX } from "react";
-export type TextProps<T extends keyof JSX.IntrinsicElements> = JSX.IntrinsicElements[T] & {
-    as?: T;
-    size?: "body" | "caption";
-    weight?: "normal" | "bold";
-    color?: "default" | "muted";
-};
-export declare const Text: <T extends keyof JSX.IntrinsicElements>({ as, size, weight, color, ...rest }: TextProps<T>) => JSX.Element;

package/dist/types/components/Text/index.d.ts

@@ -1 +0,0 @@
-export * from "./Text";

package/dist/types/contexts/SelectionContext.d.ts

@@ -1,23 +0,0 @@
-import { type PropsWithChildren } from "react";
-import { type SelectionSchema } from "../utils/selection";
-import type { BannerItemOptions } from "../components/BannerItem";
-export type SelectionContextType = {
-    selection: SelectionSchema | null;
-    toggleSelection: (key: string, value: boolean) => void;
-    onDeclineAll: () => void;
-    onSave: () => void;
-    selectionTaken: boolean;
-} | null;
-export declare const SelectionContext: import("preact").Context<SelectionContextType>;
-export interface SelectionProviderProps extends PropsWithChildren {
-    items: Pick<BannerItemOptions, "value" | "script" | "required" | "defaultSelected">[];
-    localStorageKey: string;
-}
-export declare const SelectionProvider: ({ children, items, localStorageKey, }: SelectionProviderProps) => import("preact").JSX.Element;
-export declare function useSelection(): {
-    selection: SelectionSchema | null;
-    toggleSelection: (key: string, value: boolean) => void;
-    onDeclineAll: () => void;
-    onSave: () => void;
-    selectionTaken: boolean;
-};

package/dist/types/react.d.ts

@@ -1 +0,0 @@
-export { Banner, type BannerProps } from "./components/Banner";

package/dist/types/script.d.ts

@@ -1 +0,0 @@
-export { mountBanner } from "./utils/mountBanner";

package/dist/types/utils/classes.d.ts

@@ -1,2 +0,0 @@
-export declare function cls(...classes: (string | undefined)[]): string;
-export declare function clx(classes: Record<string, boolean>): string;

package/dist/types/utils/mountBanner.d.ts

@@ -1,2 +0,0 @@
-import { type BannerOptions } from "../components/Banner";
-export declare function mountBanner(options: BannerOptions, targetElement?: HTMLElement | string): void;

package/dist/types/utils/scriptDefinition.d.ts

@@ -1,35 +0,0 @@
-import * as z from "zod/mini";
-export declare const remoteScriptDefinitionSchema: z.ZodMiniObject<{
-    variant: z.ZodMiniLiteral<"remote">;
-    type: z.ZodMiniOptional<z.ZodMiniString<string>>;
-    src: z.ZodMiniString<string>;
-    async: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    defer: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    crossorigin: z.ZodMiniOptional<z.ZodMiniString<string>>;
-    integrity: z.ZodMiniOptional<z.ZodMiniString<string>>;
-}, z.core.$strip>;
-export type RemoteScriptDefinition = z.infer<typeof remoteScriptDefinitionSchema>;
-export declare const inlineScriptDefinitionSchema: z.ZodMiniObject<{
-    variant: z.ZodMiniLiteral<"inline">;
-    type: z.ZodMiniOptional<z.ZodMiniString<string>>;
-    async: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    defer: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    content: z.ZodMiniString<string>;
-}, z.core.$strip>;
-export type InlineScriptDefinition = z.infer<typeof inlineScriptDefinitionSchema>;
-export declare const scriptDefinitionSchema: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
-    variant: z.ZodMiniLiteral<"remote">;
-    type: z.ZodMiniOptional<z.ZodMiniString<string>>;
-    src: z.ZodMiniString<string>;
-    async: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    defer: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    crossorigin: z.ZodMiniOptional<z.ZodMiniString<string>>;
-    integrity: z.ZodMiniOptional<z.ZodMiniString<string>>;
-}, z.core.$strip>, z.ZodMiniObject<{
-    variant: z.ZodMiniLiteral<"inline">;
-    type: z.ZodMiniOptional<z.ZodMiniString<string>>;
-    async: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    defer: z.ZodMiniOptional<z.ZodMiniBoolean<boolean>>;
-    content: z.ZodMiniString<string>;
-}, z.core.$strip>], "variant">;
-export type ScriptDefinition = z.infer<typeof scriptDefinitionSchema>;

package/dist/types/utils/selection.d.ts

@@ -1,3 +0,0 @@
-import * as z from "zod/mini";
-export declare const selectionSchema: z.ZodMiniRecord<z.ZodMiniString<string>, z.ZodMiniBoolean<boolean>>;
-export type SelectionSchema = z.infer<typeof selectionSchema>;

package/dist/utils/classes.js

@@ -1,9 +0,0 @@
-export function cls(...classes) {
-    return classes.filter(Boolean).join(" ");
-}
-export function clx(classes) {
-    return Object.entries(classes)
-        .filter(([, value]) => value)
-        .map(([key]) => key)
-        .join(" ");
-}

package/dist/utils/mountBanner.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx } from "preact/jsx-runtime";
-import { Banner } from "../components/Banner";
-import { render } from "preact";
-export function mountBanner(options, targetElement) {
-    const noTarget = targetElement === undefined;
-    let element;
-    if (typeof targetElement === "string") {
-        const target = document.querySelector(targetElement);
-        if (!target) {
-            throw new Error(`Element with selector "${targetElement}" not found`);
-        }
-        element = target;
-    }
-    else {
-        element = targetElement;
-    }
-    render(_jsx(Banner, { noTarget: noTarget, ...options }), element ?? document.body);
-}

package/dist/utils/scriptDefinition.js

@@ -1,21 +0,0 @@
-import * as z from "zod/mini";
-export const remoteScriptDefinitionSchema = z.object({
-    variant: z.literal("remote"),
-    type: z.optional(z.string()),
-    src: z.string(),
-    async: z.optional(z.boolean()),
-    defer: z.optional(z.boolean()),
-    crossorigin: z.optional(z.string()),
-    integrity: z.optional(z.string()),
-});
-export const inlineScriptDefinitionSchema = z.object({
-    variant: z.literal("inline"),
-    type: z.optional(z.string()),
-    async: z.optional(z.boolean()),
-    defer: z.optional(z.boolean()),
-    content: z.string(),
-});
-export const scriptDefinitionSchema = z.discriminatedUnion("variant", [
-    remoteScriptDefinitionSchema,
-    inlineScriptDefinitionSchema,
-]);

package/dist/utils/selection.js

@@ -1,2 +0,0 @@
-import * as z from "zod/mini";
-export const selectionSchema = z.record(z.string(), z.boolean());