@tipp/ui 2.3.17 → 2.3.18

package/dist/types/index.d.cts

@@ -1,3 +1,4 @@
 export { ContentBaseType, CurriculumAiTrainingContents, CurriculumContents, CurriculumFileDownloadContents, CurriculumFileDownloadFile, CurriculumReviewContents, CurriculumReviewQuestionRadio, CurriculumReviewQuestionSatisfactionOption, CurriculumReviewQuestionSatisfactionText, CurriculumReviewQuestionText, CurriculumSectionTitleContents, CurriculumVideoContents, QuestionBaseType, SatisfactionOptionMeta, SatisfactionTextMeta } from './curriculumContents.type.cjs';
 export { Curriculum, CurriculumListContents, ReviewQuestionElement } from './curriculum.type.cjs';
 export { ChoiceField, ChoicesField, DropdownField, DynamicFormFieldSchema, DynamicFormSchema, EmailField, FieldBaseType, FieldOption, LongTextField, NumberField, OptionFieldCommon, OrientationFieldCommon, ShortTextField, TextFieldCommon, ValidationRule, YesNoField } from './dynamic-form-schema-generated.cjs';
+export { TrainingInfoGuidelineContents, TrainingInfoGuidelineFileValue, TrainingInfoGuidelineVideoValue } from './training-info-guideline-schema-generated.cjs';

package/dist/types/index.d.ts

@@ -1,3 +1,4 @@
 export { ContentBaseType, CurriculumAiTrainingContents, CurriculumContents, CurriculumFileDownloadContents, CurriculumFileDownloadFile, CurriculumReviewContents, CurriculumReviewQuestionRadio, CurriculumReviewQuestionSatisfactionOption, CurriculumReviewQuestionSatisfactionText, CurriculumReviewQuestionText, CurriculumSectionTitleContents, CurriculumVideoContents, QuestionBaseType, SatisfactionOptionMeta, SatisfactionTextMeta } from './curriculumContents.type.js';
 export { Curriculum, CurriculumListContents, ReviewQuestionElement } from './curriculum.type.js';
 export { ChoiceField, ChoicesField, DropdownField, DynamicFormFieldSchema, DynamicFormSchema, EmailField, FieldBaseType, FieldOption, LongTextField, NumberField, OptionFieldCommon, OrientationFieldCommon, ShortTextField, TextFieldCommon, ValidationRule, YesNoField } from './dynamic-form-schema-generated.js';
+export { TrainingInfoGuidelineContents, TrainingInfoGuidelineFileValue, TrainingInfoGuidelineVideoValue } from './training-info-guideline-schema-generated.js';

package/dist/types/index.js

@@ -1,4 +1,5 @@
-import "../chunk-L5N6ITS7.js";
+import "../chunk-VLGR5PZX.js";
+import "../chunk-DEAVEZQM.js";
 import "../chunk-GSMBJMXJ.js";
 import "../chunk-NMLVUAFW.js";
 import "../chunk-6AVVI6B5.js";

package/dist/types/training-info-guideline-schema-generated.cjs

@@ -0,0 +1,19 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/types/training-info-guideline-schema-generated.ts
+var training_info_guideline_schema_generated_exports = {};
+module.exports = __toCommonJS(training_info_guideline_schema_generated_exports);
+//# sourceMappingURL=training-info-guideline-schema-generated.cjs.map

package/dist/types/training-info-guideline-schema-generated.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/types/training-info-guideline-schema-generated.ts"],"sourcesContent":["/* eslint-disable */\n/**\n * This file was automatically generated by json-schema-to-typescript.\n * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,\n * and run json-schema-to-typescript to regenerate this file.\n */\n\nexport interface TrainingInfoGuidelineContents {\n  version: 2;\n  values: (TrainingInfoGuidelineFileValue | TrainingInfoGuidelineVideoValue)[];\n}\nexport interface TrainingInfoGuidelineFileValue {\n  type: \"file\";\n  url: string;\n  downloadButtonName: string;\n  filename: string;\n}\nexport interface TrainingInfoGuidelineVideoValue {\n  type: \"video\";\n  url: string;\n  videoTitle: string;\n}\n\n"],"mappings":";;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}

package/dist/types/training-info-guideline-schema-generated.d.cts

