@jigowatts/jigowatts-ui 1.2.2 → 2.1.0

package/dist/components/ReportCard/index.test.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.test.es.js","sources":["../../../src/components/ReportCard/index.test.tsx"],"sourcesContent":["import { Typography } from \"@mui/material\";\nimport { render, screen } from \"@testing-library/react\";\n\nimport { ReportCard } from \".\";\n\ndescribe(\"ReportCard component\", () => {\n  it(\"renders ReportCard component with given label string and value string\", async () => {\n    render(<ReportCard value=\"値\" label=\"ラベル\" />);\n\n    const valueElement = screen.getByText(\"値\");\n    expect(valueElement).toBeInTheDocument();\n\n    const labelElement = screen.getByText(\"ラベル\");\n    expect(labelElement).toBeInTheDocument();\n  });\n\n  it(\"renders ReportCard component with given label element and value element\", async () => {\n    render(\n      <ReportCard\n        value={<Typography>値</Typography>}\n        label={<Typography>ラベル</Typography>}\n      />,\n    );\n\n    const valueElement = screen.getByText(\"値\");\n    expect(valueElement).toBeInTheDocument();\n\n    const labelElement = screen.getByText(\"ラベル\");\n    expect(labelElement).toBeInTheDocument();\n  });\n\n  it(\"renders with label at the bottom by default\", async () => {\n    const { container } = render(<ReportCard value=\"値\" label=\"ラベル\" />);\n    const children = container.querySelector(\".MuiGrid-root\")?.children;\n    expect(children?.[0]).toHaveClass(\"reportValue\");\n    expect(children?.[1]).toHaveClass(\"reportLabel\");\n  });\n\n  it(\"renders with label at the top when labelPosition is set to top\", async () => {\n    const { container } = render(\n      <ReportCard value=\"値\" label=\"ラベル\" labelPosition=\"top\" />,\n    );\n    const children = container.querySelector(\".MuiGrid-root\")?.children;\n    expect(children?.[0]).toHaveClass(\"reportLabel\");\n    expect(children?.[1]).toHaveClass(\"reportValue\");\n  });\n});\n"],"names":["render","ReportCard","valueElement","screen","labelElement","jsx","Typography","container","children","_a"],"mappings":";;;;AAKA,SAAS,wBAAwB,MAAM;AACrC,KAAG,yEAAyE,YAAY;AACtF,IAAAA,oBAAQC,GAAW,EAAA,OAAM,KAAI,OAAM,OAAM,CAAE;AAErC,UAAAC,IAAeC,EAAO,UAAU,GAAG;AAClC,WAAAD,CAAY,EAAE,kBAAkB;AAEjC,UAAAE,IAAeD,EAAO,UAAU,KAAK;AACpC,WAAAC,CAAY,EAAE,kBAAkB;AAAA,EAAA,CACxC,GAED,GAAG,2EAA2E,YAAY;AACxF,IAAAJ;AAAA,MACE,gBAAAK;AAAA,QAACJ;AAAA,QAAA;AAAA,UACC,OAAQ,gBAAAI,EAAAC,GAAA,EAAW,UAAC,IAAA,CAAA;AAAA,UACpB,OAAQ,gBAAAD,EAAAC,GAAA,EAAW,UAAG,MAAA,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAE1B;AAEM,UAAAJ,IAAeC,EAAO,UAAU,GAAG;AAClC,WAAAD,CAAY,EAAE,kBAAkB;AAEjC,UAAAE,IAAeD,EAAO,UAAU,KAAK;AACpC,WAAAC,CAAY,EAAE,kBAAkB;AAAA,EAAA,CACxC,GAED,GAAG,+CAA+C,YAAY;;AACtD,UAAA,EAAE,WAAAG,EAAU,IAAIP,EAAO,gBAAAK,EAACJ,KAAW,OAAM,KAAI,OAAM,MAAM,CAAA,CAAE,GAC3DO,KAAWC,IAAAF,EAAU,cAAc,eAAe,MAAvC,gBAAAE,EAA0C;AAC3D,WAAOD,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,GAC/C,OAAOA,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa;AAAA,EAAA,CAChD,GAED,GAAG,kEAAkE,YAAY;;AACzE,UAAA,EAAE,WAAAD,MAAcP;AAAA,wBACnBC,GAAW,EAAA,OAAM,KAAI,OAAM,OAAM,eAAc,MAAM,CAAA;AAAA,IACxD,GACMO,KAAWC,IAAAF,EAAU,cAAc,eAAe,MAAvC,gBAAAE,EAA0C;AAC3D,WAAOD,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,GAC/C,OAAOA,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa;AAAA,EAAA,CAChD;AACH,CAAC;"}
+{"version":3,"file":"index.test.es.js","sources":["../../../src/components/ReportCard/index.test.tsx"],"sourcesContent":["import { Typography } from \"@mui/material\";\nimport { render, screen } from \"@testing-library/react\";\n\nimport { ReportCard } from \".\";\n\ndescribe(\"ReportCard component\", () => {\n  it(\"renders ReportCard component with given label string and value string\", async () => {\n    render(<ReportCard value=\"値\" label=\"ラベル\" />);\n\n    const valueElement = screen.getByText(\"値\");\n    expect(valueElement).toBeInTheDocument();\n\n    const labelElement = screen.getByText(\"ラベル\");\n    expect(labelElement).toBeInTheDocument();\n  });\n\n  it(\"renders ReportCard component with given label element and value element\", async () => {\n    render(\n      <ReportCard\n        value={<Typography>値</Typography>}\n        label={<Typography>ラベル</Typography>}\n      />,\n    );\n\n    const valueElement = screen.getByText(\"値\");\n    expect(valueElement).toBeInTheDocument();\n\n    const labelElement = screen.getByText(\"ラベル\");\n    expect(labelElement).toBeInTheDocument();\n  });\n\n  it(\"renders with label at the bottom by default\", async () => {\n    const { container } = render(<ReportCard value=\"値\" label=\"ラベル\" />);\n    const children = container.querySelector(\".MuiGrid-root\")?.children;\n    expect(children?.[0]).toHaveClass(\"reportValue\");\n    expect(children?.[1]).toHaveClass(\"reportLabel\");\n  });\n\n  it(\"renders with label at the top when labelPosition is set to top\", async () => {\n    const { container } = render(\n      <ReportCard value=\"値\" label=\"ラベル\" labelPosition=\"top\" />,\n    );\n    const children = container.querySelector(\".MuiGrid-root\")?.children;\n    expect(children?.[0]).toHaveClass(\"reportLabel\");\n    expect(children?.[1]).toHaveClass(\"reportValue\");\n  });\n});\n"],"names":["render","ReportCard","valueElement","screen","labelElement","jsx","Typography","container","children","_a"],"mappings":";;;;AAKA,SAAS,wBAAwB,MAAM;AACrC,KAAG,yEAAyE,YAAY;AACtF,IAAAA,oBAAQC,GAAA,EAAW,OAAM,KAAI,OAAM,OAAM,CAAE;AAE3C,UAAMC,IAAeC,EAAO,UAAU,GAAG;AACzC,WAAOD,CAAY,EAAE,kBAAA;AAErB,UAAME,IAAeD,EAAO,UAAU,KAAK;AAC3C,WAAOC,CAAY,EAAE,kBAAA;AAAA,EACvB,CAAC,GAED,GAAG,2EAA2E,YAAY;AACxF,IAAAJ;AAAA,MACE,gBAAAK;AAAA,QAACJ;AAAA,QAAA;AAAA,UACC,OAAO,gBAAAI,EAACC,GAAA,EAAW,UAAA,IAAA,CAAC;AAAA,UACpB,OAAO,gBAAAD,EAACC,GAAA,EAAW,UAAA,MAAA,CAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IACxB;AAGF,UAAMJ,IAAeC,EAAO,UAAU,GAAG;AACzC,WAAOD,CAAY,EAAE,kBAAA;AAErB,UAAME,IAAeD,EAAO,UAAU,KAAK;AAC3C,WAAOC,CAAY,EAAE,kBAAA;AAAA,EACvB,CAAC,GAED,GAAG,+CAA+C,YAAY;;AAC5D,UAAM,EAAE,WAAAG,EAAA,IAAcP,EAAO,gBAAAK,EAACJ,KAAW,OAAM,KAAI,OAAM,MAAA,CAAM,CAAE,GAC3DO,KAAWC,IAAAF,EAAU,cAAc,eAAe,MAAvC,gBAAAE,EAA0C;AAC3D,WAAOD,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,GAC/C,OAAOA,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa;AAAA,EACjD,CAAC,GAED,GAAG,kEAAkE,YAAY;;AAC/E,UAAM,EAAE,WAAAD,MAAcP;AAAA,wBACnBC,GAAA,EAAW,OAAM,KAAI,OAAM,OAAM,eAAc,MAAA,CAAM;AAAA,IAAA,GAElDO,KAAWC,IAAAF,EAAU,cAAc,eAAe,MAAvC,gBAAAE,EAA0C;AAC3D,WAAOD,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,GAC/C,OAAOA,KAAA,gBAAAA,EAAW,EAAE,EAAE,YAAY,aAAa;AAAA,EACjD,CAAC;AACH,CAAC;"}

