@holmdigital/components 1.1.0

package/dist/Modal/Modal.js

@@ -0,0 +1,146 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Modal/Modal.tsx
+var Modal_exports = {};
+__export(Modal_exports, {
+  Modal: () => Modal
+});
+module.exports = __toCommonJS(Modal_exports);
+var import_react2 = require("react");
+
+// src/Dialog/Dialog.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var CloseIcon = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "h-5 w-5",
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M18 6 6 18" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m6 6 12 12" })
+    ]
+  }
+);
+var Dialog = (0, import_react.forwardRef)(
+  ({ isOpen, onClose, title, children, variant = "default", description, className, ...props }, ref) => {
+    const dialogRef = (0, import_react.useRef)(null);
+    (0, import_react.useImperativeHandle)(ref, () => dialogRef.current);
+    (0, import_react.useEffect)(() => {
+      const dialog = dialogRef.current;
+      if (!dialog) return;
+      if (isOpen) {
+        if (!dialog.open) {
+          dialog.showModal();
+          document.body.style.overflow = "hidden";
+        }
+      } else {
+        if (dialog.open) {
+          dialog.close();
+          document.body.style.overflow = "";
+        }
+      }
+    }, [isOpen]);
+    (0, import_react.useEffect)(() => {
+      const dialog = dialogRef.current;
+      if (!dialog) return;
+      const handleClose = () => {
+        onClose();
+        document.body.style.overflow = "";
+      };
+      dialog.addEventListener("close", handleClose);
+      const handleBackdropClick = (e) => {
+        const rect = dialog.getBoundingClientRect();
+        const isInDialog = rect.top <= e.clientY && e.clientY <= rect.top + rect.height && rect.left <= e.clientX && e.clientX <= rect.left + rect.width;
+        if (!isInDialog) {
+          dialog.close();
+        }
+      };
+      dialog.addEventListener("click", handleBackdropClick);
+      return () => {
+        dialog.removeEventListener("close", handleClose);
+        dialog.removeEventListener("click", handleBackdropClick);
+      };
+    }, [onClose]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "dialog",
+      {
+        ref: dialogRef,
+        className: `
+          backdrop:bg-slate-900/50 backdrop:backdrop-blur-sm
+          open:animate-in open:fade-in-0 open:zoom-in-95
+          bg-white rounded-xl shadow-2xl ring-1 ring-slate-900/5 
+          w-full max-w-lg p-0
+          ${className || ""}
+        `,
+        "aria-labelledby": "dialog-title",
+        "aria-describedby": description ? "dialog-desc" : void 0,
+        ...props,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between px-6 py-4 border-b border-slate-100", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { id: "dialog-title", className: `text-lg font-semibold ${variant === "alert" ? "text-red-600" : "text-slate-900"}`, children: title }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "button",
+              {
+                onClick: () => {
+                  dialogRef.current?.close();
+                },
+                className: "p-1 rounded-md text-slate-400 hover:text-slate-500 hover:bg-slate-100 focus:outline-none focus:ring-2 focus:ring-primary-500 transition-colors",
+                "aria-label": "Close dialog",
+                children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CloseIcon, {})
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "px-6 py-4", children: [
+            description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { id: "dialog-desc", className: "text-sm text-slate-500 mb-4", children: description }),
+            children
+          ] })
+        ]
+      }
+    );
+  }
+);
+Dialog.displayName = "Dialog";
+
+// src/Modal/Modal.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Modal = (0, import_react2.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    Dialog,
+    {
+      ref,
+      ...props,
+      className: `max-w-2xl ${props.className || ""}`
+    }
+  );
+});
+Modal.displayName = "Modal";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Modal
+});

package/dist/Modal/Modal.mjs

@@ -0,0 +1,7 @@
+import {
+  Modal
+} from "../chunk-HALLFO25.mjs";
+import "../chunk-LZ42XDDI.mjs";
+export {
+  Modal
+};

package/dist/NavigationMenu/NavigationMenu.js

