@jigowatts/jigowatts-ui 1.2.1 → 2.0.0

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

@@ -1 +1 @@
-{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/RadioGroupController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RadioGroupController } from \".\";\n\ndescribe(\"RadioGroupController component\", () => {\n  it(\"renders radio buttons with options and correct default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n    const defaultValue = \"option2\"; // Example of default value\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n        defaultValue={defaultValue}\n      />,\n    );\n\n    // Check if the radio group renders with correct default value\n    const option = options.find((opt) => opt.value === defaultValue);\n    if (option) {\n      // Check if the default value's label is displayed\n      const displayedValue = screen.getByText(option.label);\n      expect(displayedValue).toBeInTheDocument();\n    }\n  });\n\n  it(\"renders without default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n      />,\n    );\n\n    // Check if the radio group renders without any selected value\n    options.forEach((option) => {\n      const radioOption = screen.getByLabelText(option.label);\n      expect(radioOption).not.toBeChecked();\n    });\n  });\n});\n"],"names":["result","renderHook","useForm","control","testName","options","defaultValue","render","jsx","RadioGroupController","option","opt","displayedValue","screen","radioOption"],"mappings":"qJAKA,SAAS,iCAAkC,IAAM,CAC/C,GAAG,+DAAgE,IAAM,CACvE,KAAM,CAAE,OAAAA,CAAO,EAAIC,aAAW,IAAMC,WAAS,EACvC,CAAE,QAAAC,GAAYH,EAAO,QAErBI,EAAW,YACXC,EAAU,CACd,CAAE,MAAO,WAAY,MAAO,SAAU,EACtC,CAAE,MAAO,WAAY,MAAO,SAAU,EACtC,CAAE,MAAO,WAAY,MAAO,SAAU,CACxC,EACMC,EAAe,UAErBC,EAAA,OACEC,EAAA,IAACC,EAAA,qBAAA,CACC,QAAAN,EACA,KAAMC,EACN,QAAAC,EACA,aAAAC,CAAA,CAAA,CAEJ,EAGA,MAAMI,EAASL,EAAQ,KAAMM,GAAQA,EAAI,QAAUL,CAAY,EAC/D,GAAII,EAAQ,CAEV,MAAME,EAAiBC,EAAA,OAAO,UAAUH,EAAO,KAAK,EAC7C,OAAAE,CAAc,EAAE,kBAAkB,CAAA,CAC3C,CACD,EAED,GAAG,gCAAiC,IAAM,CACxC,KAAM,CAAE,OAAAZ,CAAO,EAAIC,aAAW,IAAMC,WAAS,EACvC,CAAE,QAAAC,GAAYH,EAAO,QAErBI,EAAW,YACXC,EAAU,CACd,CAAE,MAAO,WAAY,MAAO,SAAU,EACtC,CAAE,MAAO,WAAY,MAAO,SAAU,EACtC,CAAE,MAAO,WAAY,MAAO,SAAU,CACxC,EAEAE,EAAA,OACEC,EAAA,IAACC,EAAA,qBAAA,CACC,QAAAN,EACA,KAAMC,EACN,QAAAC,CAAA,CAAA,CAEJ,EAGQA,EAAA,QAASK,GAAW,CAC1B,MAAMI,EAAcD,EAAA,OAAO,eAAeH,EAAO,KAAK,EAC/C,OAAAI,CAAW,EAAE,IAAI,YAAY,CAAA,CACrC,CAAA,CACF,CACH,CAAC"}
+{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/RadioGroupController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RadioGroupController } from \".\";\n\ndescribe(\"RadioGroupController component\", () => {\n  it(\"renders radio buttons with options and correct default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n    const defaultValue = \"option2\"; // Example of default value\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n        defaultValue={defaultValue}\n      />,\n    );\n\n    // Check if the radio group renders with correct default value\n    const option = options.find((opt) => opt.value === defaultValue);\n    if (option) {\n      // Check if the default value's label is displayed\n      const displayedValue = screen.getByText(option.label);\n      expect(displayedValue).toBeInTheDocument();\n    }\n  });\n\n  it(\"renders without default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n      />,\n    );\n\n    // Check if the radio group renders without any selected value\n    options.forEach((option) => {\n      const radioOption = screen.getByLabelText(option.label);\n      expect(radioOption).not.toBeChecked();\n    });\n  });\n});\n"],"names":["result","renderHook","useForm","control","testName","options","defaultValue","render","jsx","RadioGroupController","option","opt","displayedValue","screen","radioOption"],"mappings":"qJAKA,SAAS,iCAAkC,IAAM,CAC/C,GAAG,+DAAgE,IAAM,CACvE,KAAM,CAAE,OAAAA,CAAA,EAAWC,aAAW,IAAMC,EAAAA,SAAS,EACvC,CAAE,QAAAC,GAAYH,EAAO,QAErBI,EAAW,YACXC,EAAU,CACd,CAAE,MAAO,WAAY,MAAO,SAAA,EAC5B,CAAE,MAAO,WAAY,MAAO,SAAA,EAC5B,CAAE,MAAO,WAAY,MAAO,SAAA,CAAU,EAElCC,EAAe,UAErBC,EAAAA,OACEC,EAAAA,IAACC,EAAAA,qBAAA,CACC,QAAAN,EACA,KAAMC,EACN,QAAAC,EACA,aAAAC,CAAA,CAAA,CACF,EAIF,MAAMI,EAASL,EAAQ,KAAMM,GAAQA,EAAI,QAAUL,CAAY,EAC/D,GAAII,EAAQ,CAEV,MAAME,EAAiBC,EAAAA,OAAO,UAAUH,EAAO,KAAK,EACpD,OAAOE,CAAc,EAAE,kBAAA,CACzB,CACF,CAAC,EAED,GAAG,gCAAiC,IAAM,CACxC,KAAM,CAAE,OAAAZ,CAAA,EAAWC,aAAW,IAAMC,EAAAA,SAAS,EACvC,CAAE,QAAAC,GAAYH,EAAO,QAErBI,EAAW,YACXC,EAAU,CACd,CAAE,MAAO,WAAY,MAAO,SAAA,EAC5B,CAAE,MAAO,WAAY,MAAO,SAAA,EAC5B,CAAE,MAAO,WAAY,MAAO,SAAA,CAAU,EAGxCE,EAAAA,OACEC,EAAAA,IAACC,EAAAA,qBAAA,CACC,QAAAN,EACA,KAAMC,EACN,QAAAC,CAAA,CAAA,CACF,EAIFA,EAAQ,QAASK,GAAW,CAC1B,MAAMI,EAAcD,EAAAA,OAAO,eAAeH,EAAO,KAAK,EACtD,OAAOI,CAAW,EAAE,IAAI,YAAA,CAC1B,CAAC,CACH,CAAC,CACH,CAAC"}

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

@@ -1,5 +1,5 @@
 import { jsx as i } from "react/jsx-runtime";