package/dist/components/ReportChart/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('../../assets/index8.css');const a=require("react/jsx-runtime"),j=require("react"),v=require("@mui/material"),e=require("chart.js"),_=require("react-chartjs-2"),C="_chart_15x7v_1",L="_reportBox_15x7v_7",R="_nodata_15x7v_11",o={chart:C,reportBox:L,nodata:R};e.Chart.register(e.CategoryScale,e.LinearScale,e.PointElement,e.LineElement,e.Title,e.Tooltip,e.Legend);const d=u=>{const{dataList:s,xLabel:p="",yLabel:h="",labelKey:l,valueKey:i,borderColor:c="#ff6384",chartMargin:r={top:0,right:20,bottom:20,left:10},tooltipFormatter:f=(t,n)=>[String(t),String(n)],isLoading:x}=u,b=j.useRef(null),g={responsive:!0,aspectRatio:2,maintainAspectRatio:!1,animation:{delay:200},transitions:{resize:{animations:{x:{from:0},y:{from:0}}},show:{animations:{x:{from:0},y:{from:0}}}},layout:{padding:{left:r.left,right:r.right,top:r.top,bottom:r.bottom}},plugins:{legend:{display:!1,position:"top"},title:{display:!1},tooltip:{callbacks:{label:t=>{const n=t.dataset.label||"";return f(t.parsed.y,n).reverse().join("")}}}},scales:{x:{title:{display:!0,text:p}},y:{beginAtZero:!0,title:{display:!0,text:h}}}},y={labels:s.map(t=>{if(typeof t=="object"&&t!==null&&l in t)return t[l];throw new Error("Invalid data structure")}),datasets:[{label:"",data:s.map(t=>{if(typeof t=="object"&&t!==null&&i in t)return t[i];throw new Error("Invalid data structure")}),borderColor:c,backgroundColor:c,tension:.4}]},m=()=>x?a.jsx("div",{className:o.nodata,children:"loading..."}):s.length===0?a.jsx("div",{className:o.nodata,children:"NO DATA"}):a.jsx(_.Line,{ref:b,options:g,data:y});return a.jsx(v.Box,{className:o.reportBox,children:a.jsx("div",{className:o.chart,children:a.jsx(m,{})})})};exports.ReportChart=d;exports.default=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('../../assets/index27.css');const a=require("react/jsx-runtime"),j=require("react"),v=require("@mui/material"),e=require("chart.js"),_=require("react-chartjs-2"),C="_chart_15x7v_1",L="_reportBox_15x7v_7",R="_nodata_15x7v_11",o={chart:C,reportBox:L,nodata:R};e.Chart.register(e.CategoryScale,e.LinearScale,e.PointElement,e.LineElement,e.Title,e.Tooltip,e.Legend);const d=u=>{const{dataList:s,xLabel:p="",yLabel:h="",labelKey:l,valueKey:i,borderColor:c="#ff6384",chartMargin:r={top:0,right:20,bottom:20,left:10},tooltipFormatter:f=(t,n)=>[String(t),String(n)],isLoading:x}=u,b=j.useRef(null),g={responsive:!0,aspectRatio:2,maintainAspectRatio:!1,animation:{delay:200},transitions:{resize:{animations:{x:{from:0},y:{from:0}}},show:{animations:{x:{from:0},y:{from:0}}}},layout:{padding:{left:r.left,right:r.right,top:r.top,bottom:r.bottom}},plugins:{legend:{display:!1,position:"top"},title:{display:!1},tooltip:{callbacks:{label:t=>{const n=t.dataset.label||"";return f(t.parsed.y,n).reverse().join("")}}}},scales:{x:{title:{display:!0,text:p}},y:{beginAtZero:!0,title:{display:!0,text:h}}}},y={labels:s.map(t=>{if(typeof t=="object"&&t!==null&&l in t)return t[l];throw new Error("Invalid data structure")}),datasets:[{label:"",data:s.map(t=>{if(typeof t=="object"&&t!==null&&i in t)return t[i];throw new Error("Invalid data structure")}),borderColor:c,backgroundColor:c,tension:.4}]},m=()=>x?a.jsx("div",{className:o.nodata,children:"loading..."}):s.length===0?a.jsx("div",{className:o.nodata,children:"NO DATA"}):a.jsx(_.Line,{ref:b,options:g,data:y});return a.jsx(v.Box,{className:o.reportBox,children:a.jsx("div",{className:o.chart,children:a.jsx(m,{})})})};exports.ReportChart=d;exports.default=d;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/ReportChart/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ReportChart/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  Legend,\n  LinearScale,\n  LineElement,\n  PointElement,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  dataList: unknown[];\n  xLabel: string;\n  yLabel: string;\n  labelKey: string;\n  valueKey: string;\n  borderColor: string;\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Title,\n  ChartJSTooltip,\n  Legend,\n);\n\nexport const ReportChart = (props: Props) => {\n  const {\n    dataList,\n    xLabel = \"\",\n    yLabel = \"\",\n    labelKey,\n    valueKey,\n    borderColor = \"#ff6384\",\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  const options = {\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: {\n      delay: 200,\n    },\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: false,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            const label = context.dataset.label || \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\"\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: {\n        title: {\n          display: true,\n          text: xLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: 25, // フォントサイズを指定\n        //   },\n        // },\n      },\n      y: {\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: styles.y.fontsize, // フォントサイズを指定\n        //   },\n        // },\n      },\n    },\n  };\n\n  const chartJsData = {\n    labels: dataList.map((item) => {\n      if (typeof item === \"object\" && item !== null && labelKey in item) {\n        return (item as { [key: string]: unknown })[labelKey];\n      }\n      throw new Error(\"Invalid data structure\");\n    }),\n    datasets: [\n      {\n        label: \"\",\n        data: dataList.map((item) => {\n          if (typeof item === \"object\" && item !== null && valueKey in item) {\n            return (item as { [key: string]: unknown })[valueKey];\n          }\n          throw new Error(\"Invalid data structure\");\n        }),\n        borderColor: borderColor,\n        backgroundColor: borderColor,\n        tension: 0.4,\n      },\n    ],\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (dataList.length === 0) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <Box className={styles.reportBox}>\n      <div className={styles.chart}>\n        <ChartData />\n      </div>\n    </Box>\n  );\n};\n\nexport default ReportChart;\n"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Title","ChartJSTooltip","Legend","ReportChart","props","dataList","xLabel","yLabel","labelKey","valueKey","borderColor","chartMargin","tooltipFormatter","value","label","isLoading","chartRef","useRef","options","context","chartJsData","item","ChartData","jsx","styles","LineChartJS","Box"],"mappings":"kVAsCAA,EAAAA,MAAQ,SACNC,EAAA,cACAC,EAAA,YACAC,EAAA,aACAC,EAAA,YACAC,EAAA,MACAC,EAAA,QACAC,EAAAA,MACF,EAEa,MAAAC,EAAeC,GAAiB,CACrC,KAAA,CACJ,SAAAC,EACA,OAAAC,EAAS,GACT,OAAAC,EAAS,GACT,SAAAC,EACA,SAAAC,EACA,YAAAC,EAAc,UACd,YAAAC,EAAc,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,GAAI,KAAM,EAAG,EACxD,iBAAAC,EAAmB,CAACC,EAAgBC,IAAkB,CACpD,OAAOD,CAAK,EACZ,OAAOC,CAAK,CACd,EACA,UAAAC,CAAA,EACEX,EAEEY,EAAWC,SAAO,IAAI,EAEtBC,EAAU,CACd,WAAY,GACZ,YAAa,EACb,oBAAqB,GACrB,UAAW,CACT,MAAO,GACT,EACA,YAAa,CACX,OAAQ,CACN,WAAY,CACV,EAAG,CACD,KAAM,CACR,EACA,EAAG,CACD,KAAM,CAAA,CACR,CAEJ,EACA,KAAM,CACJ,WAAY,CACV,EAAG,CACD,KAAM,CACR,EACA,EAAG,CACD,KAAM,CAAA,CACR,CACF,CAEJ,EACA,OAAQ,CACN,QAAS,CACP,KAAMP,EAAY,KAClB,MAAOA,EAAY,MACnB,IAAKA,EAAY,IACjB,OAAQA,EAAY,MAAA,CAExB,EACA,QAAS,CACP,OAAQ,CACN,QAAS,GACT,SAAU,KACZ,EACA,MAAO,CACL,QAAS,EACX,EACA,QAAS,CACP,UAAW,CACT,MAAQQ,GAAiC,CACjC,MAAAL,EAAQK,EAAQ,QAAQ,OAAS,GAGhC,OAFIP,EAAiBO,EAAQ,OAAO,EAAGL,CAAK,EACpC,QAAQ,EAAE,KAAK,EAAE,CACzB,CACT,CACF,CAEJ,EACA,OAAQ,CACN,EAAG,CACD,MAAO,CACL,QAAS,GACT,KAAMR,CAAA,CAYV,EACA,EAAG,CACD,YAAa,GACb,MAAO,CACL,QAAS,GACT,KAAMC,CAAA,CAKR,CAOF,CAEJ,EAEMa,EAAc,CAClB,OAAQf,EAAS,IAAKgB,GAAS,CAC7B,GAAI,OAAOA,GAAS,UAAYA,IAAS,MAAQb,KAAYa,EAC3D,OAAQA,EAAoCb,CAAQ,EAEhD,MAAA,IAAI,MAAM,wBAAwB,CAAA,CACzC,EACD,SAAU,CACR,CACE,MAAO,GACP,KAAMH,EAAS,IAAKgB,GAAS,CAC3B,GAAI,OAAOA,GAAS,UAAYA,IAAS,MAAQZ,KAAYY,EAC3D,OAAQA,EAAoCZ,CAAQ,EAEhD,MAAA,IAAI,MAAM,wBAAwB,CAAA,CACzC,EACD,YAAAC,EACA,gBAAiBA,EACjB,QAAS,EAAA,CACX,CAEJ,EAEMY,EAAY,IACZP,EACMQ,EAAA,IAAA,MAAA,CAAI,UAAWC,EAAO,OAAQ,SAAU,aAAA,EACvCnB,EAAS,SAAW,EACrBkB,EAAA,IAAA,MAAA,CAAI,UAAWC,EAAO,OAAQ,SAAO,UAAA,QAG1CC,EAAY,KAAA,CAAA,IAAKT,EAAU,QAAAE,EAAkB,KAAME,EAAa,EAKvE,OACGG,EAAA,IAAAG,EAAA,IAAA,CAAI,UAAWF,EAAO,UACrB,SAAAD,EAAAA,IAAC,MAAI,CAAA,UAAWC,EAAO,MACrB,SAACD,EAAAA,IAAAD,EAAA,CAAU,CAAA,CACb,CAAA,EACF,CAEJ"}
+{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ReportChart/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  Legend,\n  LinearScale,\n  LineElement,\n  PointElement,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  dataList: unknown[];\n  xLabel: string;\n  yLabel: string;\n  labelKey: string;\n  valueKey: string;\n  borderColor: string;\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Title,\n  ChartJSTooltip,\n  Legend,\n);\n\nexport const ReportChart = (props: Props) => {\n  const {\n    dataList,\n    xLabel = \"\",\n    yLabel = \"\",\n    labelKey,\n    valueKey,\n    borderColor = \"#ff6384\",\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  const options = {\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: {\n      delay: 200,\n    },\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: false,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            const label = context.dataset.label || \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\"\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: {\n        title: {\n          display: true,\n          text: xLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: 25, // フォントサイズを指定\n        //   },\n        // },\n      },\n      y: {\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: styles.y.fontsize, // フォントサイズを指定\n        //   },\n        // },\n      },\n    },\n  };\n\n  const chartJsData = {\n    labels: dataList.map((item) => {\n      if (typeof item === \"object\" && item !== null && labelKey in item) {\n        return (item as { [key: string]: unknown })[labelKey];\n      }\n      throw new Error(\"Invalid data structure\");\n    }),\n    datasets: [\n      {\n        label: \"\",\n        data: dataList.map((item) => {\n          if (typeof item === \"object\" && item !== null && valueKey in item) {\n            return (item as { [key: string]: unknown })[valueKey];\n          }\n          throw new Error(\"Invalid data structure\");\n        }),\n        borderColor: borderColor,\n        backgroundColor: borderColor,\n        tension: 0.4,\n      },\n    ],\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (dataList.length === 0) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <Box className={styles.reportBox}>\n      <div className={styles.chart}>\n        <ChartData />\n      </div>\n    </Box>\n  );\n};\n\nexport default ReportChart;\n"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Title","ChartJSTooltip","Legend","ReportChart","props","dataList","xLabel","yLabel","labelKey","valueKey","borderColor","chartMargin","tooltipFormatter","value","label","isLoading","chartRef","useRef","options","context","chartJsData","item","ChartData","jsx","styles","LineChartJS","Box"],"mappings":"kVAsCAA,EAAAA,MAAQ,SACNC,EAAAA,cACAC,EAAAA,YACAC,EAAAA,aACAC,EAAAA,YACAC,EAAAA,MACAC,EAAAA,QACAC,EAAAA,MACF,EAEO,MAAMC,EAAeC,GAAiB,CAC3C,KAAM,CACJ,SAAAC,EACA,OAAAC,EAAS,GACT,OAAAC,EAAS,GACT,SAAAC,EACA,SAAAC,EACA,YAAAC,EAAc,UACd,YAAAC,EAAc,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,GAAI,KAAM,EAAA,EACrD,iBAAAC,EAAmB,CAACC,EAAgBC,IAAkB,CACpD,OAAOD,CAAK,EACZ,OAAOC,CAAK,CAAA,EAEd,UAAAC,CAAA,EACEX,EAEEY,EAAWC,EAAAA,OAAO,IAAI,EAEtBC,EAAU,CACd,WAAY,GACZ,YAAa,EACb,oBAAqB,GACrB,UAAW,CACT,MAAO,GAAA,EAET,YAAa,CACX,OAAQ,CACN,WAAY,CACV,EAAG,CACD,KAAM,CAAA,EAER,EAAG,CACD,KAAM,CAAA,CACR,CACF,EAEF,KAAM,CACJ,WAAY,CACV,EAAG,CACD,KAAM,CAAA,EAER,EAAG,CACD,KAAM,CAAA,CACR,CACF,CACF,EAEF,OAAQ,CACN,QAAS,CACP,KAAMP,EAAY,KAClB,MAAOA,EAAY,MACnB,IAAKA,EAAY,IACjB,OAAQA,EAAY,MAAA,CACtB,EAEF,QAAS,CACP,OAAQ,CACN,QAAS,GACT,SAAU,KAAA,EAEZ,MAAO,CACL,QAAS,EAAA,EAEX,QAAS,CACP,UAAW,CACT,MAAQQ,GAAiC,CACvC,MAAML,EAAQK,EAAQ,QAAQ,OAAS,GAGvC,OAFWP,EAAiBO,EAAQ,OAAO,EAAGL,CAAK,EACpC,QAAA,EAAU,KAAK,EAAE,CAElC,CAAA,CACF,CACF,EAEF,OAAQ,CACN,EAAG,CACD,MAAO,CACL,QAAS,GACT,KAAMR,CAAA,CAKR,EAQF,EAAG,CACD,YAAa,GACb,MAAO,CACL,QAAS,GACT,KAAMC,CAAA,CAKR,CAOF,CACF,EAGIa,EAAc,CAClB,OAAQf,EAAS,IAAKgB,GAAS,CAC7B,GAAI,OAAOA,GAAS,UAAYA,IAAS,MAAQb,KAAYa,EAC3D,OAAQA,EAAoCb,CAAQ,EAEtD,MAAM,IAAI,MAAM,wBAAwB,CAC1C,CAAC,EACD,SAAU,CACR,CACE,MAAO,GACP,KAAMH,EAAS,IAAKgB,GAAS,CAC3B,GAAI,OAAOA,GAAS,UAAYA,IAAS,MAAQZ,KAAYY,EAC3D,OAAQA,EAAoCZ,CAAQ,EAEtD,MAAM,IAAI,MAAM,wBAAwB,CAC1C,CAAC,EACD,YAAAC,EACA,gBAAiBA,EACjB,QAAS,EAAA,CACX,CACF,EAGIY,EAAY,IACZP,EACKQ,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAO,OAAQ,SAAA,aAAU,EACvCnB,EAAS,SAAW,EACtBkB,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAO,OAAQ,SAAA,UAAO,QAG1CC,EAAAA,KAAA,CAAY,IAAKT,EAAU,QAAAE,EAAkB,KAAME,EAAa,EAKvE,OACEG,EAAAA,IAACG,EAAAA,IAAA,CAAI,UAAWF,EAAO,UACrB,SAAAD,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAO,MACrB,SAAAD,EAAAA,IAACD,EAAA,CAAA,CAAU,EACb,EACF,CAEJ"}

package/dist/components/ReportChart/index.es.js

@@ -3,7 +3,7 @@ import { useRef as y } from "react";
 import { Box as x } from "@mui/material";
 import { Chart as v, CategoryScale as _, LinearScale as L, PointElement as C, LineElement as w, Title as B, Tooltip as N, Legend as R } from "chart.js";
 import { Line as j } from "react-chartjs-2";
-import '../../assets/index8.css';const A = "_chart_15x7v_1", E = "_reportBox_15x7v_7", S = "_nodata_15x7v_11", e = {
+import '../../assets/index27.css';const A = "_chart_15x7v_1", E = "_reportBox_15x7v_7", S = "_nodata_15x7v_11", e = {
   chart: A,
   reportBox: E,
   nodata: S

package/dist/components/ReportChart/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../src/components/ReportChart/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  Legend,\n  LinearScale,\n  LineElement,\n  PointElement,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  dataList: unknown[];\n  xLabel: string;\n  yLabel: string;\n  labelKey: string;\n  valueKey: string;\n  borderColor: string;\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Title,\n  ChartJSTooltip,\n  Legend,\n);\n\nexport const ReportChart = (props: Props) => {\n  const {\n    dataList,\n    xLabel = \"\",\n    yLabel = \"\",\n    labelKey,\n    valueKey,\n    borderColor = \"#ff6384\",\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  const options = {\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: {\n      delay: 200,\n    },\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: false,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            const label = context.dataset.label || \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\"\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: {\n        title: {\n          display: true,\n          text: xLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: 25, // フォントサイズを指定\n        //   },\n        // },\n      },\n      y: {\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: styles.y.fontsize, // フォントサイズを指定\n        //   },\n        // },\n      },\n    },\n  };\n\n  const chartJsData = {\n    labels: dataList.map((item) => {\n      if (typeof item === \"object\" && item !== null && labelKey in item) {\n        return (item as { [key: string]: unknown })[labelKey];\n      }\n      throw new Error(\"Invalid data structure\");\n    }),\n    datasets: [\n      {\n        label: \"\",\n        data: dataList.map((item) => {\n          if (typeof item === \"object\" && item !== null && valueKey in item) {\n            return (item as { [key: string]: unknown })[valueKey];\n          }\n          throw new Error(\"Invalid data structure\");\n        }),\n        borderColor: borderColor,\n        backgroundColor: borderColor,\n        tension: 0.4,\n      },\n    ],\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (dataList.length === 0) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <Box className={styles.reportBox}>\n      <div className={styles.chart}>\n        <ChartData />\n      </div>\n    </Box>\n  );\n};\n\nexport default ReportChart;\n"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Title","ChartJSTooltip","Legend","ReportChart","props","dataList","xLabel","yLabel","labelKey","valueKey","borderColor","chartMargin","tooltipFormatter","value","label","isLoading","chartRef","useRef","options","context","chartJsData","item","ChartData","jsx","styles","LineChartJS","Box"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../../../src/components/ReportChart/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  Legend,\n  LinearScale,\n  LineElement,\n  PointElement,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  dataList: unknown[];\n  xLabel: string;\n  yLabel: string;\n  labelKey: string;\n  valueKey: string;\n  borderColor: string;\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Title,\n  ChartJSTooltip,\n  Legend,\n);\n\nexport const ReportChart = (props: Props) => {\n  const {\n    dataList,\n    xLabel = \"\",\n    yLabel = \"\",\n    labelKey,\n    valueKey,\n    borderColor = \"#ff6384\",\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  const options = {\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: {\n      delay: 200,\n    },\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: false,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            const label = context.dataset.label || \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\"\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: {\n        title: {\n          display: true,\n          text: xLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: 25, // フォントサイズを指定\n        //   },\n        // },\n      },\n      y: {\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n          // font: {\n          //   family: \"\", // フォントファミリーを指定\n          //   size: 30, // フォントサイズを指定\n          // },\n        },\n        // ticks: {\n        //   font: {\n        //     family: \"Arial\", // フォントファミリーを指定\n        //     size: styles.y.fontsize, // フォントサイズを指定\n        //   },\n        // },\n      },\n    },\n  };\n\n  const chartJsData = {\n    labels: dataList.map((item) => {\n      if (typeof item === \"object\" && item !== null && labelKey in item) {\n        return (item as { [key: string]: unknown })[labelKey];\n      }\n      throw new Error(\"Invalid data structure\");\n    }),\n    datasets: [\n      {\n        label: \"\",\n        data: dataList.map((item) => {\n          if (typeof item === \"object\" && item !== null && valueKey in item) {\n            return (item as { [key: string]: unknown })[valueKey];\n          }\n          throw new Error(\"Invalid data structure\");\n        }),\n        borderColor: borderColor,\n        backgroundColor: borderColor,\n        tension: 0.4,\n      },\n    ],\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (dataList.length === 0) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <Box className={styles.reportBox}>\n      <div className={styles.chart}>\n        <ChartData />\n      </div>\n    </Box>\n  );\n};\n\nexport default ReportChart;\n"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Title","ChartJSTooltip","Legend","ReportChart","props","dataList","xLabel","yLabel","labelKey","valueKey","borderColor","chartMargin","tooltipFormatter","value","label","isLoading","chartRef","useRef","options","context","chartJsData","item","ChartData","jsx","styles","LineChartJS","Box"],"mappings":";;;;;;;;;;AAsCAA,EAAQ;AAAA,EACNC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAAA,EACAC;AACF;AAEO,MAAMC,IAAc,CAACC,MAAiB;AAC3C,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC,IAAc;AAAA,IACd,aAAAC,IAAc,EAAE,KAAK,GAAG,OAAO,IAAI,QAAQ,IAAI,MAAM,GAAA;AAAA,IACrD,kBAAAC,IAAmB,CAACC,GAAgBC,MAAkB;AAAA,MACpD,OAAOD,CAAK;AAAA,MACZ,OAAOC,CAAK;AAAA,IAAA;AAAA,IAEd,WAAAC;AAAA,EAAA,IACEX,GAEEY,IAAWC,EAAO,IAAI,GAEtBC,IAAU;AAAA,IACd,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,qBAAqB;AAAA,IACrB,WAAW;AAAA,MACT,OAAO;AAAA,IAAA;AAAA,IAET,aAAa;AAAA,MACX,QAAQ;AAAA,QACN,YAAY;AAAA,UACV,GAAG;AAAA,YACD,MAAM;AAAA,UAAA;AAAA,UAER,GAAG;AAAA,YACD,MAAM;AAAA,UAAA;AAAA,QACR;AAAA,MACF;AAAA,MAEF,MAAM;AAAA,QACJ,YAAY;AAAA,UACV,GAAG;AAAA,YACD,MAAM;AAAA,UAAA;AAAA,UAER,GAAG;AAAA,YACD,MAAM;AAAA,UAAA;AAAA,QACR;AAAA,MACF;AAAA,IACF;AAAA,IAEF,QAAQ;AAAA,MACN,SAAS;AAAA,QACP,MAAMP,EAAY;AAAA,QAClB,OAAOA,EAAY;AAAA,QACnB,KAAKA,EAAY;AAAA,QACjB,QAAQA,EAAY;AAAA,MAAA;AAAA,IACtB;AAAA,IAEF,SAAS;AAAA,MACP,QAAQ;AAAA,QACN,SAAS;AAAA,QACT,UAAU;AAAA,MAAA;AAAA,MAEZ,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,MAEX,SAAS;AAAA,QACP,WAAW;AAAA,UACT,OAAO,CAACQ,MAAiC;AACvC,kBAAML,IAAQK,EAAQ,QAAQ,SAAS;AAGvC,mBAFWP,EAAiBO,EAAQ,OAAO,GAAGL,CAAK,EACpC,QAAA,EAAU,KAAK,EAAE;AAAA,UAElC;AAAA,QAAA;AAAA,MACF;AAAA,IACF;AAAA,IAEF,QAAQ;AAAA,MACN,GAAG;AAAA,QACD,OAAO;AAAA,UACL,SAAS;AAAA,UACT,MAAMR;AAAA;AAAA;AAAA;AAAA;AAAA,QAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAKR;AAAA,MAQF,GAAG;AAAA,QACD,aAAa;AAAA,QACb,OAAO;AAAA,UACL,SAAS;AAAA,UACT,MAAMC;AAAA;AAAA;AAAA;AAAA;AAAA,QAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAKR;AAAA,IAOF;AAAA,EACF,GAGIa,IAAc;AAAA,IAClB,QAAQf,EAAS,IAAI,CAACgB,MAAS;AAC7B,UAAI,OAAOA,KAAS,YAAYA,MAAS,QAAQb,KAAYa;AAC3D,eAAQA,EAAoCb,CAAQ;AAEtD,YAAM,IAAI,MAAM,wBAAwB;AAAA,IAC1C,CAAC;AAAA,IACD,UAAU;AAAA,MACR;AAAA,QACE,OAAO;AAAA,QACP,MAAMH,EAAS,IAAI,CAACgB,MAAS;AAC3B,cAAI,OAAOA,KAAS,YAAYA,MAAS,QAAQZ,KAAYY;AAC3D,mBAAQA,EAAoCZ,CAAQ;AAEtD,gBAAM,IAAI,MAAM,wBAAwB;AAAA,QAC1C,CAAC;AAAA,QACD,aAAAC;AAAA,QACA,iBAAiBA;AAAA,QACjB,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EACF,GAGIY,IAAY,MACZP,IACK,gBAAAQ,EAAC,OAAA,EAAI,WAAWC,EAAO,QAAQ,UAAA,cAAU,IACvCnB,EAAS,WAAW,IACtB,gBAAAkB,EAAC,OAAA,EAAI,WAAWC,EAAO,QAAQ,UAAA,WAAO,sBAG1CC,GAAA,EAAY,KAAKT,GAAU,SAAAE,GAAkB,MAAME,GAAa;AAKvE,SACE,gBAAAG,EAACG,GAAA,EAAI,WAAWF,EAAO,WACrB,UAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,OACrB,UAAA,gBAAAD,EAACD,GAAA,CAAA,CAAU,GACb,GACF;AAEJ;"}

package/dist/components/ReportChartMulti/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('../../assets/index7.css');const o=require("react/jsx-runtime"),M=require("react"),H=require("@mui/material"),a=require("chart.js");require("chartjs-adapter-date-fns");const c=require("date-fns"),R=require("react-chartjs-2"),q=require("../CardWithTitle/index.cjs.js"),N="_reportChart_t9sla_1",O="_chart_t9sla_10",F="_reportBox_t9sla_15",B="_nodata_t9sla_19",n={reportChart:N,chart:O,reportBox:F,nodata:B};a.Chart.register(a.CategoryScale,a.LinearScale,a.PointElement,a.LineElement,a.Filler,a.LineController,a.Title,a.Tooltip,a.Legend,a.TimeScale);const E={red:"rgb(255, 99, 132)",orange:"rgb(255, 184, 76)",yellow:"rgb(255, 205, 86)",green:"rgb(102, 187, 106)",blue:"rgb(41, 182, 246)",purple:"rgb(153, 102, 255)",grey:"rgb(201, 203, 207)",redTransparent:"rgba(255, 99, 132, 0.5)",orangeTransparent:"rgba(255, 184, 76, 0.5)",yellowTransparent:"rgba(255, 205, 86, 0.5)",greenTransparent:"rgba(102, 187, 106, 0.5)",blueTransparent:"rgba(41, 182, 246, 0.5)",purpleTransparent:"rgba(153, 102, 255, 0.5)",greyTransparent:"rgba(201, 203, 207, 0.5)"},m=g=>{const{datasets:s,xLabel:d="",yLabel:b="",xType:p="day",dataIntervalMin:h=5,chartMargin:i={top:0,right:20,bottom:20,left:10},tooltipFormatter:f=(e,t)=>[String(e),String(t)],isLoading:y,title:x,precision:D}=g,T=M.useRef(null),C=s.some(e=>e.stack!==void 0);if(p==="day"){const e=c.format(c.startOfDay(new Date),"yyyy-MM-dd'T'HH:mm:ss.SSSxxx"),t=c.format(c.endOfDay(new Date),"yyyy-MM-dd'T'HH:mm:ss.SSSxxx"),r=[{date:e,value:0},{date:t,value:0}];s.unshift({label:"",data:r,borderColor:"rgba(0, 0, 0, 0)"})}const k={type:"time",time:{unit:"minute",displayFormats:{minute:"HH:mm"},tooltipFormat:"HH:mm"},title:{display:!0,text:d},ticks:{source:"auto",autoSkip:!0,maxTicksLimit:24,callback:function(e){return`${(typeof e=="string"?new Date(e):new Date(e)).getHours()}時`}}},S={title:{display:!0,text:d}},v={interaction:{intersect:!1},responsive:!0,aspectRatio:2,maintainAspectRatio:!1,animation:!1,transitions:{resize:{animations:{x:{from:0},y:{from:0}}},show:{animations:{x:{from:0},y:{from:0}}}},layout:{padding:{left:i.left,right:i.right,top:i.top,bottom:i.bottom}},plugins:{legend:{display:!0,position:"top"},title:{display:!1},tooltip:{callbacks:{label:e=>{if(e.dataset.label==="")return"";const t=e.dataset.label?`${e.dataset.label}`:"";return f(e.parsed.y,t).reverse().join(":")}}}},scales:{x:p==="day"?k:S,y:{stacked:C,beginAtZero:!0,title:{display:!0,text:b},ticks:{precision:D}}}},u=(e,t)=>e.p0.skip||e.p1.skip?t:void 0,_=(e,t)=>e.p0.parsed.y>e.p1.parsed.y?t:void 0,j=e=>{const t=[...e];if(e.length>1){const r=new Date(e[e.length-1].date).getTime(),l=new Date(e[e.length-2].date).getTime();(r-l)/(1e3*60)>h&&t.splice(t.length-1,0,{date:new Date(l+1).toISOString(),value:NaN})}return t},w={datasets:s.map(e=>{const t=e.skipEmptyData?j(e.data):e.data;return{label:e.label,data:t.map(r=>({x:new Date(r.date),y:r.value})),borderColor:e.borderColor,backgroundColor:e.backgroundColor||e.borderColor,tension:.4,borderWidth:e.borderWidth||void 0,fill:e.fill||!1,stack:e.stack||void 0,pointRadius:0,spanGaps:!!e.skipEmptyData,segment:e.skipEmptyData?{borderColor:r=>u(r,"rgba(0,0,0,0.2)")||_(r,e.borderColor),borderDash:r=>u(r,[6,6])}:void 0}})},L=()=>y?o.jsx("div",{className:n.nodata,children:"loading..."}):s.length===0||s.length===1&&s[0].label===""?o.jsx("div",{className:n.nodata,children:"NO DATA"}):o.jsx(R.Line,{ref:T,options:v,data:w});return o.jsx("div",{className:n.reportChart,children:o.jsx(q.CardWithTitle,{title:x,spacingFromTitle:0,children:o.jsx(H.Box,{className:n.reportBox,children:o.jsx("div",{className:n.chart,children:o.jsx(L,{})})})})})};exports.ReportChartMulti=m;exports.chartColors=E;exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('../../assets/index32.css');const o=require("react/jsx-runtime"),M=require("react"),H=require("@mui/material"),a=require("chart.js");require("chartjs-adapter-date-fns");const c=require("date-fns"),R=require("react-chartjs-2"),q=require("../CardWithTitle/index.cjs.js"),N="_reportChart_t9sla_1",O="_chart_t9sla_10",F="_reportBox_t9sla_15",B="_nodata_t9sla_19",n={reportChart:N,chart:O,reportBox:F,nodata:B};a.Chart.register(a.CategoryScale,a.LinearScale,a.PointElement,a.LineElement,a.Filler,a.LineController,a.Title,a.Tooltip,a.Legend,a.TimeScale);const E={red:"rgb(255, 99, 132)",orange:"rgb(255, 184, 76)",yellow:"rgb(255, 205, 86)",green:"rgb(102, 187, 106)",blue:"rgb(41, 182, 246)",purple:"rgb(153, 102, 255)",grey:"rgb(201, 203, 207)",redTransparent:"rgba(255, 99, 132, 0.5)",orangeTransparent:"rgba(255, 184, 76, 0.5)",yellowTransparent:"rgba(255, 205, 86, 0.5)",greenTransparent:"rgba(102, 187, 106, 0.5)",blueTransparent:"rgba(41, 182, 246, 0.5)",purpleTransparent:"rgba(153, 102, 255, 0.5)",greyTransparent:"rgba(201, 203, 207, 0.5)"},m=g=>{const{datasets:s,xLabel:d="",yLabel:b="",xType:p="day",dataIntervalMin:h=5,chartMargin:i={top:0,right:20,bottom:20,left:10},tooltipFormatter:f=(e,t)=>[String(e),String(t)],isLoading:y,title:x,precision:D}=g,T=M.useRef(null),C=s.some(e=>e.stack!==void 0);if(p==="day"){const e=c.format(c.startOfDay(new Date),"yyyy-MM-dd'T'HH:mm:ss.SSSxxx"),t=c.format(c.endOfDay(new Date),"yyyy-MM-dd'T'HH:mm:ss.SSSxxx"),r=[{date:e,value:0},{date:t,value:0}];s.unshift({label:"",data:r,borderColor:"rgba(0, 0, 0, 0)"})}const k={type:"time",time:{unit:"minute",displayFormats:{minute:"HH:mm"},tooltipFormat:"HH:mm"},title:{display:!0,text:d},ticks:{source:"auto",autoSkip:!0,maxTicksLimit:24,callback:function(e){return`${(typeof e=="string"?new Date(e):new Date(e)).getHours()}時`}}},S={title:{display:!0,text:d}},v={interaction:{intersect:!1},responsive:!0,aspectRatio:2,maintainAspectRatio:!1,animation:!1,transitions:{resize:{animations:{x:{from:0},y:{from:0}}},show:{animations:{x:{from:0},y:{from:0}}}},layout:{padding:{left:i.left,right:i.right,top:i.top,bottom:i.bottom}},plugins:{legend:{display:!0,position:"top"},title:{display:!1},tooltip:{callbacks:{label:e=>{if(e.dataset.label==="")return"";const t=e.dataset.label?`${e.dataset.label}`:"";return f(e.parsed.y,t).reverse().join(":")}}}},scales:{x:p==="day"?k:S,y:{stacked:C,beginAtZero:!0,title:{display:!0,text:b},ticks:{precision:D}}}},u=(e,t)=>e.p0.skip||e.p1.skip?t:void 0,_=(e,t)=>e.p0.parsed.y>e.p1.parsed.y?t:void 0,j=e=>{const t=[...e];if(e.length>1){const r=new Date(e[e.length-1].date).getTime(),l=new Date(e[e.length-2].date).getTime();(r-l)/(1e3*60)>h&&t.splice(t.length-1,0,{date:new Date(l+1).toISOString(),value:NaN})}return t},w={datasets:s.map(e=>{const t=e.skipEmptyData?j(e.data):e.data;return{label:e.label,data:t.map(r=>({x:new Date(r.date),y:r.value})),borderColor:e.borderColor,backgroundColor:e.backgroundColor||e.borderColor,tension:.4,borderWidth:e.borderWidth||void 0,fill:e.fill||!1,stack:e.stack||void 0,pointRadius:0,spanGaps:!!e.skipEmptyData,segment:e.skipEmptyData?{borderColor:r=>u(r,"rgba(0,0,0,0.2)")||_(r,e.borderColor),borderDash:r=>u(r,[6,6])}:void 0}})},L=()=>y?o.jsx("div",{className:n.nodata,children:"loading..."}):s.length===0||s.length===1&&s[0].label===""?o.jsx("div",{className:n.nodata,children:"NO DATA"}):o.jsx(R.Line,{ref:T,options:v,data:w});return o.jsx("div",{className:n.reportChart,children:o.jsx(q.CardWithTitle,{title:x,spacingFromTitle:0,children:o.jsx(H.Box,{className:n.reportBox,children:o.jsx("div",{className:n.chart,children:o.jsx(L,{})})})})})};exports.ReportChartMulti=m;exports.chartColors=E;exports.default=m;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/ReportChartMulti/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ReportChartMulti/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  ChartOptions,\n  Filler,\n  Legend,\n  LinearScale,\n  LineController,\n  LineElement,\n  PointElement,\n  TimeScale,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\n\nimport \"chartjs-adapter-date-fns\";\n\nimport { endOfDay, format, startOfDay } from \"date-fns\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport { CardWithTitle } from \"../CardWithTitle\";\nimport styles from \"./index.module.scss\";\n\nexport type datasetType = {\n  label: string;\n  data: { date: string; value: number }[];\n  borderColor: string;\n  backgroundColor?: string;\n  borderWidth?: number;\n  fill?: boolean | number | string;\n  stack?: string;\n  skipEmptyData?: boolean;\n};\n\ntype Props = {\n  datasets: datasetType[];\n  xLabel: string;\n  yLabel: string;\n  dataIntervalMin?: number;\n  xType: \"day\" | \"week\" | \"month\" | \"year\";\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n  title: string; // Add title prop\n  precision?: number; // Y軸の小数点以下の桁数を指定\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Filler,\n  LineController,\n  Title,\n  ChartJSTooltip,\n  Legend,\n  TimeScale, // TimeScaleを登録\n);\n\n// グラフで利用する標準色を定義\nexport const chartColors = {\n  red: \"rgb(255, 99, 132)\",\n  orange: \"rgb(255, 184, 76)\",\n  yellow: \"rgb(255, 205, 86)\",\n  green: \"rgb(102, 187, 106)\",\n  blue: \"rgb(41, 182, 246)\",\n  purple: \"rgb(153, 102, 255)\",\n  grey: \"rgb(201, 203, 207)\",\n  // 透過色（塗りつぶしに利用）\n  redTransparent: \"rgba(255, 99, 132, 0.5)\",\n  orangeTransparent: \"rgba(255, 184, 76, 0.5)\",\n  yellowTransparent: \"rgba(255, 205, 86, 0.5)\",\n  greenTransparent: \"rgba(102, 187, 106, 0.5)\",\n  blueTransparent: \"rgba(41, 182, 246, 0.5)\",\n  purpleTransparent: \"rgba(153, 102, 255, 0.5)\",\n  greyTransparent: \"rgba(201, 203, 207, 0.5)\",\n};\n\nexport const ReportChartMulti = (props: Props) => {\n  const {\n    datasets,\n    xLabel = \"\",\n    yLabel = \"\",\n    xType = \"day\",\n    dataIntervalMin = 5,\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n    title, // Destructure title from props\n    precision,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  // stackにグループを追加している場合は、積み上げグラフとなる\n  const isStacked = datasets.some((dataset) => dataset.stack !== undefined);\n\n  // 時間の範囲を描画する基準として利用するダミーデータをdatasetsに追加\n  // TODO:現状はxTypeがdayの場合のみ対応している\n  if (xType === \"day\") {\n    const startDate = format(\n      startOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n    const endDate = format(\n      endOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n\n    const rangeOfDate = [\n      { date: startDate, value: 0 },\n      { date: endDate, value: 0 },\n    ];\n\n    datasets.unshift({\n      label: \"\",\n      data: rangeOfDate,\n      borderColor: \"rgba(0, 0, 0, 0)\", // 透明色\n    });\n  }\n\n  const dayScaleOptions = {\n    type: \"time\",\n    time: {\n      unit: \"minute\",\n      displayFormats: {\n        minute: \"HH:mm\",\n      },\n      tooltipFormat: \"HH:mm\",\n    },\n    title: {\n      display: true,\n      text: xLabel,\n    },\n    ticks: {\n      source: \"auto\",\n      autoSkip: true,\n      maxTicksLimit: 24,\n      callback: function (value: string | number): string {\n        const dateValue =\n          typeof value === \"string\" ? new Date(value) : new Date(value);\n        const hours = dateValue.getHours();\n        return `${hours}時`;\n      },\n    },\n  };\n\n  const otherScaleOptions = {\n    title: {\n      display: true,\n      text: xLabel,\n    },\n  };\n\n  const options: ChartOptions<\"line\"> = {\n    interaction: {\n      intersect: false,\n    },\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: false,\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: true,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            // 時間基準データはツールチップに表示させない\n            if (context.dataset.label === \"\") {\n              return \"\";\n            }\n            const label = context.dataset.label\n              ? `${context.dataset.label}`\n              : \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\":\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: xType === \"day\" ? dayScaleOptions : otherScaleOptions, // 実際使うTypeが増えたらここを改修\n      y: {\n        stacked: isStacked,\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n        },\n        ticks: {\n          precision: precision,\n        },\n      },\n    },\n  };\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const skipped = (ctx: any, value: any): any =>\n    ctx.p0.skip || ctx.p1.skip ? value : undefined;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const down = (ctx: any, value: any): any =>\n    ctx.p0.parsed.y > ctx.p1.parsed.y ? value : undefined;\n\n  const fillGaps = (data: { date: string; value: number | null }[]) => {\n    const filledData: { date: string; value: number | null }[] = [...data];\n\n    if (data.length > 1) {\n      const lastTime = new Date(data[data.length - 1].date).getTime();\n      const secondLastTime = new Date(data[data.length - 2].date).getTime();\n      const finalTimeDifference = (lastTime - secondLastTime) / (1000 * 60);\n\n      // 最後のデータポイントが大きなギャップを持つ場合にNaNを挿入\n      if (finalTimeDifference > dataIntervalMin) {\n        filledData.splice(filledData.length - 1, 0, {\n          date: new Date(secondLastTime + 1).toISOString(),\n          value: NaN,\n        });\n      }\n    }\n    return filledData;\n  };\n\n  // データセットの整形\n  const formattedDatasets = datasets.map((dataset) => {\n    const dataWithGaps = dataset.skipEmptyData\n      ? fillGaps(dataset.data)\n      : dataset.data;\n    return {\n      label: dataset.label,\n      data: dataWithGaps.map((item) => {\n        const date = new Date(item.date);\n        return { x: date, y: item.value };\n      }),\n      borderColor: dataset.borderColor,\n      backgroundColor: dataset.backgroundColor || dataset.borderColor,\n      tension: 0.4,\n      borderWidth: dataset.borderWidth || undefined,\n      fill: dataset.fill || false,\n      stack: dataset.stack || undefined,\n      pointRadius: 0,\n      spanGaps: dataset.skipEmptyData ? true : false,\n      segment: dataset.skipEmptyData\n        ? {\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderColor: (ctx: any) =>\n              skipped(ctx, \"rgba(0,0,0,0.2)\") || down(ctx, dataset.borderColor),\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderDash: (ctx: any) => skipped(ctx, [6, 6]),\n          }\n        : undefined,\n    };\n  });\n\n  const chartJsData = {\n    datasets: formattedDatasets,\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (\n      datasets.length === 0 ||\n      (datasets.length === 1 && datasets[0].label === \"\")\n    ) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <div className={styles.reportChart}>\n      <CardWithTitle title={title} spacingFromTitle={0}>\n        <Box className={styles.reportBox}>\n          <div className={styles.chart}>\n            <ChartData />\n          </div>\n        </Box>\n      </CardWithTitle>\n    </div>\n  );\n};\n\nexport default ReportChartMulti;"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Filler","LineController","Title","ChartJSTooltip","Legend","TimeScale","chartColors","ReportChartMulti","props","datasets","xLabel","yLabel","xType","dataIntervalMin","chartMargin","tooltipFormatter","value","label","isLoading","title","precision","chartRef","useRef","isStacked","dataset","startDate","format","startOfDay","endDate","endOfDay","rangeOfDate","dayScaleOptions","otherScaleOptions","options","context","skipped","ctx","down","fillGaps","data","filledData","lastTime","secondLastTime","chartJsData","dataWithGaps","item","ChartData","jsx","styles","LineChartJS","CardWithTitle","Box"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ReportChartMulti/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  ChartOptions,\n  Filler,\n  Legend,\n  LinearScale,\n  LineController,\n  LineElement,\n  PointElement,\n  TimeScale,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\n\nimport \"chartjs-adapter-date-fns\";\n\nimport { endOfDay, format, startOfDay } from \"date-fns\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport { CardWithTitle } from \"../CardWithTitle\";\nimport styles from \"./index.module.scss\";\n\nexport type datasetType = {\n  label: string;\n  data: { date: string; value: number }[];\n  borderColor: string;\n  backgroundColor?: string;\n  borderWidth?: number;\n  fill?: boolean | number | string;\n  stack?: string;\n  skipEmptyData?: boolean;\n};\n\ntype Props = {\n  datasets: datasetType[];\n  xLabel: string;\n  yLabel: string;\n  dataIntervalMin?: number;\n  xType: \"day\" | \"week\" | \"month\" | \"year\";\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n  title: string; // Add title prop\n  precision?: number; // Y軸の小数点以下の桁数を指定\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Filler,\n  LineController,\n  Title,\n  ChartJSTooltip,\n  Legend,\n  TimeScale, // TimeScaleを登録\n);\n\n// グラフで利用する標準色を定義\nexport const chartColors = {\n  red: \"rgb(255, 99, 132)\",\n  orange: \"rgb(255, 184, 76)\",\n  yellow: \"rgb(255, 205, 86)\",\n  green: \"rgb(102, 187, 106)\",\n  blue: \"rgb(41, 182, 246)\",\n  purple: \"rgb(153, 102, 255)\",\n  grey: \"rgb(201, 203, 207)\",\n  // 透過色（塗りつぶしに利用）\n  redTransparent: \"rgba(255, 99, 132, 0.5)\",\n  orangeTransparent: \"rgba(255, 184, 76, 0.5)\",\n  yellowTransparent: \"rgba(255, 205, 86, 0.5)\",\n  greenTransparent: \"rgba(102, 187, 106, 0.5)\",\n  blueTransparent: \"rgba(41, 182, 246, 0.5)\",\n  purpleTransparent: \"rgba(153, 102, 255, 0.5)\",\n  greyTransparent: \"rgba(201, 203, 207, 0.5)\",\n};\n\nexport const ReportChartMulti = (props: Props) => {\n  const {\n    datasets,\n    xLabel = \"\",\n    yLabel = \"\",\n    xType = \"day\",\n    dataIntervalMin = 5,\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n    title, // Destructure title from props\n    precision,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  // stackにグループを追加している場合は、積み上げグラフとなる\n  const isStacked = datasets.some((dataset) => dataset.stack !== undefined);\n\n  // 時間の範囲を描画する基準として利用するダミーデータをdatasetsに追加\n  // TODO:現状はxTypeがdayの場合のみ対応している\n  if (xType === \"day\") {\n    const startDate = format(\n      startOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n    const endDate = format(\n      endOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n\n    const rangeOfDate = [\n      { date: startDate, value: 0 },\n      { date: endDate, value: 0 },\n    ];\n\n    datasets.unshift({\n      label: \"\",\n      data: rangeOfDate,\n      borderColor: \"rgba(0, 0, 0, 0)\", // 透明色\n    });\n  }\n\n  const dayScaleOptions = {\n    type: \"time\",\n    time: {\n      unit: \"minute\",\n      displayFormats: {\n        minute: \"HH:mm\",\n      },\n      tooltipFormat: \"HH:mm\",\n    },\n    title: {\n      display: true,\n      text: xLabel,\n    },\n    ticks: {\n      source: \"auto\",\n      autoSkip: true,\n      maxTicksLimit: 24,\n      callback: function (value: string | number): string {\n        const dateValue =\n          typeof value === \"string\" ? new Date(value) : new Date(value);\n        const hours = dateValue.getHours();\n        return `${hours}時`;\n      },\n    },\n  };\n\n  const otherScaleOptions = {\n    title: {\n      display: true,\n      text: xLabel,\n    },\n  };\n\n  const options: ChartOptions<\"line\"> = {\n    interaction: {\n      intersect: false,\n    },\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: false,\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: true,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            // 時間基準データはツールチップに表示させない\n            if (context.dataset.label === \"\") {\n              return \"\";\n            }\n            const label = context.dataset.label\n              ? `${context.dataset.label}`\n              : \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\":\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: xType === \"day\" ? dayScaleOptions : otherScaleOptions, // 実際使うTypeが増えたらここを改修\n      y: {\n        stacked: isStacked,\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n        },\n        ticks: {\n          precision: precision,\n        },\n      },\n    },\n  };\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const skipped = (ctx: any, value: any): any =>\n    ctx.p0.skip || ctx.p1.skip ? value : undefined;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const down = (ctx: any, value: any): any =>\n    ctx.p0.parsed.y > ctx.p1.parsed.y ? value : undefined;\n\n  const fillGaps = (data: { date: string; value: number | null }[]) => {\n    const filledData: { date: string; value: number | null }[] = [...data];\n\n    if (data.length > 1) {\n      const lastTime = new Date(data[data.length - 1].date).getTime();\n      const secondLastTime = new Date(data[data.length - 2].date).getTime();\n      const finalTimeDifference = (lastTime - secondLastTime) / (1000 * 60);\n\n      // 最後のデータポイントが大きなギャップを持つ場合にNaNを挿入\n      if (finalTimeDifference > dataIntervalMin) {\n        filledData.splice(filledData.length - 1, 0, {\n          date: new Date(secondLastTime + 1).toISOString(),\n          value: NaN,\n        });\n      }\n    }\n    return filledData;\n  };\n\n  // データセットの整形\n  const formattedDatasets = datasets.map((dataset) => {\n    const dataWithGaps = dataset.skipEmptyData\n      ? fillGaps(dataset.data)\n      : dataset.data;\n    return {\n      label: dataset.label,\n      data: dataWithGaps.map((item) => {\n        const date = new Date(item.date);\n        return { x: date, y: item.value };\n      }),\n      borderColor: dataset.borderColor,\n      backgroundColor: dataset.backgroundColor || dataset.borderColor,\n      tension: 0.4,\n      borderWidth: dataset.borderWidth || undefined,\n      fill: dataset.fill || false,\n      stack: dataset.stack || undefined,\n      pointRadius: 0,\n      spanGaps: dataset.skipEmptyData ? true : false,\n      segment: dataset.skipEmptyData\n        ? {\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderColor: (ctx: any) =>\n              skipped(ctx, \"rgba(0,0,0,0.2)\") || down(ctx, dataset.borderColor),\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderDash: (ctx: any) => skipped(ctx, [6, 6]),\n          }\n        : undefined,\n    };\n  });\n\n  const chartJsData = {\n    datasets: formattedDatasets,\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (\n      datasets.length === 0 ||\n      (datasets.length === 1 && datasets[0].label === \"\")\n    ) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <div className={styles.reportChart}>\n      <CardWithTitle title={title} spacingFromTitle={0}>\n        <Box className={styles.reportBox}>\n          <div className={styles.chart}>\n            <ChartData />\n          </div>\n        </Box>\n      </CardWithTitle>\n    </div>\n  );\n};\n\nexport default ReportChartMulti;\n"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Filler","LineController","Title","ChartJSTooltip","Legend","TimeScale","chartColors","ReportChartMulti","props","datasets","xLabel","yLabel","xType","dataIntervalMin","chartMargin","tooltipFormatter","value","label","isLoading","title","precision","chartRef","useRef","isStacked","dataset","startDate","format","startOfDay","endDate","endOfDay","rangeOfDate","dayScaleOptions","otherScaleOptions","options","context","skipped","ctx","down","fillGaps","data","filledData","lastTime","secondLastTime","chartJsData","dataWithGaps","item","ChartData","jsx","styles","LineChartJS","CardWithTitle","Box"],"mappings":"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"}

package/dist/components/ReportChartMulti/index.es.js

@@ -6,7 +6,7 @@ import "chartjs-adapter-date-fns";
 import { format as d, startOfDay as I, endOfDay as V } from "date-fns";
 import { Line as $ } from "react-chartjs-2";
 import { CardWithTitle as z } from "../CardWithTitle/index.es.js";
-import '../../assets/index7.css';const J = "_reportChart_t9sla_1", P = "_chart_t9sla_10", Z = "_reportBox_t9sla_15", q = "_nodata_t9sla_19", n = {
+import '../../assets/index32.css';const J = "_reportChart_t9sla_1", P = "_chart_t9sla_10", Z = "_reportBox_t9sla_15", q = "_nodata_t9sla_19", n = {
   reportChart: J,
   chart: P,
   reportBox: Z,

package/dist/components/ReportChartMulti/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../src/components/ReportChartMulti/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  ChartOptions,\n  Filler,\n  Legend,\n  LinearScale,\n  LineController,\n  LineElement,\n  PointElement,\n  TimeScale,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\n\nimport \"chartjs-adapter-date-fns\";\n\nimport { endOfDay, format, startOfDay } from \"date-fns\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport { CardWithTitle } from \"../CardWithTitle\";\nimport styles from \"./index.module.scss\";\n\nexport type datasetType = {\n  label: string;\n  data: { date: string; value: number }[];\n  borderColor: string;\n  backgroundColor?: string;\n  borderWidth?: number;\n  fill?: boolean | number | string;\n  stack?: string;\n  skipEmptyData?: boolean;\n};\n\ntype Props = {\n  datasets: datasetType[];\n  xLabel: string;\n  yLabel: string;\n  dataIntervalMin?: number;\n  xType: \"day\" | \"week\" | \"month\" | \"year\";\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n  title: string; // Add title prop\n  precision?: number; // Y軸の小数点以下の桁数を指定\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Filler,\n  LineController,\n  Title,\n  ChartJSTooltip,\n  Legend,\n  TimeScale, // TimeScaleを登録\n);\n\n// グラフで利用する標準色を定義\nexport const chartColors = {\n  red: \"rgb(255, 99, 132)\",\n  orange: \"rgb(255, 184, 76)\",\n  yellow: \"rgb(255, 205, 86)\",\n  green: \"rgb(102, 187, 106)\",\n  blue: \"rgb(41, 182, 246)\",\n  purple: \"rgb(153, 102, 255)\",\n  grey: \"rgb(201, 203, 207)\",\n  // 透過色（塗りつぶしに利用）\n  redTransparent: \"rgba(255, 99, 132, 0.5)\",\n  orangeTransparent: \"rgba(255, 184, 76, 0.5)\",\n  yellowTransparent: \"rgba(255, 205, 86, 0.5)\",\n  greenTransparent: \"rgba(102, 187, 106, 0.5)\",\n  blueTransparent: \"rgba(41, 182, 246, 0.5)\",\n  purpleTransparent: \"rgba(153, 102, 255, 0.5)\",\n  greyTransparent: \"rgba(201, 203, 207, 0.5)\",\n};\n\nexport const ReportChartMulti = (props: Props) => {\n  const {\n    datasets,\n    xLabel = \"\",\n    yLabel = \"\",\n    xType = \"day\",\n    dataIntervalMin = 5,\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n    title, // Destructure title from props\n    precision,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  // stackにグループを追加している場合は、積み上げグラフとなる\n  const isStacked = datasets.some((dataset) => dataset.stack !== undefined);\n\n  // 時間の範囲を描画する基準として利用するダミーデータをdatasetsに追加\n  // TODO:現状はxTypeがdayの場合のみ対応している\n  if (xType === \"day\") {\n    const startDate = format(\n      startOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n    const endDate = format(\n      endOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n\n    const rangeOfDate = [\n      { date: startDate, value: 0 },\n      { date: endDate, value: 0 },\n    ];\n\n    datasets.unshift({\n      label: \"\",\n      data: rangeOfDate,\n      borderColor: \"rgba(0, 0, 0, 0)\", // 透明色\n    });\n  }\n\n  const dayScaleOptions = {\n    type: \"time\",\n    time: {\n      unit: \"minute\",\n      displayFormats: {\n        minute: \"HH:mm\",\n      },\n      tooltipFormat: \"HH:mm\",\n    },\n    title: {\n      display: true,\n      text: xLabel,\n    },\n    ticks: {\n      source: \"auto\",\n      autoSkip: true,\n      maxTicksLimit: 24,\n      callback: function (value: string | number): string {\n        const dateValue =\n          typeof value === \"string\" ? new Date(value) : new Date(value);\n        const hours = dateValue.getHours();\n        return `${hours}時`;\n      },\n    },\n  };\n\n  const otherScaleOptions = {\n    title: {\n      display: true,\n      text: xLabel,\n    },\n  };\n\n  const options: ChartOptions<\"line\"> = {\n    interaction: {\n      intersect: false,\n    },\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: false,\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: true,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            // 時間基準データはツールチップに表示させない\n            if (context.dataset.label === \"\") {\n              return \"\";\n            }\n            const label = context.dataset.label\n              ? `${context.dataset.label}`\n              : \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\":\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: xType === \"day\" ? dayScaleOptions : otherScaleOptions, // 実際使うTypeが増えたらここを改修\n      y: {\n        stacked: isStacked,\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n        },\n        ticks: {\n          precision: precision,\n        },\n      },\n    },\n  };\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const skipped = (ctx: any, value: any): any =>\n    ctx.p0.skip || ctx.p1.skip ? value : undefined;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const down = (ctx: any, value: any): any =>\n    ctx.p0.parsed.y > ctx.p1.parsed.y ? value : undefined;\n\n  const fillGaps = (data: { date: string; value: number | null }[]) => {\n    const filledData: { date: string; value: number | null }[] = [...data];\n\n    if (data.length > 1) {\n      const lastTime = new Date(data[data.length - 1].date).getTime();\n      const secondLastTime = new Date(data[data.length - 2].date).getTime();\n      const finalTimeDifference = (lastTime - secondLastTime) / (1000 * 60);\n\n      // 最後のデータポイントが大きなギャップを持つ場合にNaNを挿入\n      if (finalTimeDifference > dataIntervalMin) {\n        filledData.splice(filledData.length - 1, 0, {\n          date: new Date(secondLastTime + 1).toISOString(),\n          value: NaN,\n        });\n      }\n    }\n    return filledData;\n  };\n\n  // データセットの整形\n  const formattedDatasets = datasets.map((dataset) => {\n    const dataWithGaps = dataset.skipEmptyData\n      ? fillGaps(dataset.data)\n      : dataset.data;\n    return {\n      label: dataset.label,\n      data: dataWithGaps.map((item) => {\n        const date = new Date(item.date);\n        return { x: date, y: item.value };\n      }),\n      borderColor: dataset.borderColor,\n      backgroundColor: dataset.backgroundColor || dataset.borderColor,\n      tension: 0.4,\n      borderWidth: dataset.borderWidth || undefined,\n      fill: dataset.fill || false,\n      stack: dataset.stack || undefined,\n      pointRadius: 0,\n      spanGaps: dataset.skipEmptyData ? true : false,\n      segment: dataset.skipEmptyData\n        ? {\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderColor: (ctx: any) =>\n              skipped(ctx, \"rgba(0,0,0,0.2)\") || down(ctx, dataset.borderColor),\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderDash: (ctx: any) => skipped(ctx, [6, 6]),\n          }\n        : undefined,\n    };\n  });\n\n  const chartJsData = {\n    datasets: formattedDatasets,\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (\n      datasets.length === 0 ||\n      (datasets.length === 1 && datasets[0].label === \"\")\n    ) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <div className={styles.reportChart}>\n      <CardWithTitle title={title} spacingFromTitle={0}>\n        <Box className={styles.reportBox}>\n          <div className={styles.chart}>\n            <ChartData />\n          </div>\n        </Box>\n      </CardWithTitle>\n    </div>\n  );\n};\n\nexport default ReportChartMulti;"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Filler","LineController","Title","ChartJSTooltip","Legend","TimeScale","chartColors","ReportChartMulti","props","datasets","xLabel","yLabel","xType","dataIntervalMin","chartMargin","tooltipFormatter","value","label","isLoading","title","precision","chartRef","useRef","isStacked","dataset","startDate","format","startOfDay","endDate","endOfDay","rangeOfDate","dayScaleOptions","otherScaleOptions","options","context","skipped","ctx","down","fillGaps","data","filledData","lastTime","secondLastTime","chartJsData","dataWithGaps","item","ChartData","jsx","styles","LineChartJS","CardWithTitle","Box"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../../../src/components/ReportChartMulti/index.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { Box } from \"@mui/material\";\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Tooltip as ChartJSTooltip,\n  ChartOptions,\n  Filler,\n  Legend,\n  LinearScale,\n  LineController,\n  LineElement,\n  PointElement,\n  TimeScale,\n  Title,\n  TooltipItem,\n} from \"chart.js\";\n\nimport \"chartjs-adapter-date-fns\";\n\nimport { endOfDay, format, startOfDay } from \"date-fns\";\nimport { Line as LineChartJS } from \"react-chartjs-2\";\n\nimport { CardWithTitle } from \"../CardWithTitle\";\nimport styles from \"./index.module.scss\";\n\nexport type datasetType = {\n  label: string;\n  data: { date: string; value: number }[];\n  borderColor: string;\n  backgroundColor?: string;\n  borderWidth?: number;\n  fill?: boolean | number | string;\n  stack?: string;\n  skipEmptyData?: boolean;\n};\n\ntype Props = {\n  datasets: datasetType[];\n  xLabel: string;\n  yLabel: string;\n  dataIntervalMin?: number;\n  xType: \"day\" | \"week\" | \"month\" | \"year\";\n  chartMargin?: ChartMargin;\n  tooltipFormatter?: CustomToolTipFormatter;\n  isLoading?: boolean;\n  title: string; // Add title prop\n  precision?: number; // Y軸の小数点以下の桁数を指定\n};\n\ntype ChartMargin = {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n};\n\ntype CustomToolTipFormatter = (value: unknown, label: string) => string[];\n\nChartJS.register(\n  CategoryScale,\n  LinearScale,\n  PointElement,\n  LineElement,\n  Filler,\n  LineController,\n  Title,\n  ChartJSTooltip,\n  Legend,\n  TimeScale, // TimeScaleを登録\n);\n\n// グラフで利用する標準色を定義\nexport const chartColors = {\n  red: \"rgb(255, 99, 132)\",\n  orange: \"rgb(255, 184, 76)\",\n  yellow: \"rgb(255, 205, 86)\",\n  green: \"rgb(102, 187, 106)\",\n  blue: \"rgb(41, 182, 246)\",\n  purple: \"rgb(153, 102, 255)\",\n  grey: \"rgb(201, 203, 207)\",\n  // 透過色（塗りつぶしに利用）\n  redTransparent: \"rgba(255, 99, 132, 0.5)\",\n  orangeTransparent: \"rgba(255, 184, 76, 0.5)\",\n  yellowTransparent: \"rgba(255, 205, 86, 0.5)\",\n  greenTransparent: \"rgba(102, 187, 106, 0.5)\",\n  blueTransparent: \"rgba(41, 182, 246, 0.5)\",\n  purpleTransparent: \"rgba(153, 102, 255, 0.5)\",\n  greyTransparent: \"rgba(201, 203, 207, 0.5)\",\n};\n\nexport const ReportChartMulti = (props: Props) => {\n  const {\n    datasets,\n    xLabel = \"\",\n    yLabel = \"\",\n    xType = \"day\",\n    dataIntervalMin = 5,\n    chartMargin = { top: 0, right: 20, bottom: 20, left: 10 },\n    tooltipFormatter = (value: unknown, label: string) => [\n      String(value),\n      String(label),\n    ],\n    isLoading,\n    title, // Destructure title from props\n    precision,\n  } = props;\n\n  const chartRef = useRef(null);\n\n  // stackにグループを追加している場合は、積み上げグラフとなる\n  const isStacked = datasets.some((dataset) => dataset.stack !== undefined);\n\n  // 時間の範囲を描画する基準として利用するダミーデータをdatasetsに追加\n  // TODO:現状はxTypeがdayの場合のみ対応している\n  if (xType === \"day\") {\n    const startDate = format(\n      startOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n    const endDate = format(\n      endOfDay(new Date()),\n      \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\",\n    );\n\n    const rangeOfDate = [\n      { date: startDate, value: 0 },\n      { date: endDate, value: 0 },\n    ];\n\n    datasets.unshift({\n      label: \"\",\n      data: rangeOfDate,\n      borderColor: \"rgba(0, 0, 0, 0)\", // 透明色\n    });\n  }\n\n  const dayScaleOptions = {\n    type: \"time\",\n    time: {\n      unit: \"minute\",\n      displayFormats: {\n        minute: \"HH:mm\",\n      },\n      tooltipFormat: \"HH:mm\",\n    },\n    title: {\n      display: true,\n      text: xLabel,\n    },\n    ticks: {\n      source: \"auto\",\n      autoSkip: true,\n      maxTicksLimit: 24,\n      callback: function (value: string | number): string {\n        const dateValue =\n          typeof value === \"string\" ? new Date(value) : new Date(value);\n        const hours = dateValue.getHours();\n        return `${hours}時`;\n      },\n    },\n  };\n\n  const otherScaleOptions = {\n    title: {\n      display: true,\n      text: xLabel,\n    },\n  };\n\n  const options: ChartOptions<\"line\"> = {\n    interaction: {\n      intersect: false,\n    },\n    responsive: true,\n    aspectRatio: 2,\n    maintainAspectRatio: false,\n    animation: false,\n    transitions: {\n      resize: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n      show: {\n        animations: {\n          x: {\n            from: 0,\n          },\n          y: {\n            from: 0,\n          },\n        },\n      },\n    },\n    layout: {\n      padding: {\n        left: chartMargin.left,\n        right: chartMargin.right,\n        top: chartMargin.top,\n        bottom: chartMargin.bottom,\n      },\n    },\n    plugins: {\n      legend: {\n        display: true,\n        position: \"top\" as const,\n      },\n      title: {\n        display: false,\n      },\n      tooltip: {\n        callbacks: {\n          label: (context: TooltipItem<\"line\">) => {\n            // 時間基準データはツールチップに表示させない\n            if (context.dataset.label === \"\") {\n              return \"\";\n            }\n            const label = context.dataset.label\n              ? `${context.dataset.label}`\n              : \"\";\n            const ar = tooltipFormatter(context.parsed.y, label);\n            const str = ar.reverse().join(\":\");\n            return str;\n          },\n        },\n      },\n    },\n    scales: {\n      x: xType === \"day\" ? dayScaleOptions : otherScaleOptions, // 実際使うTypeが増えたらここを改修\n      y: {\n        stacked: isStacked,\n        beginAtZero: true,\n        title: {\n          display: true,\n          text: yLabel,\n        },\n        ticks: {\n          precision: precision,\n        },\n      },\n    },\n  };\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const skipped = (ctx: any, value: any): any =>\n    ctx.p0.skip || ctx.p1.skip ? value : undefined;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const down = (ctx: any, value: any): any =>\n    ctx.p0.parsed.y > ctx.p1.parsed.y ? value : undefined;\n\n  const fillGaps = (data: { date: string; value: number | null }[]) => {\n    const filledData: { date: string; value: number | null }[] = [...data];\n\n    if (data.length > 1) {\n      const lastTime = new Date(data[data.length - 1].date).getTime();\n      const secondLastTime = new Date(data[data.length - 2].date).getTime();\n      const finalTimeDifference = (lastTime - secondLastTime) / (1000 * 60);\n\n      // 最後のデータポイントが大きなギャップを持つ場合にNaNを挿入\n      if (finalTimeDifference > dataIntervalMin) {\n        filledData.splice(filledData.length - 1, 0, {\n          date: new Date(secondLastTime + 1).toISOString(),\n          value: NaN,\n        });\n      }\n    }\n    return filledData;\n  };\n\n  // データセットの整形\n  const formattedDatasets = datasets.map((dataset) => {\n    const dataWithGaps = dataset.skipEmptyData\n      ? fillGaps(dataset.data)\n      : dataset.data;\n    return {\n      label: dataset.label,\n      data: dataWithGaps.map((item) => {\n        const date = new Date(item.date);\n        return { x: date, y: item.value };\n      }),\n      borderColor: dataset.borderColor,\n      backgroundColor: dataset.backgroundColor || dataset.borderColor,\n      tension: 0.4,\n      borderWidth: dataset.borderWidth || undefined,\n      fill: dataset.fill || false,\n      stack: dataset.stack || undefined,\n      pointRadius: 0,\n      spanGaps: dataset.skipEmptyData ? true : false,\n      segment: dataset.skipEmptyData\n        ? {\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderColor: (ctx: any) =>\n              skipped(ctx, \"rgba(0,0,0,0.2)\") || down(ctx, dataset.borderColor),\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            borderDash: (ctx: any) => skipped(ctx, [6, 6]),\n          }\n        : undefined,\n    };\n  });\n\n  const chartJsData = {\n    datasets: formattedDatasets,\n  };\n\n  const ChartData = () => {\n    if (isLoading) {\n      return <div className={styles.nodata}>loading...</div>;\n    } else if (\n      datasets.length === 0 ||\n      (datasets.length === 1 && datasets[0].label === \"\")\n    ) {\n      return <div className={styles.nodata}>NO DATA</div>;\n    } else {\n      return (\n        <LineChartJS ref={chartRef} options={options} data={chartJsData} />\n      );\n    }\n  };\n\n  return (\n    <div className={styles.reportChart}>\n      <CardWithTitle title={title} spacingFromTitle={0}>\n        <Box className={styles.reportBox}>\n          <div className={styles.chart}>\n            <ChartData />\n          </div>\n        </Box>\n      </CardWithTitle>\n    </div>\n  );\n};\n\nexport default ReportChartMulti;\n"],"names":["ChartJS","CategoryScale","LinearScale","PointElement","LineElement","Filler","LineController","Title","ChartJSTooltip","Legend","TimeScale","chartColors","ReportChartMulti","props","datasets","xLabel","yLabel","xType","dataIntervalMin","chartMargin","tooltipFormatter","value","label","isLoading","title","precision","chartRef","useRef","isStacked","dataset","startDate","format","startOfDay","endDate","endOfDay","rangeOfDate","dayScaleOptions","otherScaleOptions","options","context","skipped","ctx","down","fillGaps","data","filledData","lastTime","secondLastTime","chartJsData","dataWithGaps","item","ChartData","jsx","styles","LineChartJS","CardWithTitle","Box"],"mappings":"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"}

package/dist/components/ReportChartMulti/index.test.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const t=require("react/jsx-runtime"),e=require("../../react.esm-CiMn0Rnx.cjs"),a=require("./index.cjs.js");require("chartjs-adapter-date-fns");jest.mock("react-chartjs-2",()=>({Line:()=>t.jsx("canvas",{"data-testid":"chartjs-line"})}));const i=[{label:"Dataset 1",data:[{date:"2024-07-10T00:00:00+09:00",value:70},{date:"2024-07-10T00:05:00+09:00",value:75},{date:"2024-07-10T00:10:00+09:00",value:80}],borderColor:"red",skipEmptyData:!0},{label:"Dataset 2",data:[{date:"2024-07-10T01:00:00+09:00",value:60},{date:"2024-07-10T01:05:00+09:00",value:65},{date:"2024-07-10T01:10:00+09:00",value:70}],borderColor:"blue",skipEmptyData:!1}],r={datasets:i,title:"Test Chart",xLabel:"Time",yLabel:"Value",xType:"day",dataIntervalMin:5,chartMargin:{top:0,right:20,bottom:20,left:10},isLoading:!1,precision:void 0};describe("ReportChartMulti",()=>{it("renders the chart with the given title",()=>{e.render(t.jsx(a.ReportChartMulti,{...r})),expect(e.screen.getByText("Test Chart")).toBeInTheDocument()}),it("renders the chart with NO DATA when datasets are empty",()=>{e.render(t.jsx(a.ReportChartMulti,{...r,datasets:[]})),expect(e.screen.getByText("NO DATA")).toBeInTheDocument()}),it("renders the chart with loading message when isLoading is true",()=>{e.render(t.jsx(a.ReportChartMulti,{...r,isLoading:!0})),expect(e.screen.getByText("loading...")).toBeInTheDocument()}),it("renders the chart with the correct datasets",()=>{e.render(t.jsx(a.ReportChartMulti,{...r}));const s=e.screen.getByTestId("chartjs-line");expect(s).toBeInTheDocument()})});
+"use strict";const t=require("react/jsx-runtime"),e=require("../../react.esm-DGuy6Rn3.cjs"),a=require("./index.cjs.js");require("chartjs-adapter-date-fns");jest.mock("react-chartjs-2",()=>({Line:()=>t.jsx("canvas",{"data-testid":"chartjs-line"})}));const i=[{label:"Dataset 1",data:[{date:"2024-07-10T00:00:00+09:00",value:70},{date:"2024-07-10T00:05:00+09:00",value:75},{date:"2024-07-10T00:10:00+09:00",value:80}],borderColor:"red",skipEmptyData:!0},{label:"Dataset 2",data:[{date:"2024-07-10T01:00:00+09:00",value:60},{date:"2024-07-10T01:05:00+09:00",value:65},{date:"2024-07-10T01:10:00+09:00",value:70}],borderColor:"blue",skipEmptyData:!1}],r={datasets:i,title:"Test Chart",xLabel:"Time",yLabel:"Value",xType:"day",dataIntervalMin:5,chartMargin:{top:0,right:20,bottom:20,left:10},isLoading:!1,precision:void 0};describe("ReportChartMulti",()=>{it("renders the chart with the given title",()=>{e.render(t.jsx(a.ReportChartMulti,{...r})),expect(e.screen.getByText("Test Chart")).toBeInTheDocument()}),it("renders the chart with NO DATA when datasets are empty",()=>{e.render(t.jsx(a.ReportChartMulti,{...r,datasets:[]})),expect(e.screen.getByText("NO DATA")).toBeInTheDocument()}),it("renders the chart with loading message when isLoading is true",()=>{e.render(t.jsx(a.ReportChartMulti,{...r,isLoading:!0})),expect(e.screen.getByText("loading...")).toBeInTheDocument()}),it("renders the chart with the correct datasets",()=>{e.render(t.jsx(a.ReportChartMulti,{...r}));const s=e.screen.getByTestId("chartjs-line");expect(s).toBeInTheDocument()})});
 //# sourceMappingURL=index.test.cjs.js.map

package/dist/components/ReportChartMulti/index.test.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/ReportChartMulti/index.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { render, screen } from \"@testing-library/react\";\n\nimport { ReportChartMulti } from \".\";\n\nimport \"chartjs-adapter-date-fns\";\n\njest.mock(\"react-chartjs-2\", () => ({\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  Line: () => <canvas data-testid=\"chartjs-line\" />,\n}));\n\nconst mockDatasets = [\n  {\n    label: \"Dataset 1\",\n    data: [\n      { date: \"2024-07-10T00:00:00+09:00\", value: 70 },\n      { date: \"2024-07-10T00:05:00+09:00\", value: 75 },\n      { date: \"2024-07-10T00:10:00+09:00\", value: 80 },\n    ],\n    borderColor: \"red\",\n    skipEmptyData: true,\n  },\n  {\n    label: \"Dataset 2\",\n    data: [\n      { date: \"2024-07-10T01:00:00+09:00\", value: 60 },\n      { date: \"2024-07-10T01:05:00+09:00\", value: 65 },\n      { date: \"2024-07-10T01:10:00+09:00\", value: 70 },\n    ],\n    borderColor: \"blue\",\n    skipEmptyData: false,\n  },\n];\n\nconst defaultProps = {\n  datasets: mockDatasets,\n  title: \"Test Chart\",\n  xLabel: \"Time\",\n  yLabel: \"Value\",\n  xType: \"day\" as const,\n  dataIntervalMin: 5,\n  chartMargin: { top: 0, right: 20, bottom: 20, left: 10 },\n  isLoading: false,\n  precision: undefined,\n};\n\ndescribe(\"ReportChartMulti\", () => {\n  it(\"renders the chart with the given title\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    expect(screen.getByText(\"Test Chart\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with NO DATA when datasets are empty\", () => {\n    render(<ReportChartMulti {...defaultProps} datasets={[]} />);\n    expect(screen.getByText(\"NO DATA\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with loading message when isLoading is true\", () => {\n    render(<ReportChartMulti {...defaultProps} isLoading={true} />);\n    expect(screen.getByText(\"loading...\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with the correct datasets\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    const chart = screen.getByTestId(\"chartjs-line\");\n    expect(chart).toBeInTheDocument();\n  });\n});\n"],"names":["jsx","mockDatasets","defaultProps","render","ReportChartMulti","screen","chart"],"mappings":"4JAOA,KAAK,KAAK,kBAAmB,KAAO,CAElC,KAAM,IAAOA,EAAA,IAAA,SAAA,CAAO,cAAY,cAAe,CAAA,CACjD,EAAE,EAEF,MAAMC,EAAe,CACnB,CACE,MAAO,YACP,KAAM,CACJ,CAAE,KAAM,4BAA6B,MAAO,EAAG,EAC/C,CAAE,KAAM,4BAA6B,MAAO,EAAG,EAC/C,CAAE,KAAM,4BAA6B,MAAO,EAAG,CACjD,EACA,YAAa,MACb,cAAe,EACjB,EACA,CACE,MAAO,YACP,KAAM,CACJ,CAAE,KAAM,4BAA6B,MAAO,EAAG,EAC/C,CAAE,KAAM,4BAA6B,MAAO,EAAG,EAC/C,CAAE,KAAM,4BAA6B,MAAO,EAAG,CACjD,EACA,YAAa,OACb,cAAe,EAAA,CAEnB,EAEMC,EAAe,CACnB,SAAUD,EACV,MAAO,aACP,OAAQ,OACR,OAAQ,QACR,MAAO,MACP,gBAAiB,EACjB,YAAa,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,GAAI,KAAM,EAAG,EACvD,UAAW,GACX,UAAW,MACb,EAEA,SAAS,mBAAoB,IAAM,CACjC,GAAG,yCAA0C,IAAM,CACjDE,EAAAA,OAAQH,EAAAA,IAAAI,EAAAA,iBAAA,CAAkB,GAAGF,CAAc,CAAA,CAAE,EAC7C,OAAOG,EAAAA,OAAO,UAAU,YAAY,CAAC,EAAE,kBAAkB,CAAA,CAC1D,EAED,GAAG,yDAA0D,IAAM,CACjEF,EAAA,aAAQC,mBAAkB,CAAA,GAAGF,EAAc,SAAU,GAAI,CAAE,EAC3D,OAAOG,EAAAA,OAAO,UAAU,SAAS,CAAC,EAAE,kBAAkB,CAAA,CACvD,EAED,GAAG,gEAAiE,IAAM,CACxEF,EAAA,aAAQC,mBAAkB,CAAA,GAAGF,EAAc,UAAW,GAAM,CAAE,EAC9D,OAAOG,EAAAA,OAAO,UAAU,YAAY,CAAC,EAAE,kBAAkB,CAAA,CAC1D,EAED,GAAG,8CAA+C,IAAM,CACtDF,EAAAA,OAAQH,EAAAA,IAAAI,EAAAA,iBAAA,CAAkB,GAAGF,CAAc,CAAA,CAAE,EACvC,MAAAI,EAAQD,EAAAA,OAAO,YAAY,cAAc,EACxC,OAAAC,CAAK,EAAE,kBAAkB,CAAA,CACjC,CACH,CAAC"}
+{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/ReportChartMulti/index.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { render, screen } from \"@testing-library/react\";\n\nimport { ReportChartMulti } from \".\";\n\nimport \"chartjs-adapter-date-fns\";\n\njest.mock(\"react-chartjs-2\", () => ({\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  Line: () => <canvas data-testid=\"chartjs-line\" />,\n}));\n\nconst mockDatasets = [\n  {\n    label: \"Dataset 1\",\n    data: [\n      { date: \"2024-07-10T00:00:00+09:00\", value: 70 },\n      { date: \"2024-07-10T00:05:00+09:00\", value: 75 },\n      { date: \"2024-07-10T00:10:00+09:00\", value: 80 },\n    ],\n    borderColor: \"red\",\n    skipEmptyData: true,\n  },\n  {\n    label: \"Dataset 2\",\n    data: [\n      { date: \"2024-07-10T01:00:00+09:00\", value: 60 },\n      { date: \"2024-07-10T01:05:00+09:00\", value: 65 },\n      { date: \"2024-07-10T01:10:00+09:00\", value: 70 },\n    ],\n    borderColor: \"blue\",\n    skipEmptyData: false,\n  },\n];\n\nconst defaultProps = {\n  datasets: mockDatasets,\n  title: \"Test Chart\",\n  xLabel: \"Time\",\n  yLabel: \"Value\",\n  xType: \"day\" as const,\n  dataIntervalMin: 5,\n  chartMargin: { top: 0, right: 20, bottom: 20, left: 10 },\n  isLoading: false,\n  precision: undefined,\n};\n\ndescribe(\"ReportChartMulti\", () => {\n  it(\"renders the chart with the given title\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    expect(screen.getByText(\"Test Chart\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with NO DATA when datasets are empty\", () => {\n    render(<ReportChartMulti {...defaultProps} datasets={[]} />);\n    expect(screen.getByText(\"NO DATA\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with loading message when isLoading is true\", () => {\n    render(<ReportChartMulti {...defaultProps} isLoading={true} />);\n    expect(screen.getByText(\"loading...\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with the correct datasets\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    const chart = screen.getByTestId(\"chartjs-line\");\n    expect(chart).toBeInTheDocument();\n  });\n});\n"],"names":["jsx","mockDatasets","defaultProps","render","ReportChartMulti","screen","chart"],"mappings":"4JAOA,KAAK,KAAK,kBAAmB,KAAO,CAElC,KAAM,IAAMA,EAAAA,IAAC,SAAA,CAAO,cAAY,cAAA,CAAe,CACjD,EAAE,EAEF,MAAMC,EAAe,CACnB,CACE,MAAO,YACP,KAAM,CACJ,CAAE,KAAM,4BAA6B,MAAO,EAAA,EAC5C,CAAE,KAAM,4BAA6B,MAAO,EAAA,EAC5C,CAAE,KAAM,4BAA6B,MAAO,EAAA,CAAG,EAEjD,YAAa,MACb,cAAe,EAAA,EAEjB,CACE,MAAO,YACP,KAAM,CACJ,CAAE,KAAM,4BAA6B,MAAO,EAAA,EAC5C,CAAE,KAAM,4BAA6B,MAAO,EAAA,EAC5C,CAAE,KAAM,4BAA6B,MAAO,EAAA,CAAG,EAEjD,YAAa,OACb,cAAe,EAAA,CAEnB,EAEMC,EAAe,CACnB,SAAUD,EACV,MAAO,aACP,OAAQ,OACR,OAAQ,QACR,MAAO,MACP,gBAAiB,EACjB,YAAa,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,GAAI,KAAM,EAAA,EACpD,UAAW,GACX,UAAW,MACb,EAEA,SAAS,mBAAoB,IAAM,CACjC,GAAG,yCAA0C,IAAM,CACjDE,EAAAA,OAAOH,EAAAA,IAACI,EAAAA,iBAAA,CAAkB,GAAGF,CAAA,CAAc,CAAE,EAC7C,OAAOG,EAAAA,OAAO,UAAU,YAAY,CAAC,EAAE,kBAAA,CACzC,CAAC,EAED,GAAG,yDAA0D,IAAM,CACjEF,EAAAA,aAAQC,mBAAA,CAAkB,GAAGF,EAAc,SAAU,CAAA,EAAI,CAAE,EAC3D,OAAOG,EAAAA,OAAO,UAAU,SAAS,CAAC,EAAE,kBAAA,CACtC,CAAC,EAED,GAAG,gEAAiE,IAAM,CACxEF,EAAAA,aAAQC,mBAAA,CAAkB,GAAGF,EAAc,UAAW,GAAM,CAAE,EAC9D,OAAOG,EAAAA,OAAO,UAAU,YAAY,CAAC,EAAE,kBAAA,CACzC,CAAC,EAED,GAAG,8CAA+C,IAAM,CACtDF,EAAAA,OAAOH,EAAAA,IAACI,EAAAA,iBAAA,CAAkB,GAAGF,CAAA,CAAc,CAAE,EAC7C,MAAMI,EAAQD,EAAAA,OAAO,YAAY,cAAc,EAC/C,OAAOC,CAAK,EAAE,kBAAA,CAChB,CAAC,CACH,CAAC"}

package/dist/components/ReportChartMulti/index.test.es.js

@@ -1,5 +1,5 @@
 import { jsx as t } from "react/jsx-runtime";
-import { r as e, s as a } from "../../react.esm-2FJSSo-S.js";
+import { r as e, s as a } from "../../react.esm-BBESb8eI.js";
 import { ReportChartMulti as r } from "./index.es.js";
 import "chartjs-adapter-date-fns";
 jest.mock("react-chartjs-2", () => ({

package/dist/components/ReportChartMulti/index.test.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.test.es.js","sources":["../../../src/components/ReportChartMulti/index.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { render, screen } from \"@testing-library/react\";\n\nimport { ReportChartMulti } from \".\";\n\nimport \"chartjs-adapter-date-fns\";\n\njest.mock(\"react-chartjs-2\", () => ({\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  Line: () => <canvas data-testid=\"chartjs-line\" />,\n}));\n\nconst mockDatasets = [\n  {\n    label: \"Dataset 1\",\n    data: [\n      { date: \"2024-07-10T00:00:00+09:00\", value: 70 },\n      { date: \"2024-07-10T00:05:00+09:00\", value: 75 },\n      { date: \"2024-07-10T00:10:00+09:00\", value: 80 },\n    ],\n    borderColor: \"red\",\n    skipEmptyData: true,\n  },\n  {\n    label: \"Dataset 2\",\n    data: [\n      { date: \"2024-07-10T01:00:00+09:00\", value: 60 },\n      { date: \"2024-07-10T01:05:00+09:00\", value: 65 },\n      { date: \"2024-07-10T01:10:00+09:00\", value: 70 },\n    ],\n    borderColor: \"blue\",\n    skipEmptyData: false,\n  },\n];\n\nconst defaultProps = {\n  datasets: mockDatasets,\n  title: \"Test Chart\",\n  xLabel: \"Time\",\n  yLabel: \"Value\",\n  xType: \"day\" as const,\n  dataIntervalMin: 5,\n  chartMargin: { top: 0, right: 20, bottom: 20, left: 10 },\n  isLoading: false,\n  precision: undefined,\n};\n\ndescribe(\"ReportChartMulti\", () => {\n  it(\"renders the chart with the given title\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    expect(screen.getByText(\"Test Chart\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with NO DATA when datasets are empty\", () => {\n    render(<ReportChartMulti {...defaultProps} datasets={[]} />);\n    expect(screen.getByText(\"NO DATA\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with loading message when isLoading is true\", () => {\n    render(<ReportChartMulti {...defaultProps} isLoading={true} />);\n    expect(screen.getByText(\"loading...\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with the correct datasets\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    const chart = screen.getByTestId(\"chartjs-line\");\n    expect(chart).toBeInTheDocument();\n  });\n});\n"],"names":["jsx","mockDatasets","defaultProps","render","ReportChartMulti","screen","chart"],"mappings":";;;;AAOA,KAAK,KAAK,mBAAmB,OAAO;AAAA;AAAA,EAElC,MAAM,MAAO,gBAAAA,EAAA,UAAA,EAAO,eAAY,eAAe,CAAA;AACjD,EAAE;AAEF,MAAMC,IAAe;AAAA,EACnB;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,MACJ,EAAE,MAAM,6BAA6B,OAAO,GAAG;AAAA,MAC/C,EAAE,MAAM,6BAA6B,OAAO,GAAG;AAAA,MAC/C,EAAE,MAAM,6BAA6B,OAAO,GAAG;AAAA,IACjD;AAAA,IACA,aAAa;AAAA,IACb,eAAe;AAAA,EACjB;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,MACJ,EAAE,MAAM,6BAA6B,OAAO,GAAG;AAAA,MAC/C,EAAE,MAAM,6BAA6B,OAAO,GAAG;AAAA,MAC/C,EAAE,MAAM,6BAA6B,OAAO,GAAG;AAAA,IACjD;AAAA,IACA,aAAa;AAAA,IACb,eAAe;AAAA,EAAA;AAEnB,GAEMC,IAAe;AAAA,EACnB,UAAUD;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,iBAAiB;AAAA,EACjB,aAAa,EAAE,KAAK,GAAG,OAAO,IAAI,QAAQ,IAAI,MAAM,GAAG;AAAA,EACvD,WAAW;AAAA,EACX,WAAW;AACb;AAEA,SAAS,oBAAoB,MAAM;AACjC,KAAG,0CAA0C,MAAM;AACjD,IAAAE,EAAQ,gBAAAH,EAAAI,GAAA,EAAkB,GAAGF,EAAc,CAAA,CAAE,GAC7C,OAAOG,EAAO,UAAU,YAAY,CAAC,EAAE,kBAAkB;AAAA,EAAA,CAC1D,GAED,GAAG,0DAA0D,MAAM;AACjE,IAAAF,oBAAQC,GAAkB,EAAA,GAAGF,GAAc,UAAU,IAAI,CAAE,GAC3D,OAAOG,EAAO,UAAU,SAAS,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACvD,GAED,GAAG,iEAAiE,MAAM;AACxE,IAAAF,oBAAQC,GAAkB,EAAA,GAAGF,GAAc,WAAW,IAAM,CAAE,GAC9D,OAAOG,EAAO,UAAU,YAAY,CAAC,EAAE,kBAAkB;AAAA,EAAA,CAC1D,GAED,GAAG,+CAA+C,MAAM;AACtD,IAAAF,EAAQ,gBAAAH,EAAAI,GAAA,EAAkB,GAAGF,EAAc,CAAA,CAAE;AACvC,UAAAI,IAAQD,EAAO,YAAY,cAAc;AACxC,WAAAC,CAAK,EAAE,kBAAkB;AAAA,EAAA,CACjC;AACH,CAAC;"}
+{"version":3,"file":"index.test.es.js","sources":["../../../src/components/ReportChartMulti/index.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { render, screen } from \"@testing-library/react\";\n\nimport { ReportChartMulti } from \".\";\n\nimport \"chartjs-adapter-date-fns\";\n\njest.mock(\"react-chartjs-2\", () => ({\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  Line: () => <canvas data-testid=\"chartjs-line\" />,\n}));\n\nconst mockDatasets = [\n  {\n    label: \"Dataset 1\",\n    data: [\n      { date: \"2024-07-10T00:00:00+09:00\", value: 70 },\n      { date: \"2024-07-10T00:05:00+09:00\", value: 75 },\n      { date: \"2024-07-10T00:10:00+09:00\", value: 80 },\n    ],\n    borderColor: \"red\",\n    skipEmptyData: true,\n  },\n  {\n    label: \"Dataset 2\",\n    data: [\n      { date: \"2024-07-10T01:00:00+09:00\", value: 60 },\n      { date: \"2024-07-10T01:05:00+09:00\", value: 65 },\n      { date: \"2024-07-10T01:10:00+09:00\", value: 70 },\n    ],\n    borderColor: \"blue\",\n    skipEmptyData: false,\n  },\n];\n\nconst defaultProps = {\n  datasets: mockDatasets,\n  title: \"Test Chart\",\n  xLabel: \"Time\",\n  yLabel: \"Value\",\n  xType: \"day\" as const,\n  dataIntervalMin: 5,\n  chartMargin: { top: 0, right: 20, bottom: 20, left: 10 },\n  isLoading: false,\n  precision: undefined,\n};\n\ndescribe(\"ReportChartMulti\", () => {\n  it(\"renders the chart with the given title\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    expect(screen.getByText(\"Test Chart\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with NO DATA when datasets are empty\", () => {\n    render(<ReportChartMulti {...defaultProps} datasets={[]} />);\n    expect(screen.getByText(\"NO DATA\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with loading message when isLoading is true\", () => {\n    render(<ReportChartMulti {...defaultProps} isLoading={true} />);\n    expect(screen.getByText(\"loading...\")).toBeInTheDocument();\n  });\n\n  it(\"renders the chart with the correct datasets\", () => {\n    render(<ReportChartMulti {...defaultProps} />);\n    const chart = screen.getByTestId(\"chartjs-line\");\n    expect(chart).toBeInTheDocument();\n  });\n});\n"],"names":["jsx","mockDatasets","defaultProps","render","ReportChartMulti","screen","chart"],"mappings":";;;;AAOA,KAAK,KAAK,mBAAmB,OAAO;AAAA;AAAA,EAElC,MAAM,MAAM,gBAAAA,EAAC,UAAA,EAAO,eAAY,eAAA,CAAe;AACjD,EAAE;AAEF,MAAMC,IAAe;AAAA,EACnB;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,MACJ,EAAE,MAAM,6BAA6B,OAAO,GAAA;AAAA,MAC5C,EAAE,MAAM,6BAA6B,OAAO,GAAA;AAAA,MAC5C,EAAE,MAAM,6BAA6B,OAAO,GAAA;AAAA,IAAG;AAAA,IAEjD,aAAa;AAAA,IACb,eAAe;AAAA,EAAA;AAAA,EAEjB;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,MACJ,EAAE,MAAM,6BAA6B,OAAO,GAAA;AAAA,MAC5C,EAAE,MAAM,6BAA6B,OAAO,GAAA;AAAA,MAC5C,EAAE,MAAM,6BAA6B,OAAO,GAAA;AAAA,IAAG;AAAA,IAEjD,aAAa;AAAA,IACb,eAAe;AAAA,EAAA;AAEnB,GAEMC,IAAe;AAAA,EACnB,UAAUD;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,iBAAiB;AAAA,EACjB,aAAa,EAAE,KAAK,GAAG,OAAO,IAAI,QAAQ,IAAI,MAAM,GAAA;AAAA,EACpD,WAAW;AAAA,EACX,WAAW;AACb;AAEA,SAAS,oBAAoB,MAAM;AACjC,KAAG,0CAA0C,MAAM;AACjD,IAAAE,EAAO,gBAAAH,EAACI,GAAA,EAAkB,GAAGF,EAAA,CAAc,CAAE,GAC7C,OAAOG,EAAO,UAAU,YAAY,CAAC,EAAE,kBAAA;AAAA,EACzC,CAAC,GAED,GAAG,0DAA0D,MAAM;AACjE,IAAAF,oBAAQC,GAAA,EAAkB,GAAGF,GAAc,UAAU,CAAA,GAAI,CAAE,GAC3D,OAAOG,EAAO,UAAU,SAAS,CAAC,EAAE,kBAAA;AAAA,EACtC,CAAC,GAED,GAAG,iEAAiE,MAAM;AACxE,IAAAF,oBAAQC,GAAA,EAAkB,GAAGF,GAAc,WAAW,IAAM,CAAE,GAC9D,OAAOG,EAAO,UAAU,YAAY,CAAC,EAAE,kBAAA;AAAA,EACzC,CAAC,GAED,GAAG,+CAA+C,MAAM;AACtD,IAAAF,EAAO,gBAAAH,EAACI,GAAA,EAAkB,GAAGF,EAAA,CAAc,CAAE;AAC7C,UAAMI,IAAQD,EAAO,YAAY,cAAc;AAC/C,WAAOC,CAAK,EAAE,kBAAA;AAAA,EAChB,CAAC;AACH,CAAC;"}

package/dist/components/ScrollableDialog/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ScrollableDialog/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogContentText,\n  DialogTitle,\n  DialogProps as MuiDialogProps,\n} from \"@mui/material\";\n\nexport type ConfirmDialogResult = \"confirm\" | \"cancel\";\n\ntype Props = {\n  /** ダイアログのタイトル */\n  dialogTitle: ReactNode;\n  /** ダイアログの内容 */\n  dialogContent: ReactNode;\n  /** ダイアログの処理ボタン（複数可） */\n  dialogActions: ReactNode;\n  /** ダイアログの表示状態 */\n  open: boolean;\n  /** 閉じた時のhandler */\n  onCloseDialog: (result: ConfirmDialogResult) => void;\n} & MuiDialogProps;\n\n/** MuiDialogを継承したコンテントのスクロール可能なDialogです。 */\nexport const ScrollableDialog = (props: Props) => {\n  const {\n    dialogTitle,\n    dialogContent,\n    dialogActions,\n    open,\n    onCloseDialog,\n    ...dialogProps\n  } = props;\n\n  return (\n    <Dialog\n      {...dialogProps}\n      open={open}\n      onClose={() => onCloseDialog(\"cancel\")}\n      scroll={\"paper\"}\n      aria-labelledby=\"scroll-dialog-title\"\n      aria-describedby=\"scroll-dialog-description\"\n    >\n      <DialogTitle\n        sx={{\n          display: \"flex\",\n          gap: \"5px\",\n          alignItems: \"center\",\n        }}\n      >\n        {dialogTitle}\n      </DialogTitle>\n      <DialogContent dividers={true}>\n        <DialogContentText tabIndex={-1}>{dialogContent}</DialogContentText>\n      </DialogContent>\n      <DialogActions sx={{ gap: \"10px\" }}>{dialogActions}</DialogActions>\n    </Dialog>\n  );\n};\n\nexport default ScrollableDialog;\n"],"names":["ScrollableDialog","props","dialogTitle","dialogContent","dialogActions","open","onCloseDialog","dialogProps","jsxs","Dialog","jsx","DialogTitle","DialogContent","DialogContentText","DialogActions"],"mappings":"4KA0BaA,EAAoBC,GAAiB,CAC1C,KAAA,CACJ,YAAAC,EACA,cAAAC,EACA,cAAAC,EACA,KAAAC,EACA,cAAAC,EACA,GAAGC,CAAA,EACDN,EAGF,OAAAO,EAAA,KAACC,EAAA,OAAA,CACE,GAAGF,EACJ,KAAAF,EACA,QAAS,IAAMC,EAAc,QAAQ,EACrC,OAAQ,QACR,kBAAgB,sBAChB,mBAAiB,4BAEjB,SAAA,CAAAI,EAAA,IAACC,EAAA,YAAA,CACC,GAAI,CACF,QAAS,OACT,IAAK,MACL,WAAY,QACd,EAEC,SAAAT,CAAA,CACH,EACAQ,EAAAA,IAACE,EAAAA,eAAc,SAAU,GACvB,eAACC,oBAAkB,CAAA,SAAU,GAAK,SAAAV,CAAA,CAAc,CAClD,CAAA,QACCW,EAAAA,cAAc,CAAA,GAAI,CAAE,IAAK,QAAW,SAAcV,CAAA,CAAA,CAAA,CAAA,CACrD,CAEJ"}
+{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ScrollableDialog/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogContentText,\n  DialogTitle,\n  DialogProps as MuiDialogProps,\n} from \"@mui/material\";\n\nexport type ConfirmDialogResult = \"confirm\" | \"cancel\";\n\ntype Props = {\n  /** ダイアログのタイトル */\n  dialogTitle: ReactNode;\n  /** ダイアログの内容 */\n  dialogContent: ReactNode;\n  /** ダイアログの処理ボタン（複数可） */\n  dialogActions: ReactNode;\n  /** ダイアログの表示状態 */\n  open: boolean;\n  /** 閉じた時のhandler */\n  onCloseDialog: (result: ConfirmDialogResult) => void;\n} & MuiDialogProps;\n\n/** MuiDialogを継承したコンテントのスクロール可能なDialogです。 */\nexport const ScrollableDialog = (props: Props) => {\n  const {\n    dialogTitle,\n    dialogContent,\n    dialogActions,\n    open,\n    onCloseDialog,\n    ...dialogProps\n  } = props;\n\n  return (\n    <Dialog\n      {...dialogProps}\n      open={open}\n      onClose={() => onCloseDialog(\"cancel\")}\n      scroll={\"paper\"}\n      aria-labelledby=\"scroll-dialog-title\"\n      aria-describedby=\"scroll-dialog-description\"\n    >\n      <DialogTitle\n        sx={{\n          display: \"flex\",\n          gap: \"5px\",\n          alignItems: \"center\",\n        }}\n      >\n        {dialogTitle}\n      </DialogTitle>\n      <DialogContent dividers={true}>\n        <DialogContentText tabIndex={-1}>{dialogContent}</DialogContentText>\n      </DialogContent>\n      <DialogActions sx={{ gap: \"10px\" }}>{dialogActions}</DialogActions>\n    </Dialog>\n  );\n};\n\nexport default ScrollableDialog;\n"],"names":["ScrollableDialog","props","dialogTitle","dialogContent","dialogActions","open","onCloseDialog","dialogProps","jsxs","Dialog","jsx","DialogTitle","DialogContent","DialogContentText","DialogActions"],"mappings":"4KA0BaA,EAAoBC,GAAiB,CAChD,KAAM,CACJ,YAAAC,EACA,cAAAC,EACA,cAAAC,EACA,KAAAC,EACA,cAAAC,EACA,GAAGC,CAAA,EACDN,EAEJ,OACEO,EAAAA,KAACC,EAAAA,OAAA,CACE,GAAGF,EACJ,KAAAF,EACA,QAAS,IAAMC,EAAc,QAAQ,EACrC,OAAQ,QACR,kBAAgB,sBAChB,mBAAiB,4BAEjB,SAAA,CAAAI,EAAAA,IAACC,EAAAA,YAAA,CACC,GAAI,CACF,QAAS,OACT,IAAK,MACL,WAAY,QAAA,EAGb,SAAAT,CAAA,CAAA,EAEHQ,EAAAA,IAACE,EAAAA,eAAc,SAAU,GACvB,eAACC,oBAAA,CAAkB,SAAU,GAAK,SAAAV,CAAA,CAAc,CAAA,CAClD,QACCW,EAAAA,cAAA,CAAc,GAAI,CAAE,IAAK,MAAA,EAAW,SAAAV,CAAA,CAAc,CAAA,CAAA,CAAA,CAGzD"}