@@ -0,0 +1,22 @@
+/**
+ * This file was automatically generated by json-schema-to-typescript.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run json-schema-to-typescript to regenerate this file.
+ */
+interface TrainingInfoGuidelineContents {
+    version: 2;
+    values: (TrainingInfoGuidelineFileValue | TrainingInfoGuidelineVideoValue)[];
+}
+interface TrainingInfoGuidelineFileValue {
+    type: "file";
+    url: string;
+    downloadButtonName: string;
+    filename: string;
+}
+interface TrainingInfoGuidelineVideoValue {
+    type: "video";
+    url: string;
+    videoTitle: string;
+}
+
+export type { TrainingInfoGuidelineContents, TrainingInfoGuidelineFileValue, TrainingInfoGuidelineVideoValue };

package/dist/types/training-info-guideline-schema-generated.d.ts

@@ -0,0 +1,22 @@
+/**
+ * This file was automatically generated by json-schema-to-typescript.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run json-schema-to-typescript to regenerate this file.
+ */
+interface TrainingInfoGuidelineContents {
+    version: 2;
+    values: (TrainingInfoGuidelineFileValue | TrainingInfoGuidelineVideoValue)[];
+}
+interface TrainingInfoGuidelineFileValue {
+    type: "file";
+    url: string;
+    downloadButtonName: string;
+    filename: string;
+}
+interface TrainingInfoGuidelineVideoValue {
+    type: "video";
+    url: string;
+    videoTitle: string;
+}
+
+export type { TrainingInfoGuidelineContents, TrainingInfoGuidelineFileValue, TrainingInfoGuidelineVideoValue };

package/dist/types/training-info-guideline-schema-generated.js

@@ -0,0 +1,2 @@
+import "../chunk-DEAVEZQM.js";
+//# sourceMappingURL=training-info-guideline-schema-generated.js.map

package/dist/types/training-info-guideline-schema-generated.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tipp/ui",
-  "version": "2.3.17",
+  "version": "2.3.18",
   "private": false,
   "type": "module",
   "exports": {
@@ -95,6 +95,6 @@
     "lint-staged": "lint-staged ./src",
     "test": "jest",
     "type-check": "tsc --noEmit",
-    "parse-json-to-type": "npx json2ts -i ./src/constrant/curriculum.schema.json -o ./src/types/curriculumContents.type.ts && npx json2ts -i ./src/constrant/dynamic-form-schema.json -o ./src/types/dynamic-form-schema-generated.ts"
+    "parse-json-to-type": "node ./scripts/generate-types.mjs"
   }
 }

package/src/constrant/training-info-guideline.schema.json

@@ -0,0 +1,45 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "TrainingInfoGuidelineContents",
+  "type": "object",
+  "properties": {
+    "version": { "const": 2 },
+    "values": {
+      "oneOf": [
+        {"type":"array",
+        "items":{
+          "oneOf": [
+            { "$ref": "#/definitions/TrainingInfoGuidelineFileValue" },
+            { "$ref": "#/definitions/TrainingInfoGuidelineVideoValue" }
+          ]
+        }
+      }
+      ]
+    }
+  },
+  "required": ["version", "values"],
+  "definitions": {
+    "TrainingInfoGuidelineFileValue": {
+      "type": "object",
+      "properties": {
+        "type": { "const": "file" },
+        "url": { "type": "string" },
+        "downloadButtonName": { "type": "string" },
+        "filename": { "type": "string" }
+      },
+      "required": ["type", "url", "downloadButtonName", "filename"],
+      "additionalProperties": false
+    },
+    "TrainingInfoGuidelineVideoValue": {
+      "type": "object",
+      "properties": {
+        "type": { "const": "video" },
+        "url": { "type": "string" },
+        "videoTitle": { "type": "string" }
+      },
+      "required": ["type", "url", "videoTitle"],
+      "additionalProperties": false
+    }
+  },
+  "additionalProperties": false
+}

package/src/molecules/index.ts

@@ -16,4 +16,5 @@ export * from './dynamic-form';
 export * from './dynamic-field';
 export * from './dynamic-form-response-item';
 export * from './one-on-one-guide-list';
-export * from './description-json-render';
+export * from './description-json-render';
+export * from './training-info-guideline';

package/src/molecules/training-info-guideline.tsx