@@ -0,0 +1,141 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/NavigationMenu/NavigationMenu.tsx
+var NavigationMenu_exports = {};
+__export(NavigationMenu_exports, {
+  NavigationMenu: () => NavigationMenu
+});
+module.exports = __toCommonJS(NavigationMenu_exports);
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var NavigationMenu = (0, import_react.forwardRef)(
+  ({ items, className, "aria-label": ariaLabel = "Main Navigation" }, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "nav",
+      {
+        ref,
+        className: `flex items-center ${className || ""}`,
+        "aria-label": ariaLabel,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { className: "flex flex-wrap gap-2 m-0 p-0 list-none", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuItem, { item }, index)) })
+      }
+    );
+  }
+);
+NavigationMenu.displayName = "NavigationMenu";
+var MenuItem = ({ item }) => {
+  const [isOpen, setIsOpen] = (0, import_react.useState)(false);
+  const containerRef = (0, import_react.useRef)(null);
+  const timeoutRef = (0, import_react.useRef)();
+  const hasChildren = item.children && item.children.length > 0;
+  (0, import_react.useEffect)(() => {
+    const handleClickOutside = (event) => {
+      if (containerRef.current && !containerRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    };
+    if (isOpen) {
+      document.addEventListener("click", handleClickOutside);
+    }
+    return () => document.removeEventListener("click", handleClickOutside);
+  }, [isOpen]);
+  const handleKeyDown = (e) => {
+    if (e.key === "Escape" && isOpen) {
+      setIsOpen(false);
+      const trigger = containerRef.current?.querySelector("button");
+      trigger?.focus();
+    }
+  };
+  const handleMouseEnter = () => {
+    clearTimeout(timeoutRef.current);
+    setIsOpen(true);
+  };
+  const handleMouseLeave = () => {
+    timeoutRef.current = setTimeout(() => setIsOpen(false), 200);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "li",
+    {
+      ref: containerRef,
+      className: "relative group",
+      onKeyDown: handleKeyDown,
+      onMouseEnter: hasChildren ? handleMouseEnter : void 0,
+      onMouseLeave: hasChildren ? handleMouseLeave : void 0,
+      children: hasChildren ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "button",
+          {
+            onClick: () => setIsOpen(!isOpen),
+            "aria-expanded": isOpen,
+            "aria-haspopup": "true",
+            className: `
+                            flex items-center gap-1 px-4 py-2 rounded-md
+                            text-slate-700 font-medium hover:bg-slate-100 focus:bg-slate-100
+                            transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500
+                        `,
+            children: [
+              item.label,
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "svg",
+                {
+                  className: `w-4 h-4 transition-transform ${isOpen ? "rotate-180" : ""}`,
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  stroke: "currentColor",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "ul",
+          {
+            className: `
+                            absolute top-full left-0 mt-1 min-w-[200px]
+                            bg-white border border-slate-200 rounded-lg shadow-xl
+                            py-2 z-50
+                            transform origin-top transition-all duration-200
+                            ${isOpen ? "opacity-100 scale-100 visible" : "opacity-0 scale-95 invisible"}
+                        `,
+            children: item.children?.map((child, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "a",
+              {
+                href: child.href,
+                className: "block px-4 py-2 text-slate-700 hover:bg-slate-50 hover:text-primary-600 focus:bg-slate-50 focus:text-primary-600 focus:outline-none",
+                children: child.label
+              }
+            ) }, idx))
+          }
+        )
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "a",
+        {
+          href: item.href,
+          className: "block px-4 py-2 text-slate-700 font-medium rounded-md hover:bg-slate-100 focus:bg-slate-100 transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500",
+          children: item.label
+        }
+      )
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  NavigationMenu
+});

package/dist/NavigationMenu/NavigationMenu.mjs

@@ -0,0 +1,6 @@
+import {
+  NavigationMenu
+} from "../chunk-GK4BYT56.mjs";
+export {
+  NavigationMenu
+};

package/dist/RadioGroup/RadioGroup.js

@@ -0,0 +1,103 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/RadioGroup/RadioGroup.tsx
+var RadioGroup_exports = {};
+__export(RadioGroup_exports, {
+  RadioGroup: () => RadioGroup
+});
+module.exports = __toCommonJS(RadioGroup_exports);
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var RadioGroup = (0, import_react.forwardRef)(
+  ({ name, options, value, onChange, orientation = "vertical", className = "", label }, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        ref,
+        className: `${className}`,
+        role: "radiogroup",
+        "aria-labelledby": label ? `${name}-label` : void 0,
+        children: [
+          label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { id: `${name}-label`, className: "text-sm font-medium text-slate-900 mb-2", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `flex ${orientation === "vertical" ? "flex-col space-y-3" : "flex-row space-x-6"}`, children: options.map((option) => {
+            const optionId = `${name}-${option.value}`;
+            const isChecked = value === option.value;
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative flex items-center justify-center", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "input",
+                  {
+                    id: optionId,
+                    name,
+                    type: "radio",
+                    value: option.value,
+                    checked: isChecked,
+                    disabled: option.disabled,
+                    onChange: (e) => {
+                      if (e.target.checked) {
+                        onChange?.(option.value);
+                      }
+                    },
+                    className: "peer sr-only"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "div",
+                  {
+                    className: `
+                      h-5 w-5 rounded-full border border-slate-300 bg-white shadow-sm transition-all
+                      peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2
+                      peer-checked:border-primary-600 peer-checked:bg-white
+                      peer-disabled:cursor-not-allowed peer-disabled:opacity-50
+                      hover:border-primary-400
+                    `,
+                    "aria-hidden": "true"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "div",
+                  {
+                    className: `
+                      absolute h-2.5 w-2.5 rounded-full bg-primary-600 transition-transform duration-200 scale-0
+                      ${isChecked ? "scale-100" : ""}
+                    `
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "label",
+                {
+                  htmlFor: optionId,
+                  className: `ml-3 text-sm font-medium ${option.disabled ? "text-slate-400" : "text-slate-700"} cursor-pointer select-none`,
+                  children: option.label
+                }
+              )
+            ] }, option.value);
+          }) })
+        ]
+      }
+    );
+  }
+);
+RadioGroup.displayName = "RadioGroup";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RadioGroup
+});