package/dist/components/ScrollableDialog/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../src/components/ScrollableDialog/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogContentText,\n  DialogTitle,\n  DialogProps as MuiDialogProps,\n} from \"@mui/material\";\n\nexport type ConfirmDialogResult = \"confirm\" | \"cancel\";\n\ntype Props = {\n  /** ダイアログのタイトル */\n  dialogTitle: ReactNode;\n  /** ダイアログの内容 */\n  dialogContent: ReactNode;\n  /** ダイアログの処理ボタン（複数可） */\n  dialogActions: ReactNode;\n  /** ダイアログの表示状態 */\n  open: boolean;\n  /** 閉じた時のhandler */\n  onCloseDialog: (result: ConfirmDialogResult) => void;\n} & MuiDialogProps;\n\n/** MuiDialogを継承したコンテントのスクロール可能なDialogです。 */\nexport const ScrollableDialog = (props: Props) => {\n  const {\n    dialogTitle,\n    dialogContent,\n    dialogActions,\n    open,\n    onCloseDialog,\n    ...dialogProps\n  } = props;\n\n  return (\n    <Dialog\n      {...dialogProps}\n      open={open}\n      onClose={() => onCloseDialog(\"cancel\")}\n      scroll={\"paper\"}\n      aria-labelledby=\"scroll-dialog-title\"\n      aria-describedby=\"scroll-dialog-description\"\n    >\n      <DialogTitle\n        sx={{\n          display: \"flex\",\n          gap: \"5px\",\n          alignItems: \"center\",\n        }}\n      >\n        {dialogTitle}\n      </DialogTitle>\n      <DialogContent dividers={true}>\n        <DialogContentText tabIndex={-1}>{dialogContent}</DialogContentText>\n      </DialogContent>\n      <DialogActions sx={{ gap: \"10px\" }}>{dialogActions}</DialogActions>\n    </Dialog>\n  );\n};\n\nexport default ScrollableDialog;\n"],"names":["ScrollableDialog","props","dialogTitle","dialogContent","dialogActions","open","onCloseDialog","dialogProps","jsxs","Dialog","jsx","DialogTitle","DialogContent","DialogContentText","DialogActions"],"mappings":";;AA0Ba,MAAAA,IAAmB,CAACC,MAAiB;AAC1C,QAAA;AAAA,IACJ,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,eAAAC;AAAA,IACA,MAAAC;AAAA,IACA,eAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDN;AAGF,SAAA,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,MAAAF;AAAA,MACA,SAAS,MAAMC,EAAc,QAAQ;AAAA,MACrC,QAAQ;AAAA,MACR,mBAAgB;AAAA,MAChB,oBAAiB;AAAA,MAEjB,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,SAAS;AAAA,cACT,KAAK;AAAA,cACL,YAAY;AAAA,YACd;AAAA,YAEC,UAAAT;AAAA,UAAA;AAAA,QACH;AAAA,QACA,gBAAAQ,EAACE,KAAc,UAAU,IACvB,4BAACC,GAAkB,EAAA,UAAU,IAAK,UAAAV,EAAA,CAAc,EAClD,CAAA;AAAA,0BACCW,GAAc,EAAA,IAAI,EAAE,KAAK,UAAW,UAAcV,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACrD;AAEJ;"}
+{"version":3,"file":"index.es.js","sources":["../../../src/components/ScrollableDialog/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport {\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogContentText,\n  DialogTitle,\n  DialogProps as MuiDialogProps,\n} from \"@mui/material\";\n\nexport type ConfirmDialogResult = \"confirm\" | \"cancel\";\n\ntype Props = {\n  /** ダイアログのタイトル */\n  dialogTitle: ReactNode;\n  /** ダイアログの内容 */\n  dialogContent: ReactNode;\n  /** ダイアログの処理ボタン（複数可） */\n  dialogActions: ReactNode;\n  /** ダイアログの表示状態 */\n  open: boolean;\n  /** 閉じた時のhandler */\n  onCloseDialog: (result: ConfirmDialogResult) => void;\n} & MuiDialogProps;\n\n/** MuiDialogを継承したコンテントのスクロール可能なDialogです。 */\nexport const ScrollableDialog = (props: Props) => {\n  const {\n    dialogTitle,\n    dialogContent,\n    dialogActions,\n    open,\n    onCloseDialog,\n    ...dialogProps\n  } = props;\n\n  return (\n    <Dialog\n      {...dialogProps}\n      open={open}\n      onClose={() => onCloseDialog(\"cancel\")}\n      scroll={\"paper\"}\n      aria-labelledby=\"scroll-dialog-title\"\n      aria-describedby=\"scroll-dialog-description\"\n    >\n      <DialogTitle\n        sx={{\n          display: \"flex\",\n          gap: \"5px\",\n          alignItems: \"center\",\n        }}\n      >\n        {dialogTitle}\n      </DialogTitle>\n      <DialogContent dividers={true}>\n        <DialogContentText tabIndex={-1}>{dialogContent}</DialogContentText>\n      </DialogContent>\n      <DialogActions sx={{ gap: \"10px\" }}>{dialogActions}</DialogActions>\n    </Dialog>\n  );\n};\n\nexport default ScrollableDialog;\n"],"names":["ScrollableDialog","props","dialogTitle","dialogContent","dialogActions","open","onCloseDialog","dialogProps","jsxs","Dialog","jsx","DialogTitle","DialogContent","DialogContentText","DialogActions"],"mappings":";;AA0BO,MAAMA,IAAmB,CAACC,MAAiB;AAChD,QAAM;AAAA,IACJ,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,eAAAC;AAAA,IACA,MAAAC;AAAA,IACA,eAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDN;AAEJ,SACE,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,MAAAF;AAAA,MACA,SAAS,MAAMC,EAAc,QAAQ;AAAA,MACrC,QAAQ;AAAA,MACR,mBAAgB;AAAA,MAChB,oBAAiB;AAAA,MAEjB,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,SAAS;AAAA,cACT,KAAK;AAAA,cACL,YAAY;AAAA,YAAA;AAAA,YAGb,UAAAT;AAAA,UAAA;AAAA,QAAA;AAAA,QAEH,gBAAAQ,EAACE,KAAc,UAAU,IACvB,4BAACC,GAAA,EAAkB,UAAU,IAAK,UAAAV,EAAA,CAAc,EAAA,CAClD;AAAA,0BACCW,GAAA,EAAc,IAAI,EAAE,KAAK,OAAA,GAAW,UAAAV,EAAA,CAAc;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGzD;"}

