@k8o/arte-odyssey 0.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Koki Sakano
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/accordion/accordion-button.d.ts

@@ -0,0 +1,2 @@
+import type { FC, PropsWithChildren } from 'react';
+export declare const AccordionButton: FC<PropsWithChildren>;

package/dist/components/accordion/accordion-button.js

@@ -0,0 +1,40 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as motion from "motion/react-client";
+import { cn } from "./../../helpers/cn";
+import { ChevronIcon } from "../icons";
+import { useItemId, useOpen, useToggleOpen } from "./context";
+const AccordionButton = ({ children }) => {
+  const id = useItemId();
+  const open = useOpen();
+  const toggleOpen = useToggleOpen();
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      "aria-controls": `${id}-panel`,
+      "aria-expanded": open,
+      className: cn(
+        "flex w-full flex-row items-center justify-between rounded-md p-2",
+        "hover:bg-bg-mute",
+        "focus-visible::first:bordertransparent focus-visible:bg-bg-mute focus-visible::first:outline-none focus-visible::first:ring-2 focus-visible::first:ring-border-info"
+      ),
+      id: `${id}-button`,
+      onClick: toggleOpen,
+      type: "button",
+      children: [
+        children,
+        /* @__PURE__ */ jsx(
+          motion.span,
+          {
+            animate: open ? { rotate: 180 } : { rotate: 0 },
+            transition: { duration: 0.3 },
+            children: /* @__PURE__ */ jsx(ChevronIcon, { direction: "down" })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  AccordionButton
+};

package/dist/components/accordion/accordion-item.d.ts

@@ -0,0 +1,4 @@
+import { type FC, type PropsWithChildren } from 'react';
+export declare const AccordionItem: FC<PropsWithChildren<{
+    defaultOpen?: boolean;
+}>>;

package/dist/components/accordion/accordion-item.js

@@ -0,0 +1,11 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useId } from "react";
+import { AccordionItemProvider } from "./context";
+const AccordionItem = ({ children, defaultOpen = false }) => {
+  const id = useId();
+  return /* @__PURE__ */ jsx(AccordionItemProvider, { defaultOpen, id, children: /* @__PURE__ */ jsx("div", { className: "border-border-mute border-t last:border-b", children }) });
+};
+export {
+  AccordionItem
+};

package/dist/components/accordion/accordion-panel.d.ts

@@ -0,0 +1,2 @@
+import type { FC, PropsWithChildren } from 'react';
+export declare const AccordionPanel: FC<PropsWithChildren>;

package/dist/components/accordion/accordion-panel.js

@@ -0,0 +1,21 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "./../../helpers/cn";
+import { useItemId, useOpen } from "./context";
+const AccordionPanel = ({ children }) => {
+  const id = useItemId();
+  const open = useOpen();
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      "aria-labelledby": `${id}-button`,
+      className: cn({ hidden: !open }, "p-2"),
+      hidden: !open,
+      id: `${id}-panel`,
+      children
+    }
+  );
+};
+export {
+  AccordionPanel
+};

package/dist/components/accordion/accordion.d.ts

@@ -0,0 +1,2 @@
+import type { FC, PropsWithChildren } from 'react';
+export declare const Accordion: FC<PropsWithChildren>;

package/dist/components/accordion/accordion.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "./../../helpers/cn";
+const Accordion = ({ children }) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "rounded-md border-2 border-border-mute bg-bg-base p-2",
+        "focus-within:bordertransparent focus-within:outline-hidden focus-within:ring-2 focus-within:ring-border-info"
+      ),
+      children
+    }
+  );
+};
+export {
+  Accordion
+};

package/dist/components/accordion/accordion.stories.js

