@duskmoon-dev/components 0.1.2

package/dist/components/dm-message/index.js

@@ -0,0 +1,280 @@
+"use client";
+
+// src/components/message/Message.tsx
+import React, { useSyncExternalStore } from "react";
+
+// ../../node_modules/.bun/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if (typeof e == "string" || typeof e == "number")
+    n += e;
+  else if (typeof e == "object")
+    if (Array.isArray(e)) {
+      var o = e.length;
+      for (t = 0;t < o; t++)
+        e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+    } else
+      for (f in e)
+        e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length;f < o; f++)
+    (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return clsx(inputs);
+}
+// src/classes/message.ts
+var messageHolderClass = "message-holder";
+var messageBaseClass = "message";
+var messageContentClass = "message-content";
+var messageIconClass = "message-icon";
+var messageCloseClass = "message-close";
+var messageTypeClasses = {
+  info: "message-info alert alert-info",
+  success: "message-success alert alert-success",
+  error: "message-error alert alert-error",
+  warning: "message-warning alert alert-warning",
+  loading: "message-loading alert"
+};
+var messagePlacementClasses = {
+  top: "message-top",
+  bottom: "message-bottom"
+};
+function getMessageHolderClasses({
+  placement = "top",
+  className
+}) {
+  return cn(messageHolderClass, messagePlacementClasses[placement], className);
+}
+function getMessageClasses({
+  type = "info",
+  className
+}) {
+  return cn(messageBaseClass, messageTypeClasses[type], className);
+}
+
+// src/components/message/Message.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var seed = 0;
+var globalConfig = {
+  duration: 3,
+  placement: "top"
+};
+var messages = [];
+var listeners = new Set;
+var timers = new Map;
+var snapshot = { messages, config: globalConfig };
+function emit() {
+  snapshot = { messages, config: globalConfig };
+  for (const listener of listeners) {
+    listener();
+  }
+}
+function subscribe(listener) {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+function getSnapshot() {
+  return snapshot;
+}
+function normalizeContent(type, content, duration, onClose) {
+  if (typeof content === "object" && content !== null && !React.isValidElement(content) && (("content" in content) || ("type" in content) || ("key" in content))) {
+    return { type, ...content };
+  }
+  return { type, content, duration, onClose };
+}
+function makeHandle(key) {
+  const promise = Promise.resolve();
+  promise.key = key;
+  promise.close = () => destroy(key);
+  return promise;
+}
+function clearTimer(key) {
+  const timer = timers.get(key);
+  if (timer) {
+    clearTimeout(timer);
+    timers.delete(key);
+  }
+}
+function destroy(key) {
+  if (key === undefined) {
+    for (const item of messages) {
+      clearTimer(item.key);
+      item.onClose?.();
+    }
+    messages = [];
+    emit();
+    return;
+  }
+  const targetKey = String(key);
+  const target = messages.find((item) => item.key === targetKey);
+  clearTimer(targetKey);
+  messages = messages.filter((item) => item.key !== targetKey);
+  target?.onClose?.();
+  emit();
+}
+function open(config) {
+  const key = String(config.key ?? `message-${seed += 1}`);
+  const duration = config.duration ?? globalConfig.duration;
+  const next = {
+    key,
+    type: config.type ?? "info",
+    content: config.content,
+    duration,
+    className: config.className,
+    icon: config.icon,
+    onClose: config.onClose
+  };
+  clearTimer(key);
+  messages = messages.filter((item) => item.key !== key).concat(next);
+  if (globalConfig.maxCount && messages.length > globalConfig.maxCount) {
+    const overflow = messages.slice(0, messages.length - globalConfig.maxCount);
+    for (const item of overflow) {
+      clearTimer(item.key);
+      item.onClose?.();
+    }
+    messages = messages.slice(-globalConfig.maxCount);
+  }
+  if (duration > 0) {
+    timers.set(key, setTimeout(() => destroy(key), duration * 1000));
+  }
+  emit();
+  return makeHandle(key);
+}
+function typedOpen(type) {
+  return (content, duration, onClose) => open(normalizeContent(type, content, duration, onClose));
+}
+function config(nextConfig) {
+  globalConfig = { ...globalConfig, ...nextConfig };
+  emit();
+}
+function MessageHolder({ className }) {
+  const snapshot2 = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+  return /* @__PURE__ */ jsx("div", {
+    className: getMessageHolderClasses({
+      placement: snapshot2.config.placement,
+      className
+    }),
+    children: snapshot2.messages.map((item) => /* @__PURE__ */ jsxs("div", {
+      className: getMessageClasses({
+        type: item.type,
+        className: item.className
+      }),
+      children: [
+        item.icon ? /* @__PURE__ */ jsx("span", {
+          className: messageIconClass,
+          children: item.icon
+        }) : null,
+        /* @__PURE__ */ jsx("span", {
+          className: messageContentClass,
+          children: item.content
+        }),
+        /* @__PURE__ */ jsx("button", {
+          type: "button",
+          className: messageCloseClass,
+          "aria-label": "Close message",
+          onClick: () => destroy(item.key),
+          children: "x"
+        })
+      ]
+    }, item.key))
+  });
+}
+var apiBase = {
+  open,
+  success: typedOpen("success"),
+  error: typedOpen("error"),
+  info: typedOpen("info"),
+  warning: typedOpen("warning"),
+  loading: typedOpen("loading"),
+  destroy,
+  config
+};
+var message = {
+  ...apiBase,
+  useMessage: () => [message, /* @__PURE__ */ jsx(MessageHolder, {}, "message-holder")]
+};
+// src/classes/dm-message.ts
+var dmMessageContentClass = "dm-message-content";
+var dmMessageScrollbarClass = "dm-message-scrollbar";
+var dmMessageLineClass = "dm-message-line";
+function getDmMessageContentClasses({
+  className
+}) {
+  return cn(dmMessageContentClass, className);
+}
+
+// src/components/dm-message/DmMessage.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function decodeHtmlEntities(content) {
+  return content.replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&amp;/g, "&").replace(/&quot;/g, '"').replace(/&#39;/g, "'");
+}
+function ensureDmMessageConfig() {
+  message.config({ duration: 3, maxCount: 3 });
+}
+function DmMessageContent({
+  content,
+  className
+}) {
+  const lines = decodeHtmlEntities(content || "").split("<br/>");
+  return /* @__PURE__ */ jsx2("span", {
+    className: getDmMessageContentClasses({ className }),
+    children: /* @__PURE__ */ jsx2("span", {
+      className: dmMessageScrollbarClass,
+      children: lines.map((line, index) => /* @__PURE__ */ jsx2("span", {
+        className: dmMessageLineClass,
+        children: line
+      }, `${index}-${line}`))
+    })
+  });
+}
+function typedOpen2(type) {
+  return (content, key) => {
+    ensureDmMessageConfig();
+    return message.open({
+      content: /* @__PURE__ */ jsx2(DmMessageContent, {
+        content
+      }),
+      key,
+      type
+    });
+  };
+}
+function open2(content, key, type = "info") {
+  ensureDmMessageConfig();
+  return message.open({
+    content: /* @__PURE__ */ jsx2(DmMessageContent, {
+      content
+    }),
+    key,
+    type
+  });
+}
+function destroy2(key) {
+  message.destroy(key);
+}
+message.config({ duration: 3, maxCount: 3 });
+function DmMessageHolder({ className }) {
+  return /* @__PURE__ */ jsx2(MessageHolder, {
+    className
+  });
+}
+var DmMessage = {
+  error: typedOpen2("error"),
+  success: typedOpen2("success"),
+  warning: typedOpen2("warning"),
+  info: typedOpen2("info"),
+  loading: typedOpen2("loading"),
+  open: open2,
+  destroy: destroy2
+};
+export {
+  DmMessageHolder,
+  DmMessageContent,
+  DmMessage
+};