package/dist/components/ScrollableDialog/index.test.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("react/jsx-runtime"),s=require("react"),t=require("../../react.esm-CiMn0Rnx.cjs"),c=require("./index.cjs.js");describe("ScrollableDialog",()=>{it("renders correctly",()=>{const o="Test Title",n="Test Content",l=e.jsx("button",{children:"Test Action"}),{getByText:i}=t.render(e.jsx(c.ScrollableDialog,{dialogTitle:o,dialogContent:n,dialogActions:l,open:!0,onCloseDialog:()=>{}}));expect(i(o)).toBeInTheDocument(),expect(i(n)).toBeInTheDocument(),expect(i("Test Action")).toBeInTheDocument()}),it('calls onClose with "cancel" when the dialog is closed',()=>{const o=jest.fn();t.render(e.jsx(c.ScrollableDialog,{open:!0,dialogTitle:"Test Dialog",dialogContent:"This is a test dialog.",dialogActions:e.jsx("button",{onClick:()=>o("cancel"),children:"Cancel"}),onCloseDialog:o}));const n=t.screen.getByRole("button",{name:/cancel/i});t.fireEvent.click(n),expect(o).toHaveBeenCalledWith("cancel")}),it("displays the dialog when the open button is clicked",()=>{const o=()=>{const[n,l]=s.useState(!1);return e.jsxs(e.Fragment,{children:[e.jsx("button",{onClick:()=>l(!0),children:"Open!"}),e.jsx(c.ScrollableDialog,{open:n,dialogTitle:"Test Dialog",dialogContent:"This is a test dialog.",dialogActions:e.jsx("button",{onClick:()=>{},children:"Close"}),onCloseDialog:()=>{}})]})};t.render(e.jsx(o,{})),expect(t.screen.queryByText("This is a test dialog.")).not.toBeInTheDocument(),t.fireEvent.click(t.screen.getByText("Open!")),expect(t.screen.getByText("This is a test dialog.")).toBeInTheDocument()})});
+"use strict";const e=require("react/jsx-runtime"),s=require("react"),t=require("../../react.esm-DGuy6Rn3.cjs"),c=require("./index.cjs.js");describe("ScrollableDialog",()=>{it("renders correctly",()=>{const o="Test Title",n="Test Content",l=e.jsx("button",{children:"Test Action"}),{getByText:i}=t.render(e.jsx(c.ScrollableDialog,{dialogTitle:o,dialogContent:n,dialogActions:l,open:!0,onCloseDialog:()=>{}}));expect(i(o)).toBeInTheDocument(),expect(i(n)).toBeInTheDocument(),expect(i("Test Action")).toBeInTheDocument()}),it('calls onClose with "cancel" when the dialog is closed',()=>{const o=jest.fn();t.render(e.jsx(c.ScrollableDialog,{open:!0,dialogTitle:"Test Dialog",dialogContent:"This is a test dialog.",dialogActions:e.jsx("button",{onClick:()=>o("cancel"),children:"Cancel"}),onCloseDialog:o}));const n=t.screen.getByRole("button",{name:/cancel/i});t.fireEvent.click(n),expect(o).toHaveBeenCalledWith("cancel")}),it("displays the dialog when the open button is clicked",()=>{const o=()=>{const[n,l]=s.useState(!1);return e.jsxs(e.Fragment,{children:[e.jsx("button",{onClick:()=>l(!0),children:"Open!"}),e.jsx(c.ScrollableDialog,{open:n,dialogTitle:"Test Dialog",dialogContent:"This is a test dialog.",dialogActions:e.jsx("button",{onClick:()=>{},children:"Close"}),onCloseDialog:()=>{}})]})};t.render(e.jsx(o,{})),expect(t.screen.queryByText("This is a test dialog.")).not.toBeInTheDocument(),t.fireEvent.click(t.screen.getByText("Open!")),expect(t.screen.getByText("This is a test dialog.")).toBeInTheDocument()})});
 //# sourceMappingURL=index.test.cjs.js.map

