@telia/teddy 0.0.15 → 0.0.17

package/dist/components/navigation-menu/navigation-menu.js

@@ -1,10 +1,393 @@
-import "react/jsx-runtime";
-import "react";
-import "../../clsx-DB4S2d7J.js";
-import { N as n } from "../../navigation-menu-DKuyW8zE.js";
-import "../../utils/composeRefs.js";
-import "../visually-hidden/visually-hidden.js";
-import "../../utils/composeEventHandlers.js";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import React__default from "react";
+import clsx from "clsx";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
+import { useComposedRefs } from "../../utils/composeRefs.js";
+import { VisuallyHidden } from "../visually-hidden/visually-hidden.js";
+import { composeEventHandlers } from "../../utils/composeEventHandlers.js";
+const enterFromLeft = "_enterFromLeft_139wf_1";
+const enterFromRight = "_enterFromRight_139wf_1";
+const exitToLeft = "_exitToLeft_139wf_1";
+const exitToRight = "_exitToRight_139wf_1";
+const scaleIn = "_scaleIn_139wf_1";
+const scaleOut = "_scaleOut_139wf_1";
+const styles = {
+  "teddy-navigation-menu": "_teddy-navigation-menu_139wf_1",
+  "teddy-navigation-menu__viewport": "_teddy-navigation-menu__viewport_139wf_33",
+  "teddy-navigation-menu__list": "_teddy-navigation-menu__list_139wf_36",
+  "teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-list_139wf_55",
+  "teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-trigger_139wf_75",
+  "teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--small_139wf_93",
+  "teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--button_139wf_98",
+  "teddy-navigation-menu__content": "_teddy-navigation-menu__content_139wf_163",
+  enterFromLeft,
+  enterFromRight,
+  exitToLeft,
+  exitToRight,
+  "teddy-navigation-menu__trigger": "_teddy-navigation-menu__trigger_139wf_208",
+  "teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--small_139wf_226",
+  "teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--button_139wf_231",
+  "teddy-navigation-menu__link": "_teddy-navigation-menu__link_139wf_296",
+  "teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--small_139wf_314",
+  "teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--button_139wf_319",
+  scaleIn,
+  scaleOut
+};
+const rootClassName = "teddy-navigation-menu";
+const NavigationMenuContext = React__default.createContext({
+  selectedTopMenu: void 0,
+  setSelectedTopMenu: () => {
+  },
+  contentRef: { current: null },
+  focusProxyRef: { current: null },
+  topMenuRef: { current: null },
+  id: "",
+  dir: "ltr",
+  orientation: "horizontal",
+  onEntryKeyDown: () => {
+  },
+  onFocusProxyEnter: () => {
+  },
+  onContentFocusOutside: () => {
+  }
+});
+const Root = React__default.forwardRef(
+  ({ className, defaultTopMenuValue, ...props }, forwardRef) => {
+    const [selectedTopMenu, setSelectedTopMenu] = React__default.useState(defaultTopMenuValue);
+    const contentRef = React__default.useRef(null);
+    const restoreContentTabOrderRef = React__default.useRef(() => {
+    });
+    const focusProxyRef = React__default.useRef(null);
+    const topMenuRef = React__default.useRef(null);
+    const id = React__default.useId();
+    const handleContentEntry = React__default.useCallback((side = "start") => {
+      if (contentRef.current) {
+        restoreContentTabOrderRef.current();
+        const candidates = getTabbableCandidates(contentRef.current);
+        if (candidates.length)
+          focusFirst(side === "start" ? candidates : candidates.reverse());
+      }
+    }, []);
+    const handleContentExit = React__default.useCallback(() => {
+      if (contentRef.current) {
+        const candidates = getTabbableCandidates(contentRef.current);
+        if (candidates.length)
+          restoreContentTabOrderRef.current = removeFromTabOrder(candidates);
+      }
+    }, []);
+    const classes = clsx([styles[`${rootClassName}`]], className);
+    return /* @__PURE__ */ jsx(
+      NavigationMenuContext.Provider,
+      {
+        value: {
+          contentRef,
+          focusProxyRef,
+          topMenuRef,
+          id,
+          dir: props.dir || "ltr",
+          orientation: props.orientation || "horizontal",
+          onEntryKeyDown: handleContentEntry,
+          onFocusProxyEnter: handleContentEntry,
+          onContentFocusOutside: handleContentExit,
+          selectedTopMenu,
+          setSelectedTopMenu
+        },
+        children: /* @__PURE__ */ jsx(NavigationMenuPrimitive.Root, { ...props, ref: forwardRef, className: classes })
+      }
+    );
+  }
+);
+Root.displayName = "NavigationMenu";
+const TopMenuList = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__top-menu-list`]], className);
+    const context = React__default.useContext(NavigationMenuContext);
+    const ref = useComposedRefs(context.topMenuRef, forwardRef);
+    return /* @__PURE__ */ jsx("ul", { ...props, ref, className: classes });
+  }
+);
+TopMenuList.displayName = "NavigationMenu.TopMenuList";
+const TopMenuItem = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__top-menu-item`]], className);
+    return /* @__PURE__ */ jsx("li", { ...props, ref: forwardRef, className: classes });
+  }
+);
+const TopMenuTrigger = React__default.forwardRef(
+  ({ className, active, ...props }, forwardRef) => {
+    const classes = clsx(
+      [styles[`${rootClassName}__top-menu-trigger`], styles[`${rootClassName}__top-menu-trigger--small`]],
+      className
+    );
+    const context = React__default.useContext(NavigationMenuContext);
+    const innerRef = React__default.useRef(null);
+    const ref = useComposedRefs(innerRef, forwardRef);
+    const isOpen = context.selectedTopMenu === props.value;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          ...props,
+          ref,
+          className: classes,
+          "data-state": isOpen ? "open" : "closed",
+          "data-active": active ? "true" : void 0,
+          "aria-expanded": isOpen,
+          "aria-controls": makeContentId({ value: props.value, baseId: context.id }),
+          ...{ [ITEM_DATA_ATTR]: "" },
+          onClick: composeEventHandlers(props.onClick, () => {
+            context.setSelectedTopMenu(props.value);
+          }),
+          onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
+            var _a;
+            const verticalEntryKey = context.dir === "rtl" ? "ArrowLeft" : "ArrowRight";
+            const entryKey = { horizontal: "ArrowDown", vertical: verticalEntryKey }[context.orientation];
+            if (isOpen && event.key === entryKey) {
+              context.onEntryKeyDown();
+              return event.preventDefault();
+            }
+            const isFocusNavigationKey = ["Home", "End", ...ARROW_KEYS].includes(event.key);
+            if (isFocusNavigationKey) {
+              const triggers = (_a = context.topMenuRef.current) == null ? void 0 : _a.querySelectorAll(`[${ITEM_DATA_ATTR}]`);
+              if (!triggers)
+                return;
+              let candidateNodes = Array.from(triggers == null ? void 0 : triggers.values());
+              const prevItemKey = context.dir === "rtl" ? "ArrowRight" : "ArrowLeft";
+              const prevKeys = [prevItemKey, "ArrowUp", "End"];
+              if (prevKeys.includes(event.key))
+                candidateNodes.reverse();
+              if (ARROW_KEYS.includes(event.key)) {
+                const currentIndex = candidateNodes.indexOf(event.currentTarget);
+                candidateNodes = candidateNodes.slice(currentIndex + 1);
+                focusFirst(candidateNodes);
+                event.preventDefault();
+              }
+            }
+          })
+        }
+      ),
+      isOpen && /* @__PURE__ */ jsx(
+        VisuallyHidden,
+        {
+          "aria-hidden": true,
+          tabIndex: 0,
+          ref: context.focusProxyRef,
+          onFocus: (event) => {
+            const content = context.contentRef.current;
+            const prevFocusedElement = event.relatedTarget;
+            const wasTriggerFocused = prevFocusedElement === innerRef.current;
+            const wasFocusFromContent = content == null ? void 0 : content.contains(prevFocusedElement);
+            if (wasTriggerFocused || !wasFocusFromContent) {
+              context.onFocusProxyEnter(wasTriggerFocused ? "start" : "end");
+            }
+          }
+        }
+      )
+    ] });
+  }
+);
+const List = React__default.forwardRef(
+  ({ className, variant, value, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__list`]], [styles[`${rootClassName}__list--${variant}`]], className);
+    const context = React__default.useContext(NavigationMenuContext);
+    const refOnOpen = useComposedRefs(context.contentRef, forwardRef);
+    const hasTopMenu = context.selectedTopMenu !== void 0;
+    const isOpen = context.selectedTopMenu === value;
+    if (!isOpen)
+      return null;
+    return /* @__PURE__ */ jsx(
+      NavigationMenuPrimitive.List,
+      {
+        ref: hasTopMenu ? refOnOpen : forwardRef,
+        id: value && makeContentId({ value, baseId: context.id }),
+        ...props,
+        onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
+          var _a;
+          if (!value)
+            return;
+          const isMetaKey = event.altKey || event.ctrlKey || event.metaKey;
+          const isTabKey = event.key === "Tab" && !isMetaKey;
+          if (isTabKey) {
+            const candidates = getTabbableCandidates(event.currentTarget);
+            const focusedElement = document.activeElement;
+            const index = candidates.findIndex((candidate) => candidate === focusedElement);
+            const isMovingBackwards = event.shiftKey;
+            const nextCandidates = isMovingBackwards ? candidates.slice(0, index).reverse() : candidates.slice(index + 1, candidates.length);
+            if (focusFirst(nextCandidates)) {
+              event.preventDefault();
+            } else {
+              (_a = context.focusProxyRef.current) == null ? void 0 : _a.focus();
+              context.onContentFocusOutside();
+            }
+          }
+        }),
+        className: classes
+      }
+    );
+  }
+);
+List.displayName = "NavigationMenu.List";
+const Item = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__item`]], className);
+    return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Item, { ...props, ref: forwardRef, className: classes });
+  }
+);
+Item.displayName = "NavigationMenu.Item";
+const Trigger = React__default.forwardRef(
+  ({ className, active, variant = "default", ...props }, forwardRef) => {
+    const classes = clsx(
+      [styles[`${rootClassName}__trigger`]],
+      [styles[`${rootClassName}__trigger--${variant}`]],
+      className
+    );
+    const innerRef = React__default.useRef(null);
+    const ref = useComposedRefs(forwardRef, innerRef);
+    return /* @__PURE__ */ jsx(
+      NavigationMenuPrimitive.Trigger,
+      {
+        onPointerEnter: (e) => e.preventDefault(),
+        onPointerMove: (e) => e.preventDefault(),
+        onPointerLeave: (e) => e.preventDefault(),
+        ...props,
+        ref,
+        "data-active": active ? "true" : void 0,
+        className: classes,
+        "data-text": getLabelFromChildren(props.children)
+      }
+    );
+  }
+);
+Trigger.displayName = "NavigationMenu.Trigger";
+const Content = React__default.forwardRef(
+  ({ className, variant = "default", ...props }, forwardRef) => {
+    const classes = clsx(
+      [styles[`${rootClassName}__content`]],
+      [styles[`${rootClassName}__content--${variant}`]],
+      className
+    );
+    return /* @__PURE__ */ jsx(
+      NavigationMenuPrimitive.Content,
+      {
+        onPointerEnter: (e) => e.preventDefault(),
+        onPointerLeave: (e) => e.preventDefault(),
+        ...props,
+        ref: forwardRef,
+        className: classes
+      }
+    );
+  }
+);
+const Link = React__default.forwardRef(
+  ({ className, variant = "default", ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__link`]], [styles[`${rootClassName}__link--${variant}`]], className);
+    return /* @__PURE__ */ jsx(
+      NavigationMenuPrimitive.Link,
+      {
+        ...props,
+        ref: forwardRef,
+        className: classes,
+        "data-text": getLabelFromChildren(props.children)
+      }
+    );
+  }
+);
+Link.displayName = "NavigationMenu.Link";
+const Indicator = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__indicator`]], className);
+    return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Indicator, { ...props, ref: forwardRef, className: classes });
+  }
+);
+Indicator.displayName = "NavigationMenu.Indicator";
+const Viewport = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__viewport`]], className);
+    return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Viewport, { ...props, ref: forwardRef, className: classes });
+  }
+);
+Viewport.displayName = "NavigationMenu.Viewport";
+const Sub = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__sub`]], className);
+    return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Sub, { ...props, ref: forwardRef, className: classes });
+  }
+);
+Sub.displayName = "NavigationMenu.Sub";
+function getLabelFromChildren(children) {
+  function findLabel(node) {
+    if (typeof node === "string") {
+      return node;
+    }
+    if (React__default.isValidElement(node) && node.props.children) {
+      return findLabel(node.props.children);
+    }
+    if (Array.isArray(node)) {
+      for (let i = node.length - 1; i >= 0; i--) {
+        const label = findLabel(node[i]);
+        if (label) {
+          return label;
+        }
+      }
+    }
+    return void 0;
+  }
+  return findLabel(children);
+}
+function getTabbableCandidates(container) {
+  const nodes = [];
+  const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    acceptNode: (node) => {
+      const isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
+      if (node.disabled || node.hidden || isHiddenInput)
+        return NodeFilter.FILTER_SKIP;
+      return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
+    }
+  });
+  while (walker.nextNode())
+    nodes.push(walker.currentNode);
+  return nodes;
+}
+function focusFirst(candidates) {
+  const previouslyFocusedElement = document.activeElement;
+  return candidates.some((candidate) => {
+    if (candidate === previouslyFocusedElement)
+      return true;
+    candidate.focus();
+    return document.activeElement !== previouslyFocusedElement;
+  });
+}
+function removeFromTabOrder(candidates) {
+  candidates.forEach((candidate) => {
+    candidate.dataset.tabindex = candidate.getAttribute("tabindex") || "";
+    candidate.setAttribute("tabindex", "-1");
+  });
+  return () => {
+    candidates.forEach((candidate) => {
+      const prevTabIndex = candidate.dataset.tabindex;
+      candidate.setAttribute("tabindex", prevTabIndex);
+    });
+  };
+}
+const ITEM_DATA_ATTR = "data-teddy-top-selector-trigger";
+const ARROW_KEYS = ["ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown"];
+function makeContentId(args) {
+  return `teddy-navigation-menu-${args.baseId}-${args.value}-content`;
+}
+const NavigationMenu = Object.assign(Root, {
+  List,
+  Item,
+  Trigger,
+  Content,
+  Link,
+  Indicator,
+  Viewport,
+  Sub,
+  TopMenuList,
+  TopMenuItem,
+  TopMenuTrigger
+});
 export {
-  n as NavigationMenu
+  NavigationMenu
 };