package/dist/RadioGroup/RadioGroup.mjs

@@ -0,0 +1,6 @@
+import {
+  RadioGroup
+} from "../chunk-YMSNGQN6.mjs";
+export {
+  RadioGroup
+};

package/dist/Select/Select.js

@@ -0,0 +1,157 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Select/Select.tsx
+var Select_exports = {};
+__export(Select_exports, {
+  Select: () => Select,
+  SelectContent: () => SelectContent,
+  SelectItem: () => SelectItem,
+  SelectTrigger: () => SelectTrigger
+});
+module.exports = __toCommonJS(Select_exports);
+var import_react = require("react");
+var import_lucide_react = require("lucide-react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var SelectContext = (0, import_react.createContext)(void 0);
+var Select = ({ value, onChange, children }) => {
+  const [isOpen, setIsOpen] = (0, import_react.useState)(false);
+  const [highlightedIndex, setHighlightedIndex] = (0, import_react.useState)(-1);
+  const optionsRef = (0, import_react.useRef)([]);
+  const containerRef = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    const handleClickOutside = (event) => {
+      if (containerRef.current && !containerRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  const handleKeyDown = (e) => {
+    if (!isOpen) {
+      if (e.key === "Enter" || e.key === " " || e.key === "ArrowDown") {
+        e.preventDefault();
+        setIsOpen(true);
+        setHighlightedIndex(0);
+      }
+      return;
+    }
+    switch (e.key) {
+      case "ArrowDown":
+        e.preventDefault();
+        setHighlightedIndex((prev) => Math.min(prev + 1, optionsRef.current.length - 1));
+        break;
+      case "ArrowUp":
+        e.preventDefault();
+        setHighlightedIndex((prev) => Math.max(prev - 1, 0));
+        break;
+      case "Enter":
+      case " ":
+        e.preventDefault();
+        if (highlightedIndex >= 0 && highlightedIndex < optionsRef.current.length) {
+          const option = optionsRef.current[highlightedIndex];
+          if (option) {
+            option.click();
+          }
+        }
+        break;
+      case "Escape":
+        e.preventDefault();
+        setIsOpen(false);
+        break;
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContext.Provider, { value: { value, onChange, isOpen, setIsOpen, highlightedIndex, setHighlightedIndex, optionsRef }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ref: containerRef,
+      className: "relative inline-block text-left w-full",
+      onKeyDown: handleKeyDown,
+      children
+    }
+  ) });
+};
+var SelectTrigger = ({ children, className = "", placeholder = "Select..." }) => {
+  const context = (0, import_react.useContext)(SelectContext);
+  if (!context) throw new Error("SelectTrigger must be used within Select");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "button",
+    {
+      type: "button",
+      onClick: () => context.setIsOpen(!context.isOpen),
+      "aria-haspopup": "listbox",
+      "aria-expanded": context.isOpen,
+      className: `flex items-center justify-between w-full px-4 py-2 text-sm bg-white border border-slate-300 rounded-md focus:outline-none focus:ring-2 focus:ring-slate-900 focus:border-transparent ${className}`,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: context.value ? "text-slate-900" : "text-slate-500", children: children || placeholder }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronDown, { className: "w-4 h-4 ml-2 opacity-50" })
+      ]
+    }
+  );
+};
+var SelectContent = ({ children }) => {
+  const context = (0, import_react.useContext)(SelectContext);
+  (0, import_react.useEffect)(() => {
+    if (context && context.isOpen) {
+      context.optionsRef.current = [];
+    }
+  }, [context?.isOpen]);
+  if (!context || !context.isOpen) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: "absolute z-10 w-full mt-1 bg-white border border-slate-200 rounded-md shadow-lg max-h-60 overflow-auto focus:outline-none",
+      role: "listbox",
+      children
+    }
+  );
+};
+var SelectItem = ({ value, children }) => {
+  const context = (0, import_react.useContext)(SelectContext);
+  if (!context) throw new Error("SelectItem must be used within Select");
+  const isSelected = context.value === value;
+  const index = context.optionsRef.current.length;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      ref: (el) => {
+        context.optionsRef.current[index] = el;
+      },
+      role: "option",
+      "aria-selected": isSelected,
+      onClick: () => {
+        context.onChange(value);
+        context.setIsOpen(false);
+      },
+      className: `flex items-center justify-between px-4 py-2 text-sm cursor-pointer ${context.highlightedIndex === index ? "bg-slate-100" : ""} ${isSelected ? "bg-slate-50 text-slate-900 font-medium" : "text-slate-700"}`,
+      children: [
+        children,
+        isSelected && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Check, { className: "w-4 h-4 text-slate-900" })
+      ]
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger
+});