package/dist/components/ScrollableDialog/index.test.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/ScrollableDialog/index.test.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { fireEvent, render, screen } from \"@testing-library/react\";\n\nimport { ScrollableDialog } from \".\";\n\ndescribe(\"ScrollableDialog\", () => {\n  it(\"renders correctly\", () => {\n    const title = \"Test Title\";\n    const content = \"Test Content\";\n    const dialogActions = <button>Test Action</button>;\n\n    const { getByText } = render(\n      <ScrollableDialog\n        dialogTitle={title}\n        dialogContent={content}\n        dialogActions={dialogActions}\n        open={true}\n        onCloseDialog={() => {}}\n      />,\n    );\n\n    expect(getByText(title)).toBeInTheDocument();\n    expect(getByText(content)).toBeInTheDocument();\n    expect(getByText(\"Test Action\")).toBeInTheDocument();\n  });\n\n  it('calls onClose with \"cancel\" when the dialog is closed', () => {\n    const handleClose = jest.fn();\n    render(\n      <ScrollableDialog\n        open={true}\n        dialogTitle=\"Test Dialog\"\n        dialogContent=\"This is a test dialog.\"\n        dialogActions={\n          <button onClick={() => handleClose(\"cancel\")}>Cancel</button>\n        }\n        onCloseDialog={handleClose}\n      />,\n    );\n\n    const cancelButton = screen.getByRole(\"button\", { name: /cancel/i });\n    fireEvent.click(cancelButton);\n\n    expect(handleClose).toHaveBeenCalledWith(\"cancel\");\n  });\n\n  it(\"displays the dialog when the open button is clicked\", () => {\n    const TestComponent = () => {\n      const [open, setOpen] = useState(false);\n\n      return (\n        <>\n          <button onClick={() => setOpen(true)}>Open!</button>\n          <ScrollableDialog\n            open={open}\n            dialogTitle=\"Test Dialog\"\n            dialogContent=\"This is a test dialog.\"\n            dialogActions={<button onClick={() => {}}>Close</button>}\n            onCloseDialog={() => {}}\n          />\n        </>\n      );\n    };\n    render(<TestComponent />);\n\n    // ダイアログがまだ表示されていないことを確認\n    expect(\n      screen.queryByText(\"This is a test dialog.\"),\n    ).not.toBeInTheDocument();\n\n    // Open! ボタンをクリック\n    fireEvent.click(screen.getByText(\"Open!\"));\n\n    // ダイアログが表示されていることを確認\n    expect(screen.getByText(\"This is a test dialog.\")).toBeInTheDocument();\n  });\n});\n"],"names":["title","content","dialogActions","jsx","getByText","render","ScrollableDialog","handleClose","cancelButton","screen","fireEvent","TestComponent","open","setOpen","useState","jsxs","Fragment"],"mappings":"2IAKA,SAAS,mBAAoB,IAAM,CACjC,GAAG,oBAAqB,IAAM,CAC5B,MAAMA,EAAQ,aACRC,EAAU,eACVC,EAAiBC,EAAAA,IAAA,SAAA,CAAO,SAAW,aAAA,CAAA,EAEnC,CAAE,UAAAC,GAAcC,EAAA,OACpBF,EAAA,IAACG,EAAA,iBAAA,CACC,YAAaN,EACb,cAAeC,EACf,cAAAC,EACA,KAAM,GACN,cAAe,IAAM,CAAA,CAAC,CAAA,CAE1B,EAEA,OAAOE,EAAUJ,CAAK,CAAC,EAAE,kBAAkB,EAC3C,OAAOI,EAAUH,CAAO,CAAC,EAAE,kBAAkB,EAC7C,OAAOG,EAAU,aAAa,CAAC,EAAE,kBAAkB,CAAA,CACpD,EAED,GAAG,wDAAyD,IAAM,CAC1D,MAAAG,EAAc,KAAK,GAAG,EAC5BF,EAAA,OACEF,EAAA,IAACG,EAAA,iBAAA,CACC,KAAM,GACN,YAAY,cACZ,cAAc,yBACd,oBACG,SAAO,CAAA,QAAS,IAAMC,EAAY,QAAQ,EAAG,SAAM,SAAA,EAEtD,cAAeA,CAAA,CAAA,CAEnB,EAEA,MAAMC,EAAeC,EAAAA,OAAO,UAAU,SAAU,CAAE,KAAM,UAAW,EACnEC,EAAA,UAAU,MAAMF,CAAY,EAErB,OAAAD,CAAW,EAAE,qBAAqB,QAAQ,CAAA,CAClD,EAED,GAAG,sDAAuD,IAAM,CAC9D,MAAMI,EAAgB,IAAM,CAC1B,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAEtC,OAEIC,EAAA,KAAAC,WAAA,CAAA,SAAA,CAAAb,MAAC,UAAO,QAAS,IAAMU,EAAQ,EAAI,EAAG,SAAK,QAAA,EAC3CV,EAAA,IAACG,EAAA,iBAAA,CACC,KAAAM,EACA,YAAY,cACZ,cAAc,yBACd,cAAeT,EAAA,IAAC,SAAO,CAAA,QAAS,IAAM,CAAA,EAAI,SAAK,QAAA,EAC/C,cAAe,IAAM,CAAA,CAAC,CAAA,CACxB,EACF,CAEJ,EACOE,EAAAA,OAAAF,EAAA,IAACQ,IAAc,CAAE,EAGxB,OACEF,EAAA,OAAO,YAAY,wBAAwB,CAAA,EAC3C,IAAI,kBAAkB,EAGxBC,EAAAA,UAAU,MAAMD,EAAAA,OAAO,UAAU,OAAO,CAAC,EAGzC,OAAOA,EAAAA,OAAO,UAAU,wBAAwB,CAAC,EAAE,kBAAkB,CAAA,CACtE,CACH,CAAC"}
+{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/ScrollableDialog/index.test.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { fireEvent, render, screen } from \"@testing-library/react\";\n\nimport { ScrollableDialog } from \".\";\n\ndescribe(\"ScrollableDialog\", () => {\n  it(\"renders correctly\", () => {\n    const title = \"Test Title\";\n    const content = \"Test Content\";\n    const dialogActions = <button>Test Action</button>;\n\n    const { getByText } = render(\n      <ScrollableDialog\n        dialogTitle={title}\n        dialogContent={content}\n        dialogActions={dialogActions}\n        open={true}\n        onCloseDialog={() => {}}\n      />,\n    );\n\n    expect(getByText(title)).toBeInTheDocument();\n    expect(getByText(content)).toBeInTheDocument();\n    expect(getByText(\"Test Action\")).toBeInTheDocument();\n  });\n\n  it('calls onClose with \"cancel\" when the dialog is closed', () => {\n    const handleClose = jest.fn();\n    render(\n      <ScrollableDialog\n        open={true}\n        dialogTitle=\"Test Dialog\"\n        dialogContent=\"This is a test dialog.\"\n        dialogActions={\n          <button onClick={() => handleClose(\"cancel\")}>Cancel</button>\n        }\n        onCloseDialog={handleClose}\n      />,\n    );\n\n    const cancelButton = screen.getByRole(\"button\", { name: /cancel/i });\n    fireEvent.click(cancelButton);\n\n    expect(handleClose).toHaveBeenCalledWith(\"cancel\");\n  });\n\n  it(\"displays the dialog when the open button is clicked\", () => {\n    const TestComponent = () => {\n      const [open, setOpen] = useState(false);\n\n      return (\n        <>\n          <button onClick={() => setOpen(true)}>Open!</button>\n          <ScrollableDialog\n            open={open}\n            dialogTitle=\"Test Dialog\"\n            dialogContent=\"This is a test dialog.\"\n            dialogActions={<button onClick={() => {}}>Close</button>}\n            onCloseDialog={() => {}}\n          />\n        </>\n      );\n    };\n    render(<TestComponent />);\n\n    // ダイアログがまだ表示されていないことを確認\n    expect(\n      screen.queryByText(\"This is a test dialog.\"),\n    ).not.toBeInTheDocument();\n\n    // Open! ボタンをクリック\n    fireEvent.click(screen.getByText(\"Open!\"));\n\n    // ダイアログが表示されていることを確認\n    expect(screen.getByText(\"This is a test dialog.\")).toBeInTheDocument();\n  });\n});\n"],"names":["title","content","dialogActions","jsx","getByText","render","ScrollableDialog","handleClose","cancelButton","screen","fireEvent","TestComponent","open","setOpen","useState","jsxs","Fragment"],"mappings":"2IAKA,SAAS,mBAAoB,IAAM,CACjC,GAAG,oBAAqB,IAAM,CAC5B,MAAMA,EAAQ,aACRC,EAAU,eACVC,EAAgBC,EAAAA,IAAC,SAAA,CAAO,SAAA,aAAA,CAAW,EAEnC,CAAE,UAAAC,GAAcC,EAAAA,OACpBF,EAAAA,IAACG,EAAAA,iBAAA,CACC,YAAaN,EACb,cAAeC,EACf,cAAAC,EACA,KAAM,GACN,cAAe,IAAM,CAAC,CAAA,CAAA,CACxB,EAGF,OAAOE,EAAUJ,CAAK,CAAC,EAAE,kBAAA,EACzB,OAAOI,EAAUH,CAAO,CAAC,EAAE,kBAAA,EAC3B,OAAOG,EAAU,aAAa,CAAC,EAAE,kBAAA,CACnC,CAAC,EAED,GAAG,wDAAyD,IAAM,CAChE,MAAMG,EAAc,KAAK,GAAA,EACzBF,EAAAA,OACEF,EAAAA,IAACG,EAAAA,iBAAA,CACC,KAAM,GACN,YAAY,cACZ,cAAc,yBACd,oBACG,SAAA,CAAO,QAAS,IAAMC,EAAY,QAAQ,EAAG,SAAA,SAAM,EAEtD,cAAeA,CAAA,CAAA,CACjB,EAGF,MAAMC,EAAeC,EAAAA,OAAO,UAAU,SAAU,CAAE,KAAM,UAAW,EACnEC,EAAAA,UAAU,MAAMF,CAAY,EAE5B,OAAOD,CAAW,EAAE,qBAAqB,QAAQ,CACnD,CAAC,EAED,GAAG,sDAAuD,IAAM,CAC9D,MAAMI,EAAgB,IAAM,CAC1B,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAEtC,OACEC,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAb,MAAC,UAAO,QAAS,IAAMU,EAAQ,EAAI,EAAG,SAAA,QAAK,EAC3CV,EAAAA,IAACG,EAAAA,iBAAA,CACC,KAAAM,EACA,YAAY,cACZ,cAAc,yBACd,cAAeT,EAAAA,IAAC,SAAA,CAAO,QAAS,IAAM,CAAC,EAAG,SAAA,QAAK,EAC/C,cAAe,IAAM,CAAC,CAAA,CAAA,CACxB,EACF,CAEJ,EACAE,EAAAA,OAAOF,EAAAA,IAACQ,IAAc,CAAE,EAGxB,OACEF,EAAAA,OAAO,YAAY,wBAAwB,CAAA,EAC3C,IAAI,kBAAA,EAGNC,EAAAA,UAAU,MAAMD,EAAAA,OAAO,UAAU,OAAO,CAAC,EAGzC,OAAOA,EAAAA,OAAO,UAAU,wBAAwB,CAAC,EAAE,kBAAA,CACrD,CAAC,CACH,CAAC"}

