matsuri-ui 16.5.1-alpha-1733126153498-ddb299f.0 → 16.6.0

package/CSVImportUI/CSVImportUI.d.ts

@@ -5,6 +5,7 @@ export type Mode = "create" | "update";
 export type CellError = [string, string];
 export type CSVImportUIColumn = Readonly<{
     label: string;
+    description?: string;
     type?: "date" | "number";
     options?: readonly string[];
     required?: boolean;
@@ -181,6 +182,12 @@ export interface CSVImportUIProps<Columns extends CSVImportUIColumns, Row extend
      * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。
      */
     defaultTemplateData?: Row[];
+    /**
+     * ダウンロードテンプレートで利用する項目を選択するかどうかを指定する。
+     * デフォルトでは、hiddenOnCreateTemplateが指定されていない列の全ての項目が追加される。
+     * @default false
+     */
+    selectDownloadTemplateColumns?: boolean;
 }
 export declare const CSVImportUI: <Columns extends CSVImportUIColumns, Row extends Record<string, string> = AssertType<UnionToIntersection<OptionByLabel<Columns>>, Record<string, string>>>(props: CSVImportUIProps<Columns, Row>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/CSVImportUI/CSVImportUI.js

@@ -28,6 +28,7 @@ var CSVImportUIContent = _ref => {
     onUploadDataByRow,
     acceptMode,
     skipDownloadTemplate,
+    selectDownloadTemplateColumns,
     defaultTemplateData
   } = _ref;
   var id = useScreen();
@@ -70,7 +71,9 @@ var CSVImportUIContent = _ref => {
         return ___EmotionJSX(DownloadCreateTemplateScreen, {
           onDownloadCSV: onDownloadCSV,
           headers: headers,
-          csvPrefix: csvPrefix
+          columns: columns,
+          csvPrefix: csvPrefix,
+          selectDownloadTemplateColumns: selectDownloadTemplateColumns
         });
       }
     case "downloadUpdateTemplate":

package/CSVImportUI/CSVImportUI.js.map

@@ -1 +1 @@
-{"version":3,"file":"CSVImportUI.js","names":["CompleteScreen","DownloadCreateTemplateScreen","DownloadUpdateTemplateScreen","LoadCSVScreen","ScreenProvider","useScreen","SelectModeScreen","UploadCSVScreen","useCallback","useMemo","useState","jsx","___EmotionJSX","CSVImportUIContent","_ref","columns","onDownloadCSV","searchLabel","onSearchData","renderSearchField","csvPrefix","csvParser","csvValidator","onPreUploadData","onPreUploadDataByRow","onUploadData","onUploadDataByRow","acceptMode","skipDownloadTemplate","defaultTemplateData","id","mode","setMode","uploadedData","setUploadedData","errors","setErrors","handleUpdateData","data","headers","_uploadedData$","rowKeys","Object","keys","values","filter","column","length","hiddenIfNoHeader","includes","label","map","filledData","_uploadedData$2","row","_extends","fromEntries","header","onChangeMode","onSearch","onUpdateData","onSubmitComplete","getFirstScreenId","accptMode","CSVImportUI","props","firstScreenId"],"sources":["../../../src/CSVImportUI/CSVImportUI.tsx"],"sourcesContent":["import { AlertMessageType } from \"../Alert\";\nimport { AssertType } from \"../@types/AssertType\";\nimport { CompleteScreen } from \"./screens/CompleteScreen\";\nimport { DownloadCreateTemplateScreen } from \"./screens/DownloadCreateTemplateScreen\";\nimport { DownloadUpdateTemplateScreen } from \"./screens/DownloadUpdateTemplateScreen\";\nimport { LoadCSVScreen } from \"./screens/LoadCSVScreen\";\nimport { ScreenId } from \"./screens/types\";\nimport { ScreenProvider, useScreen } from \"./ScreenProvider\";\nimport { SelectModeScreen } from \"./screens/SelectModeScreen\";\nimport { UnionToIntersection } from \"../@types/UnionToIntersection\";\nimport { UploadCSVScreen } from \"./screens/UploadCSVScreen\";\nimport { useCallback, useMemo, useState } from \"react\";\n\nexport type Mode = \"create\" | \"update\";\n\nexport type CellError = [string, string];\n\nexport type CSVImportUIColumn = Readonly<{\n  label: string;\n  type?: \"date\" | \"number\";\n  options?: readonly string[];\n  required?: boolean;\n  hiddenOnCreateTemplate?: boolean;\n  /**\n   * アップロードされたCSVにヘッダーがなければ表示しない。\n   */\n  hiddenIfNoHeader?: boolean;\n  renderCell?: (props: {\n    value: string;\n    header: string;\n    row: Record<string, string>;\n  }) => JSX.Element;\n}>;\n\n/**\n * ライブラリ利用者用の型\n */\nexport type CSVImportUIColumns = Record<string, CSVImportUIColumn>;\n\nexport interface CSVImportUIRenderSearchFieldProps<Row> {\n  onChange: (args: Row[]) => void;\n}\n\ntype OptionByLabel<Columns extends CSVImportUIColumns> = {\n  [Key in keyof Columns]: Record<\n    Columns[Key][\"label\"],\n    Columns[Key] extends {\n      options: readonly (infer Option)[];\n    }\n      ? Option extends string\n        ? Option\n        : never\n      : string\n  >;\n}[keyof Columns];\n\nexport type CSVImportUIRow<Columns extends CSVImportUIColumns> = AssertType<\n  UnionToIntersection<OptionByLabel<Columns>>,\n  Record<string, string>\n>;\n\nexport interface CSVImportUIProps<\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n> {\n  /**\n   * 利用できるモードを指定する。\n   */\n  acceptMode: Mode[];\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 行ごとにデータを処理する。\n   *\n   * onPreUploadDataが指定されている場合、こちらは無視される。\n   */\n  onPreUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{ error?: CellError; data?: Record<string, string> }>;\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onPreUploadDataByRowByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onPreUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 行ごとにデータをアップロードする。\n   *\n   * onUploadDataが指定されている場合、こちらは無視される。\n   */\n  onUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{\n    error?: CellError;\n    data?: Record<string, string>;\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onUploadDataByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * 検索フォームのラベルとして利用される。\n   * (only upload mode)\n   */\n  searchLabel?: string;\n  /**\n   * 検索が行われた際にトリガーされる。\n   * ユーザーの入力した文字列に応じてデータを返却する。このデータはCSVとしてダウンロードされる。\n   * (only upload mode)\n   */\n  onSearchData?: (args: { value: string }) => Promise<{\n    data: Row[];\n  }>;\n  /**\n   * CSVの各列をどのように表示するか指定する。\n   * 各列には、次のプロパティが指定できる。\n   *\n   * `label` : CSVのヘッダーとして利用される。\n   *\n   * `type` : `date`または`number`が指定でき、それぞれ日付と数値としてアップロードされたCSVの値が正しいかどうかを検証する。\n   *\n   * `options` : その列が持てる値のリストを指定する。アップロードされたCSVの値がこのリストに含まれているかどうかを検証する。\n   *\n   * `required` : その列が必須かどうかを指定する。アップロードされたCSVの値が空でないかどうかを検証する。\n   *\n   * `renderCell` : その列のセルをどのように表示するかを指定する。その列の値、ヘッダー、行のデータが渡される。\n   *\n   * `hiddenOnCreateTemplate` : 作成用のCSVのテンプレートに、その列を表示しないかどうかを決定する。\n   *\n   * `hiddenIfNoHeader` : アップロードされたCSVにそのヘッダーがなければ、その列を表示しないかどうかを決定する。\n   */\n  columns: Columns;\n  /**\n   * ダウンロードされるCSVに付与されるプレフィックスを指定する\n   */\n  csvPrefix?: string;\n  /**\n   * CSVのダウンロードがトリガーされたときに呼ばれる\n   */\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * CSVがアップロードされたときに呼ばれる\n   */\n  csvParser: (args: {\n    file: File;\n  }) => Promise<{ data: Record<string, string>[] }>;\n  /**\n   * アップロードされたCSVのデータをバリデーションする。\n   */\n  csvValidator?: (args: {\n    /**\n     * ここで渡されるデータがRowと一致するとは限らない。\n     */\n    row: Record<string, string>;\n  }) => Promise<{ errors?: CellError[] }>;\n  /**\n   * 更新モードで検索のカスタマイズをする。\n   * 省略するとonSearchData, searchLabelを用いた単一の検索フィールドが表示される。これを指定するとonSearchData, searchLabelは無視される。\n   * (only upload mode)\n   */\n  renderSearchField?: (\n    props: CSVImportUIRenderSearchFieldProps<Row>,\n  ) => JSX.Element;\n  /**\n   * 編集用CSVをダウンロードするページをスキップする\n   */\n  skipDownloadTemplate?: boolean;\n  /**\n   * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。\n   */\n  defaultTemplateData?: Row[];\n}\n\nconst CSVImportUIContent = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>({\n  columns,\n  onDownloadCSV,\n  searchLabel,\n  onSearchData,\n  renderSearchField,\n  csvPrefix,\n  csvParser,\n  csvValidator,\n  onPreUploadData,\n  onPreUploadDataByRow,\n  onUploadData,\n  onUploadDataByRow,\n  acceptMode,\n  skipDownloadTemplate,\n  defaultTemplateData,\n}: CSVImportUIProps<Columns, Row>) => {\n  const id = useScreen();\n  const [mode, setMode] = useState<Mode>(acceptMode[0]);\n  const [uploadedData, setUploadedData] = useState<Row[]>([]);\n  const [errors, setErrors] = useState<(CellError[] | undefined)[]>([]);\n\n  const handleUpdateData = useCallback(\n    (data: Row[], errors: (CellError[] | undefined)[]) => {\n      setErrors(errors);\n      setUploadedData(data);\n    },\n    [],\n  );\n\n  const headers = useMemo(() => {\n    const rowKeys = Object.keys(uploadedData[0] ?? {});\n\n    return Object.values(columns)\n      .filter((column) => {\n        if (rowKeys.length === 0) {\n          return true;\n        }\n        if (column.hiddenIfNoHeader && !rowKeys.includes(column.label)) {\n          return false;\n        }\n        return true;\n      })\n      .map((column) => column.label);\n  }, [columns, uploadedData]);\n\n  const filledData = useMemo(() => {\n    return headers.length > Object.keys(uploadedData[0] ?? {}).length\n      ? uploadedData.map((row) => {\n          return {\n            ...Object.fromEntries(headers.map((header) => [header, \"\"])),\n            ...row,\n          };\n        })\n      : uploadedData;\n  }, [headers, uploadedData]);\n\n  switch (id) {\n    case \"selectMode\": {\n      return (\n        <SelectModeScreen\n          skipDownloadTemplate={skipDownloadTemplate}\n          onChangeMode={setMode}\n        />\n      );\n    }\n    case \"downloadCreateTemplate\": {\n      return (\n        <DownloadCreateTemplateScreen\n          onDownloadCSV={onDownloadCSV}\n          headers={headers}\n          csvPrefix={csvPrefix}\n        />\n      );\n    }\n    case \"downloadUpdateTemplate\": {\n      return (\n        <DownloadUpdateTemplateScreen\n          searchLabel={searchLabel}\n          onSearch={onSearchData}\n          renderSearchField={renderSearchField}\n          onDownloadCSV={onDownloadCSV}\n          csvPrefix={csvPrefix}\n          headers={headers}\n          defaultTemplateData={defaultTemplateData}\n          columns={columns}\n        />\n      );\n    }\n    case \"loadCSV\": {\n      return (\n        <LoadCSVScreen\n          mode={mode}\n          columns={columns}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          csvParser={csvParser}\n          csvValidator={csvValidator}\n          onPreUploadData={onPreUploadData}\n          onPreUploadDataByRow={onPreUploadDataByRow}\n          onUpdateData={handleUpdateData}\n        />\n      );\n    }\n    case \"uploadCSV\": {\n      return (\n        <UploadCSVScreen\n          mode={mode}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          columns={columns}\n          onUploadData={onUploadData}\n          onUploadDataByRow={onUploadDataByRow}\n          onSubmitComplete={handleUpdateData}\n        />\n      );\n    }\n    case \"complete\": {\n      return (\n        <CompleteScreen\n          csvPrefix={csvPrefix}\n          onDownloadCSV={onDownloadCSV}\n          data={filledData}\n          columns={columns}\n          headers={headers}\n          errors={errors}\n        />\n      );\n    }\n    default: {\n      return null;\n    }\n  }\n};\n\nconst getFirstScreenId = (\n  accptMode: Mode[],\n  skipDownloadTemplate?: boolean,\n): ScreenId => {\n  if (accptMode.length > 1) {\n    return \"selectMode\";\n  }\n  if (skipDownloadTemplate) {\n    return \"loadCSV\";\n  }\n  if (accptMode[0] === \"create\") {\n    return \"downloadCreateTemplate\";\n  }\n  if (accptMode[0] === \"update\") {\n    return \"downloadUpdateTemplate\";\n  }\n  return \"selectMode\";\n};\n\nexport const CSVImportUI = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>(\n  props: CSVImportUIProps<Columns, Row>,\n) => {\n  return (\n    <ScreenProvider\n      firstScreenId={getFirstScreenId(\n        props.acceptMode,\n        props.skipDownloadTemplate,\n      )}\n    >\n      <CSVImportUIContent {...props} />\n    </ScreenProvider>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CSVImportUI.js","names":["CompleteScreen","DownloadCreateTemplateScreen","DownloadUpdateTemplateScreen","LoadCSVScreen","ScreenProvider","useScreen","SelectModeScreen","UploadCSVScreen","useCallback","useMemo","useState","jsx","___EmotionJSX","CSVImportUIContent","_ref","columns","onDownloadCSV","searchLabel","onSearchData","renderSearchField","csvPrefix","csvParser","csvValidator","onPreUploadData","onPreUploadDataByRow","onUploadData","onUploadDataByRow","acceptMode","skipDownloadTemplate","selectDownloadTemplateColumns","defaultTemplateData","id","mode","setMode","uploadedData","setUploadedData","errors","setErrors","handleUpdateData","data","headers","_uploadedData$","rowKeys","Object","keys","values","filter","column","length","hiddenIfNoHeader","includes","label","map","filledData","_uploadedData$2","row","_extends","fromEntries","header","onChangeMode","onSearch","onUpdateData","onSubmitComplete","getFirstScreenId","accptMode","CSVImportUI","props","firstScreenId"],"sources":["../../../src/CSVImportUI/CSVImportUI.tsx"],"sourcesContent":["import { AlertMessageType } from \"../Alert\";\nimport { AssertType } from \"../@types/AssertType\";\nimport { CompleteScreen } from \"./screens/CompleteScreen\";\nimport { DownloadCreateTemplateScreen } from \"./screens/DownloadCreateTemplateScreen\";\nimport { DownloadUpdateTemplateScreen } from \"./screens/DownloadUpdateTemplateScreen\";\nimport { LoadCSVScreen } from \"./screens/LoadCSVScreen\";\nimport { ScreenId } from \"./screens/types\";\nimport { ScreenProvider, useScreen } from \"./ScreenProvider\";\nimport { SelectModeScreen } from \"./screens/SelectModeScreen\";\nimport { UnionToIntersection } from \"../@types/UnionToIntersection\";\nimport { UploadCSVScreen } from \"./screens/UploadCSVScreen\";\nimport { useCallback, useMemo, useState } from \"react\";\n\nexport type Mode = \"create\" | \"update\";\n\nexport type CellError = [string, string];\n\nexport type CSVImportUIColumn = Readonly<{\n  label: string;\n  description?: string;\n  type?: \"date\" | \"number\";\n  options?: readonly string[];\n  required?: boolean;\n  hiddenOnCreateTemplate?: boolean;\n  /**\n   * アップロードされたCSVにヘッダーがなければ表示しない。\n   */\n  hiddenIfNoHeader?: boolean;\n  renderCell?: (props: {\n    value: string;\n    header: string;\n    row: Record<string, string>;\n  }) => JSX.Element;\n}>;\n\n/**\n * ライブラリ利用者用の型\n */\nexport type CSVImportUIColumns = Record<string, CSVImportUIColumn>;\n\nexport interface CSVImportUIRenderSearchFieldProps<Row> {\n  onChange: (args: Row[]) => void;\n}\n\ntype OptionByLabel<Columns extends CSVImportUIColumns> = {\n  [Key in keyof Columns]: Record<\n    Columns[Key][\"label\"],\n    Columns[Key] extends {\n      options: readonly (infer Option)[];\n    }\n      ? Option extends string\n        ? Option\n        : never\n      : string\n  >;\n}[keyof Columns];\n\nexport type CSVImportUIRow<Columns extends CSVImportUIColumns> = AssertType<\n  UnionToIntersection<OptionByLabel<Columns>>,\n  Record<string, string>\n>;\n\nexport interface CSVImportUIProps<\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n> {\n  /**\n   * 利用できるモードを指定する。\n   */\n  acceptMode: Mode[];\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 行ごとにデータを処理する。\n   *\n   * onPreUploadDataが指定されている場合、こちらは無視される。\n   */\n  onPreUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{ error?: CellError; data?: Record<string, string> }>;\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onPreUploadDataByRowByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onPreUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 行ごとにデータをアップロードする。\n   *\n   * onUploadDataが指定されている場合、こちらは無視される。\n   */\n  onUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{\n    error?: CellError;\n    data?: Record<string, string>;\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onUploadDataByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * 検索フォームのラベルとして利用される。\n   * (only upload mode)\n   */\n  searchLabel?: string;\n  /**\n   * 検索が行われた際にトリガーされる。\n   * ユーザーの入力した文字列に応じてデータを返却する。このデータはCSVとしてダウンロードされる。\n   * (only upload mode)\n   */\n  onSearchData?: (args: { value: string }) => Promise<{\n    data: Row[];\n  }>;\n  /**\n   * CSVの各列をどのように表示するか指定する。\n   * 各列には、次のプロパティが指定できる。\n   *\n   * `label` : CSVのヘッダーとして利用される。\n   *\n   * `type` : `date`または`number`が指定でき、それぞれ日付と数値としてアップロードされたCSVの値が正しいかどうかを検証する。\n   *\n   * `options` : その列が持てる値のリストを指定する。アップロードされたCSVの値がこのリストに含まれているかどうかを検証する。\n   *\n   * `required` : その列が必須かどうかを指定する。アップロードされたCSVの値が空でないかどうかを検証する。\n   *\n   * `renderCell` : その列のセルをどのように表示するかを指定する。その列の値、ヘッダー、行のデータが渡される。\n   *\n   * `hiddenOnCreateTemplate` : 作成用のCSVのテンプレートに、その列を表示しないかどうかを決定する。\n   *\n   * `hiddenIfNoHeader` : アップロードされたCSVにそのヘッダーがなければ、その列を表示しないかどうかを決定する。\n   */\n  columns: Columns;\n  /**\n   * ダウンロードされるCSVに付与されるプレフィックスを指定する\n   */\n  csvPrefix?: string;\n  /**\n   * CSVのダウンロードがトリガーされたときに呼ばれる\n   */\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * CSVがアップロードされたときに呼ばれる\n   */\n  csvParser: (args: {\n    file: File;\n  }) => Promise<{ data: Record<string, string>[] }>;\n  /**\n   * アップロードされたCSVのデータをバリデーションする。\n   */\n  csvValidator?: (args: {\n    /**\n     * ここで渡されるデータがRowと一致するとは限らない。\n     */\n    row: Record<string, string>;\n  }) => Promise<{ errors?: CellError[] }>;\n  /**\n   * 更新モードで検索のカスタマイズをする。\n   * 省略するとonSearchData, searchLabelを用いた単一の検索フィールドが表示される。これを指定するとonSearchData, searchLabelは無視される。\n   * (only upload mode)\n   */\n  renderSearchField?: (\n    props: CSVImportUIRenderSearchFieldProps<Row>,\n  ) => JSX.Element;\n  /**\n   * 編集用CSVをダウンロードするページをスキップする\n   */\n  skipDownloadTemplate?: boolean;\n  /**\n   * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。\n   */\n  defaultTemplateData?: Row[];\n\n  /**\n   * ダウンロードテンプレートで利用する項目を選択するかどうかを指定する。\n   * デフォルトでは、hiddenOnCreateTemplateが指定されていない列の全ての項目が追加される。\n   * @default false\n   */\n  selectDownloadTemplateColumns?: boolean;\n}\n\nconst CSVImportUIContent = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>({\n  columns,\n  onDownloadCSV,\n  searchLabel,\n  onSearchData,\n  renderSearchField,\n  csvPrefix,\n  csvParser,\n  csvValidator,\n  onPreUploadData,\n  onPreUploadDataByRow,\n  onUploadData,\n  onUploadDataByRow,\n  acceptMode,\n  skipDownloadTemplate,\n  selectDownloadTemplateColumns,\n  defaultTemplateData,\n}: CSVImportUIProps<Columns, Row>) => {\n  const id = useScreen();\n  const [mode, setMode] = useState<Mode>(acceptMode[0]);\n  const [uploadedData, setUploadedData] = useState<Row[]>([]);\n  const [errors, setErrors] = useState<(CellError[] | undefined)[]>([]);\n\n  const handleUpdateData = useCallback(\n    (data: Row[], errors: (CellError[] | undefined)[]) => {\n      setErrors(errors);\n      setUploadedData(data);\n    },\n    [],\n  );\n\n  const headers = useMemo(() => {\n    const rowKeys = Object.keys(uploadedData[0] ?? {});\n\n    return Object.values(columns)\n      .filter((column) => {\n        if (rowKeys.length === 0) {\n          return true;\n        }\n        if (column.hiddenIfNoHeader && !rowKeys.includes(column.label)) {\n          return false;\n        }\n        return true;\n      })\n      .map((column) => column.label);\n  }, [columns, uploadedData]);\n\n  const filledData = useMemo(() => {\n    return headers.length > Object.keys(uploadedData[0] ?? {}).length\n      ? uploadedData.map((row) => {\n          return {\n            ...Object.fromEntries(headers.map((header) => [header, \"\"])),\n            ...row,\n          };\n        })\n      : uploadedData;\n  }, [headers, uploadedData]);\n\n  switch (id) {\n    case \"selectMode\": {\n      return (\n        <SelectModeScreen\n          skipDownloadTemplate={skipDownloadTemplate}\n          onChangeMode={setMode}\n        />\n      );\n    }\n    case \"downloadCreateTemplate\": {\n      return (\n        <DownloadCreateTemplateScreen\n          onDownloadCSV={onDownloadCSV}\n          headers={headers}\n          columns={columns}\n          csvPrefix={csvPrefix}\n          selectDownloadTemplateColumns={selectDownloadTemplateColumns}\n        />\n      );\n    }\n    case \"downloadUpdateTemplate\": {\n      return (\n        <DownloadUpdateTemplateScreen\n          searchLabel={searchLabel}\n          onSearch={onSearchData}\n          renderSearchField={renderSearchField}\n          onDownloadCSV={onDownloadCSV}\n          csvPrefix={csvPrefix}\n          headers={headers}\n          defaultTemplateData={defaultTemplateData}\n          columns={columns}\n        />\n      );\n    }\n    case \"loadCSV\": {\n      return (\n        <LoadCSVScreen\n          mode={mode}\n          columns={columns}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          csvParser={csvParser}\n          csvValidator={csvValidator}\n          onPreUploadData={onPreUploadData}\n          onPreUploadDataByRow={onPreUploadDataByRow}\n          onUpdateData={handleUpdateData}\n        />\n      );\n    }\n    case \"uploadCSV\": {\n      return (\n        <UploadCSVScreen\n          mode={mode}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          columns={columns}\n          onUploadData={onUploadData}\n          onUploadDataByRow={onUploadDataByRow}\n          onSubmitComplete={handleUpdateData}\n        />\n      );\n    }\n    case \"complete\": {\n      return (\n        <CompleteScreen\n          csvPrefix={csvPrefix}\n          onDownloadCSV={onDownloadCSV}\n          data={filledData}\n          columns={columns}\n          headers={headers}\n          errors={errors}\n        />\n      );\n    }\n    default: {\n      return null;\n    }\n  }\n};\n\nconst getFirstScreenId = (\n  accptMode: Mode[],\n  skipDownloadTemplate?: boolean,\n): ScreenId => {\n  if (accptMode.length > 1) {\n    return \"selectMode\";\n  }\n  if (skipDownloadTemplate) {\n    return \"loadCSV\";\n  }\n  if (accptMode[0] === \"create\") {\n    return \"downloadCreateTemplate\";\n  }\n  if (accptMode[0] === \"update\") {\n    return \"downloadUpdateTemplate\";\n  }\n  return \"selectMode\";\n};\n\nexport const CSVImportUI = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>(\n  props: CSVImportUIProps<Columns, Row>,\n) => {\n  return (\n    <ScreenProvider\n      firstScreenId={getFirstScreenId(\n        props.acceptMode,\n        props.skipDownloadTemplate,\n      )}\n    >\n      <CSVImportUIContent {...props} />\n    </ScreenProvider>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/CSVImportUI/screens/DownloadCreateTemplateScreen.d.ts

@@ -1,10 +1,16 @@
+import { CSVImportUIColumns } from "../CSVImportUI";
 import { ScreenProps } from "./types";
 export interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {
     onDownloadCSV: (args: {
         data: Row[];
         filename: string;
     }) => void;
+    /**
+     * @default false
+     */
+    selectDownloadTemplateColumns?: boolean;
     csvPrefix?: string;
     headers: string[];
+    columns: CSVImportUIColumns;
 }
-export declare const DownloadCreateTemplateScreen: <Row>({ headers, csvPrefix, onDownloadCSV, }: DownloadCreateTemplateScreenProps<Row>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const DownloadCreateTemplateScreen: <Row>({ headers, csvPrefix, onDownloadCSV, selectDownloadTemplateColumns, columns, }: DownloadCreateTemplateScreenProps<Row>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/CSVImportUI/screens/DownloadCreateTemplateScreen.js

@@ -1,10 +1,13 @@
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 import { Button } from "../../Button";
 import { ScreenLayout } from "../ScreenLayout";
+import { TableUI } from "../../TableUI";
+import { Typography } from "@mui/material";
 import { createEmptyData } from "../createEmptyData";
 import { css } from "@emotion/react";
 import { getTemplateFilename } from "../getTemplateFilename";
 import { useNavigate } from "../ScreenProvider";
+import { useState } from "react";
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "rh2lbx",
@@ -12,20 +15,57 @@ var _ref = process.env.NODE_ENV === "production" ? {
 } : {
   name: "1r8vue8-DownloadCreateTemplateScreen",
   styles: "display:grid;justify-content:center;label:DownloadCreateTemplateScreen;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFDZ0IiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBTY3JlZW5MYXlvdXQgfSBmcm9tIFwiLi4vU2NyZWVuTGF5b3V0XCI7XG5pbXBvcnQgeyBTY3JlZW5Qcm9wcyB9IGZyb20gXCIuL3R5cGVzXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcblxuZXhwb3J0IGludGVyZmFjZSBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuUHJvcHM8Um93PiBleHRlbmRzIFNjcmVlblByb3BzIHtcbiAgb25Eb3dubG9hZENTVjogKGFyZ3M6IHsgZGF0YTogUm93W107IGZpbGVuYW1lOiBzdHJpbmcgfSkgPT4gdm9pZDtcbiAgY3N2UHJlZml4Pzogc3RyaW5nO1xuICBoZWFkZXJzOiBzdHJpbmdbXTtcbn1cblxuZXhwb3J0IGNvbnN0IERvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4gPSA8Um93LD4oe1xuICBoZWFkZXJzLFxuICBjc3ZQcmVmaXgsXG4gIG9uRG93bmxvYWRDU1YsXG59OiBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuUHJvcHM8Um93PikgPT4ge1xuICBjb25zdCB7IG9uTmF2aWdhdGUgfSA9IHVzZU5hdmlnYXRlKCk7XG5cbiAgY29uc3QgaGFuZGxlRG93bmxvYWRDcmVhdGVUZW1wbGF0ZSA9ICgpID0+IHtcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoaGVhZGVycykgYXMgUm93O1xuICAgIG9uRG93bmxvYWRDU1Yoe1xuICAgICAgZGF0YTogW3Jvd10sXG4gICAgICBmaWxlbmFtZTogZ2V0VGVtcGxhdGVGaWxlbmFtZShcImltcG9ydFwiLCBjc3ZQcmVmaXgpLFxuICAgIH0pO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFNjcmVlbkxheW91dFxuICAgICAgdGl0bGU9XCLkvZzmiJDnlKhDU1bjga7jg4Djgqbjg7Pjg63jg7zjg4lcIlxuICAgICAgb25OZXh0PXsoKSA9PiB7XG4gICAgICAgIG9uTmF2aWdhdGUoXCJsb2FkQ1NWXCIpO1xuICAgICAgfX1cbiAgICA+XG4gICAgICA8ZGl2XG4gICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxCdXR0b25cbiAgICAgICAgICB2YXJpYW50PVwib3V0bGluZWRcIlxuICAgICAgICAgIGNvbG9yPVwicHJpbWFyeVwiXG4gICAgICAgICAgb25DbGljaz17aGFuZGxlRG93bmxvYWRDcmVhdGVUZW1wbGF0ZX1cbiAgICAgICAgPlxuICAgICAgICAgIOOCouODg+ODl+ODreODvOODieeUqENTVuOCkuWPluW+l1xuICAgICAgICA8L0J1dHRvbj5cbiAgICAgIDwvZGl2PlxuICAgIDwvU2NyZWVuTGF5b3V0PlxuICApO1xufTtcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1JaUIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
-export var DownloadCreateTemplateScreen = _ref2 => {
+var _ref2 = process.env.NODE_ENV === "production" ? {
+  name: "1oecb4n",
+  styles: "display:grid;justify-content:flex-end"
+} : {
+  name: "hizbmn-DownloadCreateTemplateScreen",
+  styles: "display:grid;justify-content:flex-end;label:DownloadCreateTemplateScreen;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStIaUIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+var _ref3 = process.env.NODE_ENV === "production" ? {
+  name: "1d16ou4",
+  styles: "display:grid;gap:16px"
+} : {
+  name: "16r19s5-DownloadCreateTemplateScreen",
+  styles: "display:grid;gap:16px;label:DownloadCreateTemplateScreen;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBFa0IiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+export var DownloadCreateTemplateScreen = _ref4 => {
   var {
     headers,
     csvPrefix,
-    onDownloadCSV
-  } = _ref2;
+    onDownloadCSV,
+    selectDownloadTemplateColumns = false,
+    columns
+  } = _ref4;
   var {
     onNavigate
   } = useNavigate();
+  var tableData = Object.values(columns).filter(column => column.hiddenOnCreateTemplate !== true).map(value => {
+    return {
+      label: value.label,
+      description: value.description,
+      required: value.required
+    };
+  });
+  var [selectedIndexes, setSelectedIndexes] = useState([]);
   var handleDownloadCreateTemplate = () => {
-    var row = createEmptyData(headers);
+    var filteredHeaders = selectDownloadTemplateColumns ? tableData.filter((_, index) => {
+      if (tableData[index].required) {
+        return true;
+      }
+      if (selectedIndexes.includes(index)) {
+        return true;
+      }
+      return false;
+    }).map(item => item.label) : headers;
+    var row = createEmptyData(filteredHeaders);
     onDownloadCSV({
       data: [row],
       filename: getTemplateFilename("import", csvPrefix)
@@ -36,8 +76,53 @@ export var DownloadCreateTemplateScreen = _ref2 => {
     onNext: () => {
       onNavigate("loadCSV");
     }
-  }, ___EmotionJSX("div", {
-    css: _ref
+  }, selectDownloadTemplateColumns ? ___EmotionJSX("div", {
+    css: _ref3
+  }, ___EmotionJSX("div", null, ___EmotionJSX(Typography, null, "\u7DE8\u96C6\u3057\u305F\u3044\u9805\u76EE\u3092\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044\u3002"), ___EmotionJSX(Typography, {
+    variant: "caption"
+  }, "\uFF0A\u5FC5\u9808\u306E\u9805\u76EE\u306F\u9078\u629E\u3057\u306A\u3044\u5834\u5408\u3082\u3001CSV\u30D5\u30A1\u30A4\u30EB\u306B\u51FA\u529B\u3055\u308C\u307E\u3059\u3002")), ___EmotionJSX(TableUI, {
+    onSelectAll: _ref5 => {
+      var {
+        checked
+      } = _ref5;
+      if (checked) {
+        setSelectedIndexes(tableData.map((_, index) => index));
+      } else {
+        setSelectedIndexes([]);
+      }
+    },
+    onSelect: _ref6 => {
+      var {
+        index,
+        checked
+      } = _ref6;
+      setSelectedIndexes(prev => {
+        if (checked) {
+          return [...prev, index];
+        }
+        return prev.filter(item => item !== index);
+      });
+    },
+    selectedIndex: selectedIndexes,
+    columns: [{
+      key: "label",
+      title: "カラム名"
+    }, {
+      key: "description",
+      title: "説明"
+    }, {
+      key: "required",
+      title: "必須",
+      renderCell: _ref7 => {
+        var {
+          cell
+        } = _ref7;
+        return ___EmotionJSX("span", null, cell.value ? "YES" : "NO");
+      }
+    }],
+    data: tableData
+  })) : null, ___EmotionJSX("div", {
+    css: selectDownloadTemplateColumns ? _ref2 : _ref
   }, ___EmotionJSX(Button, {
     variant: "outlined",
     color: "primary",

package/CSVImportUI/screens/DownloadCreateTemplateScreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"DownloadCreateTemplateScreen.js","names":["Button","ScreenLayout","createEmptyData","css","getTemplateFilename","useNavigate","jsx","___EmotionJSX","_ref","process","env","NODE_ENV","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","DownloadCreateTemplateScreen","_ref2","headers","csvPrefix","onDownloadCSV","onNavigate","handleDownloadCreateTemplate","row","data","filename","title","onNext","variant","color","onClick"],"sources":["../../../../src/CSVImportUI/screens/DownloadCreateTemplateScreen.tsx"],"sourcesContent":["import { Button } from \"../../Button\";\nimport { ScreenLayout } from \"../ScreenLayout\";\nimport { ScreenProps } from \"./types\";\nimport { createEmptyData } from \"../createEmptyData\";\nimport { css } from \"@emotion/react\";\nimport { getTemplateFilename } from \"../getTemplateFilename\";\nimport { useNavigate } from \"../ScreenProvider\";\n\nexport interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  csvPrefix?: string;\n  headers: string[];\n}\n\nexport const DownloadCreateTemplateScreen = <Row,>({\n  headers,\n  csvPrefix,\n  onDownloadCSV,\n}: DownloadCreateTemplateScreenProps<Row>) => {\n  const { onNavigate } = useNavigate();\n\n  const handleDownloadCreateTemplate = () => {\n    const row = createEmptyData(headers) as Row;\n    onDownloadCSV({\n      data: [row],\n      filename: getTemplateFilename(\"import\", csvPrefix),\n    });\n  };\n\n  return (\n    <ScreenLayout\n      title=\"作成用CSVのダウンロード\"\n      onNext={() => {\n        onNavigate(\"loadCSV\");\n      }}\n    >\n      <div\n        css={css`\n          display: grid;\n          justify-content: center;\n        `}\n      >\n        <Button\n          variant=\"outlined\"\n          color=\"primary\"\n          onClick={handleDownloadCreateTemplate}\n        >\n          アップロード用CSVを取得\n        </Button>\n      </div>\n    </ScreenLayout>\n  );\n};\n"],"mappings":";AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,SAASC,YAAY,QAAQ,iBAAiB;AAE9C,SAASC,eAAe,QAAQ,oBAAoB;AACpD,SAASC,GAAG,QAAQ,gBAAgB;AACpC,SAASC,mBAAmB,QAAQ,wBAAwB;AAC5D,SAASC,WAAW,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,aAAA;AAAA,IAAAC,IAAA,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA;AAQhD,OAAO,IAAMC,4BAA4B,GAAGC,KAAA,IAIE;EAAA,IAJK;IACjDC,OAAO;IACPC,SAAS;IACTC;EACsC,CAAC,GAAAH,KAAA;EACvC,IAAM;IAAEI;EAAW,CAAC,GAAGjB,WAAW,CAAC,CAAC;EAEpC,IAAMkB,4BAA4B,GAAGA,CAAA,KAAM;IACzC,IAAMC,GAAG,GAAGtB,eAAe,CAACiB,OAAO,CAAQ;IAC3CE,aAAa,CAAC;MACZI,IAAI,EAAE,CAACD,GAAG,CAAC;MACXE,QAAQ,EAAEtB,mBAAmB,CAAC,QAAQ,EAAEgB,SAAS;IACnD,CAAC,CAAC;EACJ,CAAC;EAED,OACEb,aAAA,CAACN,YAAY;IACX0B,KAAK,EAAC,iEAAe;IACrBC,MAAM,EAAEA,CAAA,KAAM;MACZN,UAAU,CAAC,SAAS,CAAC;IACvB;EAAE,GAEFf,aAAA;IACEJ,GAAG,EAAAK;EAGD,GAEFD,aAAA,CAACP,MAAM;IACL6B,OAAO,EAAC,UAAU;IAClBC,KAAK,EAAC,SAAS;IACfC,OAAO,EAAER;EAA6B,GACvC,iEAEO,CACL,CACO,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"file":"DownloadCreateTemplateScreen.js","names":["Button","ScreenLayout","TableUI","Typography","createEmptyData","css","getTemplateFilename","useNavigate","useState","jsx","___EmotionJSX","_ref","process","env","NODE_ENV","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","_ref2","_ref3","DownloadCreateTemplateScreen","_ref4","headers","csvPrefix","onDownloadCSV","selectDownloadTemplateColumns","columns","onNavigate","tableData","Object","values","filter","column","hiddenOnCreateTemplate","value","label","description","required","selectedIndexes","setSelectedIndexes","handleDownloadCreateTemplate","filteredHeaders","_","index","includes","item","row","data","filename","title","onNext","variant","onSelectAll","_ref5","checked","onSelect","_ref6","prev","selectedIndex","key","renderCell","_ref7","cell","color","onClick"],"sources":["../../../../src/CSVImportUI/screens/DownloadCreateTemplateScreen.tsx"],"sourcesContent":["import { Button } from \"../../Button\";\nimport { CSVImportUIColumns } from \"../CSVImportUI\";\nimport { ScreenLayout } from \"../ScreenLayout\";\nimport { ScreenProps } from \"./types\";\nimport { TableUI } from \"../../TableUI\";\nimport { Typography } from \"@mui/material\";\nimport { createEmptyData } from \"../createEmptyData\";\nimport { css } from \"@emotion/react\";\nimport { getTemplateFilename } from \"../getTemplateFilename\";\nimport { useNavigate } from \"../ScreenProvider\";\nimport { useState } from \"react\";\n\nexport interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * @default false\n   */\n  selectDownloadTemplateColumns?: boolean;\n  csvPrefix?: string;\n  headers: string[];\n  columns: CSVImportUIColumns;\n}\n\nexport const DownloadCreateTemplateScreen = <Row,>({\n  headers,\n  csvPrefix,\n  onDownloadCSV,\n  selectDownloadTemplateColumns = false,\n  columns,\n}: DownloadCreateTemplateScreenProps<Row>) => {\n  const { onNavigate } = useNavigate();\n\n  const tableData = Object.values(columns)\n    .filter((column) => column.hiddenOnCreateTemplate !== true)\n    .map((value) => {\n      return {\n        label: value.label,\n        description: value.description,\n        required: value.required,\n      };\n    });\n\n  const [selectedIndexes, setSelectedIndexes] = useState<number[]>([]);\n\n  const handleDownloadCreateTemplate = () => {\n    const filteredHeaders = selectDownloadTemplateColumns\n      ? tableData\n          .filter((_, index) => {\n            if (tableData[index].required) {\n              return true;\n            }\n            if (selectedIndexes.includes(index)) {\n              return true;\n            }\n            return false;\n          })\n          .map((item) => item.label)\n      : headers;\n    const row = createEmptyData(filteredHeaders) as Row;\n    onDownloadCSV({\n      data: [row],\n      filename: getTemplateFilename(\"import\", csvPrefix),\n    });\n  };\n\n  return (\n    <ScreenLayout\n      title=\"作成用CSVのダウンロード\"\n      onNext={() => {\n        onNavigate(\"loadCSV\");\n      }}\n    >\n      {selectDownloadTemplateColumns ? (\n        <div\n          css={css`\n            display: grid;\n            gap: 16px;\n          `}\n        >\n          <div>\n            <Typography>編集したい項目を選択してください。</Typography>\n            <Typography variant=\"caption\">\n              ＊必須の項目は選択しない場合も、CSVファイルに出力されます。\n            </Typography>\n          </div>\n          <TableUI\n            onSelectAll={({ checked }) => {\n              if (checked) {\n                setSelectedIndexes(tableData.map((_, index) => index));\n              } else {\n                setSelectedIndexes([]);\n              }\n            }}\n            onSelect={({ index, checked }) => {\n              setSelectedIndexes((prev) => {\n                if (checked) {\n                  return [...prev, index];\n                }\n                return prev.filter((item) => item !== index);\n              });\n            }}\n            selectedIndex={selectedIndexes}\n            columns={[\n              {\n                key: \"label\",\n                title: \"カラム名\",\n              },\n              {\n                key: \"description\",\n                title: \"説明\",\n              },\n              {\n                key: \"required\",\n                title: \"必須\",\n                renderCell: ({ cell }) => {\n                  return <span>{cell.value ? \"YES\" : \"NO\"}</span>;\n                },\n              },\n            ]}\n            data={tableData}\n          />\n        </div>\n      ) : null}\n\n      <div\n        css={\n          selectDownloadTemplateColumns\n            ? css`\n                display: grid;\n                justify-content: flex-end;\n              `\n            : css`\n                display: grid;\n                justify-content: center;\n              `\n        }\n      >\n        <Button\n          variant=\"outlined\"\n          color=\"primary\"\n          onClick={handleDownloadCreateTemplate}\n        >\n          アップロード用CSVを取得\n        </Button>\n      </div>\n    </ScreenLayout>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/cjs/CSVImportUI/CSVImportUI.js

@@ -30,6 +30,7 @@ const CSVImportUIContent = ({
   onUploadDataByRow,
   acceptMode,
   skipDownloadTemplate,
+  selectDownloadTemplateColumns,
   defaultTemplateData
 }) => {
   const id = (0, _ScreenProvider.useScreen)();
@@ -73,7 +74,9 @@ const CSVImportUIContent = ({
         return (0, _react2.jsx)(_DownloadCreateTemplateScreen.DownloadCreateTemplateScreen, {
           onDownloadCSV: onDownloadCSV,
           headers: headers,
-          csvPrefix: csvPrefix
+          columns: columns,
+          csvPrefix: csvPrefix,
+          selectDownloadTemplateColumns: selectDownloadTemplateColumns
         });
       }
     case "downloadUpdateTemplate":

package/cjs/CSVImportUI/CSVImportUI.js.map

@@ -1 +1 @@
-{"version":3,"file":"CSVImportUI.js","names":["_CompleteScreen","require","_DownloadCreateTemplateScreen","_DownloadUpdateTemplateScreen","_LoadCSVScreen","_ScreenProvider","_SelectModeScreen","_UploadCSVScreen","_react","_react2","CSVImportUIContent","columns","onDownloadCSV","searchLabel","onSearchData","renderSearchField","csvPrefix","csvParser","csvValidator","onPreUploadData","onPreUploadDataByRow","onUploadData","onUploadDataByRow","acceptMode","skipDownloadTemplate","defaultTemplateData","id","useScreen","mode","setMode","useState","uploadedData","setUploadedData","errors","setErrors","handleUpdateData","useCallback","data","headers","useMemo","rowKeys","Object","keys","values","filter","column","length","hiddenIfNoHeader","includes","label","map","filledData","row","fromEntries","header","jsx","SelectModeScreen","onChangeMode","DownloadCreateTemplateScreen","DownloadUpdateTemplateScreen","onSearch","LoadCSVScreen","onUpdateData","UploadCSVScreen","onSubmitComplete","CompleteScreen","getFirstScreenId","accptMode","CSVImportUI","props","ScreenProvider","firstScreenId","exports"],"sources":["../../../src/CSVImportUI/CSVImportUI.tsx"],"sourcesContent":["import { AlertMessageType } from \"../Alert\";\nimport { AssertType } from \"../@types/AssertType\";\nimport { CompleteScreen } from \"./screens/CompleteScreen\";\nimport { DownloadCreateTemplateScreen } from \"./screens/DownloadCreateTemplateScreen\";\nimport { DownloadUpdateTemplateScreen } from \"./screens/DownloadUpdateTemplateScreen\";\nimport { LoadCSVScreen } from \"./screens/LoadCSVScreen\";\nimport { ScreenId } from \"./screens/types\";\nimport { ScreenProvider, useScreen } from \"./ScreenProvider\";\nimport { SelectModeScreen } from \"./screens/SelectModeScreen\";\nimport { UnionToIntersection } from \"../@types/UnionToIntersection\";\nimport { UploadCSVScreen } from \"./screens/UploadCSVScreen\";\nimport { useCallback, useMemo, useState } from \"react\";\n\nexport type Mode = \"create\" | \"update\";\n\nexport type CellError = [string, string];\n\nexport type CSVImportUIColumn = Readonly<{\n  label: string;\n  type?: \"date\" | \"number\";\n  options?: readonly string[];\n  required?: boolean;\n  hiddenOnCreateTemplate?: boolean;\n  /**\n   * アップロードされたCSVにヘッダーがなければ表示しない。\n   */\n  hiddenIfNoHeader?: boolean;\n  renderCell?: (props: {\n    value: string;\n    header: string;\n    row: Record<string, string>;\n  }) => JSX.Element;\n}>;\n\n/**\n * ライブラリ利用者用の型\n */\nexport type CSVImportUIColumns = Record<string, CSVImportUIColumn>;\n\nexport interface CSVImportUIRenderSearchFieldProps<Row> {\n  onChange: (args: Row[]) => void;\n}\n\ntype OptionByLabel<Columns extends CSVImportUIColumns> = {\n  [Key in keyof Columns]: Record<\n    Columns[Key][\"label\"],\n    Columns[Key] extends {\n      options: readonly (infer Option)[];\n    }\n      ? Option extends string\n        ? Option\n        : never\n      : string\n  >;\n}[keyof Columns];\n\nexport type CSVImportUIRow<Columns extends CSVImportUIColumns> = AssertType<\n  UnionToIntersection<OptionByLabel<Columns>>,\n  Record<string, string>\n>;\n\nexport interface CSVImportUIProps<\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n> {\n  /**\n   * 利用できるモードを指定する。\n   */\n  acceptMode: Mode[];\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 行ごとにデータを処理する。\n   *\n   * onPreUploadDataが指定されている場合、こちらは無視される。\n   */\n  onPreUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{ error?: CellError; data?: Record<string, string> }>;\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onPreUploadDataByRowByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onPreUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 行ごとにデータをアップロードする。\n   *\n   * onUploadDataが指定されている場合、こちらは無視される。\n   */\n  onUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{\n    error?: CellError;\n    data?: Record<string, string>;\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onUploadDataByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * 検索フォームのラベルとして利用される。\n   * (only upload mode)\n   */\n  searchLabel?: string;\n  /**\n   * 検索が行われた際にトリガーされる。\n   * ユーザーの入力した文字列に応じてデータを返却する。このデータはCSVとしてダウンロードされる。\n   * (only upload mode)\n   */\n  onSearchData?: (args: { value: string }) => Promise<{\n    data: Row[];\n  }>;\n  /**\n   * CSVの各列をどのように表示するか指定する。\n   * 各列には、次のプロパティが指定できる。\n   *\n   * `label` : CSVのヘッダーとして利用される。\n   *\n   * `type` : `date`または`number`が指定でき、それぞれ日付と数値としてアップロードされたCSVの値が正しいかどうかを検証する。\n   *\n   * `options` : その列が持てる値のリストを指定する。アップロードされたCSVの値がこのリストに含まれているかどうかを検証する。\n   *\n   * `required` : その列が必須かどうかを指定する。アップロードされたCSVの値が空でないかどうかを検証する。\n   *\n   * `renderCell` : その列のセルをどのように表示するかを指定する。その列の値、ヘッダー、行のデータが渡される。\n   *\n   * `hiddenOnCreateTemplate` : 作成用のCSVのテンプレートに、その列を表示しないかどうかを決定する。\n   *\n   * `hiddenIfNoHeader` : アップロードされたCSVにそのヘッダーがなければ、その列を表示しないかどうかを決定する。\n   */\n  columns: Columns;\n  /**\n   * ダウンロードされるCSVに付与されるプレフィックスを指定する\n   */\n  csvPrefix?: string;\n  /**\n   * CSVのダウンロードがトリガーされたときに呼ばれる\n   */\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * CSVがアップロードされたときに呼ばれる\n   */\n  csvParser: (args: {\n    file: File;\n  }) => Promise<{ data: Record<string, string>[] }>;\n  /**\n   * アップロードされたCSVのデータをバリデーションする。\n   */\n  csvValidator?: (args: {\n    /**\n     * ここで渡されるデータがRowと一致するとは限らない。\n     */\n    row: Record<string, string>;\n  }) => Promise<{ errors?: CellError[] }>;\n  /**\n   * 更新モードで検索のカスタマイズをする。\n   * 省略するとonSearchData, searchLabelを用いた単一の検索フィールドが表示される。これを指定するとonSearchData, searchLabelは無視される。\n   * (only upload mode)\n   */\n  renderSearchField?: (\n    props: CSVImportUIRenderSearchFieldProps<Row>,\n  ) => JSX.Element;\n  /**\n   * 編集用CSVをダウンロードするページをスキップする\n   */\n  skipDownloadTemplate?: boolean;\n  /**\n   * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。\n   */\n  defaultTemplateData?: Row[];\n}\n\nconst CSVImportUIContent = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>({\n  columns,\n  onDownloadCSV,\n  searchLabel,\n  onSearchData,\n  renderSearchField,\n  csvPrefix,\n  csvParser,\n  csvValidator,\n  onPreUploadData,\n  onPreUploadDataByRow,\n  onUploadData,\n  onUploadDataByRow,\n  acceptMode,\n  skipDownloadTemplate,\n  defaultTemplateData,\n}: CSVImportUIProps<Columns, Row>) => {\n  const id = useScreen();\n  const [mode, setMode] = useState<Mode>(acceptMode[0]);\n  const [uploadedData, setUploadedData] = useState<Row[]>([]);\n  const [errors, setErrors] = useState<(CellError[] | undefined)[]>([]);\n\n  const handleUpdateData = useCallback(\n    (data: Row[], errors: (CellError[] | undefined)[]) => {\n      setErrors(errors);\n      setUploadedData(data);\n    },\n    [],\n  );\n\n  const headers = useMemo(() => {\n    const rowKeys = Object.keys(uploadedData[0] ?? {});\n\n    return Object.values(columns)\n      .filter((column) => {\n        if (rowKeys.length === 0) {\n          return true;\n        }\n        if (column.hiddenIfNoHeader && !rowKeys.includes(column.label)) {\n          return false;\n        }\n        return true;\n      })\n      .map((column) => column.label);\n  }, [columns, uploadedData]);\n\n  const filledData = useMemo(() => {\n    return headers.length > Object.keys(uploadedData[0] ?? {}).length\n      ? uploadedData.map((row) => {\n          return {\n            ...Object.fromEntries(headers.map((header) => [header, \"\"])),\n            ...row,\n          };\n        })\n      : uploadedData;\n  }, [headers, uploadedData]);\n\n  switch (id) {\n    case \"selectMode\": {\n      return (\n        <SelectModeScreen\n          skipDownloadTemplate={skipDownloadTemplate}\n          onChangeMode={setMode}\n        />\n      );\n    }\n    case \"downloadCreateTemplate\": {\n      return (\n        <DownloadCreateTemplateScreen\n          onDownloadCSV={onDownloadCSV}\n          headers={headers}\n          csvPrefix={csvPrefix}\n        />\n      );\n    }\n    case \"downloadUpdateTemplate\": {\n      return (\n        <DownloadUpdateTemplateScreen\n          searchLabel={searchLabel}\n          onSearch={onSearchData}\n          renderSearchField={renderSearchField}\n          onDownloadCSV={onDownloadCSV}\n          csvPrefix={csvPrefix}\n          headers={headers}\n          defaultTemplateData={defaultTemplateData}\n          columns={columns}\n        />\n      );\n    }\n    case \"loadCSV\": {\n      return (\n        <LoadCSVScreen\n          mode={mode}\n          columns={columns}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          csvParser={csvParser}\n          csvValidator={csvValidator}\n          onPreUploadData={onPreUploadData}\n          onPreUploadDataByRow={onPreUploadDataByRow}\n          onUpdateData={handleUpdateData}\n        />\n      );\n    }\n    case \"uploadCSV\": {\n      return (\n        <UploadCSVScreen\n          mode={mode}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          columns={columns}\n          onUploadData={onUploadData}\n          onUploadDataByRow={onUploadDataByRow}\n          onSubmitComplete={handleUpdateData}\n        />\n      );\n    }\n    case \"complete\": {\n      return (\n        <CompleteScreen\n          csvPrefix={csvPrefix}\n          onDownloadCSV={onDownloadCSV}\n          data={filledData}\n          columns={columns}\n          headers={headers}\n          errors={errors}\n        />\n      );\n    }\n    default: {\n      return null;\n    }\n  }\n};\n\nconst getFirstScreenId = (\n  accptMode: Mode[],\n  skipDownloadTemplate?: boolean,\n): ScreenId => {\n  if (accptMode.length > 1) {\n    return \"selectMode\";\n  }\n  if (skipDownloadTemplate) {\n    return \"loadCSV\";\n  }\n  if (accptMode[0] === \"create\") {\n    return \"downloadCreateTemplate\";\n  }\n  if (accptMode[0] === \"update\") {\n    return \"downloadUpdateTemplate\";\n  }\n  return \"selectMode\";\n};\n\nexport const CSVImportUI = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>(\n  props: CSVImportUIProps<Columns, Row>,\n) => {\n  return (\n    <ScreenProvider\n      firstScreenId={getFirstScreenId(\n        props.acceptMode,\n        props.skipDownloadTemplate,\n      )}\n    >\n      <CSVImportUIContent {...props} />\n    </ScreenProvider>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CSVImportUI.js","names":["_CompleteScreen","require","_DownloadCreateTemplateScreen","_DownloadUpdateTemplateScreen","_LoadCSVScreen","_ScreenProvider","_SelectModeScreen","_UploadCSVScreen","_react","_react2","CSVImportUIContent","columns","onDownloadCSV","searchLabel","onSearchData","renderSearchField","csvPrefix","csvParser","csvValidator","onPreUploadData","onPreUploadDataByRow","onUploadData","onUploadDataByRow","acceptMode","skipDownloadTemplate","selectDownloadTemplateColumns","defaultTemplateData","id","useScreen","mode","setMode","useState","uploadedData","setUploadedData","errors","setErrors","handleUpdateData","useCallback","data","headers","useMemo","rowKeys","Object","keys","values","filter","column","length","hiddenIfNoHeader","includes","label","map","filledData","row","fromEntries","header","jsx","SelectModeScreen","onChangeMode","DownloadCreateTemplateScreen","DownloadUpdateTemplateScreen","onSearch","LoadCSVScreen","onUpdateData","UploadCSVScreen","onSubmitComplete","CompleteScreen","getFirstScreenId","accptMode","CSVImportUI","props","ScreenProvider","firstScreenId","exports"],"sources":["../../../src/CSVImportUI/CSVImportUI.tsx"],"sourcesContent":["import { AlertMessageType } from \"../Alert\";\nimport { AssertType } from \"../@types/AssertType\";\nimport { CompleteScreen } from \"./screens/CompleteScreen\";\nimport { DownloadCreateTemplateScreen } from \"./screens/DownloadCreateTemplateScreen\";\nimport { DownloadUpdateTemplateScreen } from \"./screens/DownloadUpdateTemplateScreen\";\nimport { LoadCSVScreen } from \"./screens/LoadCSVScreen\";\nimport { ScreenId } from \"./screens/types\";\nimport { ScreenProvider, useScreen } from \"./ScreenProvider\";\nimport { SelectModeScreen } from \"./screens/SelectModeScreen\";\nimport { UnionToIntersection } from \"../@types/UnionToIntersection\";\nimport { UploadCSVScreen } from \"./screens/UploadCSVScreen\";\nimport { useCallback, useMemo, useState } from \"react\";\n\nexport type Mode = \"create\" | \"update\";\n\nexport type CellError = [string, string];\n\nexport type CSVImportUIColumn = Readonly<{\n  label: string;\n  description?: string;\n  type?: \"date\" | \"number\";\n  options?: readonly string[];\n  required?: boolean;\n  hiddenOnCreateTemplate?: boolean;\n  /**\n   * アップロードされたCSVにヘッダーがなければ表示しない。\n   */\n  hiddenIfNoHeader?: boolean;\n  renderCell?: (props: {\n    value: string;\n    header: string;\n    row: Record<string, string>;\n  }) => JSX.Element;\n}>;\n\n/**\n * ライブラリ利用者用の型\n */\nexport type CSVImportUIColumns = Record<string, CSVImportUIColumn>;\n\nexport interface CSVImportUIRenderSearchFieldProps<Row> {\n  onChange: (args: Row[]) => void;\n}\n\ntype OptionByLabel<Columns extends CSVImportUIColumns> = {\n  [Key in keyof Columns]: Record<\n    Columns[Key][\"label\"],\n    Columns[Key] extends {\n      options: readonly (infer Option)[];\n    }\n      ? Option extends string\n        ? Option\n        : never\n      : string\n  >;\n}[keyof Columns];\n\nexport type CSVImportUIRow<Columns extends CSVImportUIColumns> = AssertType<\n  UnionToIntersection<OptionByLabel<Columns>>,\n  Record<string, string>\n>;\n\nexport interface CSVImportUIProps<\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n> {\n  /**\n   * 利用できるモードを指定する。\n   */\n  acceptMode: Mode[];\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 行ごとにデータを処理する。\n   *\n   * onPreUploadDataが指定されている場合、こちらは無視される。\n   */\n  onPreUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{ error?: CellError; data?: Record<string, string> }>;\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onPreUploadDataByRowByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onPreUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 行ごとにデータをアップロードする。\n   *\n   * onUploadDataが指定されている場合、こちらは無視される。\n   */\n  onUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{\n    error?: CellError;\n    data?: Record<string, string>;\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onUploadDataByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * 検索フォームのラベルとして利用される。\n   * (only upload mode)\n   */\n  searchLabel?: string;\n  /**\n   * 検索が行われた際にトリガーされる。\n   * ユーザーの入力した文字列に応じてデータを返却する。このデータはCSVとしてダウンロードされる。\n   * (only upload mode)\n   */\n  onSearchData?: (args: { value: string }) => Promise<{\n    data: Row[];\n  }>;\n  /**\n   * CSVの各列をどのように表示するか指定する。\n   * 各列には、次のプロパティが指定できる。\n   *\n   * `label` : CSVのヘッダーとして利用される。\n   *\n   * `type` : `date`または`number`が指定でき、それぞれ日付と数値としてアップロードされたCSVの値が正しいかどうかを検証する。\n   *\n   * `options` : その列が持てる値のリストを指定する。アップロードされたCSVの値がこのリストに含まれているかどうかを検証する。\n   *\n   * `required` : その列が必須かどうかを指定する。アップロードされたCSVの値が空でないかどうかを検証する。\n   *\n   * `renderCell` : その列のセルをどのように表示するかを指定する。その列の値、ヘッダー、行のデータが渡される。\n   *\n   * `hiddenOnCreateTemplate` : 作成用のCSVのテンプレートに、その列を表示しないかどうかを決定する。\n   *\n   * `hiddenIfNoHeader` : アップロードされたCSVにそのヘッダーがなければ、その列を表示しないかどうかを決定する。\n   */\n  columns: Columns;\n  /**\n   * ダウンロードされるCSVに付与されるプレフィックスを指定する\n   */\n  csvPrefix?: string;\n  /**\n   * CSVのダウンロードがトリガーされたときに呼ばれる\n   */\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * CSVがアップロードされたときに呼ばれる\n   */\n  csvParser: (args: {\n    file: File;\n  }) => Promise<{ data: Record<string, string>[] }>;\n  /**\n   * アップロードされたCSVのデータをバリデーションする。\n   */\n  csvValidator?: (args: {\n    /**\n     * ここで渡されるデータがRowと一致するとは限らない。\n     */\n    row: Record<string, string>;\n  }) => Promise<{ errors?: CellError[] }>;\n  /**\n   * 更新モードで検索のカスタマイズをする。\n   * 省略するとonSearchData, searchLabelを用いた単一の検索フィールドが表示される。これを指定するとonSearchData, searchLabelは無視される。\n   * (only upload mode)\n   */\n  renderSearchField?: (\n    props: CSVImportUIRenderSearchFieldProps<Row>,\n  ) => JSX.Element;\n  /**\n   * 編集用CSVをダウンロードするページをスキップする\n   */\n  skipDownloadTemplate?: boolean;\n  /**\n   * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。\n   */\n  defaultTemplateData?: Row[];\n\n  /**\n   * ダウンロードテンプレートで利用する項目を選択するかどうかを指定する。\n   * デフォルトでは、hiddenOnCreateTemplateが指定されていない列の全ての項目が追加される。\n   * @default false\n   */\n  selectDownloadTemplateColumns?: boolean;\n}\n\nconst CSVImportUIContent = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>({\n  columns,\n  onDownloadCSV,\n  searchLabel,\n  onSearchData,\n  renderSearchField,\n  csvPrefix,\n  csvParser,\n  csvValidator,\n  onPreUploadData,\n  onPreUploadDataByRow,\n  onUploadData,\n  onUploadDataByRow,\n  acceptMode,\n  skipDownloadTemplate,\n  selectDownloadTemplateColumns,\n  defaultTemplateData,\n}: CSVImportUIProps<Columns, Row>) => {\n  const id = useScreen();\n  const [mode, setMode] = useState<Mode>(acceptMode[0]);\n  const [uploadedData, setUploadedData] = useState<Row[]>([]);\n  const [errors, setErrors] = useState<(CellError[] | undefined)[]>([]);\n\n  const handleUpdateData = useCallback(\n    (data: Row[], errors: (CellError[] | undefined)[]) => {\n      setErrors(errors);\n      setUploadedData(data);\n    },\n    [],\n  );\n\n  const headers = useMemo(() => {\n    const rowKeys = Object.keys(uploadedData[0] ?? {});\n\n    return Object.values(columns)\n      .filter((column) => {\n        if (rowKeys.length === 0) {\n          return true;\n        }\n        if (column.hiddenIfNoHeader && !rowKeys.includes(column.label)) {\n          return false;\n        }\n        return true;\n      })\n      .map((column) => column.label);\n  }, [columns, uploadedData]);\n\n  const filledData = useMemo(() => {\n    return headers.length > Object.keys(uploadedData[0] ?? {}).length\n      ? uploadedData.map((row) => {\n          return {\n            ...Object.fromEntries(headers.map((header) => [header, \"\"])),\n            ...row,\n          };\n        })\n      : uploadedData;\n  }, [headers, uploadedData]);\n\n  switch (id) {\n    case \"selectMode\": {\n      return (\n        <SelectModeScreen\n          skipDownloadTemplate={skipDownloadTemplate}\n          onChangeMode={setMode}\n        />\n      );\n    }\n    case \"downloadCreateTemplate\": {\n      return (\n        <DownloadCreateTemplateScreen\n          onDownloadCSV={onDownloadCSV}\n          headers={headers}\n          columns={columns}\n          csvPrefix={csvPrefix}\n          selectDownloadTemplateColumns={selectDownloadTemplateColumns}\n        />\n      );\n    }\n    case \"downloadUpdateTemplate\": {\n      return (\n        <DownloadUpdateTemplateScreen\n          searchLabel={searchLabel}\n          onSearch={onSearchData}\n          renderSearchField={renderSearchField}\n          onDownloadCSV={onDownloadCSV}\n          csvPrefix={csvPrefix}\n          headers={headers}\n          defaultTemplateData={defaultTemplateData}\n          columns={columns}\n        />\n      );\n    }\n    case \"loadCSV\": {\n      return (\n        <LoadCSVScreen\n          mode={mode}\n          columns={columns}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          csvParser={csvParser}\n          csvValidator={csvValidator}\n          onPreUploadData={onPreUploadData}\n          onPreUploadDataByRow={onPreUploadDataByRow}\n          onUpdateData={handleUpdateData}\n        />\n      );\n    }\n    case \"uploadCSV\": {\n      return (\n        <UploadCSVScreen\n          mode={mode}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          columns={columns}\n          onUploadData={onUploadData}\n          onUploadDataByRow={onUploadDataByRow}\n          onSubmitComplete={handleUpdateData}\n        />\n      );\n    }\n    case \"complete\": {\n      return (\n        <CompleteScreen\n          csvPrefix={csvPrefix}\n          onDownloadCSV={onDownloadCSV}\n          data={filledData}\n          columns={columns}\n          headers={headers}\n          errors={errors}\n        />\n      );\n    }\n    default: {\n      return null;\n    }\n  }\n};\n\nconst getFirstScreenId = (\n  accptMode: Mode[],\n  skipDownloadTemplate?: boolean,\n): ScreenId => {\n  if (accptMode.length > 1) {\n    return \"selectMode\";\n  }\n  if (skipDownloadTemplate) {\n    return \"loadCSV\";\n  }\n  if (accptMode[0] === \"create\") {\n    return \"downloadCreateTemplate\";\n  }\n  if (accptMode[0] === \"update\") {\n    return \"downloadUpdateTemplate\";\n  }\n  return \"selectMode\";\n};\n\nexport const CSVImportUI = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>(\n  props: CSVImportUIProps<Columns, Row>,\n) => {\n  return (\n    <ScreenProvider\n      firstScreenId={getFirstScreenId(\n        props.acceptMode,\n        props.skipDownloadTemplate,\n      )}\n    >\n      <CSVImportUIContent {...props} />\n    </ScreenProvider>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/cjs/CSVImportUI/screens/DownloadCreateTemplateScreen.js

@@ -4,10 +4,13 @@ exports.__esModule = true;
 exports.DownloadCreateTemplateScreen = void 0;
 var _Button = require("../../Button");
 var _ScreenLayout = require("../ScreenLayout");
+var _TableUI = require("../../TableUI");
+var _material = require("@mui/material");
 var _createEmptyData = require("../createEmptyData");
 var _react = require("@emotion/react");
 var _getTemplateFilename = require("../getTemplateFilename");
 var _ScreenProvider = require("../ScreenProvider");
+var _react2 = require("react");
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "rh2lbx",
@@ -15,19 +18,56 @@ var _ref = process.env.NODE_ENV === "production" ? {
 } : {
   name: "1r8vue8-DownloadCreateTemplateScreen",
   styles: "display:grid;justify-content:center;label:DownloadCreateTemplateScreen;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFDZ0IiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBTY3JlZW5MYXlvdXQgfSBmcm9tIFwiLi4vU2NyZWVuTGF5b3V0XCI7XG5pbXBvcnQgeyBTY3JlZW5Qcm9wcyB9IGZyb20gXCIuL3R5cGVzXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcblxuZXhwb3J0IGludGVyZmFjZSBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuUHJvcHM8Um93PiBleHRlbmRzIFNjcmVlblByb3BzIHtcbiAgb25Eb3dubG9hZENTVjogKGFyZ3M6IHsgZGF0YTogUm93W107IGZpbGVuYW1lOiBzdHJpbmcgfSkgPT4gdm9pZDtcbiAgY3N2UHJlZml4Pzogc3RyaW5nO1xuICBoZWFkZXJzOiBzdHJpbmdbXTtcbn1cblxuZXhwb3J0IGNvbnN0IERvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4gPSA8Um93LD4oe1xuICBoZWFkZXJzLFxuICBjc3ZQcmVmaXgsXG4gIG9uRG93bmxvYWRDU1YsXG59OiBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuUHJvcHM8Um93PikgPT4ge1xuICBjb25zdCB7IG9uTmF2aWdhdGUgfSA9IHVzZU5hdmlnYXRlKCk7XG5cbiAgY29uc3QgaGFuZGxlRG93bmxvYWRDcmVhdGVUZW1wbGF0ZSA9ICgpID0+IHtcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoaGVhZGVycykgYXMgUm93O1xuICAgIG9uRG93bmxvYWRDU1Yoe1xuICAgICAgZGF0YTogW3Jvd10sXG4gICAgICBmaWxlbmFtZTogZ2V0VGVtcGxhdGVGaWxlbmFtZShcImltcG9ydFwiLCBjc3ZQcmVmaXgpLFxuICAgIH0pO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFNjcmVlbkxheW91dFxuICAgICAgdGl0bGU9XCLkvZzmiJDnlKhDU1bjga7jg4Djgqbjg7Pjg63jg7zjg4lcIlxuICAgICAgb25OZXh0PXsoKSA9PiB7XG4gICAgICAgIG9uTmF2aWdhdGUoXCJsb2FkQ1NWXCIpO1xuICAgICAgfX1cbiAgICA+XG4gICAgICA8ZGl2XG4gICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxCdXR0b25cbiAgICAgICAgICB2YXJpYW50PVwib3V0bGluZWRcIlxuICAgICAgICAgIGNvbG9yPVwicHJpbWFyeVwiXG4gICAgICAgICAgb25DbGljaz17aGFuZGxlRG93bmxvYWRDcmVhdGVUZW1wbGF0ZX1cbiAgICAgICAgPlxuICAgICAgICAgIOOCouODg+ODl+ODreODvOODieeUqENTVuOCkuWPluW+l1xuICAgICAgICA8L0J1dHRvbj5cbiAgICAgIDwvZGl2PlxuICAgIDwvU2NyZWVuTGF5b3V0PlxuICApO1xufTtcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1JaUIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+var _ref2 = process.env.NODE_ENV === "production" ? {
+  name: "1oecb4n",
+  styles: "display:grid;justify-content:flex-end"
+} : {
+  name: "hizbmn-DownloadCreateTemplateScreen",
+  styles: "display:grid;justify-content:flex-end;label:DownloadCreateTemplateScreen;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStIaUIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+var _ref3 = process.env.NODE_ENV === "production" ? {
+  name: "1d16ou4",
+  styles: "display:grid;gap:16px"
+} : {
+  name: "16r19s5-DownloadCreateTemplateScreen",
+  styles: "display:grid;gap:16px;label:DownloadCreateTemplateScreen;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBFa0IiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 const DownloadCreateTemplateScreen = ({
   headers,
   csvPrefix,
-  onDownloadCSV
+  onDownloadCSV,
+  selectDownloadTemplateColumns = false,
+  columns
 }) => {
   const {
     onNavigate
   } = (0, _ScreenProvider.useNavigate)();
+  const tableData = Object.values(columns).filter(column => column.hiddenOnCreateTemplate !== true).map(value => {
+    return {
+      label: value.label,
+      description: value.description,
+      required: value.required
+    };
+  });
+  const [selectedIndexes, setSelectedIndexes] = (0, _react2.useState)([]);
   const handleDownloadCreateTemplate = () => {
-    const row = (0, _createEmptyData.createEmptyData)(headers);
+    const filteredHeaders = selectDownloadTemplateColumns ? tableData.filter((_, index) => {
+      if (tableData[index].required) {
+        return true;
+      }
+      if (selectedIndexes.includes(index)) {
+        return true;
+      }
+      return false;
+    }).map(item => item.label) : headers;
+    const row = (0, _createEmptyData.createEmptyData)(filteredHeaders);
     onDownloadCSV({
       data: [row],
       filename: (0, _getTemplateFilename.getTemplateFilename)("import", csvPrefix)
@@ -38,8 +78,50 @@ const DownloadCreateTemplateScreen = ({
     onNext: () => {
       onNavigate("loadCSV");
     }
-  }, (0, _react.jsx)("div", {
-    css: _ref
+  }, selectDownloadTemplateColumns ? (0, _react.jsx)("div", {
+    css: _ref3
+  }, (0, _react.jsx)("div", null, (0, _react.jsx)(_material.Typography, null, "\u7DE8\u96C6\u3057\u305F\u3044\u9805\u76EE\u3092\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044\u3002"), (0, _react.jsx)(_material.Typography, {
+    variant: "caption"
+  }, "\uFF0A\u5FC5\u9808\u306E\u9805\u76EE\u306F\u9078\u629E\u3057\u306A\u3044\u5834\u5408\u3082\u3001CSV\u30D5\u30A1\u30A4\u30EB\u306B\u51FA\u529B\u3055\u308C\u307E\u3059\u3002")), (0, _react.jsx)(_TableUI.TableUI, {
+    onSelectAll: ({
+      checked
+    }) => {
+      if (checked) {
+        setSelectedIndexes(tableData.map((_, index) => index));
+      } else {
+        setSelectedIndexes([]);
+      }
+    },
+    onSelect: ({
+      index,
+      checked
+    }) => {
+      setSelectedIndexes(prev => {
+        if (checked) {
+          return [...prev, index];
+        }
+        return prev.filter(item => item !== index);
+      });
+    },
+    selectedIndex: selectedIndexes,
+    columns: [{
+      key: "label",
+      title: "カラム名"
+    }, {
+      key: "description",
+      title: "説明"
+    }, {
+      key: "required",
+      title: "必須",
+      renderCell: ({
+        cell
+      }) => {
+        return (0, _react.jsx)("span", null, cell.value ? "YES" : "NO");
+      }
+    }],
+    data: tableData
+  })) : null, (0, _react.jsx)("div", {
+    css: selectDownloadTemplateColumns ? _ref2 : _ref
   }, (0, _react.jsx)(_Button.Button, {
     variant: "outlined",
     color: "primary",

package/cjs/CSVImportUI/screens/DownloadCreateTemplateScreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"DownloadCreateTemplateScreen.js","names":["_Button","require","_ScreenLayout","_createEmptyData","_react","_getTemplateFilename","_ScreenProvider","_EMOTION_STRINGIFIED_CSS_ERROR__","_ref","process","env","NODE_ENV","name","styles","map","toString","DownloadCreateTemplateScreen","headers","csvPrefix","onDownloadCSV","onNavigate","useNavigate","handleDownloadCreateTemplate","row","createEmptyData","data","filename","getTemplateFilename","jsx","ScreenLayout","title","onNext","css","Button","variant","color","onClick","exports"],"sources":["../../../../src/CSVImportUI/screens/DownloadCreateTemplateScreen.tsx"],"sourcesContent":["import { Button } from \"../../Button\";\nimport { ScreenLayout } from \"../ScreenLayout\";\nimport { ScreenProps } from \"./types\";\nimport { createEmptyData } from \"../createEmptyData\";\nimport { css } from \"@emotion/react\";\nimport { getTemplateFilename } from \"../getTemplateFilename\";\nimport { useNavigate } from \"../ScreenProvider\";\n\nexport interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  csvPrefix?: string;\n  headers: string[];\n}\n\nexport const DownloadCreateTemplateScreen = <Row,>({\n  headers,\n  csvPrefix,\n  onDownloadCSV,\n}: DownloadCreateTemplateScreenProps<Row>) => {\n  const { onNavigate } = useNavigate();\n\n  const handleDownloadCreateTemplate = () => {\n    const row = createEmptyData(headers) as Row;\n    onDownloadCSV({\n      data: [row],\n      filename: getTemplateFilename(\"import\", csvPrefix),\n    });\n  };\n\n  return (\n    <ScreenLayout\n      title=\"作成用CSVのダウンロード\"\n      onNext={() => {\n        onNavigate(\"loadCSV\");\n      }}\n    >\n      <div\n        css={css`\n          display: grid;\n          justify-content: center;\n        `}\n      >\n        <Button\n          variant=\"outlined\"\n          color=\"primary\"\n          onClick={handleDownloadCreateTemplate}\n        >\n          アップロード用CSVを取得\n        </Button>\n      </div>\n    </ScreenLayout>\n  );\n};\n"],"mappings":";;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AAEA,IAAAE,gBAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,oBAAA,GAAAJ,OAAA;AACA,IAAAK,eAAA,GAAAL,OAAA;AAAgD,SAAAM,iCAAA;AAAA,IAAAC,IAAA,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAR;AAAA;AAQzC,MAAMS,4BAA4B,GAAGA,CAAO;EACjDC,OAAO;EACPC,SAAS;EACTC;AACsC,CAAC,KAAK;EAC5C,MAAM;IAAEC;EAAW,CAAC,GAAG,IAAAC,2BAAW,EAAC,CAAC;EAEpC,MAAMC,4BAA4B,GAAGA,CAAA,KAAM;IACzC,MAAMC,GAAG,GAAG,IAAAC,gCAAe,EAACP,OAAO,CAAQ;IAC3CE,aAAa,CAAC;MACZM,IAAI,EAAE,CAACF,GAAG,CAAC;MACXG,QAAQ,EAAE,IAAAC,wCAAmB,EAAC,QAAQ,EAAET,SAAS;IACnD,CAAC,CAAC;EACJ,CAAC;EAED,OACE,IAAAd,MAAA,CAAAwB,GAAA,EAAC1B,aAAA,CAAA2B,YAAY;IACXC,KAAK,EAAC,iEAAe;IACrBC,MAAM,EAAEA,CAAA,KAAM;MACZX,UAAU,CAAC,SAAS,CAAC;IACvB;EAAE,GAEF,IAAAhB,MAAA,CAAAwB,GAAA;IACEI,GAAG,EAAAxB;EAGD,GAEF,IAAAJ,MAAA,CAAAwB,GAAA,EAAC5B,OAAA,CAAAiC,MAAM;IACLC,OAAO,EAAC,UAAU;IAClBC,KAAK,EAAC,SAAS;IACfC,OAAO,EAAEd;EAA6B,GACvC,iEAEO,CACL,CACO,CAAC;AAEnB,CAAC;AAACe,OAAA,CAAArB,4BAAA,GAAAA,4BAAA","ignoreList":[]}
+{"version":3,"file":"DownloadCreateTemplateScreen.js","names":["_Button","require","_ScreenLayout","_TableUI","_material","_createEmptyData","_react","_getTemplateFilename","_ScreenProvider","_react2","_EMOTION_STRINGIFIED_CSS_ERROR__","_ref","process","env","NODE_ENV","name","styles","map","toString","_ref2","_ref3","DownloadCreateTemplateScreen","headers","csvPrefix","onDownloadCSV","selectDownloadTemplateColumns","columns","onNavigate","useNavigate","tableData","Object","values","filter","column","hiddenOnCreateTemplate","value","label","description","required","selectedIndexes","setSelectedIndexes","useState","handleDownloadCreateTemplate","filteredHeaders","_","index","includes","item","row","createEmptyData","data","filename","getTemplateFilename","jsx","ScreenLayout","title","onNext","css","Typography","variant","TableUI","onSelectAll","checked","onSelect","prev","selectedIndex","key","renderCell","cell","Button","color","onClick","exports"],"sources":["../../../../src/CSVImportUI/screens/DownloadCreateTemplateScreen.tsx"],"sourcesContent":["import { Button } from \"../../Button\";\nimport { CSVImportUIColumns } from \"../CSVImportUI\";\nimport { ScreenLayout } from \"../ScreenLayout\";\nimport { ScreenProps } from \"./types\";\nimport { TableUI } from \"../../TableUI\";\nimport { Typography } from \"@mui/material\";\nimport { createEmptyData } from \"../createEmptyData\";\nimport { css } from \"@emotion/react\";\nimport { getTemplateFilename } from \"../getTemplateFilename\";\nimport { useNavigate } from \"../ScreenProvider\";\nimport { useState } from \"react\";\n\nexport interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * @default false\n   */\n  selectDownloadTemplateColumns?: boolean;\n  csvPrefix?: string;\n  headers: string[];\n  columns: CSVImportUIColumns;\n}\n\nexport const DownloadCreateTemplateScreen = <Row,>({\n  headers,\n  csvPrefix,\n  onDownloadCSV,\n  selectDownloadTemplateColumns = false,\n  columns,\n}: DownloadCreateTemplateScreenProps<Row>) => {\n  const { onNavigate } = useNavigate();\n\n  const tableData = Object.values(columns)\n    .filter((column) => column.hiddenOnCreateTemplate !== true)\n    .map((value) => {\n      return {\n        label: value.label,\n        description: value.description,\n        required: value.required,\n      };\n    });\n\n  const [selectedIndexes, setSelectedIndexes] = useState<number[]>([]);\n\n  const handleDownloadCreateTemplate = () => {\n    const filteredHeaders = selectDownloadTemplateColumns\n      ? tableData\n          .filter((_, index) => {\n            if (tableData[index].required) {\n              return true;\n            }\n            if (selectedIndexes.includes(index)) {\n              return true;\n            }\n            return false;\n          })\n          .map((item) => item.label)\n      : headers;\n    const row = createEmptyData(filteredHeaders) as Row;\n    onDownloadCSV({\n      data: [row],\n      filename: getTemplateFilename(\"import\", csvPrefix),\n    });\n  };\n\n  return (\n    <ScreenLayout\n      title=\"作成用CSVのダウンロード\"\n      onNext={() => {\n        onNavigate(\"loadCSV\");\n      }}\n    >\n      {selectDownloadTemplateColumns ? (\n        <div\n          css={css`\n            display: grid;\n            gap: 16px;\n          `}\n        >\n          <div>\n            <Typography>編集したい項目を選択してください。</Typography>\n            <Typography variant=\"caption\">\n              ＊必須の項目は選択しない場合も、CSVファイルに出力されます。\n            </Typography>\n          </div>\n          <TableUI\n            onSelectAll={({ checked }) => {\n              if (checked) {\n                setSelectedIndexes(tableData.map((_, index) => index));\n              } else {\n                setSelectedIndexes([]);\n              }\n            }}\n            onSelect={({ index, checked }) => {\n              setSelectedIndexes((prev) => {\n                if (checked) {\n                  return [...prev, index];\n                }\n                return prev.filter((item) => item !== index);\n              });\n            }}\n            selectedIndex={selectedIndexes}\n            columns={[\n              {\n                key: \"label\",\n                title: \"カラム名\",\n              },\n              {\n                key: \"description\",\n                title: \"説明\",\n              },\n              {\n                key: \"required\",\n                title: \"必須\",\n                renderCell: ({ cell }) => {\n                  return <span>{cell.value ? \"YES\" : \"NO\"}</span>;\n                },\n              },\n            ]}\n            data={tableData}\n          />\n        </div>\n      ) : null}\n\n      <div\n        css={\n          selectDownloadTemplateColumns\n            ? css`\n                display: grid;\n                justify-content: flex-end;\n              `\n            : css`\n                display: grid;\n                justify-content: center;\n              `\n        }\n      >\n        <Button\n          variant=\"outlined\"\n          color=\"primary\"\n          onClick={handleDownloadCreateTemplate}\n        >\n          アップロード用CSVを取得\n        </Button>\n      </div>\n    </ScreenLayout>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/esm/CSVImportUI/CSVImportUI.js

@@ -28,6 +28,7 @@ var CSVImportUIContent = _ref => {
     onUploadDataByRow,
     acceptMode,
     skipDownloadTemplate,
+    selectDownloadTemplateColumns,
     defaultTemplateData
   } = _ref;
   var id = useScreen();
@@ -70,7 +71,9 @@ var CSVImportUIContent = _ref => {
         return ___EmotionJSX(DownloadCreateTemplateScreen, {
           onDownloadCSV: onDownloadCSV,
           headers: headers,
-          csvPrefix: csvPrefix
+          columns: columns,
+          csvPrefix: csvPrefix,
+          selectDownloadTemplateColumns: selectDownloadTemplateColumns
         });
       }
     case "downloadUpdateTemplate":

package/esm/CSVImportUI/CSVImportUI.js.map

@@ -1 +1 @@
-{"version":3,"file":"CSVImportUI.js","names":["CompleteScreen","DownloadCreateTemplateScreen","DownloadUpdateTemplateScreen","LoadCSVScreen","ScreenProvider","useScreen","SelectModeScreen","UploadCSVScreen","useCallback","useMemo","useState","jsx","___EmotionJSX","CSVImportUIContent","_ref","columns","onDownloadCSV","searchLabel","onSearchData","renderSearchField","csvPrefix","csvParser","csvValidator","onPreUploadData","onPreUploadDataByRow","onUploadData","onUploadDataByRow","acceptMode","skipDownloadTemplate","defaultTemplateData","id","mode","setMode","uploadedData","setUploadedData","errors","setErrors","handleUpdateData","data","headers","_uploadedData$","rowKeys","Object","keys","values","filter","column","length","hiddenIfNoHeader","includes","label","map","filledData","_uploadedData$2","row","_extends","fromEntries","header","onChangeMode","onSearch","onUpdateData","onSubmitComplete","getFirstScreenId","accptMode","CSVImportUI","props","firstScreenId"],"sources":["../../../src/CSVImportUI/CSVImportUI.tsx"],"sourcesContent":["import { AlertMessageType } from \"../Alert\";\nimport { AssertType } from \"../@types/AssertType\";\nimport { CompleteScreen } from \"./screens/CompleteScreen\";\nimport { DownloadCreateTemplateScreen } from \"./screens/DownloadCreateTemplateScreen\";\nimport { DownloadUpdateTemplateScreen } from \"./screens/DownloadUpdateTemplateScreen\";\nimport { LoadCSVScreen } from \"./screens/LoadCSVScreen\";\nimport { ScreenId } from \"./screens/types\";\nimport { ScreenProvider, useScreen } from \"./ScreenProvider\";\nimport { SelectModeScreen } from \"./screens/SelectModeScreen\";\nimport { UnionToIntersection } from \"../@types/UnionToIntersection\";\nimport { UploadCSVScreen } from \"./screens/UploadCSVScreen\";\nimport { useCallback, useMemo, useState } from \"react\";\n\nexport type Mode = \"create\" | \"update\";\n\nexport type CellError = [string, string];\n\nexport type CSVImportUIColumn = Readonly<{\n  label: string;\n  type?: \"date\" | \"number\";\n  options?: readonly string[];\n  required?: boolean;\n  hiddenOnCreateTemplate?: boolean;\n  /**\n   * アップロードされたCSVにヘッダーがなければ表示しない。\n   */\n  hiddenIfNoHeader?: boolean;\n  renderCell?: (props: {\n    value: string;\n    header: string;\n    row: Record<string, string>;\n  }) => JSX.Element;\n}>;\n\n/**\n * ライブラリ利用者用の型\n */\nexport type CSVImportUIColumns = Record<string, CSVImportUIColumn>;\n\nexport interface CSVImportUIRenderSearchFieldProps<Row> {\n  onChange: (args: Row[]) => void;\n}\n\ntype OptionByLabel<Columns extends CSVImportUIColumns> = {\n  [Key in keyof Columns]: Record<\n    Columns[Key][\"label\"],\n    Columns[Key] extends {\n      options: readonly (infer Option)[];\n    }\n      ? Option extends string\n        ? Option\n        : never\n      : string\n  >;\n}[keyof Columns];\n\nexport type CSVImportUIRow<Columns extends CSVImportUIColumns> = AssertType<\n  UnionToIntersection<OptionByLabel<Columns>>,\n  Record<string, string>\n>;\n\nexport interface CSVImportUIProps<\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n> {\n  /**\n   * 利用できるモードを指定する。\n   */\n  acceptMode: Mode[];\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 行ごとにデータを処理する。\n   *\n   * onPreUploadDataが指定されている場合、こちらは無視される。\n   */\n  onPreUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{ error?: CellError; data?: Record<string, string> }>;\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onPreUploadDataByRowByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onPreUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 行ごとにデータをアップロードする。\n   *\n   * onUploadDataが指定されている場合、こちらは無視される。\n   */\n  onUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{\n    error?: CellError;\n    data?: Record<string, string>;\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onUploadDataByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * 検索フォームのラベルとして利用される。\n   * (only upload mode)\n   */\n  searchLabel?: string;\n  /**\n   * 検索が行われた際にトリガーされる。\n   * ユーザーの入力した文字列に応じてデータを返却する。このデータはCSVとしてダウンロードされる。\n   * (only upload mode)\n   */\n  onSearchData?: (args: { value: string }) => Promise<{\n    data: Row[];\n  }>;\n  /**\n   * CSVの各列をどのように表示するか指定する。\n   * 各列には、次のプロパティが指定できる。\n   *\n   * `label` : CSVのヘッダーとして利用される。\n   *\n   * `type` : `date`または`number`が指定でき、それぞれ日付と数値としてアップロードされたCSVの値が正しいかどうかを検証する。\n   *\n   * `options` : その列が持てる値のリストを指定する。アップロードされたCSVの値がこのリストに含まれているかどうかを検証する。\n   *\n   * `required` : その列が必須かどうかを指定する。アップロードされたCSVの値が空でないかどうかを検証する。\n   *\n   * `renderCell` : その列のセルをどのように表示するかを指定する。その列の値、ヘッダー、行のデータが渡される。\n   *\n   * `hiddenOnCreateTemplate` : 作成用のCSVのテンプレートに、その列を表示しないかどうかを決定する。\n   *\n   * `hiddenIfNoHeader` : アップロードされたCSVにそのヘッダーがなければ、その列を表示しないかどうかを決定する。\n   */\n  columns: Columns;\n  /**\n   * ダウンロードされるCSVに付与されるプレフィックスを指定する\n   */\n  csvPrefix?: string;\n  /**\n   * CSVのダウンロードがトリガーされたときに呼ばれる\n   */\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * CSVがアップロードされたときに呼ばれる\n   */\n  csvParser: (args: {\n    file: File;\n  }) => Promise<{ data: Record<string, string>[] }>;\n  /**\n   * アップロードされたCSVのデータをバリデーションする。\n   */\n  csvValidator?: (args: {\n    /**\n     * ここで渡されるデータがRowと一致するとは限らない。\n     */\n    row: Record<string, string>;\n  }) => Promise<{ errors?: CellError[] }>;\n  /**\n   * 更新モードで検索のカスタマイズをする。\n   * 省略するとonSearchData, searchLabelを用いた単一の検索フィールドが表示される。これを指定するとonSearchData, searchLabelは無視される。\n   * (only upload mode)\n   */\n  renderSearchField?: (\n    props: CSVImportUIRenderSearchFieldProps<Row>,\n  ) => JSX.Element;\n  /**\n   * 編集用CSVをダウンロードするページをスキップする\n   */\n  skipDownloadTemplate?: boolean;\n  /**\n   * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。\n   */\n  defaultTemplateData?: Row[];\n}\n\nconst CSVImportUIContent = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>({\n  columns,\n  onDownloadCSV,\n  searchLabel,\n  onSearchData,\n  renderSearchField,\n  csvPrefix,\n  csvParser,\n  csvValidator,\n  onPreUploadData,\n  onPreUploadDataByRow,\n  onUploadData,\n  onUploadDataByRow,\n  acceptMode,\n  skipDownloadTemplate,\n  defaultTemplateData,\n}: CSVImportUIProps<Columns, Row>) => {\n  const id = useScreen();\n  const [mode, setMode] = useState<Mode>(acceptMode[0]);\n  const [uploadedData, setUploadedData] = useState<Row[]>([]);\n  const [errors, setErrors] = useState<(CellError[] | undefined)[]>([]);\n\n  const handleUpdateData = useCallback(\n    (data: Row[], errors: (CellError[] | undefined)[]) => {\n      setErrors(errors);\n      setUploadedData(data);\n    },\n    [],\n  );\n\n  const headers = useMemo(() => {\n    const rowKeys = Object.keys(uploadedData[0] ?? {});\n\n    return Object.values(columns)\n      .filter((column) => {\n        if (rowKeys.length === 0) {\n          return true;\n        }\n        if (column.hiddenIfNoHeader && !rowKeys.includes(column.label)) {\n          return false;\n        }\n        return true;\n      })\n      .map((column) => column.label);\n  }, [columns, uploadedData]);\n\n  const filledData = useMemo(() => {\n    return headers.length > Object.keys(uploadedData[0] ?? {}).length\n      ? uploadedData.map((row) => {\n          return {\n            ...Object.fromEntries(headers.map((header) => [header, \"\"])),\n            ...row,\n          };\n        })\n      : uploadedData;\n  }, [headers, uploadedData]);\n\n  switch (id) {\n    case \"selectMode\": {\n      return (\n        <SelectModeScreen\n          skipDownloadTemplate={skipDownloadTemplate}\n          onChangeMode={setMode}\n        />\n      );\n    }\n    case \"downloadCreateTemplate\": {\n      return (\n        <DownloadCreateTemplateScreen\n          onDownloadCSV={onDownloadCSV}\n          headers={headers}\n          csvPrefix={csvPrefix}\n        />\n      );\n    }\n    case \"downloadUpdateTemplate\": {\n      return (\n        <DownloadUpdateTemplateScreen\n          searchLabel={searchLabel}\n          onSearch={onSearchData}\n          renderSearchField={renderSearchField}\n          onDownloadCSV={onDownloadCSV}\n          csvPrefix={csvPrefix}\n          headers={headers}\n          defaultTemplateData={defaultTemplateData}\n          columns={columns}\n        />\n      );\n    }\n    case \"loadCSV\": {\n      return (\n        <LoadCSVScreen\n          mode={mode}\n          columns={columns}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          csvParser={csvParser}\n          csvValidator={csvValidator}\n          onPreUploadData={onPreUploadData}\n          onPreUploadDataByRow={onPreUploadDataByRow}\n          onUpdateData={handleUpdateData}\n        />\n      );\n    }\n    case \"uploadCSV\": {\n      return (\n        <UploadCSVScreen\n          mode={mode}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          columns={columns}\n          onUploadData={onUploadData}\n          onUploadDataByRow={onUploadDataByRow}\n          onSubmitComplete={handleUpdateData}\n        />\n      );\n    }\n    case \"complete\": {\n      return (\n        <CompleteScreen\n          csvPrefix={csvPrefix}\n          onDownloadCSV={onDownloadCSV}\n          data={filledData}\n          columns={columns}\n          headers={headers}\n          errors={errors}\n        />\n      );\n    }\n    default: {\n      return null;\n    }\n  }\n};\n\nconst getFirstScreenId = (\n  accptMode: Mode[],\n  skipDownloadTemplate?: boolean,\n): ScreenId => {\n  if (accptMode.length > 1) {\n    return \"selectMode\";\n  }\n  if (skipDownloadTemplate) {\n    return \"loadCSV\";\n  }\n  if (accptMode[0] === \"create\") {\n    return \"downloadCreateTemplate\";\n  }\n  if (accptMode[0] === \"update\") {\n    return \"downloadUpdateTemplate\";\n  }\n  return \"selectMode\";\n};\n\nexport const CSVImportUI = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>(\n  props: CSVImportUIProps<Columns, Row>,\n) => {\n  return (\n    <ScreenProvider\n      firstScreenId={getFirstScreenId(\n        props.acceptMode,\n        props.skipDownloadTemplate,\n      )}\n    >\n      <CSVImportUIContent {...props} />\n    </ScreenProvider>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CSVImportUI.js","names":["CompleteScreen","DownloadCreateTemplateScreen","DownloadUpdateTemplateScreen","LoadCSVScreen","ScreenProvider","useScreen","SelectModeScreen","UploadCSVScreen","useCallback","useMemo","useState","jsx","___EmotionJSX","CSVImportUIContent","_ref","columns","onDownloadCSV","searchLabel","onSearchData","renderSearchField","csvPrefix","csvParser","csvValidator","onPreUploadData","onPreUploadDataByRow","onUploadData","onUploadDataByRow","acceptMode","skipDownloadTemplate","selectDownloadTemplateColumns","defaultTemplateData","id","mode","setMode","uploadedData","setUploadedData","errors","setErrors","handleUpdateData","data","headers","_uploadedData$","rowKeys","Object","keys","values","filter","column","length","hiddenIfNoHeader","includes","label","map","filledData","_uploadedData$2","row","_extends","fromEntries","header","onChangeMode","onSearch","onUpdateData","onSubmitComplete","getFirstScreenId","accptMode","CSVImportUI","props","firstScreenId"],"sources":["../../../src/CSVImportUI/CSVImportUI.tsx"],"sourcesContent":["import { AlertMessageType } from \"../Alert\";\nimport { AssertType } from \"../@types/AssertType\";\nimport { CompleteScreen } from \"./screens/CompleteScreen\";\nimport { DownloadCreateTemplateScreen } from \"./screens/DownloadCreateTemplateScreen\";\nimport { DownloadUpdateTemplateScreen } from \"./screens/DownloadUpdateTemplateScreen\";\nimport { LoadCSVScreen } from \"./screens/LoadCSVScreen\";\nimport { ScreenId } from \"./screens/types\";\nimport { ScreenProvider, useScreen } from \"./ScreenProvider\";\nimport { SelectModeScreen } from \"./screens/SelectModeScreen\";\nimport { UnionToIntersection } from \"../@types/UnionToIntersection\";\nimport { UploadCSVScreen } from \"./screens/UploadCSVScreen\";\nimport { useCallback, useMemo, useState } from \"react\";\n\nexport type Mode = \"create\" | \"update\";\n\nexport type CellError = [string, string];\n\nexport type CSVImportUIColumn = Readonly<{\n  label: string;\n  description?: string;\n  type?: \"date\" | \"number\";\n  options?: readonly string[];\n  required?: boolean;\n  hiddenOnCreateTemplate?: boolean;\n  /**\n   * アップロードされたCSVにヘッダーがなければ表示しない。\n   */\n  hiddenIfNoHeader?: boolean;\n  renderCell?: (props: {\n    value: string;\n    header: string;\n    row: Record<string, string>;\n  }) => JSX.Element;\n}>;\n\n/**\n * ライブラリ利用者用の型\n */\nexport type CSVImportUIColumns = Record<string, CSVImportUIColumn>;\n\nexport interface CSVImportUIRenderSearchFieldProps<Row> {\n  onChange: (args: Row[]) => void;\n}\n\ntype OptionByLabel<Columns extends CSVImportUIColumns> = {\n  [Key in keyof Columns]: Record<\n    Columns[Key][\"label\"],\n    Columns[Key] extends {\n      options: readonly (infer Option)[];\n    }\n      ? Option extends string\n        ? Option\n        : never\n      : string\n  >;\n}[keyof Columns];\n\nexport type CSVImportUIRow<Columns extends CSVImportUIColumns> = AssertType<\n  UnionToIntersection<OptionByLabel<Columns>>,\n  Record<string, string>\n>;\n\nexport interface CSVImportUIProps<\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n> {\n  /**\n   * 利用できるモードを指定する。\n   */\n  acceptMode: Mode[];\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 行ごとにデータを処理する。\n   *\n   * onPreUploadDataが指定されている場合、こちらは無視される。\n   */\n  onPreUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{ error?: CellError; data?: Record<string, string> }>;\n  /**\n   * アップロード画面に進む前にトリガーされる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onPreUploadDataByRowByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onPreUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 行ごとにデータをアップロードする。\n   *\n   * onUploadDataが指定されている場合、こちらは無視される。\n   */\n  onUploadDataByRow?: (args: {\n    index: number;\n    /**\n     * 欠損したフィールドがある可能性があるため、型を緩くする。\n     */\n    row: Partial<Row>;\n    mode: Mode;\n  }) => Promise<{\n    error?: CellError;\n    data?: Record<string, string>;\n  }>;\n  /**\n   * CSVをパースしたデータのアップロードがトリガーされた際に呼ばれる。\n   * 一括でデータをアップロードする。\n   *\n   * 現状onUploadDataByRowとは異なり、行ごとにエラーを表示することはできない。\n   * 代わりに、エラー時に表示されるアラートのメッセージをerrorMessageで指定する。\n   *\n   * 行毎にエラーを表示したくなった場合は、要望を出すこと。\n   */\n  onUploadData?: (args: { data: Partial<Row>[]; mode: Mode }) => Promise<{\n    errorMessage?: AlertMessageType;\n    data?: Record<string, string>[];\n  }>;\n  /**\n   * 検索フォームのラベルとして利用される。\n   * (only upload mode)\n   */\n  searchLabel?: string;\n  /**\n   * 検索が行われた際にトリガーされる。\n   * ユーザーの入力した文字列に応じてデータを返却する。このデータはCSVとしてダウンロードされる。\n   * (only upload mode)\n   */\n  onSearchData?: (args: { value: string }) => Promise<{\n    data: Row[];\n  }>;\n  /**\n   * CSVの各列をどのように表示するか指定する。\n   * 各列には、次のプロパティが指定できる。\n   *\n   * `label` : CSVのヘッダーとして利用される。\n   *\n   * `type` : `date`または`number`が指定でき、それぞれ日付と数値としてアップロードされたCSVの値が正しいかどうかを検証する。\n   *\n   * `options` : その列が持てる値のリストを指定する。アップロードされたCSVの値がこのリストに含まれているかどうかを検証する。\n   *\n   * `required` : その列が必須かどうかを指定する。アップロードされたCSVの値が空でないかどうかを検証する。\n   *\n   * `renderCell` : その列のセルをどのように表示するかを指定する。その列の値、ヘッダー、行のデータが渡される。\n   *\n   * `hiddenOnCreateTemplate` : 作成用のCSVのテンプレートに、その列を表示しないかどうかを決定する。\n   *\n   * `hiddenIfNoHeader` : アップロードされたCSVにそのヘッダーがなければ、その列を表示しないかどうかを決定する。\n   */\n  columns: Columns;\n  /**\n   * ダウンロードされるCSVに付与されるプレフィックスを指定する\n   */\n  csvPrefix?: string;\n  /**\n   * CSVのダウンロードがトリガーされたときに呼ばれる\n   */\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * CSVがアップロードされたときに呼ばれる\n   */\n  csvParser: (args: {\n    file: File;\n  }) => Promise<{ data: Record<string, string>[] }>;\n  /**\n   * アップロードされたCSVのデータをバリデーションする。\n   */\n  csvValidator?: (args: {\n    /**\n     * ここで渡されるデータがRowと一致するとは限らない。\n     */\n    row: Record<string, string>;\n  }) => Promise<{ errors?: CellError[] }>;\n  /**\n   * 更新モードで検索のカスタマイズをする。\n   * 省略するとonSearchData, searchLabelを用いた単一の検索フィールドが表示される。これを指定するとonSearchData, searchLabelは無視される。\n   * (only upload mode)\n   */\n  renderSearchField?: (\n    props: CSVImportUIRenderSearchFieldProps<Row>,\n  ) => JSX.Element;\n  /**\n   * 編集用CSVをダウンロードするページをスキップする\n   */\n  skipDownloadTemplate?: boolean;\n  /**\n   * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。\n   */\n  defaultTemplateData?: Row[];\n\n  /**\n   * ダウンロードテンプレートで利用する項目を選択するかどうかを指定する。\n   * デフォルトでは、hiddenOnCreateTemplateが指定されていない列の全ての項目が追加される。\n   * @default false\n   */\n  selectDownloadTemplateColumns?: boolean;\n}\n\nconst CSVImportUIContent = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>({\n  columns,\n  onDownloadCSV,\n  searchLabel,\n  onSearchData,\n  renderSearchField,\n  csvPrefix,\n  csvParser,\n  csvValidator,\n  onPreUploadData,\n  onPreUploadDataByRow,\n  onUploadData,\n  onUploadDataByRow,\n  acceptMode,\n  skipDownloadTemplate,\n  selectDownloadTemplateColumns,\n  defaultTemplateData,\n}: CSVImportUIProps<Columns, Row>) => {\n  const id = useScreen();\n  const [mode, setMode] = useState<Mode>(acceptMode[0]);\n  const [uploadedData, setUploadedData] = useState<Row[]>([]);\n  const [errors, setErrors] = useState<(CellError[] | undefined)[]>([]);\n\n  const handleUpdateData = useCallback(\n    (data: Row[], errors: (CellError[] | undefined)[]) => {\n      setErrors(errors);\n      setUploadedData(data);\n    },\n    [],\n  );\n\n  const headers = useMemo(() => {\n    const rowKeys = Object.keys(uploadedData[0] ?? {});\n\n    return Object.values(columns)\n      .filter((column) => {\n        if (rowKeys.length === 0) {\n          return true;\n        }\n        if (column.hiddenIfNoHeader && !rowKeys.includes(column.label)) {\n          return false;\n        }\n        return true;\n      })\n      .map((column) => column.label);\n  }, [columns, uploadedData]);\n\n  const filledData = useMemo(() => {\n    return headers.length > Object.keys(uploadedData[0] ?? {}).length\n      ? uploadedData.map((row) => {\n          return {\n            ...Object.fromEntries(headers.map((header) => [header, \"\"])),\n            ...row,\n          };\n        })\n      : uploadedData;\n  }, [headers, uploadedData]);\n\n  switch (id) {\n    case \"selectMode\": {\n      return (\n        <SelectModeScreen\n          skipDownloadTemplate={skipDownloadTemplate}\n          onChangeMode={setMode}\n        />\n      );\n    }\n    case \"downloadCreateTemplate\": {\n      return (\n        <DownloadCreateTemplateScreen\n          onDownloadCSV={onDownloadCSV}\n          headers={headers}\n          columns={columns}\n          csvPrefix={csvPrefix}\n          selectDownloadTemplateColumns={selectDownloadTemplateColumns}\n        />\n      );\n    }\n    case \"downloadUpdateTemplate\": {\n      return (\n        <DownloadUpdateTemplateScreen\n          searchLabel={searchLabel}\n          onSearch={onSearchData}\n          renderSearchField={renderSearchField}\n          onDownloadCSV={onDownloadCSV}\n          csvPrefix={csvPrefix}\n          headers={headers}\n          defaultTemplateData={defaultTemplateData}\n          columns={columns}\n        />\n      );\n    }\n    case \"loadCSV\": {\n      return (\n        <LoadCSVScreen\n          mode={mode}\n          columns={columns}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          csvParser={csvParser}\n          csvValidator={csvValidator}\n          onPreUploadData={onPreUploadData}\n          onPreUploadDataByRow={onPreUploadDataByRow}\n          onUpdateData={handleUpdateData}\n        />\n      );\n    }\n    case \"uploadCSV\": {\n      return (\n        <UploadCSVScreen\n          mode={mode}\n          data={filledData}\n          headers={headers}\n          errors={errors}\n          columns={columns}\n          onUploadData={onUploadData}\n          onUploadDataByRow={onUploadDataByRow}\n          onSubmitComplete={handleUpdateData}\n        />\n      );\n    }\n    case \"complete\": {\n      return (\n        <CompleteScreen\n          csvPrefix={csvPrefix}\n          onDownloadCSV={onDownloadCSV}\n          data={filledData}\n          columns={columns}\n          headers={headers}\n          errors={errors}\n        />\n      );\n    }\n    default: {\n      return null;\n    }\n  }\n};\n\nconst getFirstScreenId = (\n  accptMode: Mode[],\n  skipDownloadTemplate?: boolean,\n): ScreenId => {\n  if (accptMode.length > 1) {\n    return \"selectMode\";\n  }\n  if (skipDownloadTemplate) {\n    return \"loadCSV\";\n  }\n  if (accptMode[0] === \"create\") {\n    return \"downloadCreateTemplate\";\n  }\n  if (accptMode[0] === \"update\") {\n    return \"downloadUpdateTemplate\";\n  }\n  return \"selectMode\";\n};\n\nexport const CSVImportUI = <\n  Columns extends CSVImportUIColumns,\n  Row extends Record<string, string> = CSVImportUIRow<Columns>,\n>(\n  props: CSVImportUIProps<Columns, Row>,\n) => {\n  return (\n    <ScreenProvider\n      firstScreenId={getFirstScreenId(\n        props.acceptMode,\n        props.skipDownloadTemplate,\n      )}\n    >\n      <CSVImportUIContent {...props} />\n    </ScreenProvider>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/esm/CSVImportUI/screens/DownloadCreateTemplateScreen.js

@@ -1,10 +1,13 @@
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 import { Button } from "../../Button";
 import { ScreenLayout } from "../ScreenLayout";
+import { TableUI } from "../../TableUI";
+import { Typography } from "@mui/material";
 import { createEmptyData } from "../createEmptyData";
 import { css } from "@emotion/react";
 import { getTemplateFilename } from "../getTemplateFilename";
 import { useNavigate } from "../ScreenProvider";
+import { useState } from "react";
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "rh2lbx",
@@ -12,20 +15,57 @@ var _ref = process.env.NODE_ENV === "production" ? {
 } : {
   name: "1r8vue8-DownloadCreateTemplateScreen",
   styles: "display:grid;justify-content:center;label:DownloadCreateTemplateScreen;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFDZ0IiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBTY3JlZW5MYXlvdXQgfSBmcm9tIFwiLi4vU2NyZWVuTGF5b3V0XCI7XG5pbXBvcnQgeyBTY3JlZW5Qcm9wcyB9IGZyb20gXCIuL3R5cGVzXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcblxuZXhwb3J0IGludGVyZmFjZSBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuUHJvcHM8Um93PiBleHRlbmRzIFNjcmVlblByb3BzIHtcbiAgb25Eb3dubG9hZENTVjogKGFyZ3M6IHsgZGF0YTogUm93W107IGZpbGVuYW1lOiBzdHJpbmcgfSkgPT4gdm9pZDtcbiAgY3N2UHJlZml4Pzogc3RyaW5nO1xuICBoZWFkZXJzOiBzdHJpbmdbXTtcbn1cblxuZXhwb3J0IGNvbnN0IERvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4gPSA8Um93LD4oe1xuICBoZWFkZXJzLFxuICBjc3ZQcmVmaXgsXG4gIG9uRG93bmxvYWRDU1YsXG59OiBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuUHJvcHM8Um93PikgPT4ge1xuICBjb25zdCB7IG9uTmF2aWdhdGUgfSA9IHVzZU5hdmlnYXRlKCk7XG5cbiAgY29uc3QgaGFuZGxlRG93bmxvYWRDcmVhdGVUZW1wbGF0ZSA9ICgpID0+IHtcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoaGVhZGVycykgYXMgUm93O1xuICAgIG9uRG93bmxvYWRDU1Yoe1xuICAgICAgZGF0YTogW3Jvd10sXG4gICAgICBmaWxlbmFtZTogZ2V0VGVtcGxhdGVGaWxlbmFtZShcImltcG9ydFwiLCBjc3ZQcmVmaXgpLFxuICAgIH0pO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFNjcmVlbkxheW91dFxuICAgICAgdGl0bGU9XCLkvZzmiJDnlKhDU1bjga7jg4Djgqbjg7Pjg63jg7zjg4lcIlxuICAgICAgb25OZXh0PXsoKSA9PiB7XG4gICAgICAgIG9uTmF2aWdhdGUoXCJsb2FkQ1NWXCIpO1xuICAgICAgfX1cbiAgICA+XG4gICAgICA8ZGl2XG4gICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxCdXR0b25cbiAgICAgICAgICB2YXJpYW50PVwib3V0bGluZWRcIlxuICAgICAgICAgIGNvbG9yPVwicHJpbWFyeVwiXG4gICAgICAgICAgb25DbGljaz17aGFuZGxlRG93bmxvYWRDcmVhdGVUZW1wbGF0ZX1cbiAgICAgICAgPlxuICAgICAgICAgIOOCouODg+ODl+ODreODvOODieeUqENTVuOCkuWPluW+l1xuICAgICAgICA8L0J1dHRvbj5cbiAgICAgIDwvZGl2PlxuICAgIDwvU2NyZWVuTGF5b3V0PlxuICApO1xufTtcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1JaUIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
-export var DownloadCreateTemplateScreen = _ref2 => {
+var _ref2 = process.env.NODE_ENV === "production" ? {
+  name: "1oecb4n",
+  styles: "display:grid;justify-content:flex-end"
+} : {
+  name: "hizbmn-DownloadCreateTemplateScreen",
+  styles: "display:grid;justify-content:flex-end;label:DownloadCreateTemplateScreen;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStIaUIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+var _ref3 = process.env.NODE_ENV === "production" ? {
+  name: "1d16ou4",
+  styles: "display:grid;gap:16px"
+} : {
+  name: "16r19s5-DownloadCreateTemplateScreen",
+  styles: "display:grid;gap:16px;label:DownloadCreateTemplateScreen;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9DU1ZJbXBvcnRVSS9zY3JlZW5zL0Rvd25sb2FkQ3JlYXRlVGVtcGxhdGVTY3JlZW4udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBFa0IiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0NTVkltcG9ydFVJL3NjcmVlbnMvRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCdXR0b24gfSBmcm9tIFwiLi4vLi4vQnV0dG9uXCI7XG5pbXBvcnQgeyBDU1ZJbXBvcnRVSUNvbHVtbnMgfSBmcm9tIFwiLi4vQ1NWSW1wb3J0VUlcIjtcbmltcG9ydCB7IFNjcmVlbkxheW91dCB9IGZyb20gXCIuLi9TY3JlZW5MYXlvdXRcIjtcbmltcG9ydCB7IFNjcmVlblByb3BzIH0gZnJvbSBcIi4vdHlwZXNcIjtcbmltcG9ydCB7IFRhYmxlVUkgfSBmcm9tIFwiLi4vLi4vVGFibGVVSVwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeSB9IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyBjcmVhdGVFbXB0eURhdGEgfSBmcm9tIFwiLi4vY3JlYXRlRW1wdHlEYXRhXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IGdldFRlbXBsYXRlRmlsZW5hbWUgfSBmcm9tIFwiLi4vZ2V0VGVtcGxhdGVGaWxlbmFtZVwiO1xuaW1wb3J0IHsgdXNlTmF2aWdhdGUgfSBmcm9tIFwiLi4vU2NyZWVuUHJvdmlkZXJcIjtcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4gZXh0ZW5kcyBTY3JlZW5Qcm9wcyB7XG4gIG9uRG93bmxvYWRDU1Y6IChhcmdzOiB7IGRhdGE6IFJvd1tdOyBmaWxlbmFtZTogc3RyaW5nIH0pID0+IHZvaWQ7XG4gIC8qKlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgc2VsZWN0RG93bmxvYWRUZW1wbGF0ZUNvbHVtbnM/OiBib29sZWFuO1xuICBjc3ZQcmVmaXg/OiBzdHJpbmc7XG4gIGhlYWRlcnM6IHN0cmluZ1tdO1xuICBjb2x1bW5zOiBDU1ZJbXBvcnRVSUNvbHVtbnM7XG59XG5cbmV4cG9ydCBjb25zdCBEb3dubG9hZENyZWF0ZVRlbXBsYXRlU2NyZWVuID0gPFJvdyw+KHtcbiAgaGVhZGVycyxcbiAgY3N2UHJlZml4LFxuICBvbkRvd25sb2FkQ1NWLFxuICBzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA9IGZhbHNlLFxuICBjb2x1bW5zLFxufTogRG93bmxvYWRDcmVhdGVUZW1wbGF0ZVNjcmVlblByb3BzPFJvdz4pID0+IHtcbiAgY29uc3QgeyBvbk5hdmlnYXRlIH0gPSB1c2VOYXZpZ2F0ZSgpO1xuXG4gIGNvbnN0IHRhYmxlRGF0YSA9IE9iamVjdC52YWx1ZXMoY29sdW1ucylcbiAgICAuZmlsdGVyKChjb2x1bW4pID0+IGNvbHVtbi5oaWRkZW5PbkNyZWF0ZVRlbXBsYXRlICE9PSB0cnVlKVxuICAgIC5tYXAoKHZhbHVlKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICBsYWJlbDogdmFsdWUubGFiZWwsXG4gICAgICAgIGRlc2NyaXB0aW9uOiB2YWx1ZS5kZXNjcmlwdGlvbixcbiAgICAgICAgcmVxdWlyZWQ6IHZhbHVlLnJlcXVpcmVkLFxuICAgICAgfTtcbiAgICB9KTtcblxuICBjb25zdCBbc2VsZWN0ZWRJbmRleGVzLCBzZXRTZWxlY3RlZEluZGV4ZXNdID0gdXNlU3RhdGU8bnVtYmVyW10+KFtdKTtcblxuICBjb25zdCBoYW5kbGVEb3dubG9hZENyZWF0ZVRlbXBsYXRlID0gKCkgPT4ge1xuICAgIGNvbnN0IGZpbHRlcmVkSGVhZGVycyA9IHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICA/IHRhYmxlRGF0YVxuICAgICAgICAgIC5maWx0ZXIoKF8sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICBpZiAodGFibGVEYXRhW2luZGV4XS5yZXF1aXJlZCkge1xuICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGlmIChzZWxlY3RlZEluZGV4ZXMuaW5jbHVkZXMoaW5kZXgpKSB7XG4gICAgICAgICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICAgIH0pXG4gICAgICAgICAgLm1hcCgoaXRlbSkgPT4gaXRlbS5sYWJlbClcbiAgICAgIDogaGVhZGVycztcbiAgICBjb25zdCByb3cgPSBjcmVhdGVFbXB0eURhdGEoZmlsdGVyZWRIZWFkZXJzKSBhcyBSb3c7XG4gICAgb25Eb3dubG9hZENTVih7XG4gICAgICBkYXRhOiBbcm93XSxcbiAgICAgIGZpbGVuYW1lOiBnZXRUZW1wbGF0ZUZpbGVuYW1lKFwiaW1wb3J0XCIsIGNzdlByZWZpeCksXG4gICAgfSk7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8U2NyZWVuTGF5b3V0XG4gICAgICB0aXRsZT1cIuS9nOaIkOeUqENTVuOBruODgOOCpuODs+ODreODvOODiVwiXG4gICAgICBvbk5leHQ9eygpID0+IHtcbiAgICAgICAgb25OYXZpZ2F0ZShcImxvYWRDU1ZcIik7XG4gICAgICB9fVxuICAgID5cbiAgICAgIHtzZWxlY3REb3dubG9hZFRlbXBsYXRlQ29sdW1ucyA/IChcbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIGdhcDogMTZweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5Pue3qOmbhuOBl+OBn+OBhOmgheebruOCkumBuOaKnuOBl+OBpuOBj+OBoOOBleOBhOOAgjwvVHlwb2dyYXBoeT5cbiAgICAgICAgICAgIDxUeXBvZ3JhcGh5IHZhcmlhbnQ9XCJjYXB0aW9uXCI+XG4gICAgICAgICAgICAgIO+8iuW/hemgiOOBrumgheebruOBr+mBuOaKnuOBl+OBquOBhOWgtOWQiOOCguOAgUNTVuODleOCoeOCpOODq+OBq+WHuuWKm+OBleOCjOOBvuOBmeOAglxuICAgICAgICAgICAgPC9UeXBvZ3JhcGh5PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgIDxUYWJsZVVJXG4gICAgICAgICAgICBvblNlbGVjdEFsbD17KHsgY2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChjaGVja2VkKSB7XG4gICAgICAgICAgICAgICAgc2V0U2VsZWN0ZWRJbmRleGVzKHRhYmxlRGF0YS5tYXAoKF8sIGluZGV4KSA9PiBpbmRleCkpO1xuICAgICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIHNldFNlbGVjdGVkSW5kZXhlcyhbXSk7XG4gICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBvblNlbGVjdD17KHsgaW5kZXgsIGNoZWNrZWQgfSkgPT4ge1xuICAgICAgICAgICAgICBzZXRTZWxlY3RlZEluZGV4ZXMoKHByZXYpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoY2hlY2tlZCkge1xuICAgICAgICAgICAgICAgICAgcmV0dXJuIFsuLi5wcmV2LCBpbmRleF07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiBwcmV2LmZpbHRlcigoaXRlbSkgPT4gaXRlbSAhPT0gaW5kZXgpO1xuICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICBzZWxlY3RlZEluZGV4PXtzZWxlY3RlZEluZGV4ZXN9XG4gICAgICAgICAgICBjb2x1bW5zPXtbXG4gICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBrZXk6IFwibGFiZWxcIixcbiAgICAgICAgICAgICAgICB0aXRsZTogXCLjgqvjg6njg6DlkI1cIixcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIGtleTogXCJkZXNjcmlwdGlvblwiLFxuICAgICAgICAgICAgICAgIHRpdGxlOiBcIuiqrOaYjlwiLFxuICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAga2V5OiBcInJlcXVpcmVkXCIsXG4gICAgICAgICAgICAgICAgdGl0bGU6IFwi5b+F6aCIXCIsXG4gICAgICAgICAgICAgICAgcmVuZGVyQ2VsbDogKHsgY2VsbCB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICByZXR1cm4gPHNwYW4+e2NlbGwudmFsdWUgPyBcIllFU1wiIDogXCJOT1wifTwvc3Bhbj47XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIF19XG4gICAgICAgICAgICBkYXRhPXt0YWJsZURhdGF9XG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICApIDogbnVsbH1cblxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e1xuICAgICAgICAgIHNlbGVjdERvd25sb2FkVGVtcGxhdGVDb2x1bW5zXG4gICAgICAgICAgICA/IGNzc2BcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgICAgIDogY3NzYFxuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgIGBcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8QnV0dG9uXG4gICAgICAgICAgdmFyaWFudD1cIm91dGxpbmVkXCJcbiAgICAgICAgICBjb2xvcj1cInByaW1hcnlcIlxuICAgICAgICAgIG9uQ2xpY2s9e2hhbmRsZURvd25sb2FkQ3JlYXRlVGVtcGxhdGV9XG4gICAgICAgID5cbiAgICAgICAgICDjgqLjg4Pjg5fjg63jg7zjg4nnlKhDU1bjgpLlj5blvpdcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NjcmVlbkxheW91dD5cbiAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+export var DownloadCreateTemplateScreen = _ref4 => {
   var {
     headers,
     csvPrefix,
-    onDownloadCSV
-  } = _ref2;
+    onDownloadCSV,
+    selectDownloadTemplateColumns = false,
+    columns
+  } = _ref4;
   var {
     onNavigate
   } = useNavigate();
+  var tableData = Object.values(columns).filter(column => column.hiddenOnCreateTemplate !== true).map(value => {
+    return {
+      label: value.label,
+      description: value.description,
+      required: value.required
+    };
+  });
+  var [selectedIndexes, setSelectedIndexes] = useState([]);
   var handleDownloadCreateTemplate = () => {
-    var row = createEmptyData(headers);
+    var filteredHeaders = selectDownloadTemplateColumns ? tableData.filter((_, index) => {
+      if (tableData[index].required) {
+        return true;
+      }
+      if (selectedIndexes.includes(index)) {
+        return true;
+      }
+      return false;
+    }).map(item => item.label) : headers;
+    var row = createEmptyData(filteredHeaders);
     onDownloadCSV({
       data: [row],
       filename: getTemplateFilename("import", csvPrefix)
@@ -36,8 +76,53 @@ export var DownloadCreateTemplateScreen = _ref2 => {
     onNext: () => {
       onNavigate("loadCSV");
     }
-  }, ___EmotionJSX("div", {
-    css: _ref
+  }, selectDownloadTemplateColumns ? ___EmotionJSX("div", {
+    css: _ref3
+  }, ___EmotionJSX("div", null, ___EmotionJSX(Typography, null, "\u7DE8\u96C6\u3057\u305F\u3044\u9805\u76EE\u3092\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044\u3002"), ___EmotionJSX(Typography, {
+    variant: "caption"
+  }, "\uFF0A\u5FC5\u9808\u306E\u9805\u76EE\u306F\u9078\u629E\u3057\u306A\u3044\u5834\u5408\u3082\u3001CSV\u30D5\u30A1\u30A4\u30EB\u306B\u51FA\u529B\u3055\u308C\u307E\u3059\u3002")), ___EmotionJSX(TableUI, {
+    onSelectAll: _ref5 => {
+      var {
+        checked
+      } = _ref5;
+      if (checked) {
+        setSelectedIndexes(tableData.map((_, index) => index));
+      } else {
+        setSelectedIndexes([]);
+      }
+    },
+    onSelect: _ref6 => {
+      var {
+        index,
+        checked
+      } = _ref6;
+      setSelectedIndexes(prev => {
+        if (checked) {
+          return [...prev, index];
+        }
+        return prev.filter(item => item !== index);
+      });
+    },
+    selectedIndex: selectedIndexes,
+    columns: [{
+      key: "label",
+      title: "カラム名"
+    }, {
+      key: "description",
+      title: "説明"
+    }, {
+      key: "required",
+      title: "必須",
+      renderCell: _ref7 => {
+        var {
+          cell
+        } = _ref7;
+        return ___EmotionJSX("span", null, cell.value ? "YES" : "NO");
+      }
+    }],
+    data: tableData
+  })) : null, ___EmotionJSX("div", {
+    css: selectDownloadTemplateColumns ? _ref2 : _ref
   }, ___EmotionJSX(Button, {
     variant: "outlined",
     color: "primary",

package/esm/CSVImportUI/screens/DownloadCreateTemplateScreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"DownloadCreateTemplateScreen.js","names":["Button","ScreenLayout","createEmptyData","css","getTemplateFilename","useNavigate","jsx","___EmotionJSX","_ref","process","env","NODE_ENV","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","DownloadCreateTemplateScreen","_ref2","headers","csvPrefix","onDownloadCSV","onNavigate","handleDownloadCreateTemplate","row","data","filename","title","onNext","variant","color","onClick"],"sources":["../../../../src/CSVImportUI/screens/DownloadCreateTemplateScreen.tsx"],"sourcesContent":["import { Button } from \"../../Button\";\nimport { ScreenLayout } from \"../ScreenLayout\";\nimport { ScreenProps } from \"./types\";\nimport { createEmptyData } from \"../createEmptyData\";\nimport { css } from \"@emotion/react\";\nimport { getTemplateFilename } from \"../getTemplateFilename\";\nimport { useNavigate } from \"../ScreenProvider\";\n\nexport interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  csvPrefix?: string;\n  headers: string[];\n}\n\nexport const DownloadCreateTemplateScreen = <Row,>({\n  headers,\n  csvPrefix,\n  onDownloadCSV,\n}: DownloadCreateTemplateScreenProps<Row>) => {\n  const { onNavigate } = useNavigate();\n\n  const handleDownloadCreateTemplate = () => {\n    const row = createEmptyData(headers) as Row;\n    onDownloadCSV({\n      data: [row],\n      filename: getTemplateFilename(\"import\", csvPrefix),\n    });\n  };\n\n  return (\n    <ScreenLayout\n      title=\"作成用CSVのダウンロード\"\n      onNext={() => {\n        onNavigate(\"loadCSV\");\n      }}\n    >\n      <div\n        css={css`\n          display: grid;\n          justify-content: center;\n        `}\n      >\n        <Button\n          variant=\"outlined\"\n          color=\"primary\"\n          onClick={handleDownloadCreateTemplate}\n        >\n          アップロード用CSVを取得\n        </Button>\n      </div>\n    </ScreenLayout>\n  );\n};\n"],"mappings":";AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,SAASC,YAAY,QAAQ,iBAAiB;AAE9C,SAASC,eAAe,QAAQ,oBAAoB;AACpD,SAASC,GAAG,QAAQ,gBAAgB;AACpC,SAASC,mBAAmB,QAAQ,wBAAwB;AAC5D,SAASC,WAAW,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,aAAA;AAAA,IAAAC,IAAA,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA;AAQhD,OAAO,IAAMC,4BAA4B,GAAGC,KAAA,IAIE;EAAA,IAJK;IACjDC,OAAO;IACPC,SAAS;IACTC;EACsC,CAAC,GAAAH,KAAA;EACvC,IAAM;IAAEI;EAAW,CAAC,GAAGjB,WAAW,CAAC,CAAC;EAEpC,IAAMkB,4BAA4B,GAAGA,CAAA,KAAM;IACzC,IAAMC,GAAG,GAAGtB,eAAe,CAACiB,OAAO,CAAQ;IAC3CE,aAAa,CAAC;MACZI,IAAI,EAAE,CAACD,GAAG,CAAC;MACXE,QAAQ,EAAEtB,mBAAmB,CAAC,QAAQ,EAAEgB,SAAS;IACnD,CAAC,CAAC;EACJ,CAAC;EAED,OACEb,aAAA,CAACN,YAAY;IACX0B,KAAK,EAAC,iEAAe;IACrBC,MAAM,EAAEA,CAAA,KAAM;MACZN,UAAU,CAAC,SAAS,CAAC;IACvB;EAAE,GAEFf,aAAA;IACEJ,GAAG,EAAAK;EAGD,GAEFD,aAAA,CAACP,MAAM;IACL6B,OAAO,EAAC,UAAU;IAClBC,KAAK,EAAC,SAAS;IACfC,OAAO,EAAER;EAA6B,GACvC,iEAEO,CACL,CACO,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"file":"DownloadCreateTemplateScreen.js","names":["Button","ScreenLayout","TableUI","Typography","createEmptyData","css","getTemplateFilename","useNavigate","useState","jsx","___EmotionJSX","_ref","process","env","NODE_ENV","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","_ref2","_ref3","DownloadCreateTemplateScreen","_ref4","headers","csvPrefix","onDownloadCSV","selectDownloadTemplateColumns","columns","onNavigate","tableData","Object","values","filter","column","hiddenOnCreateTemplate","value","label","description","required","selectedIndexes","setSelectedIndexes","handleDownloadCreateTemplate","filteredHeaders","_","index","includes","item","row","data","filename","title","onNext","variant","onSelectAll","_ref5","checked","onSelect","_ref6","prev","selectedIndex","key","renderCell","_ref7","cell","color","onClick"],"sources":["../../../../src/CSVImportUI/screens/DownloadCreateTemplateScreen.tsx"],"sourcesContent":["import { Button } from \"../../Button\";\nimport { CSVImportUIColumns } from \"../CSVImportUI\";\nimport { ScreenLayout } from \"../ScreenLayout\";\nimport { ScreenProps } from \"./types\";\nimport { TableUI } from \"../../TableUI\";\nimport { Typography } from \"@mui/material\";\nimport { createEmptyData } from \"../createEmptyData\";\nimport { css } from \"@emotion/react\";\nimport { getTemplateFilename } from \"../getTemplateFilename\";\nimport { useNavigate } from \"../ScreenProvider\";\nimport { useState } from \"react\";\n\nexport interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {\n  onDownloadCSV: (args: { data: Row[]; filename: string }) => void;\n  /**\n   * @default false\n   */\n  selectDownloadTemplateColumns?: boolean;\n  csvPrefix?: string;\n  headers: string[];\n  columns: CSVImportUIColumns;\n}\n\nexport const DownloadCreateTemplateScreen = <Row,>({\n  headers,\n  csvPrefix,\n  onDownloadCSV,\n  selectDownloadTemplateColumns = false,\n  columns,\n}: DownloadCreateTemplateScreenProps<Row>) => {\n  const { onNavigate } = useNavigate();\n\n  const tableData = Object.values(columns)\n    .filter((column) => column.hiddenOnCreateTemplate !== true)\n    .map((value) => {\n      return {\n        label: value.label,\n        description: value.description,\n        required: value.required,\n      };\n    });\n\n  const [selectedIndexes, setSelectedIndexes] = useState<number[]>([]);\n\n  const handleDownloadCreateTemplate = () => {\n    const filteredHeaders = selectDownloadTemplateColumns\n      ? tableData\n          .filter((_, index) => {\n            if (tableData[index].required) {\n              return true;\n            }\n            if (selectedIndexes.includes(index)) {\n              return true;\n            }\n            return false;\n          })\n          .map((item) => item.label)\n      : headers;\n    const row = createEmptyData(filteredHeaders) as Row;\n    onDownloadCSV({\n      data: [row],\n      filename: getTemplateFilename(\"import\", csvPrefix),\n    });\n  };\n\n  return (\n    <ScreenLayout\n      title=\"作成用CSVのダウンロード\"\n      onNext={() => {\n        onNavigate(\"loadCSV\");\n      }}\n    >\n      {selectDownloadTemplateColumns ? (\n        <div\n          css={css`\n            display: grid;\n            gap: 16px;\n          `}\n        >\n          <div>\n            <Typography>編集したい項目を選択してください。</Typography>\n            <Typography variant=\"caption\">\n              ＊必須の項目は選択しない場合も、CSVファイルに出力されます。\n            </Typography>\n          </div>\n          <TableUI\n            onSelectAll={({ checked }) => {\n              if (checked) {\n                setSelectedIndexes(tableData.map((_, index) => index));\n              } else {\n                setSelectedIndexes([]);\n              }\n            }}\n            onSelect={({ index, checked }) => {\n              setSelectedIndexes((prev) => {\n                if (checked) {\n                  return [...prev, index];\n                }\n                return prev.filter((item) => item !== index);\n              });\n            }}\n            selectedIndex={selectedIndexes}\n            columns={[\n              {\n                key: \"label\",\n                title: \"カラム名\",\n              },\n              {\n                key: \"description\",\n                title: \"説明\",\n              },\n              {\n                key: \"required\",\n                title: \"必須\",\n                renderCell: ({ cell }) => {\n                  return <span>{cell.value ? \"YES\" : \"NO\"}</span>;\n                },\n              },\n            ]}\n            data={tableData}\n          />\n        </div>\n      ) : null}\n\n      <div\n        css={\n          selectDownloadTemplateColumns\n            ? css`\n                display: grid;\n                justify-content: flex-end;\n              `\n            : css`\n                display: grid;\n                justify-content: center;\n              `\n        }\n      >\n        <Button\n          variant=\"outlined\"\n          color=\"primary\"\n          onClick={handleDownloadCreateTemplate}\n        >\n          アップロード用CSVを取得\n        </Button>\n      </div>\n    </ScreenLayout>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "matsuri-ui",
-  "version": "16.5.1-alpha-1733126153498-ddb299f.0",
+  "version": "16.6.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/matsuri-tech/matsuri-ui.git"

package/types/CSVImportUI/CSVImportUI.d.ts

@@ -5,6 +5,7 @@ export type Mode = "create" | "update";
 export type CellError = [string, string];
 export type CSVImportUIColumn = Readonly<{
     label: string;
+    description?: string;
     type?: "date" | "number";
     options?: readonly string[];
     required?: boolean;
@@ -181,6 +182,12 @@ export interface CSVImportUIProps<Columns extends CSVImportUIColumns, Row extend
      * 更新用のCSVをダウンロードする際にデフォルトで表示されるデータを指定する。
      */
     defaultTemplateData?: Row[];
+    /**
+     * ダウンロードテンプレートで利用する項目を選択するかどうかを指定する。
+     * デフォルトでは、hiddenOnCreateTemplateが指定されていない列の全ての項目が追加される。
+     * @default false
+     */
+    selectDownloadTemplateColumns?: boolean;
 }
 export declare const CSVImportUI: <Columns extends CSVImportUIColumns, Row extends Record<string, string> = AssertType<UnionToIntersection<OptionByLabel<Columns>>, Record<string, string>>>(props: CSVImportUIProps<Columns, Row>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/types/CSVImportUI/screens/DownloadCreateTemplateScreen.d.ts

@@ -1,10 +1,16 @@
+import { CSVImportUIColumns } from "../CSVImportUI";
 import { ScreenProps } from "./types";
 export interface DownloadCreateTemplateScreenProps<Row> extends ScreenProps {
     onDownloadCSV: (args: {
         data: Row[];
         filename: string;
     }) => void;
+    /**
+     * @default false
+     */
+    selectDownloadTemplateColumns?: boolean;
     csvPrefix?: string;
     headers: string[];
+    columns: CSVImportUIColumns;
 }
-export declare const DownloadCreateTemplateScreen: <Row>({ headers, csvPrefix, onDownloadCSV, }: DownloadCreateTemplateScreenProps<Row>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const DownloadCreateTemplateScreen: <Row>({ headers, csvPrefix, onDownloadCSV, selectDownloadTemplateColumns, columns, }: DownloadCreateTemplateScreenProps<Row>) => import("@emotion/react/jsx-runtime").JSX.Element;