package/dist/Select/Select.mjs

@@ -0,0 +1,12 @@
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger
+} from "../chunk-V2JYAFB7.mjs";
+export {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger
+};

package/dist/SkipLink/SkipLink.js

@@ -0,0 +1,59 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/SkipLink/SkipLink.tsx
+var SkipLink_exports = {};
+__export(SkipLink_exports, {
+  SkipLink: () => SkipLink
+});
+module.exports = __toCommonJS(SkipLink_exports);
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var SkipLink = (0, import_react.forwardRef)(
+  ({ targetId = "main", className, style, children, ...props }, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "a",
+      {
+        ref,
+        href: `#${targetId}`,
+        className: `
+                    fixed top-4 left-4 z-50 
+                    px-4 py-3 
+                    bg-white text-slate-900 font-medium 
+                    rounded-md shadow-lg ring-2 ring-slate-900
+                    transition-transform duration-200
+                    -translate-y-[150%] focus:translate-y-0
+                    ${className || ""}
+                `,
+        style: {
+          // Ensure it stays on top of everything
+          zIndex: 9999,
+          ...style
+        },
+        ...props,
+        children: children || "Hoppa till huvudinneh\xE5ll"
+      }
+    );
+  }
+);
+SkipLink.displayName = "SkipLink";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SkipLink
+});

package/dist/SkipLink/SkipLink.mjs

@@ -0,0 +1,6 @@
+import {
+  SkipLink
+} from "../chunk-MKKQLWGK.mjs";
+export {
+  SkipLink
+};