package/dist/components/ScrollableDialog/index.test.es.js

@@ -1,6 +1,6 @@
 import { jsx as e, jsxs as r, Fragment as d } from "react/jsx-runtime";
 import { useState as g } from "react";
-import { r as c, s as n, f as a } from "../../react.esm-2FJSSo-S.js";
+import { r as c, s as n, f as a } from "../../react.esm-BBESb8eI.js";
 import { ScrollableDialog as s } from "./index.es.js";
 describe("ScrollableDialog", () => {
   it("renders correctly", () => {

package/dist/components/ScrollableDialog/index.test.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.test.es.js","sources":["../../../src/components/ScrollableDialog/index.test.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { fireEvent, render, screen } from \"@testing-library/react\";\n\nimport { ScrollableDialog } from \".\";\n\ndescribe(\"ScrollableDialog\", () => {\n  it(\"renders correctly\", () => {\n    const title = \"Test Title\";\n    const content = \"Test Content\";\n    const dialogActions = <button>Test Action</button>;\n\n    const { getByText } = render(\n      <ScrollableDialog\n        dialogTitle={title}\n        dialogContent={content}\n        dialogActions={dialogActions}\n        open={true}\n        onCloseDialog={() => {}}\n      />,\n    );\n\n    expect(getByText(title)).toBeInTheDocument();\n    expect(getByText(content)).toBeInTheDocument();\n    expect(getByText(\"Test Action\")).toBeInTheDocument();\n  });\n\n  it('calls onClose with \"cancel\" when the dialog is closed', () => {\n    const handleClose = jest.fn();\n    render(\n      <ScrollableDialog\n        open={true}\n        dialogTitle=\"Test Dialog\"\n        dialogContent=\"This is a test dialog.\"\n        dialogActions={\n          <button onClick={() => handleClose(\"cancel\")}>Cancel</button>\n        }\n        onCloseDialog={handleClose}\n      />,\n    );\n\n    const cancelButton = screen.getByRole(\"button\", { name: /cancel/i });\n    fireEvent.click(cancelButton);\n\n    expect(handleClose).toHaveBeenCalledWith(\"cancel\");\n  });\n\n  it(\"displays the dialog when the open button is clicked\", () => {\n    const TestComponent = () => {\n      const [open, setOpen] = useState(false);\n\n      return (\n        <>\n          <button onClick={() => setOpen(true)}>Open!</button>\n          <ScrollableDialog\n            open={open}\n            dialogTitle=\"Test Dialog\"\n            dialogContent=\"This is a test dialog.\"\n            dialogActions={<button onClick={() => {}}>Close</button>}\n            onCloseDialog={() => {}}\n          />\n        </>\n      );\n    };\n    render(<TestComponent />);\n\n    // ダイアログがまだ表示されていないことを確認\n    expect(\n      screen.queryByText(\"This is a test dialog.\"),\n    ).not.toBeInTheDocument();\n\n    // Open! ボタンをクリック\n    fireEvent.click(screen.getByText(\"Open!\"));\n\n    // ダイアログが表示されていることを確認\n    expect(screen.getByText(\"This is a test dialog.\")).toBeInTheDocument();\n  });\n});\n"],"names":["title","content","dialogActions","jsx","getByText","render","ScrollableDialog","handleClose","cancelButton","screen","fireEvent","open","setOpen","useState","jsxs","Fragment"],"mappings":";;;;AAKA,SAAS,oBAAoB,MAAM;AACjC,KAAG,qBAAqB,MAAM;AAC5B,UAAMA,IAAQ,cACRC,IAAU,gBACVC,IAAiB,gBAAAC,EAAA,UAAA,EAAO,UAAW,cAAA,CAAA,GAEnC,EAAE,WAAAC,MAAcC;AAAA,MACpB,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,aAAaN;AAAA,UACb,eAAeC;AAAA,UACf,eAAAC;AAAA,UACA,MAAM;AAAA,UACN,eAAe,MAAM;AAAA,UAAA;AAAA,QAAC;AAAA,MAAA;AAAA,IAE1B;AAEA,WAAOE,EAAUJ,CAAK,CAAC,EAAE,kBAAkB,GAC3C,OAAOI,EAAUH,CAAO,CAAC,EAAE,kBAAkB,GAC7C,OAAOG,EAAU,aAAa,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACpD,GAED,GAAG,yDAAyD,MAAM;AAC1D,UAAAG,IAAc,KAAK,GAAG;AAC5B,IAAAF;AAAA,MACE,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,aAAY;AAAA,UACZ,eAAc;AAAA,UACd,iCACG,UAAO,EAAA,SAAS,MAAMC,EAAY,QAAQ,GAAG,UAAM,UAAA;AAAA,UAEtD,eAAeA;AAAA,QAAA;AAAA,MAAA;AAAA,IAEnB;AAEA,UAAMC,IAAeC,EAAO,UAAU,UAAU,EAAE,MAAM,WAAW;AACnE,IAAAC,EAAU,MAAMF,CAAY,GAErB,OAAAD,CAAW,EAAE,qBAAqB,QAAQ;AAAA,EAAA,CAClD,GAED,GAAG,uDAAuD,MAAM;AAiBvD,IAAAF,EAAA,gBAAAF,EAhBe,MAAM;AAC1B,YAAM,CAACQ,GAAMC,CAAO,IAAIC,EAAS,EAAK;AAEtC,aAEI,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAZ,EAAC,YAAO,SAAS,MAAMS,EAAQ,EAAI,GAAG,UAAK,SAAA;AAAA,QAC3C,gBAAAT;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,MAAAK;AAAA,YACA,aAAY;AAAA,YACZ,eAAc;AAAA,YACd,eAAe,gBAAAR,EAAC,UAAO,EAAA,SAAS,MAAM;AAAA,YAAA,GAAI,UAAK,SAAA;AAAA,YAC/C,eAAe,MAAM;AAAA,YAAA;AAAA,UAAC;AAAA,QAAA;AAAA,MACxB,GACF;AAAA,IAEJ,KACsB,CAAE,GAGxB;AAAA,MACEM,EAAO,YAAY,wBAAwB;AAAA,IAAA,EAC3C,IAAI,kBAAkB,GAGxBC,EAAU,MAAMD,EAAO,UAAU,OAAO,CAAC,GAGzC,OAAOA,EAAO,UAAU,wBAAwB,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACtE;AACH,CAAC;"}
+{"version":3,"file":"index.test.es.js","sources":["../../../src/components/ScrollableDialog/index.test.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { fireEvent, render, screen } from \"@testing-library/react\";\n\nimport { ScrollableDialog } from \".\";\n\ndescribe(\"ScrollableDialog\", () => {\n  it(\"renders correctly\", () => {\n    const title = \"Test Title\";\n    const content = \"Test Content\";\n    const dialogActions = <button>Test Action</button>;\n\n    const { getByText } = render(\n      <ScrollableDialog\n        dialogTitle={title}\n        dialogContent={content}\n        dialogActions={dialogActions}\n        open={true}\n        onCloseDialog={() => {}}\n      />,\n    );\n\n    expect(getByText(title)).toBeInTheDocument();\n    expect(getByText(content)).toBeInTheDocument();\n    expect(getByText(\"Test Action\")).toBeInTheDocument();\n  });\n\n  it('calls onClose with \"cancel\" when the dialog is closed', () => {\n    const handleClose = jest.fn();\n    render(\n      <ScrollableDialog\n        open={true}\n        dialogTitle=\"Test Dialog\"\n        dialogContent=\"This is a test dialog.\"\n        dialogActions={\n          <button onClick={() => handleClose(\"cancel\")}>Cancel</button>\n        }\n        onCloseDialog={handleClose}\n      />,\n    );\n\n    const cancelButton = screen.getByRole(\"button\", { name: /cancel/i });\n    fireEvent.click(cancelButton);\n\n    expect(handleClose).toHaveBeenCalledWith(\"cancel\");\n  });\n\n  it(\"displays the dialog when the open button is clicked\", () => {\n    const TestComponent = () => {\n      const [open, setOpen] = useState(false);\n\n      return (\n        <>\n          <button onClick={() => setOpen(true)}>Open!</button>\n          <ScrollableDialog\n            open={open}\n            dialogTitle=\"Test Dialog\"\n            dialogContent=\"This is a test dialog.\"\n            dialogActions={<button onClick={() => {}}>Close</button>}\n            onCloseDialog={() => {}}\n          />\n        </>\n      );\n    };\n    render(<TestComponent />);\n\n    // ダイアログがまだ表示されていないことを確認\n    expect(\n      screen.queryByText(\"This is a test dialog.\"),\n    ).not.toBeInTheDocument();\n\n    // Open! ボタンをクリック\n    fireEvent.click(screen.getByText(\"Open!\"));\n\n    // ダイアログが表示されていることを確認\n    expect(screen.getByText(\"This is a test dialog.\")).toBeInTheDocument();\n  });\n});\n"],"names":["title","content","dialogActions","jsx","getByText","render","ScrollableDialog","handleClose","cancelButton","screen","fireEvent","open","setOpen","useState","jsxs","Fragment"],"mappings":";;;;AAKA,SAAS,oBAAoB,MAAM;AACjC,KAAG,qBAAqB,MAAM;AAC5B,UAAMA,IAAQ,cACRC,IAAU,gBACVC,IAAgB,gBAAAC,EAAC,UAAA,EAAO,UAAA,cAAA,CAAW,GAEnC,EAAE,WAAAC,MAAcC;AAAA,MACpB,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,aAAaN;AAAA,UACb,eAAeC;AAAA,UACf,eAAAC;AAAA,UACA,MAAM;AAAA,UACN,eAAe,MAAM;AAAA,UAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IACxB;AAGF,WAAOE,EAAUJ,CAAK,CAAC,EAAE,kBAAA,GACzB,OAAOI,EAAUH,CAAO,CAAC,EAAE,kBAAA,GAC3B,OAAOG,EAAU,aAAa,CAAC,EAAE,kBAAA;AAAA,EACnC,CAAC,GAED,GAAG,yDAAyD,MAAM;AAChE,UAAMG,IAAc,KAAK,GAAA;AACzB,IAAAF;AAAA,MACE,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,aAAY;AAAA,UACZ,eAAc;AAAA,UACd,iCACG,UAAA,EAAO,SAAS,MAAMC,EAAY,QAAQ,GAAG,UAAA,UAAM;AAAA,UAEtD,eAAeA;AAAA,QAAA;AAAA,MAAA;AAAA,IACjB;AAGF,UAAMC,IAAeC,EAAO,UAAU,UAAU,EAAE,MAAM,WAAW;AACnE,IAAAC,EAAU,MAAMF,CAAY,GAE5B,OAAOD,CAAW,EAAE,qBAAqB,QAAQ;AAAA,EACnD,CAAC,GAED,GAAG,uDAAuD,MAAM;AAiB9D,IAAAF,EAAO,gBAAAF,EAhBe,MAAM;AAC1B,YAAM,CAACQ,GAAMC,CAAO,IAAIC,EAAS,EAAK;AAEtC,aACE,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,QAAA,gBAAAZ,EAAC,YAAO,SAAS,MAAMS,EAAQ,EAAI,GAAG,UAAA,SAAK;AAAA,QAC3C,gBAAAT;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,MAAAK;AAAA,YACA,aAAY;AAAA,YACZ,eAAc;AAAA,YACd,eAAe,gBAAAR,EAAC,UAAA,EAAO,SAAS,MAAM;AAAA,YAAC,GAAG,UAAA,SAAK;AAAA,YAC/C,eAAe,MAAM;AAAA,YAAC;AAAA,UAAA;AAAA,QAAA;AAAA,MACxB,GACF;AAAA,IAEJ,KACsB,CAAE,GAGxB;AAAA,MACEM,EAAO,YAAY,wBAAwB;AAAA,IAAA,EAC3C,IAAI,kBAAA,GAGNC,EAAU,MAAMD,EAAO,UAAU,OAAO,CAAC,GAGzC,OAAOA,EAAO,UAAU,wBAAwB,CAAC,EAAE,kBAAA;AAAA,EACrD,CAAC;AACH,CAAC;"}

package/dist/components/SearchForm/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../src/components/SearchForm/index.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { ExpandMore, Search } from \"@mui/icons-material\";\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Button,\n} from \"@mui/material\";\nimport { type FieldValues, type useForm } from \"react-hook-form\";\n\nimport { FlexButtons } from \"../FlexButtons\";\nimport styles from \"./index.module.scss\";\n\ntype Props<T extends FieldValues = FieldValues> = {\n  headerTitle?: string;\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  handleSubmit: ReturnType<typeof useForm<T>>[\"handleSubmit\"];\n  onSubmitSearch: (data: T) => void;\n  onClickClear?: () => void;\n};\n\nexport const SearchForm = <T extends FieldValues = FieldValues>({\n  headerTitle,\n  children,\n  defaultExpanded,\n  handleSubmit,\n  onSubmitSearch,\n  onClickClear,\n}: Props<T>) => {\n  const handleClear = () => {\n    if (onClickClear) {\n      onClickClear();\n    }\n  };\n\n  const handle = handleSubmit((data) => {\n    onSubmitSearch(data);\n  });\n\n  return (\n    <Accordion defaultExpanded={defaultExpanded} className={styles.container}>\n      <AccordionSummary\n        className={styles.header}\n        aria-controls=\"panel-content\"\n        expandIcon={<ExpandMore />}\n      >\n        {headerTitle || \"絞り込み\"}\n      </AccordionSummary>\n      <AccordionDetails className={styles.mainContent}>\n        <form className={styles.searchForm} onSubmit={handle}>\n          <div className={styles.inputItems}>{children}</div>\n          <FlexButtons position=\"flex-end\">\n            <Button\n              onClick={handleClear}\n              variant=\"outlined\"\n              sx={{\n                p: 1,\n                background: \"white\",\n                color: \"#6672e8\",\n                borderBlockColor: \"#6672e8\",\n                width: \"128px\",\n              }}\n            >\n              クリア\n            </Button>\n            <Button\n              type=\"submit\"\n              variant=\"contained\"\n              startIcon={<Search />}\n              sx={{\n                background: \"#6672e8\",\n                color: \"white\",\n                \":hover\": { background: \"#6672e8\" },\n                width: \"128px\",\n              }}\n            >\n              検索\n            </Button>\n          </FlexButtons>\n        </form>\n      </AccordionDetails>\n    </Accordion>\n  );\n};\n\nexport default SearchForm;\n"],"names":["SearchForm","headerTitle","children","defaultExpanded","handleSubmit","onSubmitSearch","onClickClear","handleClear","handle","data","jsxs","Accordion","styles","jsx","AccordionSummary","ExpandMore","AccordionDetails","FlexButtons","Button","Search"],"mappings":"8aAsBaA,EAAa,CAAsC,CAC9D,YAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,eAAAC,EACA,aAAAC,CACF,IAAgB,CACd,MAAMC,EAAc,IAAM,CACpBD,GACWA,EAAA,CAEjB,EAEME,EAASJ,EAAcK,GAAS,CACpCJ,EAAeI,CAAI,CAAA,CACpB,EAED,OACGC,EAAAA,KAAAC,EAAAA,UAAA,CAAU,gBAAAR,EAAkC,UAAWS,EAAO,UAC7D,SAAA,CAAAC,EAAA,IAACC,EAAA,iBAAA,CACC,UAAWF,EAAO,OAClB,gBAAc,gBACd,iBAAaG,EAAW,WAAA,EAAA,EAEvB,SAAed,GAAA,MAAA,CAClB,EACAY,EAAA,IAACG,EAAiB,iBAAA,CAAA,UAAWJ,EAAO,YAClC,SAACF,EAAAA,KAAA,OAAA,CAAK,UAAWE,EAAO,WAAY,SAAUJ,EAC5C,SAAA,CAAAK,EAAA,IAAC,MAAI,CAAA,UAAWD,EAAO,WAAa,SAAAV,EAAS,EAC7CQ,EAAAA,KAACO,EAAAA,YAAY,CAAA,SAAS,WACpB,SAAA,CAAAJ,EAAA,IAACK,EAAA,OAAA,CACC,QAASX,EACT,QAAQ,WACR,GAAI,CACF,EAAG,EACH,WAAY,QACZ,MAAO,UACP,iBAAkB,UAClB,MAAO,OACT,EACD,SAAA,KAAA,CAED,EACAM,EAAA,IAACK,EAAA,OAAA,CACC,KAAK,SACL,QAAQ,YACR,gBAAYC,EAAO,OAAA,EAAA,EACnB,GAAI,CACF,WAAY,UACZ,MAAO,QACP,SAAU,CAAE,WAAY,SAAU,EAClC,MAAO,OACT,EACD,SAAA,IAAA,CAAA,CAED,CACF,CAAA,CAAA,CAAA,CACF,CACF,CAAA,CAAA,EACF,CAEJ"}
+{"version":3,"file":"index.cjs.js","sources":["../../../src/components/SearchForm/index.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { ExpandMore, Search } from \"@mui/icons-material\";\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Button,\n} from \"@mui/material\";\nimport { type FieldValues, type useForm } from \"react-hook-form\";\n\nimport { FlexButtons } from \"../FlexButtons\";\nimport styles from \"./index.module.scss\";\n\ntype Props<T extends FieldValues = FieldValues> = {\n  headerTitle?: string;\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  handleSubmit: ReturnType<typeof useForm<T>>[\"handleSubmit\"];\n  onSubmitSearch: (data: T) => void;\n  onClickClear?: () => void;\n};\n\nexport const SearchForm = <T extends FieldValues = FieldValues>({\n  headerTitle,\n  children,\n  defaultExpanded,\n  handleSubmit,\n  onSubmitSearch,\n  onClickClear,\n}: Props<T>) => {\n  const handleClear = () => {\n    if (onClickClear) {\n      onClickClear();\n    }\n  };\n\n  const handle = handleSubmit((data) => {\n    onSubmitSearch(data);\n  });\n\n  return (\n    <Accordion defaultExpanded={defaultExpanded} className={styles.container}>\n      <AccordionSummary\n        className={styles.header}\n        aria-controls=\"panel-content\"\n        expandIcon={<ExpandMore />}\n      >\n        {headerTitle || \"絞り込み\"}\n      </AccordionSummary>\n      <AccordionDetails className={styles.mainContent}>\n        <form className={styles.searchForm} onSubmit={handle}>\n          <div className={styles.inputItems}>{children}</div>\n          <FlexButtons position=\"flex-end\">\n            <Button\n              onClick={handleClear}\n              variant=\"outlined\"\n              sx={{\n                p: 1,\n                background: \"white\",\n                color: \"#6672e8\",\n                borderBlockColor: \"#6672e8\",\n                width: \"128px\",\n              }}\n            >\n              クリア\n            </Button>\n            <Button\n              type=\"submit\"\n              variant=\"contained\"\n              startIcon={<Search />}\n              sx={{\n                background: \"#6672e8\",\n                color: \"white\",\n                \":hover\": { background: \"#6672e8\" },\n                width: \"128px\",\n              }}\n            >\n              検索\n            </Button>\n          </FlexButtons>\n        </form>\n      </AccordionDetails>\n    </Accordion>\n  );\n};\n\nexport default SearchForm;\n"],"names":["SearchForm","headerTitle","children","defaultExpanded","handleSubmit","onSubmitSearch","onClickClear","handleClear","handle","data","jsxs","Accordion","styles","jsx","AccordionSummary","ExpandMore","AccordionDetails","FlexButtons","Button","Search"],"mappings":"8aAsBaA,EAAa,CAAsC,CAC9D,YAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,eAAAC,EACA,aAAAC,CACF,IAAgB,CACd,MAAMC,EAAc,IAAM,CACpBD,GACFA,EAAA,CAEJ,EAEME,EAASJ,EAAcK,GAAS,CACpCJ,EAAeI,CAAI,CACrB,CAAC,EAED,OACEC,EAAAA,KAACC,EAAAA,UAAA,CAAU,gBAAAR,EAAkC,UAAWS,EAAO,UAC7D,SAAA,CAAAC,EAAAA,IAACC,EAAAA,iBAAA,CACC,UAAWF,EAAO,OAClB,gBAAc,gBACd,iBAAaG,EAAAA,WAAA,EAAW,EAEvB,SAAAd,GAAe,MAAA,CAAA,EAElBY,EAAAA,IAACG,EAAAA,iBAAA,CAAiB,UAAWJ,EAAO,YAClC,SAAAF,EAAAA,KAAC,OAAA,CAAK,UAAWE,EAAO,WAAY,SAAUJ,EAC5C,SAAA,CAAAK,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAO,WAAa,SAAAV,EAAS,EAC7CQ,EAAAA,KAACO,EAAAA,YAAA,CAAY,SAAS,WACpB,SAAA,CAAAJ,EAAAA,IAACK,EAAAA,OAAA,CACC,QAASX,EACT,QAAQ,WACR,GAAI,CACF,EAAG,EACH,WAAY,QACZ,MAAO,UACP,iBAAkB,UAClB,MAAO,OAAA,EAEV,SAAA,KAAA,CAAA,EAGDM,EAAAA,IAACK,EAAAA,OAAA,CACC,KAAK,SACL,QAAQ,YACR,gBAAYC,EAAAA,OAAA,EAAO,EACnB,GAAI,CACF,WAAY,UACZ,MAAO,QACP,SAAU,CAAE,WAAY,SAAA,EACxB,MAAO,OAAA,EAEV,SAAA,IAAA,CAAA,CAED,CAAA,CACF,CAAA,CAAA,CACF,CAAA,CACF,CAAA,EACF,CAEJ"}