-import { a as s, r as p, s as c } from "../../react.esm-2FJSSo-S.js";
+import { a as s, r as p, s as c } from "../../react.esm-DVhZgPrH.js";
 import { useForm as u } from "react-hook-form";
 import { RadioGroupController as d } from "./index.es.js";
 describe("RadioGroupController component", () => {

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

@@ -1 +1 @@
-{"version":3,"file":"index.test.es.js","sources":["../../../src/components/RadioGroupController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RadioGroupController } from \".\";\n\ndescribe(\"RadioGroupController component\", () => {\n  it(\"renders radio buttons with options and correct default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n    const defaultValue = \"option2\"; // Example of default value\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n        defaultValue={defaultValue}\n      />,\n    );\n\n    // Check if the radio group renders with correct default value\n    const option = options.find((opt) => opt.value === defaultValue);\n    if (option) {\n      // Check if the default value's label is displayed\n      const displayedValue = screen.getByText(option.label);\n      expect(displayedValue).toBeInTheDocument();\n    }\n  });\n\n  it(\"renders without default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n      />,\n    );\n\n    // Check if the radio group renders without any selected value\n    options.forEach((option) => {\n      const radioOption = screen.getByLabelText(option.label);\n      expect(radioOption).not.toBeChecked();\n    });\n  });\n});\n"],"names":["result","renderHook","useForm","control","testName","options","defaultValue","render","jsx","RadioGroupController","option","opt","displayedValue","screen","radioOption"],"mappings":";;;;AAKA,SAAS,kCAAkC,MAAM;AAC/C,KAAG,gEAAgE,MAAM;AACvE,UAAM,EAAE,QAAAA,EAAO,IAAIC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,MAAYH,EAAO,SAErBI,IAAW,aACXC,IAAU;AAAA,MACd,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,MACtC,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,MACtC,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,IACxC,GACMC,IAAe;AAErB,IAAAC;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAN;AAAA,UACA,MAAMC;AAAA,UACN,SAAAC;AAAA,UACA,cAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ;AAGA,UAAMI,IAASL,EAAQ,KAAK,CAACM,MAAQA,EAAI,UAAUL,CAAY;AAC/D,QAAII,GAAQ;AAEV,YAAME,IAAiBC,EAAO,UAAUH,EAAO,KAAK;AAC7C,aAAAE,CAAc,EAAE,kBAAkB;AAAA,IAAA;AAAA,EAC3C,CACD,GAED,GAAG,iCAAiC,MAAM;AACxC,UAAM,EAAE,QAAAZ,EAAO,IAAIC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,MAAYH,EAAO,SAErBI,IAAW,aACXC,IAAU;AAAA,MACd,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,MACtC,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,MACtC,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,IACxC;AAEA,IAAAE;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAN;AAAA,UACA,MAAMC;AAAA,UACN,SAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ,GAGQA,EAAA,QAAQ,CAACK,MAAW;AAC1B,YAAMI,IAAcD,EAAO,eAAeH,EAAO,KAAK;AAC/C,aAAAI,CAAW,EAAE,IAAI,YAAY;AAAA,IAAA,CACrC;AAAA,EAAA,CACF;AACH,CAAC;"}
+{"version":3,"file":"index.test.es.js","sources":["../../../src/components/RadioGroupController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RadioGroupController } from \".\";\n\ndescribe(\"RadioGroupController component\", () => {\n  it(\"renders radio buttons with options and correct default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n    const defaultValue = \"option2\"; // Example of default value\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n        defaultValue={defaultValue}\n      />,\n    );\n\n    // Check if the radio group renders with correct default value\n    const option = options.find((opt) => opt.value === defaultValue);\n    if (option) {\n      // Check if the default value's label is displayed\n      const displayedValue = screen.getByText(option.label);\n      expect(displayedValue).toBeInTheDocument();\n    }\n  });\n\n  it(\"renders without default value\", () => {\n    const { result } = renderHook(() => useForm());\n    const { control } = result.current;\n\n    const testName = \"TestRadio\";\n    const options = [\n      { label: \"Option 1\", value: \"option1\" },\n      { label: \"Option 2\", value: \"option2\" },\n      { label: \"Option 3\", value: \"option3\" },\n    ];\n\n    render(\n      <RadioGroupController\n        control={control}\n        name={testName}\n        options={options}\n      />,\n    );\n\n    // Check if the radio group renders without any selected value\n    options.forEach((option) => {\n      const radioOption = screen.getByLabelText(option.label);\n      expect(radioOption).not.toBeChecked();\n    });\n  });\n});\n"],"names":["result","renderHook","useForm","control","testName","options","defaultValue","render","jsx","RadioGroupController","option","opt","displayedValue","screen","radioOption"],"mappings":";;;;AAKA,SAAS,kCAAkC,MAAM;AAC/C,KAAG,gEAAgE,MAAM;AACvE,UAAM,EAAE,QAAAA,EAAA,IAAWC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,MAAYH,EAAO,SAErBI,IAAW,aACXC,IAAU;AAAA,MACd,EAAE,OAAO,YAAY,OAAO,UAAA;AAAA,MAC5B,EAAE,OAAO,YAAY,OAAO,UAAA;AAAA,MAC5B,EAAE,OAAO,YAAY,OAAO,UAAA;AAAA,IAAU,GAElCC,IAAe;AAErB,IAAAC;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAN;AAAA,UACA,MAAMC;AAAA,UACN,SAAAC;AAAA,UACA,cAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAIF,UAAMI,IAASL,EAAQ,KAAK,CAACM,MAAQA,EAAI,UAAUL,CAAY;AAC/D,QAAII,GAAQ;AAEV,YAAME,IAAiBC,EAAO,UAAUH,EAAO,KAAK;AACpD,aAAOE,CAAc,EAAE,kBAAA;AAAA,IACzB;AAAA,EACF,CAAC,GAED,GAAG,iCAAiC,MAAM;AACxC,UAAM,EAAE,QAAAZ,EAAA,IAAWC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,MAAYH,EAAO,SAErBI,IAAW,aACXC,IAAU;AAAA,MACd,EAAE,OAAO,YAAY,OAAO,UAAA;AAAA,MAC5B,EAAE,OAAO,YAAY,OAAO,UAAA;AAAA,MAC5B,EAAE,OAAO,YAAY,OAAO,UAAA;AAAA,IAAU;AAGxC,IAAAE;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAN;AAAA,UACA,MAAMC;AAAA,UACN,SAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IACF,GAIFA,EAAQ,QAAQ,CAACK,MAAW;AAC1B,YAAMI,IAAcD,EAAO,eAAeH,EAAO,KAAK;AACtD,aAAOI,CAAW,EAAE,IAAI,YAAA;AAAA,IAC1B,CAAC;AAAA,EACH,CAAC;AACH,CAAC;"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../src/components/RangeDatePicker/index.tsx"],"sourcesContent":["import { type Dispatch, type SetStateAction } from \"react\";\nimport { DatePicker, LocalizationProvider } from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport ja from \"date-fns/locale/ja\";\n\nimport styles from \"./index.module.scss\";\n\nexport type RangeDatePickerInfo = {\n  id: string;\n  name: string;\n  valueState: Date | null;\n  setValue: Dispatch<SetStateAction<Date | null>>;\n};\ntype Props = {\n  fromDateInfo: RangeDatePickerInfo;\n  toDateInfo: RangeDatePickerInfo;\n};\n\nexport const RangeDatePicker = (props: Props) => {\n  const { fromDateInfo, toDateInfo } = props;\n\n  return (\n    <LocalizationProvider dateAdapter={AdapterDateFns} adapterLocale={ja}>\n      <div className={styles.rangeContainer}>\n        <DatePicker\n          maxDate={new Date()}\n          value={fromDateInfo.valueState}\n          onChange={(newValue) => fromDateInfo.setValue(newValue)}\n        />\n        ~\n        <DatePicker\n          maxDate={new Date()}\n          value={toDateInfo.valueState}\n          onChange={(newValue) => toDateInfo.setValue(newValue)}\n        />\n      </div>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePicker;\n"],"names":["RangeDatePicker","props","fromDateInfo","toDateInfo","jsx","LocalizationProvider","AdapterDateFns","ja","jsxs","styles","DatePicker","newValue"],"mappings":"mTAkBaA,EAAmBC,GAAiB,CACzC,KAAA,CAAE,aAAAC,EAAc,WAAAC,CAAA,EAAeF,EAGnC,OAAAG,EAAAA,IAACC,EAAAA,qBAAqB,CAAA,YAAaC,EAAgB,eAAA,cAAeC,EAChE,SAACC,EAAA,KAAA,MAAA,CAAI,UAAWC,EAAO,eACrB,SAAA,CAAAL,EAAA,IAACM,EAAA,WAAA,CACC,YAAa,KACb,MAAOR,EAAa,WACpB,SAAWS,GAAaT,EAAa,SAASS,CAAQ,CAAA,CACxD,EAAE,IAEFP,EAAA,IAACM,EAAA,WAAA,CACC,YAAa,KACb,MAAOP,EAAW,WAClB,SAAWQ,GAAaR,EAAW,SAASQ,CAAQ,CAAA,CAAA,CACtD,CAAA,CACF,CACF,CAAA,CAEJ"}
+{"version":3,"file":"index.cjs.js","sources":["../../../src/components/RangeDatePicker/index.tsx"],"sourcesContent":["import { type Dispatch, type SetStateAction } from \"react\";\nimport { DatePicker, LocalizationProvider } from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport ja from \"date-fns/locale/ja\";\n\nimport styles from \"./index.module.scss\";\n\nexport type RangeDatePickerInfo = {\n  id: string;\n  name: string;\n  valueState: Date | null;\n  setValue: Dispatch<SetStateAction<Date | null>>;\n};\ntype Props = {\n  fromDateInfo: RangeDatePickerInfo;\n  toDateInfo: RangeDatePickerInfo;\n};\n\nexport const RangeDatePicker = (props: Props) => {\n  const { fromDateInfo, toDateInfo } = props;\n\n  return (\n    <LocalizationProvider dateAdapter={AdapterDateFns} adapterLocale={ja}>\n      <div className={styles.rangeContainer}>\n        <DatePicker\n          maxDate={new Date()}\n          value={fromDateInfo.valueState}\n          onChange={(newValue) => fromDateInfo.setValue(newValue)}\n        />\n        ~\n        <DatePicker\n          maxDate={new Date()}\n          value={toDateInfo.valueState}\n          onChange={(newValue) => toDateInfo.setValue(newValue)}\n        />\n      </div>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePicker;\n"],"names":["RangeDatePicker","props","fromDateInfo","toDateInfo","jsx","LocalizationProvider","AdapterDateFns","ja","jsxs","styles","DatePicker","newValue"],"mappings":"mTAkBaA,EAAmBC,GAAiB,CAC/C,KAAM,CAAE,aAAAC,EAAc,WAAAC,CAAA,EAAeF,EAErC,OACEG,EAAAA,IAACC,EAAAA,qBAAA,CAAqB,YAAaC,EAAAA,eAAgB,cAAeC,EAChE,SAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAO,eACrB,SAAA,CAAAL,EAAAA,IAACM,EAAAA,WAAA,CACC,YAAa,KACb,MAAOR,EAAa,WACpB,SAAWS,GAAaT,EAAa,SAASS,CAAQ,CAAA,CAAA,EACtD,IAEFP,EAAAA,IAACM,EAAAA,WAAA,CACC,YAAa,KACb,MAAOP,EAAW,WAClB,SAAWQ,GAAaR,EAAW,SAASQ,CAAQ,CAAA,CAAA,CACtD,CAAA,CACF,CAAA,CACF,CAEJ"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../src/components/RangeDatePicker/index.tsx"],"sourcesContent":["import { type Dispatch, type SetStateAction } from \"react\";\nimport { DatePicker, LocalizationProvider } from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport ja from \"date-fns/locale/ja\";\n\nimport styles from \"./index.module.scss\";\n\nexport type RangeDatePickerInfo = {\n  id: string;\n  name: string;\n  valueState: Date | null;\n  setValue: Dispatch<SetStateAction<Date | null>>;\n};\ntype Props = {\n  fromDateInfo: RangeDatePickerInfo;\n  toDateInfo: RangeDatePickerInfo;\n};\n\nexport const RangeDatePicker = (props: Props) => {\n  const { fromDateInfo, toDateInfo } = props;\n\n  return (\n    <LocalizationProvider dateAdapter={AdapterDateFns} adapterLocale={ja}>\n      <div className={styles.rangeContainer}>\n        <DatePicker\n          maxDate={new Date()}\n          value={fromDateInfo.valueState}\n          onChange={(newValue) => fromDateInfo.setValue(newValue)}\n        />\n        ~\n        <DatePicker\n          maxDate={new Date()}\n          value={toDateInfo.valueState}\n          onChange={(newValue) => toDateInfo.setValue(newValue)}\n        />\n      </div>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePicker;\n"],"names":["RangeDatePicker","props","fromDateInfo","toDateInfo","jsx","LocalizationProvider","AdapterDateFns","ja","jsxs","styles","DatePicker","newValue"],"mappings":";;;;;;GAkBaA,IAAkB,CAACC,MAAiB;AACzC,QAAA,EAAE,cAAAC,GAAc,YAAAC,EAAA,IAAeF;AAGnC,SAAA,gBAAAG,EAACC,GAAqB,EAAA,aAAaC,GAAgB,eAAeC,GAChE,UAAC,gBAAAC,EAAA,OAAA,EAAI,WAAWC,EAAO,gBACrB,UAAA;AAAA,IAAA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,6BAAa,KAAK;AAAA,QAClB,OAAOR,EAAa;AAAA,QACpB,UAAU,CAACS,MAAaT,EAAa,SAASS,CAAQ;AAAA,MAAA;AAAA,IACxD;AAAA,IAAE;AAAA,IAEF,gBAAAP;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,6BAAa,KAAK;AAAA,QAClB,OAAOP,EAAW;AAAA,QAClB,UAAU,CAACQ,MAAaR,EAAW,SAASQ,CAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,EACtD,EAAA,CACF,EACF,CAAA;AAEJ;"}
+{"version":3,"file":"index.es.js","sources":["../../../src/components/RangeDatePicker/index.tsx"],"sourcesContent":["import { type Dispatch, type SetStateAction } from \"react\";\nimport { DatePicker, LocalizationProvider } from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport ja from \"date-fns/locale/ja\";\n\nimport styles from \"./index.module.scss\";\n\nexport type RangeDatePickerInfo = {\n  id: string;\n  name: string;\n  valueState: Date | null;\n  setValue: Dispatch<SetStateAction<Date | null>>;\n};\ntype Props = {\n  fromDateInfo: RangeDatePickerInfo;\n  toDateInfo: RangeDatePickerInfo;\n};\n\nexport const RangeDatePicker = (props: Props) => {\n  const { fromDateInfo, toDateInfo } = props;\n\n  return (\n    <LocalizationProvider dateAdapter={AdapterDateFns} adapterLocale={ja}>\n      <div className={styles.rangeContainer}>\n        <DatePicker\n          maxDate={new Date()}\n          value={fromDateInfo.valueState}\n          onChange={(newValue) => fromDateInfo.setValue(newValue)}\n        />\n        ~\n        <DatePicker\n          maxDate={new Date()}\n          value={toDateInfo.valueState}\n          onChange={(newValue) => toDateInfo.setValue(newValue)}\n        />\n      </div>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePicker;\n"],"names":["RangeDatePicker","props","fromDateInfo","toDateInfo","jsx","LocalizationProvider","AdapterDateFns","ja","jsxs","styles","DatePicker","newValue"],"mappings":";;;;;;GAkBaA,IAAkB,CAACC,MAAiB;AAC/C,QAAM,EAAE,cAAAC,GAAc,YAAAC,EAAA,IAAeF;AAErC,SACE,gBAAAG,EAACC,GAAA,EAAqB,aAAaC,GAAgB,eAAeC,GAChE,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,gBACrB,UAAA;AAAA,IAAA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,6BAAa,KAAA;AAAA,QACb,OAAOR,EAAa;AAAA,QACpB,UAAU,CAACS,MAAaT,EAAa,SAASS,CAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,IACtD;AAAA,IAEF,gBAAAP;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,6BAAa,KAAA;AAAA,QACb,OAAOP,EAAW;AAAA,QAClB,UAAU,CAACQ,MAAaR,EAAW,SAASQ,CAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,EACtD,EAAA,CACF,EAAA,CACF;AAEJ;"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../src/components/RangeDatePickerController/index.tsx"],"sourcesContent":["import { Grid } from \"@mui/material\";\nimport {\n  DateTimePicker,\n  PickersActionBarAction,\n  type DateOrTimeView,\n} from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport { jaJP } from \"@mui/x-date-pickers/locales\";\nimport { LocalizationProvider } from \"@mui/x-date-pickers/LocalizationProvider\";\nimport { parse, set } from \"date-fns\";\nimport ja from \"date-fns/locale/ja\";\nimport {\n  Controller,\n  type Control,\n  type FieldValues,\n  type UseFormSetValue,\n} from \"react-hook-form\";\n\nimport { DATETIME_FORMAT } from \"@/constants/datetime\";\n\nexport type PickerInfo = {\n  name: string;\n  defaultValue?: string | undefined | null;\n};\n\ntype Props = {\n  control: Control;\n  fromDateInfo: PickerInfo;\n  toDateInfo: PickerInfo;\n  dateFormat: string;\n  setValue: UseFormSetValue<FieldValues>;\n};\n\nconst pickerStyles = {\n  \".MuiButtonBase-root\": {\n    padding: 0.5,\n    paddingLeft: 0,\n  },\n  \"& input::placeholder\": {\n    fontSize: \"x-small\",\n  },\n};\n\nconst pickerActions: PickersActionBarAction[] = [\"clear\", \"accept\"];\n\n/**\n * Date,DateTimeをを選択できるコンポーネント\n * dateFormatに合わせてpickerViewを生成します。\n * @param props\n * @returns\n */\nexport const RangeDatePickerController = (props: Props) => {\n  const { control, fromDateInfo, toDateInfo, dateFormat, setValue } = props;\n\n  /**\n   * 受信した値を適切な日付またはnullに変換します。\n   * @param value ユーザーによる値、呼び出し側からセットされた値\n   * @param pickerInfo 紐づくpickerの情報\n   * @returns\n   */\n  const convertValue = (\n    value: string | Date | null,\n    pickerInfo: PickerInfo,\n  ): Date | null => {\n    const newValue = value\n      ? value instanceof Date\n        ? value\n        : typeof value === \"string\"\n          ? parse(value, dateFormat, new Date())\n          : null\n      : null;\n    // NOTE:呼び出し側からはstringがセットされる可能性が高いため、変換後controlに紐付けvalueも置き換えます。\n    if (typeof value === \"string\") {\n      setValue(pickerInfo.name, newValue);\n    }\n    return newValue;\n  };\n\n  const handleOnchange = (value: Date | null, pickerInfo: PickerInfo) => {\n    setValue(pickerInfo.name, value ?? pickerInfo.defaultValue, {\n      shouldDirty: true,\n    });\n  };\n\n  const views: DateOrTimeView[] = (() => {\n    const v: DateOrTimeView[] = [];\n\n    if (dateFormat.includes(\"yyyy\")) {\n      v.push(\"year\");\n    }\n    if (dateFormat.includes(\"MM\")) {\n      v.push(\"month\");\n    }\n    if (dateFormat.includes(\"dd\")) {\n      v.push(\"day\");\n    }\n    if (dateFormat.includes(\"HH\")) {\n      v.push(\"hours\");\n    }\n    if (dateFormat.includes(\"mm\")) {\n      v.push(\"minutes\");\n    }\n    if (dateFormat.includes(\"ss\")) {\n      v.push(\"seconds\");\n    }\n    return v;\n  })();\n\n  return (\n    <LocalizationProvider\n      dateAdapter={AdapterDateFns}\n      adapterLocale={ja}\n      localeText={\n        jaJP.components.MuiLocalizationProvider.defaultProps.localeText\n      }\n    >\n      <Grid container alignItems=\"center\" rowSpacing={1} columnSpacing={1}>\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={fromDateInfo.name}\n            defaultValue={fromDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, fromDateInfo)}\n                onChange={(newDate) => {\n                  handleOnchange(newDate, fromDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n        <Grid item xs={0.6} sm={0.6} md={0.6} lg={0.6} textAlign=\"center\">\n          ~\n        </Grid>\n        {/* <Grid item xs={1} sm={0} lg={0}>\n          <></>\n        </Grid> */}\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={toDateInfo.name}\n            defaultValue={toDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, toDateInfo)}\n                onChange={(newDate) => {\n                  // NOTE: 値がない状態からh日付をを入力した場合に限りto入力部だけデフォルトで23:59:59が入るようにします。\n                  if (\n                    dateFormat === DATETIME_FORMAT &&\n                    newDate !== null &&\n                    !field.value\n                  ) {\n                    newDate = set(newDate, {\n                      hours: 23,\n                      minutes: 59,\n                      seconds: 59,\n                    });\n                  }\n                  handleOnchange(newDate, toDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n      </Grid>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePickerController;"],"names":["pickerStyles","pickerActions","RangeDatePickerController","props","control","fromDateInfo","toDateInfo","dateFormat","setValue","convertValue","value","pickerInfo","newValue","parse","handleOnchange","views","v","jsx","LocalizationProvider","AdapterDateFns","ja","jaJP","jsxs","Grid","Controller","field","fieldState","DateTimePicker","newDate","_a","DATETIME_FORMAT","set"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["../../../src/components/RangeDatePickerController/index.tsx"],"sourcesContent":["import { Grid } from \"@mui/material\";\nimport {\n  DateTimePicker,\n  PickersActionBarAction,\n  type DateOrTimeView,\n} from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport { jaJP } from \"@mui/x-date-pickers/locales\";\nimport { LocalizationProvider } from \"@mui/x-date-pickers/LocalizationProvider\";\nimport { parse, set } from \"date-fns\";\nimport ja from \"date-fns/locale/ja\";\nimport {\n  Controller,\n  type Control,\n  type FieldValues,\n  type UseFormSetValue,\n} from \"react-hook-form\";\n\nimport { DATETIME_FORMAT } from \"@/constants/datetime\";\n\nexport type PickerInfo = {\n  name: string;\n  defaultValue?: string | undefined | null;\n};\n\ntype Props = {\n  control: Control;\n  fromDateInfo: PickerInfo;\n  toDateInfo: PickerInfo;\n  dateFormat: string;\n  setValue: UseFormSetValue<FieldValues>;\n};\n\nconst pickerStyles = {\n  \".MuiButtonBase-root\": {\n    padding: 0.5,\n    paddingLeft: 0,\n  },\n  \"& input::placeholder\": {\n    fontSize: \"x-small\",\n  },\n};\n\nconst pickerActions: PickersActionBarAction[] = [\"clear\", \"accept\"];\n\n/**\n * Date,DateTimeをを選択できるコンポーネント\n * dateFormatに合わせてpickerViewを生成します。\n * @param props\n * @returns\n */\nexport const RangeDatePickerController = (props: Props) => {\n  const { control, fromDateInfo, toDateInfo, dateFormat, setValue } = props;\n\n  /**\n   * 受信した値を適切な日付またはnullに変換します。\n   * @param value ユーザーによる値、呼び出し側からセットされた値\n   * @param pickerInfo 紐づくpickerの情報\n   * @returns\n   */\n  const convertValue = (\n    value: string | Date | null,\n    pickerInfo: PickerInfo,\n  ): Date | null => {\n    const newValue = value\n      ? value instanceof Date\n        ? value\n        : typeof value === \"string\"\n          ? parse(value, dateFormat, new Date())\n          : null\n      : null;\n    // NOTE:呼び出し側からはstringがセットされる可能性が高いため、変換後controlに紐付けvalueも置き換えます。\n    if (typeof value === \"string\") {\n      setValue(pickerInfo.name, newValue);\n    }\n    return newValue;\n  };\n\n  const handleOnchange = (value: Date | null, pickerInfo: PickerInfo) => {\n    setValue(pickerInfo.name, value ?? pickerInfo.defaultValue, {\n      shouldDirty: true,\n    });\n  };\n\n  const views: DateOrTimeView[] = (() => {\n    const v: DateOrTimeView[] = [];\n\n    if (dateFormat.includes(\"yyyy\")) {\n      v.push(\"year\");\n    }\n    if (dateFormat.includes(\"MM\")) {\n      v.push(\"month\");\n    }\n    if (dateFormat.includes(\"dd\")) {\n      v.push(\"day\");\n    }\n    if (dateFormat.includes(\"HH\")) {\n      v.push(\"hours\");\n    }\n    if (dateFormat.includes(\"mm\")) {\n      v.push(\"minutes\");\n    }\n    if (dateFormat.includes(\"ss\")) {\n      v.push(\"seconds\");\n    }\n    return v;\n  })();\n\n  return (\n    <LocalizationProvider\n      dateAdapter={AdapterDateFns}\n      adapterLocale={ja}\n      localeText={\n        jaJP.components.MuiLocalizationProvider.defaultProps.localeText\n      }\n    >\n      <Grid container alignItems=\"center\" rowSpacing={1} columnSpacing={1}>\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={fromDateInfo.name}\n            defaultValue={fromDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, fromDateInfo)}\n                onChange={(newDate) => {\n                  handleOnchange(newDate, fromDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n        <Grid item xs={0.6} sm={0.6} md={0.6} lg={0.6} textAlign=\"center\">\n          ~\n        </Grid>\n        {/* <Grid item xs={1} sm={0} lg={0}>\n          <></>\n        </Grid> */}\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={toDateInfo.name}\n            defaultValue={toDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, toDateInfo)}\n                onChange={(newDate) => {\n                  // NOTE: 値がない状態からh日付をを入力した場合に限りto入力部だけデフォルトで23:59:59が入るようにします。\n                  if (\n                    dateFormat === DATETIME_FORMAT &&\n                    newDate !== null &&\n                    !field.value\n                  ) {\n                    newDate = set(newDate, {\n                      hours: 23,\n                      minutes: 59,\n                      seconds: 59,\n                    });\n                  }\n                  handleOnchange(newDate, toDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n      </Grid>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePickerController;\n"],"names":["pickerStyles","pickerActions","RangeDatePickerController","props","control","fromDateInfo","toDateInfo","dateFormat","setValue","convertValue","value","pickerInfo","newValue","parse","handleOnchange","views","v","jsx","LocalizationProvider","AdapterDateFns","ja","jaJP","jsxs","Grid","Controller","field","fieldState","DateTimePicker","newDate","_a","DATETIME_FORMAT","set"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../src/components/RangeDatePickerController/index.tsx"],"sourcesContent":["import { Grid } from \"@mui/material\";\nimport {\n  DateTimePicker,\n  PickersActionBarAction,\n  type DateOrTimeView,\n} from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport { jaJP } from \"@mui/x-date-pickers/locales\";\nimport { LocalizationProvider } from \"@mui/x-date-pickers/LocalizationProvider\";\nimport { parse, set } from \"date-fns\";\nimport ja from \"date-fns/locale/ja\";\nimport {\n  Controller,\n  type Control,\n  type FieldValues,\n  type UseFormSetValue,\n} from \"react-hook-form\";\n\nimport { DATETIME_FORMAT } from \"@/constants/datetime\";\n\nexport type PickerInfo = {\n  name: string;\n  defaultValue?: string | undefined | null;\n};\n\ntype Props = {\n  control: Control;\n  fromDateInfo: PickerInfo;\n  toDateInfo: PickerInfo;\n  dateFormat: string;\n  setValue: UseFormSetValue<FieldValues>;\n};\n\nconst pickerStyles = {\n  \".MuiButtonBase-root\": {\n    padding: 0.5,\n    paddingLeft: 0,\n  },\n  \"& input::placeholder\": {\n    fontSize: \"x-small\",\n  },\n};\n\nconst pickerActions: PickersActionBarAction[] = [\"clear\", \"accept\"];\n\n/**\n * Date,DateTimeをを選択できるコンポーネント\n * dateFormatに合わせてpickerViewを生成します。\n * @param props\n * @returns\n */\nexport const RangeDatePickerController = (props: Props) => {\n  const { control, fromDateInfo, toDateInfo, dateFormat, setValue } = props;\n\n  /**\n   * 受信した値を適切な日付またはnullに変換します。\n   * @param value ユーザーによる値、呼び出し側からセットされた値\n   * @param pickerInfo 紐づくpickerの情報\n   * @returns\n   */\n  const convertValue = (\n    value: string | Date | null,\n    pickerInfo: PickerInfo,\n  ): Date | null => {\n    const newValue = value\n      ? value instanceof Date\n        ? value\n        : typeof value === \"string\"\n          ? parse(value, dateFormat, new Date())\n          : null\n      : null;\n    // NOTE:呼び出し側からはstringがセットされる可能性が高いため、変換後controlに紐付けvalueも置き換えます。\n    if (typeof value === \"string\") {\n      setValue(pickerInfo.name, newValue);\n    }\n    return newValue;\n  };\n\n  const handleOnchange = (value: Date | null, pickerInfo: PickerInfo) => {\n    setValue(pickerInfo.name, value ?? pickerInfo.defaultValue, {\n      shouldDirty: true,\n    });\n  };\n\n  const views: DateOrTimeView[] = (() => {\n    const v: DateOrTimeView[] = [];\n\n    if (dateFormat.includes(\"yyyy\")) {\n      v.push(\"year\");\n    }\n    if (dateFormat.includes(\"MM\")) {\n      v.push(\"month\");\n    }\n    if (dateFormat.includes(\"dd\")) {\n      v.push(\"day\");\n    }\n    if (dateFormat.includes(\"HH\")) {\n      v.push(\"hours\");\n    }\n    if (dateFormat.includes(\"mm\")) {\n      v.push(\"minutes\");\n    }\n    if (dateFormat.includes(\"ss\")) {\n      v.push(\"seconds\");\n    }\n    return v;\n  })();\n\n  return (\n    <LocalizationProvider\n      dateAdapter={AdapterDateFns}\n      adapterLocale={ja}\n      localeText={\n        jaJP.components.MuiLocalizationProvider.defaultProps.localeText\n      }\n    >\n      <Grid container alignItems=\"center\" rowSpacing={1} columnSpacing={1}>\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={fromDateInfo.name}\n            defaultValue={fromDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, fromDateInfo)}\n                onChange={(newDate) => {\n                  handleOnchange(newDate, fromDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n        <Grid item xs={0.6} sm={0.6} md={0.6} lg={0.6} textAlign=\"center\">\n          ~\n        </Grid>\n        {/* <Grid item xs={1} sm={0} lg={0}>\n          <></>\n        </Grid> */}\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={toDateInfo.name}\n            defaultValue={toDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, toDateInfo)}\n                onChange={(newDate) => {\n                  // NOTE: 値がない状態からh日付をを入力した場合に限りto入力部だけデフォルトで23:59:59が入るようにします。\n                  if (\n                    dateFormat === DATETIME_FORMAT &&\n                    newDate !== null &&\n                    !field.value\n                  ) {\n                    newDate = set(newDate, {\n                      hours: 23,\n                      minutes: 59,\n                      seconds: 59,\n                    });\n                  }\n                  handleOnchange(newDate, toDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n      </Grid>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePickerController;"],"names":["pickerStyles","pickerActions","RangeDatePickerController","props","control","fromDateInfo","toDateInfo","dateFormat","setValue","convertValue","value","pickerInfo","newValue","parse","handleOnchange","views","v","jsx","LocalizationProvider","AdapterDateFns","ja","jaJP","jsxs","Grid","Controller","field","fieldState","DateTimePicker","newDate","_a","DATETIME_FORMAT","set"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../../../src/components/RangeDatePickerController/index.tsx"],"sourcesContent":["import { Grid } from \"@mui/material\";\nimport {\n  DateTimePicker,\n  PickersActionBarAction,\n  type DateOrTimeView,\n} from \"@mui/x-date-pickers\";\nimport { AdapterDateFns } from \"@mui/x-date-pickers/AdapterDateFns\";\nimport { jaJP } from \"@mui/x-date-pickers/locales\";\nimport { LocalizationProvider } from \"@mui/x-date-pickers/LocalizationProvider\";\nimport { parse, set } from \"date-fns\";\nimport ja from \"date-fns/locale/ja\";\nimport {\n  Controller,\n  type Control,\n  type FieldValues,\n  type UseFormSetValue,\n} from \"react-hook-form\";\n\nimport { DATETIME_FORMAT } from \"@/constants/datetime\";\n\nexport type PickerInfo = {\n  name: string;\n  defaultValue?: string | undefined | null;\n};\n\ntype Props = {\n  control: Control;\n  fromDateInfo: PickerInfo;\n  toDateInfo: PickerInfo;\n  dateFormat: string;\n  setValue: UseFormSetValue<FieldValues>;\n};\n\nconst pickerStyles = {\n  \".MuiButtonBase-root\": {\n    padding: 0.5,\n    paddingLeft: 0,\n  },\n  \"& input::placeholder\": {\n    fontSize: \"x-small\",\n  },\n};\n\nconst pickerActions: PickersActionBarAction[] = [\"clear\", \"accept\"];\n\n/**\n * Date,DateTimeをを選択できるコンポーネント\n * dateFormatに合わせてpickerViewを生成します。\n * @param props\n * @returns\n */\nexport const RangeDatePickerController = (props: Props) => {\n  const { control, fromDateInfo, toDateInfo, dateFormat, setValue } = props;\n\n  /**\n   * 受信した値を適切な日付またはnullに変換します。\n   * @param value ユーザーによる値、呼び出し側からセットされた値\n   * @param pickerInfo 紐づくpickerの情報\n   * @returns\n   */\n  const convertValue = (\n    value: string | Date | null,\n    pickerInfo: PickerInfo,\n  ): Date | null => {\n    const newValue = value\n      ? value instanceof Date\n        ? value\n        : typeof value === \"string\"\n          ? parse(value, dateFormat, new Date())\n          : null\n      : null;\n    // NOTE:呼び出し側からはstringがセットされる可能性が高いため、変換後controlに紐付けvalueも置き換えます。\n    if (typeof value === \"string\") {\n      setValue(pickerInfo.name, newValue);\n    }\n    return newValue;\n  };\n\n  const handleOnchange = (value: Date | null, pickerInfo: PickerInfo) => {\n    setValue(pickerInfo.name, value ?? pickerInfo.defaultValue, {\n      shouldDirty: true,\n    });\n  };\n\n  const views: DateOrTimeView[] = (() => {\n    const v: DateOrTimeView[] = [];\n\n    if (dateFormat.includes(\"yyyy\")) {\n      v.push(\"year\");\n    }\n    if (dateFormat.includes(\"MM\")) {\n      v.push(\"month\");\n    }\n    if (dateFormat.includes(\"dd\")) {\n      v.push(\"day\");\n    }\n    if (dateFormat.includes(\"HH\")) {\n      v.push(\"hours\");\n    }\n    if (dateFormat.includes(\"mm\")) {\n      v.push(\"minutes\");\n    }\n    if (dateFormat.includes(\"ss\")) {\n      v.push(\"seconds\");\n    }\n    return v;\n  })();\n\n  return (\n    <LocalizationProvider\n      dateAdapter={AdapterDateFns}\n      adapterLocale={ja}\n      localeText={\n        jaJP.components.MuiLocalizationProvider.defaultProps.localeText\n      }\n    >\n      <Grid container alignItems=\"center\" rowSpacing={1} columnSpacing={1}>\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={fromDateInfo.name}\n            defaultValue={fromDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, fromDateInfo)}\n                onChange={(newDate) => {\n                  handleOnchange(newDate, fromDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n        <Grid item xs={0.6} sm={0.6} md={0.6} lg={0.6} textAlign=\"center\">\n          ~\n        </Grid>\n        {/* <Grid item xs={1} sm={0} lg={0}>\n          <></>\n        </Grid> */}\n        <Grid item xs={11.4} sm={5.7} md={11.4} xl={5.7}>\n          <Controller\n            control={control}\n            name={toDateInfo.name}\n            defaultValue={toDateInfo.defaultValue}\n            render={({ field, fieldState }) => (\n              <DateTimePicker\n                {...field}\n                format={dateFormat}\n                views={views}\n                sx={pickerStyles}\n                value={convertValue(field.value, toDateInfo)}\n                onChange={(newDate) => {\n                  // NOTE: 値がない状態からh日付をを入力した場合に限りto入力部だけデフォルトで23:59:59が入るようにします。\n                  if (\n                    dateFormat === DATETIME_FORMAT &&\n                    newDate !== null &&\n                    !field.value\n                  ) {\n                    newDate = set(newDate, {\n                      hours: 23,\n                      minutes: 59,\n                      seconds: 59,\n                    });\n                  }\n                  handleOnchange(newDate, toDateInfo);\n                }}\n                slotProps={{\n                  textField: {\n                    error: !!fieldState.error,\n                    helperText: fieldState.error?.message,\n                    fullWidth: true,\n                  },\n                  // NOTE: clearボタンが文字を隠していまうのでとりあえずcalendar内のもので代用\n                  // field: {\n                  //   clearable: true,\n                  // },\n                  actionBar: { actions: pickerActions },\n                }}\n              />\n            )}\n          />\n        </Grid>\n      </Grid>\n    </LocalizationProvider>\n  );\n};\n\nexport default RangeDatePickerController;\n"],"names":["pickerStyles","pickerActions","RangeDatePickerController","props","control","fromDateInfo","toDateInfo","dateFormat","setValue","convertValue","value","pickerInfo","newValue","parse","handleOnchange","views","v","jsx","LocalizationProvider","AdapterDateFns","ja","jaJP","jsxs","Grid","Controller","field","fieldState","DateTimePicker","newDate","_a","DATETIME_FORMAT","set"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";const o=require("react/jsx-runtime"),e=require("../../react.esm-CiMn0Rnx.cjs"),n=require("react-hook-form"),c=require("./index.cjs.js");describe("RangeDatePickerController component",()=>{it("renders date pickers with correct default values (date-only format)",async()=>{const{result:t}=e.renderHook(()=>n.useForm()),{control:a,setValue:r}=t.current;e.render(o.jsx(c.RangeDatePickerController,{control:a,fromDateInfo:{name:"fromDate",defaultValue:"2024-03-01"},toDateInfo:{name:"toDate",defaultValue:"2024-03-15"},dateFormat:"yyyy-MM-dd",setValue:r}));const s=await e.screen.findByDisplayValue("2024-03-01"),u=await e.screen.findByDisplayValue("2024-03-15");expect(s).toBeInTheDocument(),expect(u).toBeInTheDocument()}),it("renders date pickers with correct default values (datetime format)",async()=>{const{result:t}=e.renderHook(()=>n.useForm()),{control:a,setValue:r}=t.current;e.render(o.jsx(c.RangeDatePickerController,{control:a,fromDateInfo:{name:"fromDate",defaultValue:"2024/03/01 00:00:00"},toDateInfo:{name:"toDate",defaultValue:"2024/03/15 23:59:59"},dateFormat:"yyyy/MM/dd HH:mm:ss",setValue:r})),expect(await e.screen.findByDisplayValue("2024/03/01 00:00:00")).toBeInTheDocument(),expect(await e.screen.findByDisplayValue("2024/03/15 23:59:59")).toBeInTheDocument()})});
+"use strict";const o=require("react/jsx-runtime"),e=require("../../react.esm-BcRJ42eI.cjs"),n=require("react-hook-form"),c=require("./index.cjs.js");describe("RangeDatePickerController component",()=>{it("renders date pickers with correct default values (date-only format)",async()=>{const{result:t}=e.renderHook(()=>n.useForm()),{control:a,setValue:r}=t.current;e.render(o.jsx(c.RangeDatePickerController,{control:a,fromDateInfo:{name:"fromDate",defaultValue:"2024-03-01"},toDateInfo:{name:"toDate",defaultValue:"2024-03-15"},dateFormat:"yyyy-MM-dd",setValue:r}));const s=await e.screen.findByDisplayValue("2024-03-01"),u=await e.screen.findByDisplayValue("2024-03-15");expect(s).toBeInTheDocument(),expect(u).toBeInTheDocument()}),it("renders date pickers with correct default values (datetime format)",async()=>{const{result:t}=e.renderHook(()=>n.useForm()),{control:a,setValue:r}=t.current;e.render(o.jsx(c.RangeDatePickerController,{control:a,fromDateInfo:{name:"fromDate",defaultValue:"2024/03/01 00:00:00"},toDateInfo:{name:"toDate",defaultValue:"2024/03/15 23:59:59"},dateFormat:"yyyy/MM/dd HH:mm:ss",setValue:r})),expect(await e.screen.findByDisplayValue("2024/03/01 00:00:00")).toBeInTheDocument(),expect(await e.screen.findByDisplayValue("2024/03/15 23:59:59")).toBeInTheDocument()})});
 //# sourceMappingURL=index.test.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/RangeDatePickerController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RangeDatePickerController } from \".\";\n\ndescribe(\"RangeDatePickerController component\", () => {\n  it(\"renders date pickers with correct default values (date-only format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{ name: \"fromDate\", defaultValue: \"2024-03-01\" }}\n        toDateInfo={{ name: \"toDate\", defaultValue: \"2024-03-15\" }}\n        dateFormat=\"yyyy-MM-dd\"\n        setValue={setValue}\n      />,\n    );\n\n    const fromDateInput = await screen.findByDisplayValue(\"2024-03-01\");\n    const toDateInput = await screen.findByDisplayValue(\"2024-03-15\");\n\n    expect(fromDateInput).toBeInTheDocument();\n    expect(toDateInput).toBeInTheDocument();\n  });\n\n  it(\"renders date pickers with correct default values (datetime format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{\n          name: \"fromDate\",\n          defaultValue: \"2024/03/01 00:00:00\",\n        }}\n        toDateInfo={{\n          name: \"toDate\",\n          defaultValue: \"2024/03/15 23:59:59\",\n        }}\n        dateFormat=\"yyyy/MM/dd HH:mm:ss\"\n        setValue={setValue}\n      />,\n    );\n\n    expect(\n      await screen.findByDisplayValue(\"2024/03/01 00:00:00\"),\n    ).toBeInTheDocument();\n    expect(\n      await screen.findByDisplayValue(\"2024/03/15 23:59:59\"),\n    ).toBeInTheDocument();\n  });\n});\n"],"names":["result","renderHook","useForm","control","setValue","render","jsx","RangeDatePickerController","fromDateInput","screen","toDateInput"],"mappings":"qJAKA,SAAS,sCAAuC,IAAM,CACpD,GAAG,sEAAuE,SAAY,CACpF,KAAM,CAAE,OAAAA,CAAO,EAAIC,aAAW,IAAMC,WAAS,EACvC,CAAE,QAAAC,EAAS,SAAAC,CAAS,EAAIJ,EAAO,QAErCK,EAAA,OACEC,EAAA,IAACC,EAAA,0BAAA,CACC,QAAAJ,EACA,aAAc,CAAE,KAAM,WAAY,aAAc,YAAa,EAC7D,WAAY,CAAE,KAAM,SAAU,aAAc,YAAa,EACzD,WAAW,aACX,SAAAC,CAAA,CAAA,CAEJ,EAEA,MAAMI,EAAgB,MAAMC,SAAO,mBAAmB,YAAY,EAC5DC,EAAc,MAAMD,SAAO,mBAAmB,YAAY,EAEzD,OAAAD,CAAa,EAAE,kBAAkB,EACjC,OAAAE,CAAW,EAAE,kBAAkB,CAAA,CACvC,EAED,GAAG,qEAAsE,SAAY,CACnF,KAAM,CAAE,OAAAV,CAAO,EAAIC,aAAW,IAAMC,WAAS,EACvC,CAAE,QAAAC,EAAS,SAAAC,CAAS,EAAIJ,EAAO,QAErCK,EAAA,OACEC,EAAA,IAACC,EAAA,0BAAA,CACC,QAAAJ,EACA,aAAc,CACZ,KAAM,WACN,aAAc,qBAChB,EACA,WAAY,CACV,KAAM,SACN,aAAc,qBAChB,EACA,WAAW,sBACX,SAAAC,CAAA,CAAA,CAEJ,EAEA,OACE,MAAMK,EAAAA,OAAO,mBAAmB,qBAAqB,GACrD,kBAAkB,EACpB,OACE,MAAMA,EAAAA,OAAO,mBAAmB,qBAAqB,GACrD,kBAAkB,CAAA,CACrB,CACH,CAAC"}
+{"version":3,"file":"index.test.cjs.js","sources":["../../../src/components/RangeDatePickerController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RangeDatePickerController } from \".\";\n\ndescribe(\"RangeDatePickerController component\", () => {\n  it(\"renders date pickers with correct default values (date-only format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{ name: \"fromDate\", defaultValue: \"2024-03-01\" }}\n        toDateInfo={{ name: \"toDate\", defaultValue: \"2024-03-15\" }}\n        dateFormat=\"yyyy-MM-dd\"\n        setValue={setValue}\n      />,\n    );\n\n    const fromDateInput = await screen.findByDisplayValue(\"2024-03-01\");\n    const toDateInput = await screen.findByDisplayValue(\"2024-03-15\");\n\n    expect(fromDateInput).toBeInTheDocument();\n    expect(toDateInput).toBeInTheDocument();\n  });\n\n  it(\"renders date pickers with correct default values (datetime format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{\n          name: \"fromDate\",\n          defaultValue: \"2024/03/01 00:00:00\",\n        }}\n        toDateInfo={{\n          name: \"toDate\",\n          defaultValue: \"2024/03/15 23:59:59\",\n        }}\n        dateFormat=\"yyyy/MM/dd HH:mm:ss\"\n        setValue={setValue}\n      />,\n    );\n\n    expect(\n      await screen.findByDisplayValue(\"2024/03/01 00:00:00\"),\n    ).toBeInTheDocument();\n    expect(\n      await screen.findByDisplayValue(\"2024/03/15 23:59:59\"),\n    ).toBeInTheDocument();\n  });\n});\n"],"names":["result","renderHook","useForm","control","setValue","render","jsx","RangeDatePickerController","fromDateInput","screen","toDateInput"],"mappings":"qJAKA,SAAS,sCAAuC,IAAM,CACpD,GAAG,sEAAuE,SAAY,CACpF,KAAM,CAAE,OAAAA,CAAA,EAAWC,aAAW,IAAMC,EAAAA,SAAS,EACvC,CAAE,QAAAC,EAAS,SAAAC,CAAA,EAAaJ,EAAO,QAErCK,EAAAA,OACEC,EAAAA,IAACC,EAAAA,0BAAA,CACC,QAAAJ,EACA,aAAc,CAAE,KAAM,WAAY,aAAc,YAAA,EAChD,WAAY,CAAE,KAAM,SAAU,aAAc,YAAA,EAC5C,WAAW,aACX,SAAAC,CAAA,CAAA,CACF,EAGF,MAAMI,EAAgB,MAAMC,SAAO,mBAAmB,YAAY,EAC5DC,EAAc,MAAMD,SAAO,mBAAmB,YAAY,EAEhE,OAAOD,CAAa,EAAE,kBAAA,EACtB,OAAOE,CAAW,EAAE,kBAAA,CACtB,CAAC,EAED,GAAG,qEAAsE,SAAY,CACnF,KAAM,CAAE,OAAAV,CAAA,EAAWC,aAAW,IAAMC,EAAAA,SAAS,EACvC,CAAE,QAAAC,EAAS,SAAAC,CAAA,EAAaJ,EAAO,QAErCK,EAAAA,OACEC,EAAAA,IAACC,EAAAA,0BAAA,CACC,QAAAJ,EACA,aAAc,CACZ,KAAM,WACN,aAAc,qBAAA,EAEhB,WAAY,CACV,KAAM,SACN,aAAc,qBAAA,EAEhB,WAAW,sBACX,SAAAC,CAAA,CAAA,CACF,EAGF,OACE,MAAMK,EAAAA,OAAO,mBAAmB,qBAAqB,CAAA,EACrD,kBAAA,EACF,OACE,MAAMA,EAAAA,OAAO,mBAAmB,qBAAqB,CAAA,EACrD,kBAAA,CACJ,CAAC,CACH,CAAC"}

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

@@ -1,5 +1,5 @@
 import { jsx as r } from "react/jsx-runtime";
-import { a as n, r as s, s as e } from "../../react.esm-2FJSSo-S.js";
+import { a as n, r as s, s as e } from "../../react.esm-DVhZgPrH.js";
 import { useForm as c } from "react-hook-form";
 import { RangeDatePickerController as l } from "./index.es.js";
 describe("RangeDatePickerController component", () => {

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

@@ -1 +1 @@
-{"version":3,"file":"index.test.es.js","sources":["../../../src/components/RangeDatePickerController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RangeDatePickerController } from \".\";\n\ndescribe(\"RangeDatePickerController component\", () => {\n  it(\"renders date pickers with correct default values (date-only format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{ name: \"fromDate\", defaultValue: \"2024-03-01\" }}\n        toDateInfo={{ name: \"toDate\", defaultValue: \"2024-03-15\" }}\n        dateFormat=\"yyyy-MM-dd\"\n        setValue={setValue}\n      />,\n    );\n\n    const fromDateInput = await screen.findByDisplayValue(\"2024-03-01\");\n    const toDateInput = await screen.findByDisplayValue(\"2024-03-15\");\n\n    expect(fromDateInput).toBeInTheDocument();\n    expect(toDateInput).toBeInTheDocument();\n  });\n\n  it(\"renders date pickers with correct default values (datetime format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{\n          name: \"fromDate\",\n          defaultValue: \"2024/03/01 00:00:00\",\n        }}\n        toDateInfo={{\n          name: \"toDate\",\n          defaultValue: \"2024/03/15 23:59:59\",\n        }}\n        dateFormat=\"yyyy/MM/dd HH:mm:ss\"\n        setValue={setValue}\n      />,\n    );\n\n    expect(\n      await screen.findByDisplayValue(\"2024/03/01 00:00:00\"),\n    ).toBeInTheDocument();\n    expect(\n      await screen.findByDisplayValue(\"2024/03/15 23:59:59\"),\n    ).toBeInTheDocument();\n  });\n});\n"],"names":["result","renderHook","useForm","control","setValue","render","jsx","RangeDatePickerController","fromDateInput","screen","toDateInput"],"mappings":";;;;AAKA,SAAS,uCAAuC,MAAM;AACpD,KAAG,uEAAuE,YAAY;AACpF,UAAM,EAAE,QAAAA,EAAO,IAAIC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,GAAS,UAAAC,EAAS,IAAIJ,EAAO;AAErC,IAAAK;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAJ;AAAA,UACA,cAAc,EAAE,MAAM,YAAY,cAAc,aAAa;AAAA,UAC7D,YAAY,EAAE,MAAM,UAAU,cAAc,aAAa;AAAA,UACzD,YAAW;AAAA,UACX,UAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ;AAEA,UAAMI,IAAgB,MAAMC,EAAO,mBAAmB,YAAY,GAC5DC,IAAc,MAAMD,EAAO,mBAAmB,YAAY;AAEzD,WAAAD,CAAa,EAAE,kBAAkB,GACjC,OAAAE,CAAW,EAAE,kBAAkB;AAAA,EAAA,CACvC,GAED,GAAG,sEAAsE,YAAY;AACnF,UAAM,EAAE,QAAAV,EAAO,IAAIC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,GAAS,UAAAC,EAAS,IAAIJ,EAAO;AAErC,IAAAK;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAJ;AAAA,UACA,cAAc;AAAA,YACZ,MAAM;AAAA,YACN,cAAc;AAAA,UAChB;AAAA,UACA,YAAY;AAAA,YACV,MAAM;AAAA,YACN,cAAc;AAAA,UAChB;AAAA,UACA,YAAW;AAAA,UACX,UAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ,GAEA;AAAA,MACE,MAAMK,EAAO,mBAAmB,qBAAqB;AAAA,MACrD,kBAAkB,GACpB;AAAA,MACE,MAAMA,EAAO,mBAAmB,qBAAqB;AAAA,MACrD,kBAAkB;AAAA,EAAA,CACrB;AACH,CAAC;"}
+{"version":3,"file":"index.test.es.js","sources":["../../../src/components/RangeDatePickerController/index.test.tsx"],"sourcesContent":["import { render, renderHook, screen } from \"@testing-library/react\";\nimport { useForm } from \"react-hook-form\";\n\nimport { RangeDatePickerController } from \".\";\n\ndescribe(\"RangeDatePickerController component\", () => {\n  it(\"renders date pickers with correct default values (date-only format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{ name: \"fromDate\", defaultValue: \"2024-03-01\" }}\n        toDateInfo={{ name: \"toDate\", defaultValue: \"2024-03-15\" }}\n        dateFormat=\"yyyy-MM-dd\"\n        setValue={setValue}\n      />,\n    );\n\n    const fromDateInput = await screen.findByDisplayValue(\"2024-03-01\");\n    const toDateInput = await screen.findByDisplayValue(\"2024-03-15\");\n\n    expect(fromDateInput).toBeInTheDocument();\n    expect(toDateInput).toBeInTheDocument();\n  });\n\n  it(\"renders date pickers with correct default values (datetime format)\", async () => {\n    const { result } = renderHook(() => useForm());\n    const { control, setValue } = result.current;\n\n    render(\n      <RangeDatePickerController\n        control={control}\n        fromDateInfo={{\n          name: \"fromDate\",\n          defaultValue: \"2024/03/01 00:00:00\",\n        }}\n        toDateInfo={{\n          name: \"toDate\",\n          defaultValue: \"2024/03/15 23:59:59\",\n        }}\n        dateFormat=\"yyyy/MM/dd HH:mm:ss\"\n        setValue={setValue}\n      />,\n    );\n\n    expect(\n      await screen.findByDisplayValue(\"2024/03/01 00:00:00\"),\n    ).toBeInTheDocument();\n    expect(\n      await screen.findByDisplayValue(\"2024/03/15 23:59:59\"),\n    ).toBeInTheDocument();\n  });\n});\n"],"names":["result","renderHook","useForm","control","setValue","render","jsx","RangeDatePickerController","fromDateInput","screen","toDateInput"],"mappings":";;;;AAKA,SAAS,uCAAuC,MAAM;AACpD,KAAG,uEAAuE,YAAY;AACpF,UAAM,EAAE,QAAAA,EAAA,IAAWC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,GAAS,UAAAC,EAAA,IAAaJ,EAAO;AAErC,IAAAK;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAJ;AAAA,UACA,cAAc,EAAE,MAAM,YAAY,cAAc,aAAA;AAAA,UAChD,YAAY,EAAE,MAAM,UAAU,cAAc,aAAA;AAAA,UAC5C,YAAW;AAAA,UACX,UAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAGF,UAAMI,IAAgB,MAAMC,EAAO,mBAAmB,YAAY,GAC5DC,IAAc,MAAMD,EAAO,mBAAmB,YAAY;AAEhE,WAAOD,CAAa,EAAE,kBAAA,GACtB,OAAOE,CAAW,EAAE,kBAAA;AAAA,EACtB,CAAC,GAED,GAAG,sEAAsE,YAAY;AACnF,UAAM,EAAE,QAAAV,EAAA,IAAWC,EAAW,MAAMC,GAAS,GACvC,EAAE,SAAAC,GAAS,UAAAC,EAAA,IAAaJ,EAAO;AAErC,IAAAK;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAAAJ;AAAA,UACA,cAAc;AAAA,YACZ,MAAM;AAAA,YACN,cAAc;AAAA,UAAA;AAAA,UAEhB,YAAY;AAAA,YACV,MAAM;AAAA,YACN,cAAc;AAAA,UAAA;AAAA,UAEhB,YAAW;AAAA,UACX,UAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IACF,GAGF;AAAA,MACE,MAAMK,EAAO,mBAAmB,qBAAqB;AAAA,IAAA,EACrD,kBAAA,GACF;AAAA,MACE,MAAMA,EAAO,mBAAmB,qBAAqB;AAAA,IAAA,EACrD,kBAAA;AAAA,EACJ,CAAC;AACH,CAAC;"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ReportCard/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport { Box, Card, Grid } from \"@mui/material\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  value: string | ReactNode;\n  label: string | ReactNode;\n  labelPosition?: \"top\" | \"bottom\";\n};\n\n/**\n * ダッシュボード用のレポート表示（値の直接表示）用のカードです。\n * 項目名と値のみを表示します。\n * labelPositionで項目名の表示位置を指定できます。\n */\nexport const ReportCard = (props: Props) => {\n  const { value, label, labelPosition = \"bottom\" } = props;\n  return (\n    <Card className={styles.reportCard}>\n      <Box className={styles.reportBox}>\n        <Grid>\n          {labelPosition === \"bottom\" && (\n            <>\n              <div className={styles.reportValue}>{value}</div>\n              <div className={styles.reportLabel}>{label}</div>\n            </>\n          )}\n          {labelPosition === \"top\" && (\n            <>\n              <div className={styles.reportLabel}>{label}</div>\n              <div className={styles.reportValue}>{value}</div>\n            </>\n          )}\n        </Grid>\n      </Box>\n    </Card>\n  );\n};\n\nexport default ReportCard;\n"],"names":["ReportCard","props","value","label","labelPosition","jsx","Card","styles","Box","jsxs","Grid","Fragment"],"mappings":"wUAgBaA,EAAcC,GAAiB,CAC1C,KAAM,CAAE,MAAAC,EAAO,MAAAC,EAAO,cAAAC,EAAgB,QAAa,EAAAH,EAEjD,OAAAI,EAAAA,IAACC,EAAAA,KAAK,CAAA,UAAWC,EAAO,WACtB,SAACF,EAAA,IAAAG,EAAA,IAAA,CAAI,UAAWD,EAAO,UACrB,SAAAE,OAACC,EAAAA,KACE,CAAA,SAAA,CAAAN,IAAkB,UAEfK,EAAAA,KAAAE,EAAA,SAAA,CAAA,SAAA,CAAAN,EAAA,IAAC,MAAI,CAAA,UAAWE,EAAO,YAAc,SAAML,EAAA,EAC1CG,EAAA,IAAA,MAAA,CAAI,UAAWE,EAAO,YAAc,SAAMJ,CAAA,CAAA,CAAA,EAC7C,EAEDC,IAAkB,OAEfK,EAAAA,KAAAE,EAAA,SAAA,CAAA,SAAA,CAAAN,EAAA,IAAC,MAAI,CAAA,UAAWE,EAAO,YAAc,SAAMJ,EAAA,EAC1CE,EAAA,IAAA,MAAA,CAAI,UAAWE,EAAO,YAAc,SAAML,CAAA,CAAA,CAAA,CAC7C,CAAA,CAAA,CAEJ,CAAA,CACF,CAAA,EACF,CAEJ"}
+{"version":3,"file":"index.cjs.js","sources":["../../../src/components/ReportCard/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport { Box, Card, Grid } from \"@mui/material\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  value: string | ReactNode;\n  label: string | ReactNode;\n  labelPosition?: \"top\" | \"bottom\";\n};\n\n/**\n * ダッシュボード用のレポート表示（値の直接表示）用のカードです。\n * 項目名と値のみを表示します。\n * labelPositionで項目名の表示位置を指定できます。\n */\nexport const ReportCard = (props: Props) => {\n  const { value, label, labelPosition = \"bottom\" } = props;\n  return (\n    <Card className={styles.reportCard}>\n      <Box className={styles.reportBox}>\n        <Grid>\n          {labelPosition === \"bottom\" && (\n            <>\n              <div className={styles.reportValue}>{value}</div>\n              <div className={styles.reportLabel}>{label}</div>\n            </>\n          )}\n          {labelPosition === \"top\" && (\n            <>\n              <div className={styles.reportLabel}>{label}</div>\n              <div className={styles.reportValue}>{value}</div>\n            </>\n          )}\n        </Grid>\n      </Box>\n    </Card>\n  );\n};\n\nexport default ReportCard;\n"],"names":["ReportCard","props","value","label","labelPosition","jsx","Card","styles","Box","jsxs","Grid","Fragment"],"mappings":"wUAgBaA,EAAcC,GAAiB,CAC1C,KAAM,CAAE,MAAAC,EAAO,MAAAC,EAAO,cAAAC,EAAgB,UAAaH,EACnD,OACEI,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAWC,EAAO,WACtB,SAAAF,EAAAA,IAACG,EAAAA,IAAA,CAAI,UAAWD,EAAO,UACrB,SAAAE,OAACC,EAAAA,KAAA,CACE,SAAA,CAAAN,IAAkB,UACjBK,EAAAA,KAAAE,EAAAA,SAAA,CACE,SAAA,CAAAN,EAAAA,IAAC,MAAA,CAAI,UAAWE,EAAO,YAAc,SAAAL,EAAM,EAC3CG,EAAAA,IAAC,MAAA,CAAI,UAAWE,EAAO,YAAc,SAAAJ,CAAA,CAAM,CAAA,EAC7C,EAEDC,IAAkB,OACjBK,EAAAA,KAAAE,EAAAA,SAAA,CACE,SAAA,CAAAN,EAAAA,IAAC,MAAA,CAAI,UAAWE,EAAO,YAAc,SAAAJ,EAAM,EAC3CE,EAAAA,IAAC,MAAA,CAAI,UAAWE,EAAO,YAAc,SAAAL,CAAA,CAAM,CAAA,CAAA,CAC7C,CAAA,CAAA,CAEJ,EACF,EACF,CAEJ"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../src/components/ReportCard/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport { Box, Card, Grid } from \"@mui/material\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  value: string | ReactNode;\n  label: string | ReactNode;\n  labelPosition?: \"top\" | \"bottom\";\n};\n\n/**\n * ダッシュボード用のレポート表示（値の直接表示）用のカードです。\n * 項目名と値のみを表示します。\n * labelPositionで項目名の表示位置を指定できます。\n */\nexport const ReportCard = (props: Props) => {\n  const { value, label, labelPosition = \"bottom\" } = props;\n  return (\n    <Card className={styles.reportCard}>\n      <Box className={styles.reportBox}>\n        <Grid>\n          {labelPosition === \"bottom\" && (\n            <>\n              <div className={styles.reportValue}>{value}</div>\n              <div className={styles.reportLabel}>{label}</div>\n            </>\n          )}\n          {labelPosition === \"top\" && (\n            <>\n              <div className={styles.reportLabel}>{label}</div>\n              <div className={styles.reportValue}>{value}</div>\n            </>\n          )}\n        </Grid>\n      </Box>\n    </Card>\n  );\n};\n\nexport default ReportCard;\n"],"names":["ReportCard","props","value","label","labelPosition","jsx","Card","styles","Box","jsxs","Grid","Fragment"],"mappings":";;;;;;;GAgBaA,IAAa,CAACC,MAAiB;AAC1C,QAAM,EAAE,OAAAC,GAAO,OAAAC,GAAO,eAAAC,IAAgB,SAAa,IAAAH;AAEjD,SAAA,gBAAAI,EAACC,GAAK,EAAA,WAAWC,EAAO,YACtB,UAAC,gBAAAF,EAAAG,GAAA,EAAI,WAAWD,EAAO,WACrB,UAAA,gBAAAE,EAACC,GACE,EAAA,UAAA;AAAA,IAAAN,MAAkB,YAEf,gBAAAK,EAAAE,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAN,EAAC,OAAI,EAAA,WAAWE,EAAO,aAAc,UAAML,GAAA;AAAA,MAC1C,gBAAAG,EAAA,OAAA,EAAI,WAAWE,EAAO,aAAc,UAAMJ,EAAA,CAAA;AAAA,IAAA,GAC7C;AAAA,IAEDC,MAAkB,SAEf,gBAAAK,EAAAE,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAN,EAAC,OAAI,EAAA,WAAWE,EAAO,aAAc,UAAMJ,GAAA;AAAA,MAC1C,gBAAAE,EAAA,OAAA,EAAI,WAAWE,EAAO,aAAc,UAAML,EAAA,CAAA;AAAA,IAAA,EAC7C,CAAA;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA,GACF;AAEJ;"}
+{"version":3,"file":"index.es.js","sources":["../../../src/components/ReportCard/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport { Box, Card, Grid } from \"@mui/material\";\n\nimport styles from \"./index.module.scss\";\n\ntype Props = {\n  value: string | ReactNode;\n  label: string | ReactNode;\n  labelPosition?: \"top\" | \"bottom\";\n};\n\n/**\n * ダッシュボード用のレポート表示（値の直接表示）用のカードです。\n * 項目名と値のみを表示します。\n * labelPositionで項目名の表示位置を指定できます。\n */\nexport const ReportCard = (props: Props) => {\n  const { value, label, labelPosition = \"bottom\" } = props;\n  return (\n    <Card className={styles.reportCard}>\n      <Box className={styles.reportBox}>\n        <Grid>\n          {labelPosition === \"bottom\" && (\n            <>\n              <div className={styles.reportValue}>{value}</div>\n              <div className={styles.reportLabel}>{label}</div>\n            </>\n          )}\n          {labelPosition === \"top\" && (\n            <>\n              <div className={styles.reportLabel}>{label}</div>\n              <div className={styles.reportValue}>{value}</div>\n            </>\n          )}\n        </Grid>\n      </Box>\n    </Card>\n  );\n};\n\nexport default ReportCard;\n"],"names":["ReportCard","props","value","label","labelPosition","jsx","Card","styles","Box","jsxs","Grid","Fragment"],"mappings":";;;;;;;GAgBaA,IAAa,CAACC,MAAiB;AAC1C,QAAM,EAAE,OAAAC,GAAO,OAAAC,GAAO,eAAAC,IAAgB,aAAaH;AACnD,SACE,gBAAAI,EAACC,GAAA,EAAK,WAAWC,EAAO,YACtB,UAAA,gBAAAF,EAACG,GAAA,EAAI,WAAWD,EAAO,WACrB,UAAA,gBAAAE,EAACC,GAAA,EACE,UAAA;AAAA,IAAAN,MAAkB,YACjB,gBAAAK,EAAAE,GAAA,EACE,UAAA;AAAA,MAAA,gBAAAN,EAAC,OAAA,EAAI,WAAWE,EAAO,aAAc,UAAAL,GAAM;AAAA,MAC3C,gBAAAG,EAAC,OAAA,EAAI,WAAWE,EAAO,aAAc,UAAAJ,EAAA,CAAM;AAAA,IAAA,GAC7C;AAAA,IAEDC,MAAkB,SACjB,gBAAAK,EAAAE,GAAA,EACE,UAAA;AAAA,MAAA,gBAAAN,EAAC,OAAA,EAAI,WAAWE,EAAO,aAAc,UAAAJ,GAAM;AAAA,MAC3C,gBAAAE,EAAC,OAAA,EAAI,WAAWE,EAAO,aAAc,UAAAL,EAAA,CAAM;AAAA,IAAA,EAAA,CAC7C;AAAA,EAAA,EAAA,CAEJ,GACF,GACF;AAEJ;"}

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

@@ -1,2 +1,2 @@
-"use strict";const o=require("react/jsx-runtime"),s=require("@mui/material"),t=require("../../react.esm-CiMn0Rnx.cjs"),a=require("./index.cjs.js");describe("ReportCard component",()=>{it("renders ReportCard component with given label string and value string",async()=>{t.render(o.jsx(a.ReportCard,{value:"値",label:"ラベル"}));const r=t.screen.getByText("値");expect(r).toBeInTheDocument();const e=t.screen.getByText("ラベル");expect(e).toBeInTheDocument()}),it("renders ReportCard component with given label element and value element",async()=>{t.render(o.jsx(a.ReportCard,{value:o.jsx(s.Typography,{children:"値"}),label:o.jsx(s.Typography,{children:"ラベル"})}));const r=t.screen.getByText("値");expect(r).toBeInTheDocument();const e=t.screen.getByText("ラベル");expect(e).toBeInTheDocument()}),it("renders with label at the bottom by default",async()=>{var n;const{container:r}=t.render(o.jsx(a.ReportCard,{value:"値",label:"ラベル"})),e=(n=r.querySelector(".MuiGrid-root"))==null?void 0:n.children;expect(e==null?void 0:e[0]).toHaveClass("reportValue"),expect(e==null?void 0:e[1]).toHaveClass("reportLabel")}),it("renders with label at the top when labelPosition is set to top",async()=>{var n;const{container:r}=t.render(o.jsx(a.ReportCard,{value:"値",label:"ラベル",labelPosition:"top"})),e=(n=r.querySelector(".MuiGrid-root"))==null?void 0:n.children;expect(e==null?void 0:e[0]).toHaveClass("reportLabel"),expect(e==null?void 0:e[1]).toHaveClass("reportValue")})});
+"use strict";const o=require("react/jsx-runtime"),s=require("@mui/material"),t=require("../../react.esm-BcRJ42eI.cjs"),a=require("./index.cjs.js");describe("ReportCard component",()=>{it("renders ReportCard component with given label string and value string",async()=>{t.render(o.jsx(a.ReportCard,{value:"値",label:"ラベル"}));const r=t.screen.getByText("値");expect(r).toBeInTheDocument();const e=t.screen.getByText("ラベル");expect(e).toBeInTheDocument()}),it("renders ReportCard component with given label element and value element",async()=>{t.render(o.jsx(a.ReportCard,{value:o.jsx(s.Typography,{children:"値"}),label:o.jsx(s.Typography,{children:"ラベル"})}));const r=t.screen.getByText("値");expect(r).toBeInTheDocument();const e=t.screen.getByText("ラベル");expect(e).toBeInTheDocument()}),it("renders with label at the bottom by default",async()=>{var n;const{container:r}=t.render(o.jsx(a.ReportCard,{value:"値",label:"ラベル"})),e=(n=r.querySelector(".MuiGrid-root"))==null?void 0:n.children;expect(e==null?void 0:e[0]).toHaveClass("reportValue"),expect(e==null?void 0:e[1]).toHaveClass("reportLabel")}),it("renders with label at the top when labelPosition is set to top",async()=>{var n;const{container:r}=t.render(o.jsx(a.ReportCard,{value:"値",label:"ラベル",labelPosition:"top"})),e=(n=r.querySelector(".MuiGrid-root"))==null?void 0:n.children;expect(e==null?void 0:e[0]).toHaveClass("reportLabel"),expect(e==null?void 0:e[1]).toHaveClass("reportValue")})});
 //# sourceMappingURL=index.test.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.test.cjs.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":"mJAKA,SAAS,uBAAwB,IAAM,CACrC,GAAG,wEAAyE,SAAY,CACtFA,eAAQC,EAAAA,WAAW,CAAA,MAAM,IAAI,MAAM,MAAM,CAAE,EAErC,MAAAC,EAAeC,EAAAA,OAAO,UAAU,GAAG,EAClC,OAAAD,CAAY,EAAE,kBAAkB,EAEjC,MAAAE,EAAeD,EAAAA,OAAO,UAAU,KAAK,EACpC,OAAAC,CAAY,EAAE,kBAAkB,CAAA,CACxC,EAED,GAAG,0EAA2E,SAAY,CACxFJ,EAAA,OACEK,EAAA,IAACJ,EAAA,WAAA,CACC,MAAQI,EAAAA,IAAAC,EAAAA,WAAA,CAAW,SAAC,GAAA,CAAA,EACpB,MAAQD,EAAAA,IAAAC,EAAAA,WAAA,CAAW,SAAG,KAAA,CAAA,CAAA,CAAA,CAE1B,EAEM,MAAAJ,EAAeC,EAAAA,OAAO,UAAU,GAAG,EAClC,OAAAD,CAAY,EAAE,kBAAkB,EAEjC,MAAAE,EAAeD,EAAAA,OAAO,UAAU,KAAK,EACpC,OAAAC,CAAY,EAAE,kBAAkB,CAAA,CACxC,EAED,GAAG,8CAA+C,SAAY,OACtD,KAAA,CAAE,UAAAG,CAAU,EAAIP,EAAO,OAAAK,MAACJ,EAAAA,YAAW,MAAM,IAAI,MAAM,KAAM,CAAA,CAAE,EAC3DO,GAAWC,EAAAF,EAAU,cAAc,eAAe,IAAvC,YAAAE,EAA0C,SAC3D,OAAOD,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,EAC/C,OAAOA,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,CAAA,CAChD,EAED,GAAG,iEAAkE,SAAY,OACzE,KAAA,CAAE,UAAAD,GAAcP,EAAA,aACnBC,EAAAA,WAAW,CAAA,MAAM,IAAI,MAAM,MAAM,cAAc,KAAM,CAAA,CACxD,EACMO,GAAWC,EAAAF,EAAU,cAAc,eAAe,IAAvC,YAAAE,EAA0C,SAC3D,OAAOD,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,EAC/C,OAAOA,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,CAAA,CAChD,CACH,CAAC"}
+{"version":3,"file":"index.test.cjs.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":"mJAKA,SAAS,uBAAwB,IAAM,CACrC,GAAG,wEAAyE,SAAY,CACtFA,eAAQC,EAAAA,WAAA,CAAW,MAAM,IAAI,MAAM,MAAM,CAAE,EAE3C,MAAMC,EAAeC,EAAAA,OAAO,UAAU,GAAG,EACzC,OAAOD,CAAY,EAAE,kBAAA,EAErB,MAAME,EAAeD,EAAAA,OAAO,UAAU,KAAK,EAC3C,OAAOC,CAAY,EAAE,kBAAA,CACvB,CAAC,EAED,GAAG,0EAA2E,SAAY,CACxFJ,EAAAA,OACEK,EAAAA,IAACJ,EAAAA,WAAA,CACC,MAAOI,EAAAA,IAACC,EAAAA,WAAA,CAAW,SAAA,GAAA,CAAC,EACpB,MAAOD,EAAAA,IAACC,EAAAA,WAAA,CAAW,SAAA,KAAA,CAAG,CAAA,CAAA,CACxB,EAGF,MAAMJ,EAAeC,EAAAA,OAAO,UAAU,GAAG,EACzC,OAAOD,CAAY,EAAE,kBAAA,EAErB,MAAME,EAAeD,EAAAA,OAAO,UAAU,KAAK,EAC3C,OAAOC,CAAY,EAAE,kBAAA,CACvB,CAAC,EAED,GAAG,8CAA+C,SAAY,OAC5D,KAAM,CAAE,UAAAG,CAAA,EAAcP,EAAAA,OAAOK,MAACJ,EAAAA,YAAW,MAAM,IAAI,MAAM,KAAA,CAAM,CAAE,EAC3DO,GAAWC,EAAAF,EAAU,cAAc,eAAe,IAAvC,YAAAE,EAA0C,SAC3D,OAAOD,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,EAC/C,OAAOA,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,CACjD,CAAC,EAED,GAAG,iEAAkE,SAAY,OAC/E,KAAM,CAAE,UAAAD,GAAcP,EAAAA,aACnBC,EAAAA,WAAA,CAAW,MAAM,IAAI,MAAM,MAAM,cAAc,KAAA,CAAM,CAAA,EAElDO,GAAWC,EAAAF,EAAU,cAAc,eAAe,IAAvC,YAAAE,EAA0C,SAC3D,OAAOD,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,EAC/C,OAAOA,GAAA,YAAAA,EAAW,EAAE,EAAE,YAAY,aAAa,CACjD,CAAC,CACH,CAAC"}

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

@@ -1,6 +1,6 @@
 import { jsx as o } from "react/jsx-runtime";
 import { Typography as s } from "@mui/material";
-import { r as n, s as r } from "../../react.esm-2FJSSo-S.js";
+import { r as n, s as r } from "../../react.esm-DVhZgPrH.js";
 import { ReportCard as l } from "./index.es.js";
 describe("ReportCard component", () => {
   it("renders ReportCard component with given label string and value string", async () => {

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 r=require("react/jsx-runtime"),j=require("react"),_=require("@mui/material"),e=require("chart.js"),v=require("react-chartjs-2"),C="_chart_l9ziq_10",q="_reportBox_l9ziq_19",L="_nodata_l9ziq_23",n={chart:C,reportBox:q,nodata:L};e.Chart.register(e.CategoryScale,e.LinearScale,e.PointElement,e.LineElement,e.Title,e.Tooltip,e.Legend);const d=u=>{const{dataList:a,xLabel:p="",yLabel:h="",labelKey:l,valueKey:i,borderColor:c="#ff6384",chartMargin:o={top:0,right:20,bottom:20,left:10},tooltipFormatter:f=(t,s)=>[String(t),String(s)],isLoading:b}=u,g=j.useRef(null),m={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:o.left,right:o.right,top:o.top,bottom:o.bottom}},plugins:{legend:{display:!1,position:"top"},title:{display:!1},tooltip:{callbacks:{label:t=>{const s=t.dataset.label||"";return f(t.parsed.y,s).reverse().join("")}}}},scales:{x:{title:{display:!0,text:p}},y:{beginAtZero:!0,title:{display:!0,text:h}}}},y={labels:a.map(t=>{if(typeof t=="object"&&t!==null&&l in t)return t[l];throw new Error("Invalid data structure")}),datasets:[{label:"",data:a.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},{label:"",data:a.map(()=>[70,70,70,70,70,70,70]),borderColor:"red",backgroundColor:"red",tension:.4}]},x=()=>b?r.jsx("div",{className:n.nodata,children:"loading..."}):a.length===0?r.jsx("div",{className:n.nodata,children:"NO DATA"}):r.jsx(v.Line,{ref:g,options:m,data:y});return r.jsx(_.Box,{className:n.reportBox,children:r.jsx("div",{className:n.chart,children:r.jsx(x,{})})})};exports.ReportChart=d;exports.default=d;
+"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;
 //# 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        label: \"\",\n        data: dataList.map(() => {\n          return [70, 70, 70, 70, 70, 70, 70];\n        }),\n        borderColor: \"red\",\n        backgroundColor: \"red\",\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":"oVAsCAA,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,EACX,EACA,CACE,MAAO,GACP,KAAML,EAAS,IAAI,IACV,CAAC,GAAI,GAAI,GAAI,GAAI,GAAI,GAAI,EAAE,CACnC,EACD,YAAa,MACb,gBAAiB,MACjB,QAAS,EAAA,CACX,CAEJ,EAEMiB,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

@@ -1,37 +1,37 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { useRef as y } from "react";
 import { Box as x } from "@mui/material";
-import { Chart as _, CategoryScale as v, LinearScale as C, PointElement as L, LineElement as w, Title as B, Tooltip as N, Legend as R } from "chart.js";
+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 z = "_chart_l9ziq_10", A = "_reportBox_l9ziq_19", E = "_nodata_l9ziq_23", o = {
-  chart: z,
-  reportBox: A,
-  nodata: E
+import '../../assets/index8.css';const A = "_chart_15x7v_1", E = "_reportBox_15x7v_7", S = "_nodata_15x7v_11", e = {
+  chart: A,
+  reportBox: E,
+  nodata: S
 };
-_.register(
-  v,
-  C,
+v.register(
+  _,
   L,
+  C,
   w,
   B,
   N,
   R
 );
-const F = (d) => {
+const J = (c) => {
   const {
-    dataList: a,
-    xLabel: c = "",
+    dataList: o,
+    xLabel: d = "",
     yLabel: p = "",
     labelKey: l,
     valueKey: s,
     borderColor: i = "#ff6384",
-    chartMargin: e = { top: 0, right: 20, bottom: 20, left: 10 },
+    chartMargin: r = { top: 0, right: 20, bottom: 20, left: 10 },
     tooltipFormatter: f = (t, n) => [
       String(t),
       String(n)
     ],
-    isLoading: u
-  } = d, m = y(null), h = {
+    isLoading: m
+  } = c, u = y(null), h = {
     responsive: !0,
     aspectRatio: 2,
     maintainAspectRatio: !1,
@@ -62,10 +62,10 @@ const F = (d) => {
     },
     layout: {
       padding: {
-        left: e.left,
-        right: e.right,
-        top: e.top,
-        bottom: e.bottom
+        left: r.left,
+        right: r.right,
+        top: r.top,
+        bottom: r.bottom
       }
     },
     plugins: {
@@ -89,7 +89,7 @@ const F = (d) => {
       x: {
         title: {
           display: !0,
-          text: c
+          text: d
           // font: {
           //   family: "", // フォントファミリーを指定
           //   size: 30, // フォントサイズを指定
@@ -121,7 +121,7 @@ const F = (d) => {
       }
     }
   }, b = {
-    labels: a.map((t) => {
+    labels: o.map((t) => {
       if (typeof t == "object" && t !== null && l in t)
         return t[l];
       throw new Error("Invalid data structure");
@@ -129,7 +129,7 @@ const F = (d) => {
     datasets: [
       {
         label: "",
-        data: a.map((t) => {
+        data: o.map((t) => {
           if (typeof t == "object" && t !== null && s in t)
             return t[s];
           throw new Error("Invalid data structure");
@@ -137,20 +137,13 @@ const F = (d) => {
         borderColor: i,
         backgroundColor: i,
         tension: 0.4
-      },
-      {
-        label: "",
-        data: a.map(() => [70, 70, 70, 70, 70, 70, 70]),
-        borderColor: "red",
-        backgroundColor: "red",
-        tension: 0.4
       }
     ]
-  }, g = () => u ? /* @__PURE__ */ r("div", { className: o.nodata, children: "loading..." }) : a.length === 0 ? /* @__PURE__ */ r("div", { className: o.nodata, children: "NO DATA" }) : /* @__PURE__ */ r(j, { ref: m, options: h, data: b });
-  return /* @__PURE__ */ r(x, { className: o.reportBox, children: /* @__PURE__ */ r("div", { className: o.chart, children: /* @__PURE__ */ r(g, {}) }) });
+  }, g = () => m ? /* @__PURE__ */ a("div", { className: e.nodata, children: "loading..." }) : o.length === 0 ? /* @__PURE__ */ a("div", { className: e.nodata, children: "NO DATA" }) : /* @__PURE__ */ a(j, { ref: u, options: h, data: b });
+  return /* @__PURE__ */ a(x, { className: e.reportBox, children: /* @__PURE__ */ a("div", { className: e.chart, children: /* @__PURE__ */ a(g, {}) }) });
 };
 export {
-  F as ReportChart,
-  F as default
+  J as ReportChart,
+  J as default
 };
 //# sourceMappingURL=index.es.js.map

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        label: \"\",\n        data: dataList.map(() => {\n          return [70, 70, 70, 70, 70, 70, 70];\n        }),\n        borderColor: \"red\",\n        backgroundColor: \"red\",\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":"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"}