@dotss/tictoccroc 0.3.3 → 0.4.1

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

@@ -0,0 +1,19 @@
+import { MouseEvent } from 'react';
+import { ButtonProps } from '@dotss/ui/Button';
+import { CollapseProps } from '@dotss/ui/Collapse';
+import { FlexboxProps } from 'node_modules/@dotss/ui/Flexbox/Flexbox';
+export interface NotificationCardProps {
+    id: number;
+    collapsed: boolean;
+    title: string;
+    description: string;
+    regDate: string;
+    isNew: boolean;
+    collapseProps?: CollapseProps;
+    wrapperProps?: FlexboxProps;
+    buttonProps?: ButtonProps;
+    collapseDuration?: number;
+    onClick: (e: MouseEvent<HTMLButtonElement>, id: number, isCollapsed: boolean) => void;
+}
+declare function NotificationCard({ id, collapsed, title, description, regDate, isNew, collapseProps, wrapperProps, buttonProps, onClick, collapseDuration }: NotificationCardProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export default NotificationCard;

package/dist/parent/notification/components/NotificationCard/NotificationCard.mjs

@@ -0,0 +1,106 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { Badge as S, Typography as c, Icon as k, Collapse as v, Box as H } from "@dotss/ui";
+import j from "@dotss/ui/core/useTheme";
+import n from "@dotss/ui/Flexbox";
+import { useCheckHoverPossible as w } from "@dotss/ui/hooks";
+import z from "dayjs";
+function M({
+  id: s,
+  collapsed: r,
+  title: g,
+  description: m,
+  regDate: a,
+  isNew: p,
+  collapseProps: d,
+  wrapperProps: h,
+  buttonProps: f,
+  onClick: u,
+  collapseDuration: l = 400
+}) {
+  const { palette: o, spacing: b, typography: t } = j(), { isHoverPossible: C } = w(), x = (y) => u(y, s, !r);
+  return /* @__PURE__ */ i(n, { flexDirection: "column", inlineCSS: { width: "100%" }, ...h, children: [
+    /* @__PURE__ */ i(
+      n,
+      {
+        tag: "button",
+        p: 4,
+        gap: 4,
+        justifyContent: "space-between",
+        inlineCSS: {
+          "&:active": {
+            backgroundColor: o.background.primary
+          },
+          ...C ? {
+            "&:hover": {
+              backgroundColor: o.background.primary
+            }
+          } : {}
+        },
+        onClick: x,
+        "aria-expanded": !r,
+        ...f,
+        children: [
+          /* @__PURE__ */ i(n, { gap: 2, children: [
+            p && /* @__PURE__ */ e(
+              S,
+              {
+                size: "large",
+                color: "pink",
+                position: "static",
+                content: "N",
+                "aria-label": "새 알림",
+                inlineCSS: {
+                  marginTop: b.content(1)
+                }
+              }
+            ),
+            /* @__PURE__ */ i(n, { flexDirection: "column", gap: 1, alignItems: "flex-start", children: [
+              /* @__PURE__ */ e(c, { tag: "span", variant: "h4B", textAlign: "left", children: g }),
+              a && /* @__PURE__ */ e(c, { tag: "span", variant: "b5R", color: "grey.50", children: z(a).format("YYYY.MM.DD") })
+            ] })
+          ] }),
+          /* @__PURE__ */ e(
+            n,
+            {
+              alignItems: "center",
+              style: {
+                willChange: "transform",
+                transition: `transform ${l}ms ease-in-out`,
+                transform: r ? "rotate(0deg)" : "rotate(180deg)"
+              },
+              children: /* @__PURE__ */ e(k, { name: "ChevronDownLine", size: "xSmall", color: "grey.50" })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(
+      v,
+      {
+        isCollapsed: r,
+        duration: l,
+        role: "region",
+        ...d,
+        children: /* @__PURE__ */ e(
+          H,
+          {
+            p: 4,
+            inlineCSS: {
+              backgroundColor: o.background.primary,
+              "& *": {
+                fontSize: t.b3R.size,
+                lineHeight: t.b3R.lineHeight,
+                letterSpacing: t.b3R.letterSpacing
+              },
+              "& img": { maxWidth: "100% !important" }
+            },
+            dangerouslySetInnerHTML: { __html: m }
+          }
+        )
+      }
+    )
+  ] });
+}
+export {
+  M as default
+};

package/dist/parent/notification/components/NotificationCard/index.d.ts

@@ -0,0 +1,3 @@
+import { default as NotificationCard } from './NotificationCard';
+export type { NotificationCardProps } from './NotificationCard';
+export default NotificationCard;

package/dist/parent/notification/components/NotificationCard/index.mjs

@@ -0,0 +1,4 @@
+import t from "./NotificationCard.mjs";
+export {
+  t as default
+};

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

@@ -0,0 +1,2 @@
+export { default as NotificationCard } from './NotificationCard';
+export * from './NotificationCard';

package/dist/parent/notification/components/index.mjs

@@ -0,0 +1,4 @@
+import { default as t } from "./NotificationCard/NotificationCard.mjs";
+export {
+  t as NotificationCard
+};

package/dist/parent/notification/utils/index.d.ts

@@ -0,0 +1 @@
+export { default as sanitize } from './sanitize/sanitize';

package/dist/parent/notification/utils/index.mjs

@@ -0,0 +1,4 @@
+import { default as t } from "./sanitize/sanitize.mjs";
+export {
+  t as sanitize
+};

package/dist/parent/notification/utils/sanitize/sanitize.d.ts

@@ -0,0 +1 @@
+export default function sanitize(html: string): string;

package/dist/parent/notification/utils/sanitize/sanitize.mjs

@@ -0,0 +1,7 @@
+import { p as t } from "../../../../purify.es-BGaRrCfO.js";
+function a(i) {
+  return t.sanitize(i);
+}
+export {
+  a as default
+};

package/dist/parent/notification/utils/sanitize/sanitize.test.d.ts

@@ -0,0 +1 @@
+export {};