package/dist/components/SearchForm/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../src/components/SearchForm/index.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { ExpandMore, Search } from \"@mui/icons-material\";\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Button,\n} from \"@mui/material\";\nimport { type FieldValues, type useForm } from \"react-hook-form\";\n\nimport { FlexButtons } from \"../FlexButtons\";\nimport styles from \"./index.module.scss\";\n\ntype Props<T extends FieldValues = FieldValues> = {\n  headerTitle?: string;\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  handleSubmit: ReturnType<typeof useForm<T>>[\"handleSubmit\"];\n  onSubmitSearch: (data: T) => void;\n  onClickClear?: () => void;\n};\n\nexport const SearchForm = <T extends FieldValues = FieldValues>({\n  headerTitle,\n  children,\n  defaultExpanded,\n  handleSubmit,\n  onSubmitSearch,\n  onClickClear,\n}: Props<T>) => {\n  const handleClear = () => {\n    if (onClickClear) {\n      onClickClear();\n    }\n  };\n\n  const handle = handleSubmit((data) => {\n    onSubmitSearch(data);\n  });\n\n  return (\n    <Accordion defaultExpanded={defaultExpanded} className={styles.container}>\n      <AccordionSummary\n        className={styles.header}\n        aria-controls=\"panel-content\"\n        expandIcon={<ExpandMore />}\n      >\n        {headerTitle || \"絞り込み\"}\n      </AccordionSummary>\n      <AccordionDetails className={styles.mainContent}>\n        <form className={styles.searchForm} onSubmit={handle}>\n          <div className={styles.inputItems}>{children}</div>\n          <FlexButtons position=\"flex-end\">\n            <Button\n              onClick={handleClear}\n              variant=\"outlined\"\n              sx={{\n                p: 1,\n                background: \"white\",\n                color: \"#6672e8\",\n                borderBlockColor: \"#6672e8\",\n                width: \"128px\",\n              }}\n            >\n              クリア\n            </Button>\n            <Button\n              type=\"submit\"\n              variant=\"contained\"\n              startIcon={<Search />}\n              sx={{\n                background: \"#6672e8\",\n                color: \"white\",\n                \":hover\": { background: \"#6672e8\" },\n                width: \"128px\",\n              }}\n            >\n              検索\n            </Button>\n          </FlexButtons>\n        </form>\n      </AccordionDetails>\n    </Accordion>\n  );\n};\n\nexport default SearchForm;\n"],"names":["SearchForm","headerTitle","children","defaultExpanded","handleSubmit","onSubmitSearch","onClickClear","handleClear","handle","data","jsxs","Accordion","styles","jsx","AccordionSummary","ExpandMore","AccordionDetails","FlexButtons","Button","Search"],"mappings":";;;;;;;;;;GAsBaA,IAAa,CAAsC;AAAA,EAC9D,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,cAAAC;AACF,MAAgB;AACd,QAAMC,IAAc,MAAM;AACxB,IAAID,KACWA,EAAA;AAAA,EAEjB,GAEME,IAASJ,EAAa,CAACK,MAAS;AACpC,IAAAJ,EAAeI,CAAI;AAAA,EAAA,CACpB;AAED,SACG,gBAAAC,EAAAC,GAAA,EAAU,iBAAAR,GAAkC,WAAWS,EAAO,WAC7D,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWF,EAAO;AAAA,QAClB,iBAAc;AAAA,QACd,8BAAaG,GAAW,EAAA;AAAA,QAEvB,UAAed,KAAA;AAAA,MAAA;AAAA,IAClB;AAAA,IACA,gBAAAY,EAACG,GAAiB,EAAA,WAAWJ,EAAO,aAClC,UAAC,gBAAAF,EAAA,QAAA,EAAK,WAAWE,EAAO,YAAY,UAAUJ,GAC5C,UAAA;AAAA,MAAA,gBAAAK,EAAC,OAAI,EAAA,WAAWD,EAAO,YAAa,UAAAV,GAAS;AAAA,MAC7C,gBAAAQ,EAACO,GAAY,EAAA,UAAS,YACpB,UAAA;AAAA,QAAA,gBAAAJ;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,SAASX;AAAA,YACT,SAAQ;AAAA,YACR,IAAI;AAAA,cACF,GAAG;AAAA,cACH,YAAY;AAAA,cACZ,OAAO;AAAA,cACP,kBAAkB;AAAA,cAClB,OAAO;AAAA,YACT;AAAA,YACD,UAAA;AAAA,UAAA;AAAA,QAED;AAAA,QACA,gBAAAM;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,6BAAYC,GAAO,EAAA;AAAA,YACnB,IAAI;AAAA,cACF,YAAY;AAAA,cACZ,OAAO;AAAA,cACP,UAAU,EAAE,YAAY,UAAU;AAAA,cAClC,OAAO;AAAA,YACT;AAAA,YACD,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED,EACF,CAAA;AAAA,IAAA,EAAA,CACF,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"index.es.js","sources":["../../../src/components/SearchForm/index.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { ExpandMore, Search } from \"@mui/icons-material\";\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Button,\n} from \"@mui/material\";\nimport { type FieldValues, type useForm } from \"react-hook-form\";\n\nimport { FlexButtons } from \"../FlexButtons\";\nimport styles from \"./index.module.scss\";\n\ntype Props<T extends FieldValues = FieldValues> = {\n  headerTitle?: string;\n  children: ReactNode;\n  defaultExpanded?: boolean;\n  handleSubmit: ReturnType<typeof useForm<T>>[\"handleSubmit\"];\n  onSubmitSearch: (data: T) => void;\n  onClickClear?: () => void;\n};\n\nexport const SearchForm = <T extends FieldValues = FieldValues>({\n  headerTitle,\n  children,\n  defaultExpanded,\n  handleSubmit,\n  onSubmitSearch,\n  onClickClear,\n}: Props<T>) => {\n  const handleClear = () => {\n    if (onClickClear) {\n      onClickClear();\n    }\n  };\n\n  const handle = handleSubmit((data) => {\n    onSubmitSearch(data);\n  });\n\n  return (\n    <Accordion defaultExpanded={defaultExpanded} className={styles.container}>\n      <AccordionSummary\n        className={styles.header}\n        aria-controls=\"panel-content\"\n        expandIcon={<ExpandMore />}\n      >\n        {headerTitle || \"絞り込み\"}\n      </AccordionSummary>\n      <AccordionDetails className={styles.mainContent}>\n        <form className={styles.searchForm} onSubmit={handle}>\n          <div className={styles.inputItems}>{children}</div>\n          <FlexButtons position=\"flex-end\">\n            <Button\n              onClick={handleClear}\n              variant=\"outlined\"\n              sx={{\n                p: 1,\n                background: \"white\",\n                color: \"#6672e8\",\n                borderBlockColor: \"#6672e8\",\n                width: \"128px\",\n              }}\n            >\n              クリア\n            </Button>\n            <Button\n              type=\"submit\"\n              variant=\"contained\"\n              startIcon={<Search />}\n              sx={{\n                background: \"#6672e8\",\n                color: \"white\",\n                \":hover\": { background: \"#6672e8\" },\n                width: \"128px\",\n              }}\n            >\n              検索\n            </Button>\n          </FlexButtons>\n        </form>\n      </AccordionDetails>\n    </Accordion>\n  );\n};\n\nexport default SearchForm;\n"],"names":["SearchForm","headerTitle","children","defaultExpanded","handleSubmit","onSubmitSearch","onClickClear","handleClear","handle","data","jsxs","Accordion","styles","jsx","AccordionSummary","ExpandMore","AccordionDetails","FlexButtons","Button","Search"],"mappings":";;;;;;;;;;GAsBaA,IAAa,CAAsC;AAAA,EAC9D,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,cAAAC;AACF,MAAgB;AACd,QAAMC,IAAc,MAAM;AACxB,IAAID,KACFA,EAAA;AAAA,EAEJ,GAEME,IAASJ,EAAa,CAACK,MAAS;AACpC,IAAAJ,EAAeI,CAAI;AAAA,EACrB,CAAC;AAED,SACE,gBAAAC,EAACC,GAAA,EAAU,iBAAAR,GAAkC,WAAWS,EAAO,WAC7D,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWF,EAAO;AAAA,QAClB,iBAAc;AAAA,QACd,8BAAaG,GAAA,EAAW;AAAA,QAEvB,UAAAd,KAAe;AAAA,MAAA;AAAA,IAAA;AAAA,IAElB,gBAAAY,EAACG,GAAA,EAAiB,WAAWJ,EAAO,aAClC,UAAA,gBAAAF,EAAC,QAAA,EAAK,WAAWE,EAAO,YAAY,UAAUJ,GAC5C,UAAA;AAAA,MAAA,gBAAAK,EAAC,OAAA,EAAI,WAAWD,EAAO,YAAa,UAAAV,GAAS;AAAA,MAC7C,gBAAAQ,EAACO,GAAA,EAAY,UAAS,YACpB,UAAA;AAAA,QAAA,gBAAAJ;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,SAASX;AAAA,YACT,SAAQ;AAAA,YACR,IAAI;AAAA,cACF,GAAG;AAAA,cACH,YAAY;AAAA,cACZ,OAAO;AAAA,cACP,kBAAkB;AAAA,cAClB,OAAO;AAAA,YAAA;AAAA,YAEV,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAGD,gBAAAM;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,6BAAYC,GAAA,EAAO;AAAA,YACnB,IAAI;AAAA,cACF,YAAY;AAAA,cACZ,OAAO;AAAA,cACP,UAAU,EAAE,YAAY,UAAA;AAAA,cACxB,OAAO;AAAA,YAAA;AAAA,YAEV,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED,EAAA,CACF;AAAA,IAAA,EAAA,CACF,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/SelectBox/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("react/jsx-runtime");require("classnames");const e=require("../../index-CCbJ_2yU.cjs");exports.SelectBox=e.SelectBox;exports.default=e.SelectBox;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("react/jsx-runtime");require("classnames");const e=require("../../index-SHLzSoKB.cjs");exports.SelectBox=e.SelectBox;exports.default=e.SelectBox;
 //# sourceMappingURL=index.cjs.js.map