@situaction/traq-ui-ste 1.1.18 → 1.1.20

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

@@ -12,6 +12,10 @@ export interface AccordionProps {
         defaultOpen?: boolean;
         /** The content displayed when the accordion item is expanded. */
         content: ReactNode;
+        /** ID accordions items*/
+        id: string;
+        /** Function to handle click on the header */
+        onClickHeader?: (id: string) => void;
     }[];
     /** Accordion style if block type the header and the content are in the same block, if it is tile they are separated into 2 blocks */
     type?: 'block' | 'tile';

package/dist/components/accordion/Accordion.js

@@ -1,19 +1,23 @@
-import { jsx as c } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
 import { AccordionItem as i } from "./item/AccordionItem.js";
-import '../../styles/Accordion.css';const a = "_accordion_hz3a1_6", t = {
-  accordion: a
-}, p = ({ items: n, type: r = "block", paddingHeader: e }) => /* @__PURE__ */ c("div", { className: t.accordion, children: n.map((o, d) => /* @__PURE__ */ c(
+import '../../styles/Accordion.css';const l = "_accordion_hz3a1_6", s = {
+  accordion: l
+}, h = ({ items: r, type: d = "block", paddingHeader: a }) => /* @__PURE__ */ n("div", { className: s.accordion, children: r.map((o, e) => /* @__PURE__ */ n(
   i,
   {
     header: o.header,
     iconPosition: o.iconPosition ?? "right",
     defaultOpen: o.defaultOpen ?? !1,
-    type: r ?? "block",
-    paddingHeader: e ?? "m",
+    type: d ?? "block",
+    paddingHeader: a ?? "m",
+    onClickHeader: () => {
+      var c;
+      return (c = o.onClickHeader) == null ? void 0 : c.call(o, o.id);
+    },
     children: o.content
   },
-  d
+  e
 )) });
 export {
-  p as Accordion
+  h as Accordion
 };

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

@@ -14,6 +14,8 @@ interface AccordionItemProps {
     type?: 'block' | 'tile';
     /** Padding size inside the Accordion: small, medium, large */
     paddingHeader?: Size;
+    /** Click handler on the padding header (outside of IconButtons) */
+    onClickHeader?: () => void;
 }
 /**
  * AccordionItem component represents an individual item in an accordion.

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

@@ -1,52 +1,61 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
-import { useState as g, useEffect as _ } from "react";
-import { IconButton as a } from "../../icon-button/IconButton.js";
-import '../../../styles/AccordionItem.css';const w = "_accordionHeader_1tsuj_7", p = "_title_1tsuj_31", m = "_fullHeight_1tsuj_36", v = "_block_1tsuj_40", f = "_tile_1tsuj_48", l = {
-  accordionHeader: w,
+import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import { useState as p, useEffect as m } from "react";
+import { IconButton as n } from "../../icon-button/IconButton.js";
+import '../../../styles/AccordionItem.css';const u = "_accordionHeader_1tsuj_7", f = "_title_1tsuj_31", v = "_fullHeight_1tsuj_36", x = "_block_1tsuj_40", j = "_tile_1tsuj_48", l = {
+  accordionHeader: u,
   "padding-s": "_padding-s_1tsuj_15",
   "padding-m": "_padding-m_1tsuj_19",
   "padding-l": "_padding-l_1tsuj_23",
   "padding-xl": "_padding-xl_1tsuj_27",
-  title: p,
-  fullHeight: m,
-  block: v,
-  tile: f
-}, k = ({
-  header: c,
-  children: n,
+  title: f,
+  fullHeight: v,
+  block: x,
+  tile: j
+}, H = ({
+  header: r,
+  children: g,
   iconPosition: d = "right",
-  defaultOpen: e = !1,
+  defaultOpen: s = !1,
   type: h = "block",
-  paddingHeader: r = "m"
+  paddingHeader: _ = "m",
+  onClickHeader: e
 }) => {
-  const [i, s] = g(!1);
-  return _(() => {
-    e && s(e);
-  }, [e]), /* @__PURE__ */ o("div", { className: `${h === "tile" ? l.tile : l.block}`, children: [
-    /* @__PURE__ */ o("div", { className: `${l.accordionHeader} ${l[`padding-${r}`]}`, children: [
+  const [i, o] = p(!1);
+  m(() => {
+    s && o(s);
+  }, [s]);
+  const w = (a) => {
+    if (a.target.closest("button")) {
+      a.stopPropagation();
+      return;
+    }
+    e == null || e();
+  };
+  return /* @__PURE__ */ c("div", { className: `${h === "tile" ? l.tile : l.block}`, children: [
+    /* @__PURE__ */ c("div", { className: `${l.accordionHeader} ${l[`padding-${_}`]}`, onClick: w, "data-ignore-outside-click": !0, children: [
       d === "left" && /* @__PURE__ */ t(
-        a,
+        n,
         {
           mode: "ghost",
           size: "s",
-          onClick: () => s(!i),
+          onClick: () => o(!i),
           children: i ? /* @__PURE__ */ t("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "#000000", viewBox: "0 0 256 256", children: /* @__PURE__ */ t("path", { d: "M213.66,165.66a8,8,0,0,1-11.32,0L128,91.31,53.66,165.66a8,8,0,0,1-11.32-11.32l80-80a8,8,0,0,1,11.32,0l80,80A8,8,0,0,1,213.66,165.66Z" }) }) : /* @__PURE__ */ t("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "#000000", viewBox: "0 0 256 256", children: /* @__PURE__ */ t("path", { d: "M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z" }) })
         }
       ),
-      /* @__PURE__ */ t("div", { className: l.title, children: c }),
+      /* @__PURE__ */ t("div", { className: l.title, children: r }),
       d === "right" && /* @__PURE__ */ t(
-        a,
+        n,
         {
           mode: "ghost",
           size: "s",
-          onClick: () => s(!i),
+          onClick: () => o(!i),
           children: i ? /* @__PURE__ */ t("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "#000000", viewBox: "0 0 256 256", children: /* @__PURE__ */ t("path", { d: "M213.66,165.66a8,8,0,0,1-11.32,0L128,91.31,53.66,165.66a8,8,0,0,1-11.32-11.32l80-80a8,8,0,0,1,11.32,0l80,80A8,8,0,0,1,213.66,165.66Z" }) }) : /* @__PURE__ */ t("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "#000000", viewBox: "0 0 256 256", children: /* @__PURE__ */ t("path", { d: "M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z" }) })
         }
       )
     ] }),
-    i && n
+    i && g
   ] });
 };
 export {
-  k as AccordionItem
+  H as AccordionItem
 };

package/dist/components/calendar/Calendar.d.ts

@@ -13,6 +13,10 @@ export interface CalendarProps {
         start: Date;
         end: Date;
     }) => void;
+    /** Maximum date allowed by the selection */
+    maxDateSelected?: Date;
+    /** Minimum date allowed by the selection */
+    minDateSelected?: Date;
 }
 /**
  * Calendar component that renders a month view for selecting dates.