@@ -0,0 +1,89 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Accordion } from "./accordion";
+import { AccordionButton } from "./accordion-button";
+import { AccordionItem } from "./accordion-item";
+import { AccordionPanel } from "./accordion-panel";
+const meta = {
+  title: "components/accordion",
+  component: Accordion
+};
+var accordion_stories_default = meta;
+const Primary = {
+  args: {},
+  render: () => {
+    return /* @__PURE__ */ jsxs(Accordion, { children: [
+      /* @__PURE__ */ jsxs(AccordionItem, { children: [
+        /* @__PURE__ */ jsx("h3", { children: /* @__PURE__ */ jsx(AccordionButton, { children: /* @__PURE__ */ jsx("p", { className: "text-lg", children: "\u96E8\u30CB\u30E2\u30DE\u30B1\u30BA" }) }) }),
+        /* @__PURE__ */ jsxs(AccordionPanel, { children: [
+          /* @__PURE__ */ jsx("p", { children: "\u96E8\u30CB\u30E2\u30DE\u30B1\u30BA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u98A8\u30CB\u30E2\u30DE\u30B1\u30BA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u96EA\u30CB\u30E2\u590F\u30CE\u6691\u30B5\u30CB\u30E2\u30DE\u30B1\u30CC" }),
+          /* @__PURE__ */ jsx("p", { children: "\u4E08\u592B\u30CA\u30AB\u30E9\u30C0\u30F2\u30E2\u30C1" }),
+          /* @__PURE__ */ jsx("p", { children: "\u617E\u30CF\u30CA\u30AF" }),
+          /* @__PURE__ */ jsx("p", { children: "\u6C7A\u30B7\u30C6\u778B\u30E9\u30BA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30A4\u30C4\u30E2\u30B7\u30C5\u30AB\u30CB\u30EF\u30E9\u30C3\u30C6\u30F0\u30EB" }),
+          /* @__PURE__ */ jsx("p", { children: "\u4E00\u65E5\u30CB\u7384\u7C73\u56DB\u5408\u30C8" }),
+          /* @__PURE__ */ jsx("p", { children: "\u5473\u564C\u30C8\u5C11\u30B7\u30CE\u91CE\u83DC\u30F2\u30BF\u30D9" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30A2\u30E9\u30E6\u30EB\u30B3\u30C8\u30F2" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30B8\u30D6\u30F3\u30F2\u30AB\u30F3\u30B8\u30E7\u30A6\u30CB\u5165\u30EC\u30BA\u30CB" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30E8\u30AF\u30DF\u30AD\u30AD\u30B7\u30EF\u30AB\u30EA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30BD\u30B7\u30C6\u30EF\u30B9\u30EC\u30BA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u91CE\u539F\u30CE\u677E\u30CE\u6797\u30CE" }),
+          /* @__PURE__ */ jsx("p", { children: "\u5C0F\u30B5\u30CA\u8413\u30D6\u30AD\u30CE\u5C0F\u5C4B\u30CB\u30F0\u30C6" }),
+          /* @__PURE__ */ jsx("p", { children: "\u6771\u30CB\u75C5\u6C17\u30CE\u30B3\u30C9\u30E2\u30A2\u30EC\u30D0" }),
+          /* @__PURE__ */ jsx("p", { children: "\u884C\u30C3\u30C6\u770B\u75C5\u30B7\u30C6\u30E4\u30EA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u897F\u30CB\u30C4\u30AB\u30EC\u30BF\u6BCD\u30A2\u30EC\u30D0" }),
+          /* @__PURE__ */ jsx("p", { children: "\u884C\u30C3\u30C6\u30BD\u30CE\u7A32\u30CE\u673F\u30F2\uFF3B\uFF03\u300C\u673F\u30F2\u300D\u306F\u30DE\u30DE\uFF3D\u8CA0\u30D2" }),
+          /* @__PURE__ */ jsx("p", { children: "\u5357\u30CB\u6B7B\u30CB\u30B5\u30A6\u30CA\u4EBA\u30A2\u30EC\u30D0" }),
+          /* @__PURE__ */ jsx("p", { children: "\u884C\u30C3\u30C6\u30B3\u30CF\u30AC\u30E9\u30CA\u30AF\u30C6\u30E2\u30A4\u30FD\u30C8\u30A4\u30D2" }),
+          /* @__PURE__ */ jsx("p", { children: "\u5317\u30CB\u30B1\u30F3\u30AF\u30EE\u30E4\u30BD\u30B7\u30E7\u30A6\u30AC\u30A2\u30EC\u30D0" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30C4\u30DE\u30E9\u30CA\u30A4\u30AB\u30E9\u30E4\u30E1\u30ED\u30C8\u30A4\u30D2" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30D2\u30C9\u30EA\u30CE\u30C8\u30AD\u30CF\u30CA\u30DF\u30C0\u30F2\u30CA\u30AC\u30B7" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30B5\u30E0\u30B5\u30CE\u30CA\u30C4\u30CF\u30AA\u30ED\u30AA\u30ED\u30A2\u30EB\u30AD" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30DF\u30F3\u30CA\u30CB\u30C7\u30AF\u30CE\u30DC\u30FC\u30C8\u30E8\u30D0\u30EC" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30DB\u30E1\u30E9\u30EC\u30E2\u30BB\u30BA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30AF\u30CB\u30E2\u30B5\u30EC\u30BA" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30B5\u30A6\u30A4\u30D5\u30E2\u30CE\u30CB" }),
+          /* @__PURE__ */ jsx("p", { children: "\u30EF\u30BF\u30B7\u30CF\u30CA\u30EA\u30BF\u30A4" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(AccordionItem, { children: [
+        /* @__PURE__ */ jsx("h3", { children: /* @__PURE__ */ jsx(AccordionButton, { children: /* @__PURE__ */ jsx("p", { className: "text-lg", children: "\u3042\u3069\u3051\u306A\u3044\u8A71" }) }) }),
+        /* @__PURE__ */ jsxs(AccordionPanel, { children: [
+          /* @__PURE__ */ jsx("p", { children: "\u667A\u6075\u5B50\u306F\u6771\u4EAC\u306B\u7A7A\u304C\u7121\u3044\u3068\u3044\u3075\u3001" }),
+          /* @__PURE__ */ jsx("p", { children: "\u307B\u3093\u3068\u306E\u7A7A\u304C\u898B\u305F\u3044\u3068\u3044\u3075\u3002" }),
+          /* @__PURE__ */ jsx("p", { children: "\u79C1\u306F\u9A5A\u3044\u3066\u7A7A\u3092\u898B\u308B\u3002" }),
+          /* @__PURE__ */ jsx("p", { children: "\u685C\u82E5\u8449\u306E\u9593\u306B\u5728\u308B\u306E\u306F\u3001" }),
+          /* @__PURE__ */ jsx("p", { children: "\u5207\u3064\u3066\u3082\u5207\u308C\u306A\u3044" }),
+          /* @__PURE__ */ jsx("p", { children: "\u3080\u304B\u3057\u306A\u3058\u307F\u306E\u304D\u308C\u3044\u306A\u7A7A\u3060\u3002" }),
+          /* @__PURE__ */ jsx("p", { children: "\u3069\u3093\u3088\u308A\u3051\u3080\u308B\u5730\u5E73\u306E\u307C\u304B\u3057\u306F" }),
+          /* @__PURE__ */ jsx("p", { children: "\u3046\u3059\u3082\u3082\u8272\u306E\u671D\u306E\u3057\u3081\u308A\u3060\u3002" }),
+          /* @__PURE__ */ jsx("p", { children: "\u667A\u6075\u5B50\u306F\u9060\u304F\u3092\u898B\u306A\u304C\u3089\u8A00\u3075\u3002" }),
+          /* @__PURE__ */ jsx("p", { children: "\u963F\u591A\u591A\u7F85\u5C71\u3042\u305F\u305F\u3089\u3084\u307E\u306E\u5C71\u306E\u4E0A\u306B" }),
+          /* @__PURE__ */ jsx("p", { children: "\u6BCE\u65E5\u51FA\u3066\u3090\u308B\u9752\u3044\u7A7A\u304C" }),
+          /* @__PURE__ */ jsx("p", { children: "\u667A\u6075\u5B50\u306E\u307B\u3093\u3068\u306E\u7A7A\u3060\u3068\u3044\u3075\u3002" }),
+          /* @__PURE__ */ jsx("p", { children: "\u3042\u3069\u3051\u306A\u3044\u7A7A\u306E\u8A71\u3067\u3042\u308B\u3002" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(AccordionItem, { children: [
+        /* @__PURE__ */ jsx("h3", { children: /* @__PURE__ */ jsx(AccordionButton, { children: /* @__PURE__ */ jsx("p", { className: "text-lg", children: "\u304B\u306A\u3057\u307F" }) }) }),
+        /* @__PURE__ */ jsx(AccordionPanel, { children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { children: "\u3042\u306E\u9752\u3044\u7A7A\u306E\u6CE2\u306E\u97F3\u304C\u805E\u3048\u308B\u3042\u305F\u308A\u306B" }),
+            /* @__PURE__ */ jsx("p", { children: "\u4F55\u304B\u3068\u3093\u3067\u3082\u306A\u3044\u304A\u3068\u3057\u7269\u3092" }),
+            /* @__PURE__ */ jsx("p", { children: "\u50D5\u306F\u3057\u3066\u304D\u3066\u3057\u307E\u3063\u305F\u3089\u3057\u3044" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { children: "\u900F\u660E\u306A\u904E\u53BB\u306E\u99C5\u3067" }),
+            /* @__PURE__ */ jsx("p", { children: "\u907A\u5931\u7269\u4FC2\u306E\u524D\u306B\u7ACB\u3063\u305F\u3089" }),
+            /* @__PURE__ */ jsx("p", { children: "\u50D5\u306F\u4F59\u8A08\u306B\u60B2\u3057\u304F\u306A\u3063\u3066\u3057\u307E\u3063\u305F" })
+          ] })
+        ] }) })
+      ] })
+    ] });
+  }
+};
+export {
+  Primary,
+  accordion_stories_default as default
+};

package/dist/components/accordion/context.d.ts

@@ -0,0 +1,10 @@
+import { type FC, type PropsWithChildren } from 'react';
+type ToggleOpen = () => void;
+export declare const useOpen: () => boolean;
+export declare const useToggleOpen: () => ToggleOpen;
+export declare const useItemId: () => string;
+export declare const AccordionItemProvider: FC<PropsWithChildren<{
+    defaultOpen?: boolean;
+    id: string;
+}>>;
+export {};

package/dist/components/accordion/context.js

@@ -0,0 +1,38 @@
+import { jsx } from "react/jsx-runtime";
+import {
+  createContext,
+  use,
+  useCallback,
+  useState
+} from "react";
+const OpenContext = createContext(false);
+const ToggleOpenContext = createContext(void 0);
+const ItemIdContext = createContext(void 0);
+const useOpen = () => use(OpenContext);
+const useToggleOpen = () => {
+  const toggleOpen = use(ToggleOpenContext);
+  if (!toggleOpen) {
+    throw new Error("useToggleOpen must be used within AccordionProvider");
+  }
+  return toggleOpen;
+};
+const useItemId = () => {
+  const id = use(ItemIdContext);
+  if (!id) {
+    throw new Error("useItemId must be used within AccordionProvider");
+  }
+  return id;
+};
+const AccordionItemProvider = ({ defaultOpen = false, id, children }) => {
+  const [open, setOpen] = useState(defaultOpen);
+  const toggleOpen = useCallback(() => {
+    setOpen((open2) => !open2);
+  }, []);
+  return /* @__PURE__ */ jsx(OpenContext, { value: open, children: /* @__PURE__ */ jsx(ToggleOpenContext, { value: toggleOpen, children: /* @__PURE__ */ jsx(ItemIdContext, { value: id, children }) }) });
+};
+export {
+  AccordionItemProvider,
+  useItemId,
+  useOpen,
+  useToggleOpen
+};

package/dist/components/accordion/index.d.ts

@@ -0,0 +1,4 @@
+export * from './accordion';
+export * from './accordion-button';
+export * from './accordion-item';
+export * from './accordion-panel';

package/dist/components/accordion/index.js

@@ -0,0 +1,4 @@
+export * from "./accordion";
+export * from "./accordion-button";
+export * from "./accordion-item";
+export * from "./accordion-panel";

package/dist/components/alert/alert.d.ts

@@ -0,0 +1,8 @@
+import type { FC } from 'react';
+import type { Status } from './../../types/variables';
+type Props = {
+    status: Status;
+    message: string | string[];
+};
+export declare const Alert: FC<Props>;
+export {};

package/dist/components/alert/alert.js

@@ -0,0 +1,46 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "./../../helpers/cn";
+import { AlertIcon } from "../icons";
+const STATUS_LABEL = {
+  success: "\u6210\u529F",
+  info: "\u60C5\u5831",
+  warning: "\u8B66\u544A",
+  error: "\u30A8\u30E9\u30FC"
+};
+const Alert = ({ status, message }) => {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-2 rounded-md p-4",
+        status === "success" && "bg-bg-success",
+        status === "info" && "bg-bg-info",
+        status === "warning" && "bg-bg-warning",
+        status === "error" && "bg-bg-error"
+      ),
+      role: status === "error" || status === "warning" ? "alert" : "status",
+      children: [
+        /* @__PURE__ */ jsxs(
+          "span",
+          {
+            className: cn(
+              "size-8",
+              status === "success" && "text-fg-success",
+              status === "info" && "text-fg-info",
+              status === "warning" && "text-fg-warning",
+              status === "error" && "text-fg-error"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(AlertIcon, { size: "lg", status }),
+              /* @__PURE__ */ jsx("span", { className: "sr-only", children: STATUS_LABEL[status] })
+            ]
+          }
+        ),
+        Array.isArray(message) ? message.length > 1 ? /* @__PURE__ */ jsx("ul", { className: "ml-4 list-disc", children: message.map((msg) => /* @__PURE__ */ jsx("li", { className: "text-lg", children: msg }, msg)) }) : /* @__PURE__ */ jsx("p", { className: "font-bold text-lg", children: message[0] }) : /* @__PURE__ */ jsx("p", { className: "font-bold text-lg", children: message })
+      ]
+    }
+  );
+};
+export {
+  Alert
+};

package/dist/components/alert/alert.stories.js

@@ -0,0 +1,51 @@
+import { Alert } from "./alert";
+const meta = {
+  title: "components/alert",
+  component: Alert
+};
+var alert_stories_default = meta;
+const Success = {
+  args: {
+    status: "success",
+    message: "Success"
+  }
+};
+const Info = {
+  args: {
+    status: "info",
+    message: "Info"
+  }
+};
+const Warning = {
+  args: {
+    status: "warning",
+    message: "Warning"
+  }
+};
+const Error = {
+  args: {
+    status: "error",
+    message: "Error"
+  }
+};
+const ArrayMessage = {
+  args: {
+    status: "success",
+    message: ["Success1", "Success2", "Success3"]
+  }
+};
+const SingleArrayMessage = {
+  args: {
+    status: "success",
+    message: ["Success"]
+  }
+};
+export {
+  ArrayMessage,
+  Error,
+  Info,
+  SingleArrayMessage,
+  Success,
+  Warning,
+  alert_stories_default as default
+};

package/dist/components/alert/index.d.ts

@@ -0,0 +1 @@
+export * from './alert';

package/dist/components/alert/index.js

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

package/dist/components/anchor/anchor.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from 'react';
+export declare const Anchor: ({ href, children, openInNewTab, renderAnchor, }: {
+    href: string;
+    children: ReactNode;
+    openInNewTab?: boolean;
+    renderAnchor?: (props: {
+        type: "internal" | "external";
+        href: string;
+        className: string;
+        target?: string;
+        rel?: string;
+        children: ReactNode;
+    }) => ReactNode;
+}) => ReactNode;

package/dist/components/anchor/anchor.js

@@ -0,0 +1,31 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { isInternalRoute } from "./../../helpers/is-internal-route";
+import { ExternalLinkIcon } from "../icons";
+const Anchor = ({
+  href,
+  children,
+  openInNewTab = false,
+  renderAnchor = ({ children: children2, ...props }) => /* @__PURE__ */ jsx("a", { ...props, children: children2 })
+}) => {
+  const type = isInternalRoute(href) && !openInNewTab ? "internal" : "external";
+  const props = type === "internal" ? {
+    className: "text-fg-info cursor-pointer underline",
+    children
+  } : {
+    className: "text-fg-info inline-flex cursor-pointer items-center gap-0.5 underline",
+    target: "_blank",
+    rel: "noopener noreferrer",
+    children: /* @__PURE__ */ jsxs(Fragment, { children: [
+      children,
+      /* @__PURE__ */ jsx(ExternalLinkIcon, { size: "sm" })
+    ] })
+  };
+  return renderAnchor({
+    type,
+    href,
+    ...props
+  });
+};
+export {
+  Anchor
+};

package/dist/components/anchor/anchor.stories.js

@@ -0,0 +1,23 @@
+import { Anchor } from "./anchor";
+const meta = {
+  title: "components/anchor",
+  component: Anchor
+};
+var anchor_stories_default = meta;
+const External = {
+  args: {
+    href: "https://example.com",
+    children: "external link"
+  }
+};
+const Internal = {
+  args: {
+    href: "/blog",
+    children: "internal link"
+  }
+};
+export {
+  External,
+  Internal,
+  anchor_stories_default as default
+};

package/dist/components/anchor/index.d.ts

@@ -0,0 +1 @@
+export * from './anchor';

package/dist/components/anchor/index.js

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

package/dist/components/baseline-status/baseline-status.d.ts

@@ -0,0 +1,16 @@
+import { type FC } from 'react';
+declare global {
+    namespace React {
+        namespace JSX {
+            interface IntrinsicElements {
+                'baseline-status': {
+                    featureId: string;
+                    className: string;
+                };
+            }
+        }
+    }
+}
+export declare const BaselineStatus: FC<{
+    featureId: string;
+}>;

package/dist/components/baseline-status/baseline-status.js

@@ -0,0 +1,39 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useSyncExternalStore } from "react";
+let didInit = false;
+const BaselineStatus = ({ featureId }) => {
+  const isLoad = useSyncExternalStore(
+    (onStoreChange) => {
+      if (!didInit) {
+        didInit = true;
+        void import("baseline-status").then(() => {
+          onStoreChange();
+        });
+      }
+      return () => {
+      };
+    },
+    () => didInit,
+    () => false
+  );
+  if (!isLoad) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "max-w-full animate-pulse rounded-md border border-border-base bg-bg-base p-4",
+        style: { height: "120px" }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "baseline-status",
+    {
+      className: "wrap-normal max-w-full rounded-md border border-border-base bg-bg-base p-4",
+      featureId
+    }
+  );
+};
+export {
+  BaselineStatus
+};

package/dist/components/baseline-status/baseline-status.stories.js

@@ -0,0 +1,15 @@
+import { BaselineStatus } from "./baseline-status";
+const meta = {
+  title: "components/baseline-status",
+  component: BaselineStatus
+};
+var baseline_status_stories_default = meta;
+const Primary = {
+  args: {
+    featureId: "promise-try"
+  }
+};
+export {
+  Primary,
+  baseline_status_stories_default as default
+};

package/dist/components/baseline-status/index.d.ts

@@ -0,0 +1 @@
+export * from './baseline-status';

package/dist/components/baseline-status/index.js

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

package/dist/components/breadcrumb/breadcrumb.d.ts

@@ -0,0 +1,18 @@
+import type { FC, PropsWithChildren } from 'react';
+export declare const Breadcrumb: {
+    List: FC<PropsWithChildren<{
+        size?: "sm" | "md" | "lg";
+    }>>;
+    Item: FC<{
+        children?: React.ReactNode | undefined;
+    }>;
+    Separator: FC;
+    Link: FC<PropsWithChildren<{
+        href: string;
+        current?: boolean;
+        component?: FC<{
+            href: string;
+            className: string;
+        }>;
+    }>>;
+};

package/dist/components/breadcrumb/breadcrumb.js

@@ -0,0 +1,36 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "./../../helpers/cn";
+import { ChevronIcon } from "../icons";
+const List = ({ children, size = "md" }) => {
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "\u30D1\u30F3\u30AF\u30BA\u30EA\u30B9\u30C8", children: /* @__PURE__ */ jsx(
+    "ol",
+    {
+      className: cn(
+        "flex list-none items-center gap-1 font-bold text-fg-mute",
+        size === "sm" && "text-xs",
+        size === "md" && "text-xs md:text-md",
+        size === "lg" && "text-xl md:text-2xl"
+      ),
+      children
+    }
+  ) });
+};
+const Item = ({ children }) => {
+  return /* @__PURE__ */ jsx("li", { className: "inline-flex items-center", children });
+};
+const Separator = () => {
+  return /* @__PURE__ */ jsx("li", { className: "text-fg-mute", children: /* @__PURE__ */ jsx(ChevronIcon, { direction: "right", size: "sm" }) });
+};
+const _Link = ({ href, current = false, children, component }) => {
+  const Link = component ?? "a";
+  return current ? /* @__PURE__ */ jsx("span", { className: "text-fg-base", children }) : /* @__PURE__ */ jsx(Link, { className: "text-fg-mute underline hover:text-fg-base", href, children });
+};
+const Breadcrumb = {
+  List,
+  Item,
+  Separator,
+  Link: _Link
+};
+export {
+  Breadcrumb
+};