@@ -0,0 +1,130 @@
+import React, { useState } from 'react';
+import { FileTextIcon, VideoIcon } from '@radix-ui/react-icons';
+import { AspectRatio } from '@/atoms/aspect-ratio';
+import { Button } from '@/atoms/button';
+import type { TrainingInfoGuidelineContents } from '@/types/training-info-guideline-schema-generated';
+import { Dialog } from '@/atoms/dialog';
+import { Spinner } from '@/atoms/spinner';
+import { Flex } from '../atoms/flex';
+
+export interface TrainingInfoGuidelineProps {
+  values: TrainingInfoGuidelineContents['values'];
+  onClickFileDownload: (args: { url: string; filename: string }) => void;
+}
+
+export function TrainingInfoGuideline({
+  values,
+  onClickFileDownload,
+}: TrainingInfoGuidelineProps): React.ReactElement {
+  return (
+    <>
+      {values.map((value) => (
+        <TrainingInfoGuidelineItem
+          key={getItemKey(value)}
+          onClickFileDownload={onClickFileDownload}
+          value={value}
+        />
+      ))}
+    </>
+  );
+}
+
+type TrainingInfoGuidelineValue =
+  TrainingInfoGuidelineContents['values'][number];
+
+function getItemKey(value: TrainingInfoGuidelineValue): string {
+  return value.url;
+}
+
+interface TrainingInfoGuidelineItemProps {
+  value: TrainingInfoGuidelineValue;
+  onClickFileDownload: TrainingInfoGuidelineProps['onClickFileDownload'];
+}
+
+function TrainingInfoGuidelineItem({
+  value,
+  onClickFileDownload,
+}: TrainingInfoGuidelineItemProps): React.ReactElement | null {
+  const [isLoading, setIsLoading] = useState(true);
+
+  if (value.type === 'file') {
+    return (
+      <Button
+        onClick={() => {
+          onClickFileDownload({ url: value.url, filename: value.filename });
+        }}
+        variant="surface"
+      >
+        <FileTextIcon />
+        {value.downloadButtonName}
+      </Button>
+    );
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 차후 다른 타입 추가 시 사용
+  if (value.type === 'video') {
+    return (
+      <Dialog.Root>
+        <Dialog.Trigger>
+          <Button variant="surface">
+            <VideoIcon />
+            {value.videoTitle}
+          </Button>
+        </Dialog.Trigger>
+        <Dialog.Content
+          height="100%"
+          maxHeight="500px"
+          maxWidth="800px"
+          title={value.videoTitle}
+          width="100%"
+        >
+          <AspectRatio ratio={16 / 9} style={{ width: '100%' }}>
+            <Flex
+              align="center"
+              justify="center"
+              style={{
+                width: '100%',
+                height: '100%',
+                backgroundColor: 'black',
+                position: 'relative',
+              }}
+            >
+              {isLoading ? (
+                <Flex
+                  align="center"
+                  height="100%"
+                  justify="center"
+                  position="absolute"
+                  style={{
+                    position: 'absolute',
+                    top: 0,
+                    left: 0,
+                    zIndex: 1,
+                    color: 'white',
+                  }}
+                  width="100%"
+                >
+                  <Spinner size="3" style={{ width: 48, height: 48 }} />
+                </Flex>
+              ) : null}
+
+              <iframe
+                allowFullScreen
+                onError={() => {
+                  setIsLoading(false);
+                }} // 필요시 에러 메시지로 대체
+                onLoad={() => {
+                  setIsLoading(false);
+                }}
+                src={`${value.url}?theme=light`}
+                style={{ width: '100%', height: '100%', border: 'none' }}
+                title="Curriculum Video"
+              />
+            </Flex>
+          </AspectRatio>
+        </Dialog.Content>
+      </Dialog.Root>
+    );
+  }
+  return null;
+}

package/src/types/curriculumContents.type.ts

@@ -146,3 +146,4 @@ export interface SatisfactionTextMeta {
   icon?: string;
   [k: string]: unknown;
 }
+

package/src/types/dynamic-form-schema-generated.ts

@@ -101,3 +101,4 @@ export interface OrientationFieldCommon {
   orientation?: "horizontal" | "vertical";
   [k: string]: unknown;
 }
+

package/src/types/index.ts

@@ -1,3 +1,4 @@
 export * from './curriculumContents.type';
 export * from './curriculum.type';
 export * from './dynamic-form-schema-generated';
+export * from './training-info-guideline-schema-generated';

package/src/types/training-info-guideline-schema-generated.ts

@@ -0,0 +1,23 @@
+/* eslint-disable */
+/**
+ * This file was automatically generated by json-schema-to-typescript.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run json-schema-to-typescript to regenerate this file.
+ */
+
+export interface TrainingInfoGuidelineContents {
+  version: 2;
+  values: (TrainingInfoGuidelineFileValue | TrainingInfoGuidelineVideoValue)[];
+}
+export interface TrainingInfoGuidelineFileValue {
+  type: "file";
+  url: string;
+  downloadButtonName: string;
+  filename: string;
+}
+export interface TrainingInfoGuidelineVideoValue {
+  type: "video";
+  url: string;
+  videoTitle: string;
+}
+