package/dist/components/notification/index.js

@@ -1,4 +1,4 @@
-import { N as t } from "../../badge-Cnug5TzH.js";
+import { Notification } from "./notification.js";
 export {
-  t as Notification
+  Notification
 };

package/dist/components/notification/notification.d.ts

@@ -1,4 +1,8 @@
-import { Text as TextPrimitives, Heading as HeadingPrimitives, Card, Icon as IconPrimitives, Button as ButtonPrimitives } from '..';
+import { Card } from '../card';
+import { Heading as HeadingPrimitives } from '../heading';
+import { Icon as IconPrimitives } from '../icon';
+import { Button as ButtonPrimitives } from '../button';
+import { Text as TextPrimitives } from '../text';
 import { default as React } from 'react';
 
 /** -------------------------------------------------------------------------------------------------
@@ -35,7 +39,7 @@ declare const Notification: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<
     as?: undefined;
 } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
     asChild?: boolean | undefined;
-    variant?: "purple-light" | "purple-dark" | "gray" | "white" | "beige" | undefined;
+    variant?: "beige" | "gray" | "white" | "purple-light" | "purple-dark" | undefined;
     bordered?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('../../utils/layout/flex').FlexChildren & import('../../utils/layout/grid').GridChildren & import('../../utils/layout/position').PositionProps & import('../../utils/layout/inset').InsetProps & import('../../utils/layout/margin').MarginProps & import('../../utils/layout/padding').PaddingProps & import('../../utils/layout/width').WidthProps & import('../../utils/layout/height').HeightProps & import('../../utils/layout/gap').GapProps & {
@@ -46,7 +50,7 @@ declare const Notification: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<
     asChild?: false | undefined;
 } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
     asChild?: boolean | undefined;
-    variant?: "purple-light" | "purple-dark" | "gray" | "white" | "beige" | undefined;
+    variant?: "beige" | "gray" | "white" | "purple-light" | "purple-dark" | undefined;
     bordered?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('../../utils/layout/flex').FlexChildren & import('../../utils/layout/grid').GridChildren & import('../../utils/layout/position').PositionProps & import('../../utils/layout/inset').InsetProps & import('../../utils/layout/margin').MarginProps & import('../../utils/layout/padding').PaddingProps & import('../../utils/layout/width').WidthProps & import('../../utils/layout/height').HeightProps & import('../../utils/layout/gap').GapProps & {
@@ -57,7 +61,7 @@ declare const Notification: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<
     asChild?: false | undefined;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & {
     asChild?: boolean | undefined;
-    variant?: "purple-light" | "purple-dark" | "gray" | "white" | "beige" | undefined;
+    variant?: "beige" | "gray" | "white" | "purple-light" | "purple-dark" | undefined;
     bordered?: boolean | undefined;
     backgroundImageSrc?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>, "ref">, "as" | "variant"> & {
@@ -71,9 +75,6 @@ declare const Notification: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<
     Heading: React.ForwardRefExoticComponent<HeadingProps & React.RefAttributes<HTMLHeadingElement>>;
     Icon: React.ForwardRefExoticComponent<Partial<Omit<React.SVGProps<SVGSVGElement> & {
         name: "link" | "map" | "menu" | "search" | "summary" | "time" | "video" | "filter" | "image" | "stop" | "key" | "x" | "download" | "split" | "alert" | "radio" | "email" | "copy" | "sync" | "alarm-off" | "alarm-on" | "attachment" | "bookmark-filled" | "bookmark" | "copy-filled" | "dislike" | "edit" | "heart-filled" | "heart" | "invisible" | "like" | "lock-open" | "lock" | "login" | "logout" | "maximize" | "minimize" | "mute" | "password-invisible" | "password-visible" | "play-filled" | "play" | "remove-filled" | "remove" | "save" | "send" | "settings" | "share" | "shuffle" | "skip-back-10sec" | "skip-back-30sec" | "skip-forward-10sec" | "skip-forward-30sec" | "star-filled" | "star" | "switch-arrows" | "tv-next" | "tv-pause" | "tv-previous" | "tv-stop" | "upload" | "visible" | "volume" | "zoom-out" | "zoom" | "connected-building" | "home" | "hospital" | "industry" | "premises-datacenter" | "premises-large" | "premises-medium" | "premises-small" | "premises" | "store" | "address-book" | "b2b-customer" | "care" | "chat-robot" | "chat" | "child-1" | "child-2" | "conversation" | "customer-dialogue" | "dsl-hub" | "end-user" | "handshake" | "headphones" | "letter" | "mms" | "new-contact" | "new-group" | "news" | "parental-guide" | "people-hub" | "people" | "portal" | "signature" | "smiley-happy" | "smiley-sad" | "sms" | "support" | "user-admin" | "vcard" | "voicemail" | "battery" | "bluetooth" | "broadband" | "broken-phone" | "cast" | "cloud-connect" | "connected" | "core-router" | "daas-device" | "data-transfer" | "desktop" | "devices" | "esim-simcard" | "esim" | "face-id" | "fiber" | "fingerprint" | "fiveg" | "fourg" | "home-installation" | "industrial-iot" | "internet" | "it-service" | "laptop" | "mobile-broadband" | "network" | "phone-recycling" | "phone-ringing" | "phone" | "rack" | "refill-card" | "remote-control" | "repair" | "roaming" | "router" | "secure-device" | "sense-car" | "server" | "service-device" | "service-supervision" | "slow-wifi" | "smart-wifi" | "smartphone" | "smartwatch" | "tablet" | "trade-phone" | "tv" | "usb" | "voice-switch" | "wallplug" | "wireless-off" | "wireless-weak" | "wireless" | "world-alert" | "world-off" | "world-question" | "bar-chart" | "doc" | "document-doc" | "document-edit" | "document-pdf" | "document-ppt" | "excel" | "folder-copy" | "folder-new" | "folder" | "gif" | "graph" | "media-content" | "org-chart" | "pie-chart" | "print" | "register" | "report" | "simcard" | "spell-check" | "credit-card" | "euro" | "invoice" | "kontantkort" | "kr" | "late-payment" | "money-back-euro" | "money-back-kr" | "money-euro" | "money-kr" | "pay-monthly-euro" | "pay-monthly-kr" | "pay-once-euro" | "pay-once-kr" | "payment-success" | "savings" | "wallet" | "airplay" | "camera" | "entertainment" | "external" | "film" | "games" | "megaphone" | "microphone" | "music" | "player-settings" | "record" | "stream" | "trailer" | "video-conference" | "activity-level" | "add" | "ai-robot" | "bag" | "basketball" | "blood-pressure" | "bulb" | "business-continuity" | "business-intelligence" | "calendar" | "cart" | "close-circle" | "cloud" | "coffee" | "compass" | "construction" | "cookie" | "delivery" | "drone" | "education" | "efficiency" | "environment" | "facemask" | "flag" | "focus" | "food" | "fraud" | "getting-started" | "home-care" | "infinite" | "job-search" | "layers" | "measuring-health" | "moisture" | "offering" | "offshore" | "optimization" | "pebble" | "pet-dog" | "pin" | "plane" | "plus-minus" | "police" | "power-grid" | "present" | "press-button" | "price" | "pulse" | "recycle" | "reservation" | "reverse" | "route" | "ruler" | "satellite" | "secured-1" | "secured-2" | "security-camera" | "shopping" | "snowflake" | "speedometer" | "spyware" | "suitcase" | "sustainability" | "tag" | "temperature" | "thinking" | "train" | "transfer" | "undo" | "wavelength" | "weather" | "world" | "android" | "apple" | "bankid-norway" | "bankid" | "facebook" | "instagram" | "youtube" | "linkedin" | "snapchat" | "whatsapp" | "windows" | "alert-filled" | "check-circle-filled" | "check-circle" | "error-filled" | "error" | "help" | "info-filled" | "info" | "question-filled" | "question" | "warning" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-subdirectory" | "arrow-up" | "card-view" | "checkmark-bold" | "checkmark" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "close" | "grid-view" | "list-view" | "minus-bold" | "minus" | "more-horizontal" | "more-vertical" | "plus" | "services" | "sorter" | "table-view";
-        /** -------------------------------------------------------------------------------------------------
-         * Root
-         * -----------------------------------------------------------------------------------------------*/
         size?: ("sm" | "md" | "lg" | "xl" | "font" | "xxs" | "xs") | undefined;
         children?: React.ReactNode;
     }, "ref">> & React.RefAttributes<SVGSVGElement>>;