package/dist/components/dm-page-header/DmPageHeader.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import type { DmPageHeaderProps } from "./DmPageHeader.types";
+export declare function DmPageHeader({ backClick, onBack, title, extra, breadcrumb, className, style, children, titleSeparator, backIcon, }: DmPageHeaderProps): React.JSX.Element;
+export declare namespace DmPageHeader {
+    var displayName: string;
+}

package/dist/components/dm-page-header/DmPageHeader.types.d.ts

@@ -0,0 +1,19 @@
+import type { CSSProperties, MouseEvent, ReactNode } from "react";
+import type { BreadcrumbProps } from "../breadcrumb/Breadcrumb.types";
+import type { DmToolbarProps } from "../dm-toolbar/DmToolbar.types";
+export interface DmPageHeaderTitleItem {
+    title: ReactNode;
+    value: ReactNode;
+}
+export interface DmPageHeaderProps {
+    backClick?: (event: MouseEvent<HTMLButtonElement>) => void;
+    onBack?: (event: MouseEvent<HTMLButtonElement>) => void;
+    title?: ReactNode | DmPageHeaderTitleItem[];
+    extra?: ReactNode | DmToolbarProps;
+    breadcrumb?: BreadcrumbProps;
+    className?: string;
+    style?: CSSProperties;
+    children?: ReactNode;
+    titleSeparator?: ReactNode;
+    backIcon?: ReactNode;
+}

package/dist/components/dm-page-header/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./DmPageHeader";
+export * from "./DmPageHeader.types";