package/dist/components/notification/notification.js

@@ -1,27 +1,99 @@
-import "react/jsx-runtime";
-import "react";
-import "../../clsx-DB4S2d7J.js";
-import { N as y } from "../../badge-Cnug5TzH.js";
-import "../../index-FPIZOCcD.js";
-import "../../radio-group-B--zT3OL.js";
-import "../box/box.js";
-import "../flex/flex.js";
-import "../grid/grid.js";
-import "../../navigation-menu-DKuyW8zE.js";
-import "../link/link.js";
-import "../button/button.js";
-import "../field-error-text/field-error-text.js";
-import "../helper-text/helper-text.js";
+import { jsx } from "react/jsx-runtime";
+import React__default from "react";
+import clsx from "clsx";
+import * as Collapsible from "@radix-ui/react-collapsible";
+import { useControllableState } from "@radix-ui/react-use-controllable-state";
+import { Text as Text$1 } from "../text/text.js";
+import { Button } from "../button/button.js";
 import "../../assets/4bbd022cee9b0f06.svg";
-import "../icon/icon.js";
-import "../input/input.js";
-import "../label/label.js";
-import "../spinner/spinner.js";
-import "../text/text.js";
-import "../text-field/text-field.js";
-import "../heading/heading.js";
-import "../visually-hidden/visually-hidden.js";
-import "../text-spacing/text-spacing.js";
+import { Icon as Icon$1 } from "../icon/icon.js";
+import { Heading as Heading$1 } from "../heading/heading.js";
+import { Card } from "../card/card.js";
+const styles = {
+  "teddy-notification": "_teddy-notification_q80ka_3",
+  "teddy-notification__dismiss": "_teddy-notification__dismiss_q80ka_14",
+  "teddy-notification--success": "_teddy-notification--success_q80ka_18",
+  "teddy-notification--warning": "_teddy-notification--warning_q80ka_23",
+  "teddy-notification--error": "_teddy-notification--error_q80ka_28",
+  "teddy-notification--information": "_teddy-notification--information_q80ka_33",
+  "teddy-notification__heading": "_teddy-notification__heading_q80ka_38",
+  "teddy-notification__icon": "_teddy-notification__icon_q80ka_43"
+};
+const rootClassName = "teddy-notification";
+const NotificationContext = React__default.createContext(void 0);
+const Root = React__default.forwardRef(
+  ({ className, open: openProp, defaultOpen, onOpenChange, variant, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}`]], styles[`${rootClassName}--${variant}`], className);
+    const [open = true, setOpen] = useControllableState({
+      prop: openProp,
+      defaultProp: defaultOpen,
+      onChange: onOpenChange
+    });
+    return /* @__PURE__ */ jsx(NotificationContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsx(Collapsible.Root, { open, onOpenChange: setOpen, asChild: true, children: /* @__PURE__ */ jsx(Collapsible.Content, { asChild: true, children: /* @__PURE__ */ jsx(Card, { variant: "white", as: void 0, bordered: true, ...props, ref: forwardRef, className: classes }) }) }) });
+  }
+);
+Root.displayName = "Notification";
+function getVariantIcon(variant) {
+  switch (variant) {
+    case "success":
+      return "check-circle-filled";
+    case "error":
+      return "error-filled";
+    case "warning":
+      return "alert-filled";
+    case "information":
+      return "info-filled";
+  }
+}
+const Icon = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__icon`]], className);
+    const context = React__default.useContext(NotificationContext);
+    const name = props.name || getVariantIcon(context == null ? void 0 : context.variant);
+    if (!name)
+      return null;
+    return /* @__PURE__ */ jsx(Icon$1, { size: "md", ...props, name, ref: forwardRef, className: classes });
+  }
+);
+Icon.displayName = "Notification.Icon";
+const Heading = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__heading`]], className);
+    return /* @__PURE__ */ jsx(Heading$1, { ...props, variant: "subsection-100", asChild: false, ref: forwardRef, className: classes });
+  }
+);
+Heading.displayName = "Notification.Heading";
+const Text = React__default.forwardRef(
+  ({ className, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__text`]], className);
+    return /* @__PURE__ */ jsx(Text$1, { ...props, ref: forwardRef, className: classes });
+  }
+);
+Text.displayName = "Notification.Text";
+const Dismiss = React__default.forwardRef(
+  ({ className, children, ...props }, forwardRef) => {
+    const classes = clsx([styles[`${rootClassName}__dismiss`]], className);
+    return /* @__PURE__ */ jsx(Collapsible.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        iconOnly: true,
+        "aria-label": "Lukk",
+        variant: "tertiary-purple",
+        ...props,
+        ref: forwardRef,
+        className: classes,
+        children: children || /* @__PURE__ */ jsx(Icon$1, { name: "close" })
+      }
+    ) });
+  }
+);
+Dismiss.displayName = "Notification.Dismiss";
+const Notification = Object.assign(Root, {
+  Text,
+  Heading,
+  Icon,
+  Dismiss
+});
 export {
-  y as Notification
+  Notification
 };

package/dist/components/radio-group/index.js

@@ -1,4 +1,4 @@
-import { R as a } from "../../radio-group-B--zT3OL.js";
+import { RadioGroup } from "./radio-group.js";
 export {
-  a as RadioGroup
+  RadioGroup
 };