@tipp/ui 2.3.39 → 2.3.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/app/index.cjs +7 -7
- package/dist/app/index.cjs.map +1 -1
- package/dist/app/index.js +7 -7
- package/dist/app/platform/contents-card.cjs +7 -7
- package/dist/app/platform/contents-card.cjs.map +1 -1
- package/dist/app/platform/contents-card.js +1 -1
- package/dist/app/platform/edit-coaching-time.cjs.map +1 -1
- package/dist/app/platform/edit-coaching-time.js +6 -6
- package/dist/app/platform/edit-service-type.cjs.map +1 -1
- package/dist/app/platform/edit-service-type.js +6 -6
- package/dist/app/platform/goal-manage-card-edit.cjs.map +1 -1
- package/dist/app/platform/goal-manage-card-edit.js +6 -6
- package/dist/app/platform/on-offline-radio-card.cjs.map +1 -1
- package/dist/app/platform/on-offline-radio-card.js +6 -6
- package/dist/app/platform/reservation-card.cjs.map +1 -1
- package/dist/app/platform/reservation-card.js +6 -6
- package/dist/app/platform/session-card.cjs.map +1 -1
- package/dist/app/platform/session-card.js +6 -6
- package/dist/{chunk-YC5XSFKC.js → chunk-OYJ7HJIE.js} +7 -7
- package/dist/{chunk-BXRTYDSY.js → chunk-VY4J3FLW.js} +8 -8
- package/dist/chunk-VY4J3FLW.js.map +1 -0
- package/dist/{chunk-MLAQDU6U.js → chunk-XLKJYRFY.js} +37 -7
- package/dist/{chunk-MLAQDU6U.js.map → chunk-XLKJYRFY.js.map} +1 -1
- package/dist/index.cjs +43 -13
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +13 -13
- package/dist/molecules/dynamic-form-editor.js +2 -2
- package/dist/molecules/index.cjs +36 -6
- package/dist/molecules/index.cjs.map +1 -1
- package/dist/molecules/index.js +9 -9
- package/dist/molecules/training-info-guideline.cjs +36 -6
- package/dist/molecules/training-info-guideline.cjs.map +1 -1
- package/dist/molecules/training-info-guideline.js +1 -1
- package/package.json +1 -1
- package/src/app/platform/contents-card.tsx +5 -5
- package/src/molecules/training-info-guideline.tsx +28 -7
- package/dist/chunk-BXRTYDSY.js.map +0 -1
- /package/dist/{chunk-YC5XSFKC.js.map → chunk-OYJ7HJIE.js.map} +0 -0
package/dist/molecules/index.js
CHANGED
|
@@ -51,9 +51,6 @@ import {
|
|
|
51
51
|
DatePicker
|
|
52
52
|
} from "../chunk-OE2AVQED.js";
|
|
53
53
|
import "../chunk-2ISIAPFS.js";
|
|
54
|
-
import {
|
|
55
|
-
Navigation
|
|
56
|
-
} from "../chunk-JRT6KTBG.js";
|
|
57
54
|
import {
|
|
58
55
|
OneOnOneGuideList,
|
|
59
56
|
oneOnOneNoteTextReplacer
|
|
@@ -77,10 +74,10 @@ import "../chunk-NRPDVI76.js";
|
|
|
77
74
|
import "../chunk-2BPFXK4L.js";
|
|
78
75
|
import {
|
|
79
76
|
TrainingInfoGuideline
|
|
80
|
-
} from "../chunk-
|
|
77
|
+
} from "../chunk-XLKJYRFY.js";
|
|
81
78
|
import {
|
|
82
79
|
DynamicFormEditor
|
|
83
|
-
} from "../chunk-
|
|
80
|
+
} from "../chunk-OYJ7HJIE.js";
|
|
84
81
|
import {
|
|
85
82
|
DynamicFormResponseItem
|
|
86
83
|
} from "../chunk-77H5BUYO.js";
|
|
@@ -96,9 +93,8 @@ import {
|
|
|
96
93
|
} from "../chunk-SACH3XVV.js";
|
|
97
94
|
import "../chunk-7FKRQQYK.js";
|
|
98
95
|
import {
|
|
99
|
-
|
|
100
|
-
} from "../chunk-
|
|
101
|
-
import "../chunk-ADAQSPUA.js";
|
|
96
|
+
Navigation
|
|
97
|
+
} from "../chunk-JRT6KTBG.js";
|
|
102
98
|
import {
|
|
103
99
|
DotNavigation
|
|
104
100
|
} from "../chunk-IJOOKMKQ.js";
|
|
@@ -107,7 +103,6 @@ import {
|
|
|
107
103
|
} from "../chunk-OHNBVT52.js";
|
|
108
104
|
import "../chunk-2REWQIZJ.js";
|
|
109
105
|
import "../chunk-6UXCNYVO.js";
|
|
110
|
-
import "../chunk-Z7WNKARH.js";
|
|
111
106
|
import "../chunk-MIATMZDP.js";
|
|
112
107
|
import "../chunk-JRSZNGFD.js";
|
|
113
108
|
import {
|
|
@@ -117,9 +112,14 @@ import {
|
|
|
117
112
|
import {
|
|
118
113
|
DynamicFormField
|
|
119
114
|
} from "../chunk-MPZJH3PI.js";
|
|
115
|
+
import "../chunk-Z7WNKARH.js";
|
|
120
116
|
import {
|
|
121
117
|
AutocompleteTextfield
|
|
122
118
|
} from "../chunk-LSDD4TAP.js";
|
|
119
|
+
import {
|
|
120
|
+
DescriptionJsonRender
|
|
121
|
+
} from "../chunk-HYMODLGE.js";
|
|
122
|
+
import "../chunk-ADAQSPUA.js";
|
|
123
123
|
import "../chunk-4U6DFH7Z.js";
|
|
124
124
|
import "../chunk-QDC3LFHS.js";
|
|
125
125
|
import "../chunk-5XYPLDI5.js";
|
|
@@ -569,14 +569,44 @@ function TrainingInfoGuidelineButton({
|
|
|
569
569
|
Button,
|
|
570
570
|
{
|
|
571
571
|
onClick,
|
|
572
|
-
style: {
|
|
572
|
+
style: {
|
|
573
|
+
width: "100%",
|
|
574
|
+
height: "auto",
|
|
575
|
+
minHeight: "48px",
|
|
576
|
+
textAlign: "left",
|
|
577
|
+
paddingTop: 8,
|
|
578
|
+
paddingBottom: 8
|
|
579
|
+
},
|
|
573
580
|
variant: "outline",
|
|
574
581
|
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_themes11.Flex, { align: "center", gap: "2", width: "100%", children: [
|
|
575
|
-
icon,
|
|
576
|
-
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_themes9.Separator, { orientation: "vertical", size: "2" }),
|
|
577
|
-
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_themes8.Box, { children: [
|
|
578
|
-
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
579
|
-
|
|
582
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_themes11.Flex, { align: "center", flexShrink: "0", children: icon }),
|
|
583
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_themes9.Separator, { orientation: "vertical", size: "2", style: { flexShrink: 0 } }),
|
|
584
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_themes8.Box, { flexGrow: "1", style: { minWidth: 0 }, children: [
|
|
585
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
586
|
+
Typo,
|
|
587
|
+
{
|
|
588
|
+
as: "div",
|
|
589
|
+
style: {
|
|
590
|
+
whiteSpace: "normal",
|
|
591
|
+
wordBreak: "break-word",
|
|
592
|
+
overflowWrap: "anywhere"
|
|
593
|
+
},
|
|
594
|
+
children: title
|
|
595
|
+
}
|
|
596
|
+
),
|
|
597
|
+
typeof description === "string" && description !== "" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
598
|
+
Typo,
|
|
599
|
+
{
|
|
600
|
+
style: {
|
|
601
|
+
display: "block",
|
|
602
|
+
whiteSpace: "normal",
|
|
603
|
+
wordBreak: "break-word",
|
|
604
|
+
overflowWrap: "anywhere"
|
|
605
|
+
},
|
|
606
|
+
variant: "caption",
|
|
607
|
+
children: description
|
|
608
|
+
}
|
|
609
|
+
) : null
|
|
580
610
|
] })
|
|
581
611
|
] })
|
|
582
612
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/molecules/training-info-guideline.tsx","../../src/atoms/aspect-ratio.tsx","../../src/atoms/button.tsx","../../src/utils/convert-button-size.ts","../../src/atoms/dialog.tsx","../../src/theme/portal-provider.tsx","../../src/atoms/heading.tsx","../../src/utils/map-with-responsive.ts","../../src/atoms/icon-button.tsx","../../src/utils/convert-icon-button-size.ts","../../src/atoms/spinner.tsx","../../src/atoms/box.tsx","../../src/atoms/separator.tsx","../../src/atoms/typo.tsx","../../src/atoms/flex.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { FileTextIcon, VideoIcon } from '@radix-ui/react-icons';\nimport { AspectRatio } from '@/atoms/aspect-ratio';\nimport { Button } from '@/atoms/button';\nimport type { TrainingInfoGuidelineContents } from '@/types/training-info-guideline-schema-generated';\nimport { Dialog } from '@/atoms/dialog';\nimport { Spinner } from '@/atoms/spinner';\nimport { Box } from '@/atoms/box';\nimport { Separator } from '@/atoms/separator';\nimport { Typo } from '@/atoms/typo';\nimport { Flex } from '../atoms/flex';\n\nexport interface TrainingInfoGuidelineProps {\n values: TrainingInfoGuidelineContents['values'];\n onClickFileDownload: (args: { url: string; filename: string }) => void;\n}\n\nexport function TrainingInfoGuideline({\n values,\n onClickFileDownload,\n}: TrainingInfoGuidelineProps): React.ReactElement {\n return (\n <>\n {values.map((value) => (\n <TrainingInfoGuidelineItem\n key={getItemKey(value)}\n onClickFileDownload={onClickFileDownload}\n value={value}\n />\n ))}\n </>\n );\n}\n\ntype TrainingInfoGuidelineValue =\n TrainingInfoGuidelineContents['values'][number];\n\nfunction getItemKey(value: TrainingInfoGuidelineValue): string {\n return value.url;\n}\n\ninterface TrainingInfoGuidelineItemProps {\n value: TrainingInfoGuidelineValue;\n onClickFileDownload: TrainingInfoGuidelineProps['onClickFileDownload'];\n}\n\nfunction TrainingInfoGuidelineItem({\n value,\n onClickFileDownload,\n}: TrainingInfoGuidelineItemProps): React.ReactElement | null {\n const [isLoading, setIsLoading] = useState(true);\n\n if (value.type === 'file') {\n return (\n <TrainingInfoGuidelineButton\n description=\"파일 다운로드\"\n icon={<FileTextIcon />}\n onClick={() => {\n onClickFileDownload({ url: value.url, filename: value.filename });\n }}\n title={value.downloadButtonName}\n />\n );\n }\n\n if (value.type === 'youtube-shorts') {\n return (\n <TrainingInfoGuidelineButton\n description=\"TIPP 쇼츠 보기\"\n icon={<VideoIcon />}\n onClick={() => {\n window.open(value.url, '_blank');\n }}\n title={value.title}\n />\n );\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 차후 다른 타입 추가 시 사용\n if (value.type === 'video') {\n return (\n <Dialog.Root>\n <Dialog.Trigger>\n <TrainingInfoGuidelineButton\n description=\"영상 자료\"\n icon={<VideoIcon />}\n title={value.videoTitle}\n />\n </Dialog.Trigger>\n <Dialog.Content\n height=\"100%\"\n maxHeight=\"500px\"\n maxWidth=\"800px\"\n title={value.videoTitle}\n width=\"100%\"\n >\n <AspectRatio ratio={16 / 9} style={{ width: '100%' }}>\n <Flex\n align=\"center\"\n justify=\"center\"\n style={{\n width: '100%',\n height: '100%',\n backgroundColor: 'black',\n position: 'relative',\n }}\n >\n {isLoading ? (\n <Flex\n align=\"center\"\n height=\"100%\"\n justify=\"center\"\n position=\"absolute\"\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 1,\n color: 'white',\n }}\n width=\"100%\"\n >\n <Spinner size=\"3\" style={{ width: 48, height: 48 }} />\n </Flex>\n ) : null}\n\n <iframe\n allowFullScreen\n onError={() => {\n setIsLoading(false);\n }} // 필요시 에러 메시지로 대체\n onLoad={() => {\n setIsLoading(false);\n }}\n src={`${value.url}?theme=light`}\n style={{ width: '100%', height: '100%', border: 'none' }}\n title=\"Curriculum Video\"\n />\n </Flex>\n </AspectRatio>\n </Dialog.Content>\n </Dialog.Root>\n );\n }\n return null;\n}\n\ninterface TrainingInfoGuidelineButtonProps {\n icon: React.ReactNode;\n title: string;\n description?: string;\n onClick?: () => void;\n}\n\nfunction TrainingInfoGuidelineButton({\n icon,\n title,\n description,\n onClick,\n}: TrainingInfoGuidelineButtonProps): React.ReactElement {\n return (\n <Button\n onClick={onClick}\n style={{ width: '100%', height: '48px' , textAlign: 'left'}}\n variant=\"outline\"\n >\n <Flex align=\"center\" gap=\"2\" width=\"100%\">\n {icon}\n <Separator orientation=\"vertical\" size=\"2\" />\n <Box>\n <Typo as=\"div\">\n {title}\n </Typo>\n {typeof description === 'string' && description !== '' ? (\n <Typo variant=\"caption\" >\n {description}\n </Typo>\n ) : null}\n </Box>\n \n </Flex>\n </Button>\n );\n}\n","export { AspectRatio } from '@radix-ui/themes';\n","import React, { forwardRef, useMemo } from 'react';\nimport { Button as RadixButton } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { convertSize } from '../utils/convert-button-size';\nimport type { ButtonProps } from './button.type';\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref): React.ReactNode => {\n const { size, style, variant, ...restProps } = props;\n\n const radixSize = useMemo(() => {\n return convertSize(size);\n }, [size]);\n\n const radixVariant = useMemo(() => {\n if (variant === 'transparent') return 'ghost';\n return variant;\n }, [variant]);\n\n const className = useMemo(() => {\n return clsx(props.className, { transparent: variant === 'transparent' });\n }, [props.className, variant]);\n\n return (\n <RadixButton\n style={style}\n type=\"button\"\n variant={radixVariant}\n {...restProps}\n className={className}\n ref={ref}\n size={radixSize}\n />\n );\n }\n);\n\nButton.displayName = 'Button';\n","import { type ButtonProps as RadixButtonProps } from '@radix-ui/themes';\nimport type { Breakpoint } from '@radix-ui/themes/props';\nimport type { ButtonProps } from '../atoms/button.type';\n\nexport const convertSizeStr = (\n size: ButtonProps['size']\n): '1' | '2' | '3' | '4' => {\n switch (size) {\n case 'small':\n return '1';\n case 'medium':\n return '2';\n case 'large':\n return '3';\n default:\n return '2';\n }\n};\n\nexport const convertSizeResponse = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string' || typeof size === 'undefined') {\n return convertSizeStr(size);\n }\n const radixSize: RadixButtonProps['size'] = {};\n let key: Breakpoint = 'initial';\n for (key in size) {\n radixSize[key] = convertSizeStr(size[key]);\n }\n return radixSize;\n};\n\nexport const convertSize = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string') {\n return convertSizeStr(size);\n }\n return convertSizeResponse(size);\n};\n","import * as RadixDialog from '@radix-ui/react-dialog';\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport { Flex, Theme } from '@radix-ui/themes';\nimport { useEffect, useRef } from 'react';\nimport { usePortalContainer } from '@/theme/portal-provider';\nimport { Heading } from './heading';\nimport { IconButton } from './icon-button';\n\ntype ContentProps = RadixDialog.DialogContentProps & {\n width?: string;\n maxWidth?: string;\n minWidth?: string;\n height?: string;\n maxHeight?: string;\n minHeight?: string;\n title?: string;\n hideCloseButton?: boolean;\n buttons?: React.ReactNode;\n size?: '1' | '2' | '3' | '4';\n};\n\nconst preventDefault: RadixDialog.DialogContentProps['onPointerDownOutside'] = (\n e\n) => {\n e.preventDefault();\n};\n\nfunction Content(props: ContentProps): React.ReactNode {\n const {\n children,\n style = {},\n width,\n maxWidth,\n minWidth,\n maxHeight,\n height,\n minHeight,\n title,\n buttons,\n size,\n hideCloseButton,\n className,\n ...rest\n } = props;\n const { dialogContainerRef } = usePortalContainer();\n\n return (\n <RadixDialog.Portal container={dialogContainerRef.current}>\n <Theme asChild>\n <RadixDialog.Overlay className=\"rt-BaseDialogScroll rt-DialogScroll DialogOverlay\">\n <RadixDialog.Content\n className={`DialogContent ${className || ''} rt-BaseDialogContent rt-DialogContent rt-r-size-${size||'3'}`}\n onPointerDownOutside={preventDefault}\n style={{\n width,\n maxWidth,\n minWidth,\n maxHeight,\n height,\n minHeight,\n ...style,\n }}\n {...rest}\n >\n <Flex gap=\"2\" justify=\"between\" width=\"100%\">\n <RadixDialog.Title asChild>\n {typeof title === 'string' && title !== '' ? (\n <Heading mb=\"2\" variant=\"heading3\">\n {title}\n </Heading>\n ) : (\n title\n )}\n </RadixDialog.Title>\n {!hideCloseButton && (\n <RadixDialog.Close asChild className=\"DialogClose\">\n <IconButton color=\"gray\" variant=\"ghost\">\n <Cross1Icon />\n </IconButton>\n </RadixDialog.Close>\n )}\n </Flex>\n {children}\n {buttons ? (\n <Flex gap=\"3\" justify=\"end\" mt=\"3\" width=\"100%\">\n {buttons}\n </Flex>\n ) : null}\n </RadixDialog.Content>\n </RadixDialog.Overlay>\n </Theme>\n </RadixDialog.Portal>\n );\n}\n\nfunction Close({\n children,\n ...rest\n}: RadixDialog.DialogCloseProps): React.ReactNode {\n return (\n <RadixDialog.Close asChild {...rest}>\n {children}\n </RadixDialog.Close>\n );\n}\n\nfunction Trigger({\n children,\n ...rest\n}: RadixDialog.DialogTriggerProps): React.ReactNode {\n return (\n <RadixDialog.Trigger asChild {...rest}>\n {children}\n </RadixDialog.Trigger>\n );\n}\n\nfunction Root(props: RadixDialog.DialogProps): React.ReactNode {\n const prevOpenRef = useRef<boolean | undefined>(undefined);\n const cleanupExecutedRef = useRef<boolean>(false);\n\n // 모달이 닫힌 후 포커스 복원 및 이벤트 정리\n useEffect(() => {\n const prevOpen = prevOpenRef.current;\n const currentOpen = props.open;\n\n // 현재 상태를 이전 상태로 업데이트 (if 분기의 early return과 무관하게 항상 실행)\n prevOpenRef.current = currentOpen;\n\n // 모달이 열린 상태에서 닫힌 상태로 변경될 때만 실행\n if (prevOpen === true && currentOpen === false && !cleanupExecutedRef.current) {\n cleanupExecutedRef.current = true;\n\n // 모달이 닫힌 후 약간의 지연을 두고 포커스 복원\n const timer = setTimeout(() => {\n try {\n // 활성 요소에 포커스 복원\n const activeElement = document.activeElement as HTMLElement | null;\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 어떤 dom인지 확실하지 않음\n activeElement?.blur?.();\n\n // body의 pointer-events 복원\n document.body.style.pointerEvents = '';\n } catch {\n // 에러 무시\n } finally {\n cleanupExecutedRef.current = false;\n }\n }, 100);\n\n return () => {\n clearTimeout(timer);\n cleanupExecutedRef.current = false;\n };\n }\n }, [props.open]);\n\n // open=true 상태에서 컴포넌트가 언마운트될 때 body 스타일 복원\n useEffect(() => {\n return () => {\n if (prevOpenRef.current === true) {\n document.body.style.pointerEvents = '';\n }\n };\n }, []);\n\n return <RadixDialog.Root {...props} />;\n}\n\nexport const Dialog = {\n Root,\n Trigger,\n Content,\n Close,\n Description: RadixDialog.Description,\n Title: RadixDialog.Title,\n};\n","import React, { createContext, useContext, useRef } from 'react';\n\ninterface PortalProviderProps {\n children: React.ReactNode;\n}\n\ninterface PortalState {\n dialogContainerRef: React.RefObject<HTMLDivElement | null>;\n drawerContainerRef: React.RefObject<HTMLDivElement | null>;\n}\n\nconst PortalContext = createContext<PortalState>(\n null as unknown as PortalState\n);\n\nexport function PortalProvider({\n children,\n}: PortalProviderProps): React.ReactNode {\n const dialogContainerRef = useRef<HTMLDivElement | null>(null);\n const drawerContainerRef = useRef<HTMLDivElement | null>(null);\n\n return (\n <PortalContext.Provider value={{ dialogContainerRef, drawerContainerRef }}>\n {children}\n <div className=\"drawer-portal-container\" ref={drawerContainerRef} />\n <div className=\"dialog-portal-container\" ref={dialogContainerRef} />\n </PortalContext.Provider>\n );\n}\n\nexport const usePortalContainer = (): PortalState => {\n try {\n const state = useContext(PortalContext);\n return state;\n } catch (error) {\n throw new Error('PortalProvider not found');\n }\n};\n\nexport default PortalProvider;\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { useMemo } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\ntype HeadingVariant =\n | 'heading1'\n | 'heading2'\n | 'heading3'\n | 'heading4'\n | 'heading5';\nexport type HeadingProps = RadixHeadingProps & {\n variant?: Responsive<HeadingVariant>;\n};\n\ntype HeadingSize = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9';\n\nconst mapVariant = (variant?: HeadingVariant): HeadingSize | undefined => {\n switch (variant) {\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n case 'heading4':\n return '4';\n case 'heading5':\n return '3';\n default:\n return undefined;\n }\n};\n\nexport function Heading(props: HeadingProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n return variant\n ? mapWithResponsive({\n value: variant,\n mapFn: mapVariant,\n })\n : size;\n \n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","import type { Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args: {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n const {value, mapFn} = args;\n if(typeof value === 'string'){\n return mapFn(value);\n };\n \n if(typeof value === 'object'){\n const newObj: Partial<Record<Breakpoint, K>> = {};\n let key: Breakpoint;\n for(key in value){\n newObj[key] = mapFn(value[key]);\n }\n return newObj;\n }\n return value;\n};\n","import React, { forwardRef, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport { IconButton as RadixIconButton } from '@radix-ui/themes';\nimport { convertSize } from '../utils/convert-icon-button-size';\nimport type { ButtonProps } from './button.type';\n\nexport type IconButtonProps = ButtonProps;\nexport const IconButton = forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref): React.ReactNode => {\n const { size, style, variant, ...restProps } = props;\n\n const radixSize = useMemo(() => {\n return convertSize(size);\n }, [size]);\n\n const radixVariant = useMemo(() => {\n if (variant === 'transparent') return 'ghost';\n return variant;\n }, [variant]);\n\n const className = useMemo(() => {\n return clsx(props.className, { transparent: variant === 'transparent' });\n }, [props.className, variant]);\n\n return (\n <RadixIconButton\n style={style}\n type=\"button\"\n variant={radixVariant}\n {...restProps}\n className={className}\n ref={ref}\n size={radixSize}\n />\n );\n }\n);\n\nIconButton.displayName = 'IconButton';\n","import { type ButtonProps as RadixButtonProps } from '@radix-ui/themes';\nimport type { Breakpoint } from '@radix-ui/themes/props';\nimport type { ButtonProps } from '../atoms/button.type';\n\nexport const convertSizeStr = (\n size: ButtonProps['size']\n): '1' | '2' | '3' | '4' => {\n switch (size) {\n case 'small':\n return '1';\n case 'medium':\n return '2';\n case 'large':\n return '4';\n default:\n return '2';\n }\n};\n\nexport const convertSizeResponse = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string' || typeof size === 'undefined') {\n return convertSizeStr(size);\n }\n const radixSize: RadixButtonProps['size'] = {};\n let key: Breakpoint = 'initial';\n for (key in size) {\n radixSize[key] = convertSizeStr(size[key]);\n }\n return radixSize;\n};\n\nexport const convertSize = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string') {\n return convertSizeStr(size);\n }\n return convertSizeResponse(size);\n};\n","export { Spinner, type SpinnerProps } from '@radix-ui/themes';\n","export { Box, type BoxProps } from '@radix-ui/themes';\n","export { Separator, type SeparatorProps } from '@radix-ui/themes';\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport type TypoProps = RadixTextProps & {\n variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactNode => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n\n if (variant === undefined) return '2';\n\n return mapWithResponsive({\n value: variant,\n mapFn: (variantValue?: 'body' | 'caption' | 'subtitle') => {\n switch (variantValue) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n },\n });\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n"],"mappings":"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","names":["import_react","import_react_icons","import_themes","RadixButton","import_themes","import_react","import_react","import_jsx_runtime","import_themes","import_react","import_themes","import_jsx_runtime","Heading","RadixHeading","import_react","import_clsx","import_themes","convertSizeStr","convertSizeResponse","convertSize","import_jsx_runtime","convertSize","RadixIconButton","import_jsx_runtime","Content","Heading","Close","Trigger","Root","import_themes","import_themes","import_themes","import_themes","import_react","import_jsx_runtime","RadixText","import_themes","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/molecules/training-info-guideline.tsx","../../src/atoms/aspect-ratio.tsx","../../src/atoms/button.tsx","../../src/utils/convert-button-size.ts","../../src/atoms/dialog.tsx","../../src/theme/portal-provider.tsx","../../src/atoms/heading.tsx","../../src/utils/map-with-responsive.ts","../../src/atoms/icon-button.tsx","../../src/utils/convert-icon-button-size.ts","../../src/atoms/spinner.tsx","../../src/atoms/box.tsx","../../src/atoms/separator.tsx","../../src/atoms/typo.tsx","../../src/atoms/flex.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { FileTextIcon, VideoIcon } from '@radix-ui/react-icons';\nimport { AspectRatio } from '@/atoms/aspect-ratio';\nimport { Button } from '@/atoms/button';\nimport type { TrainingInfoGuidelineContents } from '@/types/training-info-guideline-schema-generated';\nimport { Dialog } from '@/atoms/dialog';\nimport { Spinner } from '@/atoms/spinner';\nimport { Box } from '@/atoms/box';\nimport { Separator } from '@/atoms/separator';\nimport { Typo } from '@/atoms/typo';\nimport { Flex } from '../atoms/flex';\n\nexport interface TrainingInfoGuidelineProps {\n values: TrainingInfoGuidelineContents['values'];\n onClickFileDownload: (args: { url: string; filename: string }) => void;\n}\n\nexport function TrainingInfoGuideline({\n values,\n onClickFileDownload,\n}: TrainingInfoGuidelineProps): React.ReactElement {\n return (\n <>\n {values.map((value) => (\n <TrainingInfoGuidelineItem\n key={getItemKey(value)}\n onClickFileDownload={onClickFileDownload}\n value={value}\n />\n ))}\n </>\n );\n}\n\ntype TrainingInfoGuidelineValue =\n TrainingInfoGuidelineContents['values'][number];\n\nfunction getItemKey(value: TrainingInfoGuidelineValue): string {\n return value.url;\n}\n\ninterface TrainingInfoGuidelineItemProps {\n value: TrainingInfoGuidelineValue;\n onClickFileDownload: TrainingInfoGuidelineProps['onClickFileDownload'];\n}\n\nfunction TrainingInfoGuidelineItem({\n value,\n onClickFileDownload,\n}: TrainingInfoGuidelineItemProps): React.ReactElement | null {\n const [isLoading, setIsLoading] = useState(true);\n\n if (value.type === 'file') {\n return (\n <TrainingInfoGuidelineButton\n description=\"파일 다운로드\"\n icon={<FileTextIcon />}\n onClick={() => {\n onClickFileDownload({ url: value.url, filename: value.filename });\n }}\n title={value.downloadButtonName}\n />\n );\n }\n\n if (value.type === 'youtube-shorts') {\n return (\n <TrainingInfoGuidelineButton\n description=\"TIPP 쇼츠 보기\"\n icon={<VideoIcon />}\n onClick={() => {\n window.open(value.url, '_blank');\n }}\n title={value.title}\n />\n );\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 차후 다른 타입 추가 시 사용\n if (value.type === 'video') {\n return (\n <Dialog.Root>\n <Dialog.Trigger>\n <TrainingInfoGuidelineButton\n description=\"영상 자료\"\n icon={<VideoIcon />}\n title={value.videoTitle}\n />\n </Dialog.Trigger>\n <Dialog.Content\n height=\"100%\"\n maxHeight=\"500px\"\n maxWidth=\"800px\"\n title={value.videoTitle}\n width=\"100%\"\n >\n <AspectRatio ratio={16 / 9} style={{ width: '100%' }}>\n <Flex\n align=\"center\"\n justify=\"center\"\n style={{\n width: '100%',\n height: '100%',\n backgroundColor: 'black',\n position: 'relative',\n }}\n >\n {isLoading ? (\n <Flex\n align=\"center\"\n height=\"100%\"\n justify=\"center\"\n position=\"absolute\"\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 1,\n color: 'white',\n }}\n width=\"100%\"\n >\n <Spinner size=\"3\" style={{ width: 48, height: 48 }} />\n </Flex>\n ) : null}\n\n <iframe\n allowFullScreen\n onError={() => {\n setIsLoading(false);\n }} // 필요시 에러 메시지로 대체\n onLoad={() => {\n setIsLoading(false);\n }}\n src={`${value.url}?theme=light`}\n style={{ width: '100%', height: '100%', border: 'none' }}\n title=\"Curriculum Video\"\n />\n </Flex>\n </AspectRatio>\n </Dialog.Content>\n </Dialog.Root>\n );\n }\n return null;\n}\n\ninterface TrainingInfoGuidelineButtonProps {\n icon: React.ReactNode;\n title: string;\n description?: string;\n onClick?: () => void;\n}\n\nfunction TrainingInfoGuidelineButton({\n icon,\n title,\n description,\n onClick,\n}: TrainingInfoGuidelineButtonProps): React.ReactElement {\n return (\n <Button\n onClick={onClick}\n style={{\n width: '100%',\n height: 'auto',\n minHeight: '48px',\n textAlign: 'left',\n paddingTop: 8,\n paddingBottom: 8,\n }}\n variant=\"outline\"\n >\n <Flex align=\"center\" gap=\"2\" width=\"100%\">\n <Flex align=\"center\" flexShrink=\"0\">{icon}</Flex>\n <Separator orientation=\"vertical\" size=\"2\" style={{ flexShrink: 0 }} />\n <Box flexGrow=\"1\" style={{ minWidth: 0 }}>\n <Typo\n as=\"div\"\n style={{\n whiteSpace: 'normal',\n wordBreak: 'break-word',\n overflowWrap: 'anywhere',\n }}\n >\n {title}\n </Typo>\n {typeof description === 'string' && description !== '' ? (\n <Typo\n style={{\n display: 'block',\n whiteSpace: 'normal',\n wordBreak: 'break-word',\n overflowWrap: 'anywhere',\n }}\n variant=\"caption\"\n >\n {description}\n </Typo>\n ) : null}\n </Box>\n </Flex>\n </Button>\n );\n}\n","export { AspectRatio } from '@radix-ui/themes';\n","import React, { forwardRef, useMemo } from 'react';\nimport { Button as RadixButton } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { convertSize } from '../utils/convert-button-size';\nimport type { ButtonProps } from './button.type';\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref): React.ReactNode => {\n const { size, style, variant, ...restProps } = props;\n\n const radixSize = useMemo(() => {\n return convertSize(size);\n }, [size]);\n\n const radixVariant = useMemo(() => {\n if (variant === 'transparent') return 'ghost';\n return variant;\n }, [variant]);\n\n const className = useMemo(() => {\n return clsx(props.className, { transparent: variant === 'transparent' });\n }, [props.className, variant]);\n\n return (\n <RadixButton\n style={style}\n type=\"button\"\n variant={radixVariant}\n {...restProps}\n className={className}\n ref={ref}\n size={radixSize}\n />\n );\n }\n);\n\nButton.displayName = 'Button';\n","import { type ButtonProps as RadixButtonProps } from '@radix-ui/themes';\nimport type { Breakpoint } from '@radix-ui/themes/props';\nimport type { ButtonProps } from '../atoms/button.type';\n\nexport const convertSizeStr = (\n size: ButtonProps['size']\n): '1' | '2' | '3' | '4' => {\n switch (size) {\n case 'small':\n return '1';\n case 'medium':\n return '2';\n case 'large':\n return '3';\n default:\n return '2';\n }\n};\n\nexport const convertSizeResponse = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string' || typeof size === 'undefined') {\n return convertSizeStr(size);\n }\n const radixSize: RadixButtonProps['size'] = {};\n let key: Breakpoint = 'initial';\n for (key in size) {\n radixSize[key] = convertSizeStr(size[key]);\n }\n return radixSize;\n};\n\nexport const convertSize = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string') {\n return convertSizeStr(size);\n }\n return convertSizeResponse(size);\n};\n","import * as RadixDialog from '@radix-ui/react-dialog';\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport { Flex, Theme } from '@radix-ui/themes';\nimport { useEffect, useRef } from 'react';\nimport { usePortalContainer } from '@/theme/portal-provider';\nimport { Heading } from './heading';\nimport { IconButton } from './icon-button';\n\ntype ContentProps = RadixDialog.DialogContentProps & {\n width?: string;\n maxWidth?: string;\n minWidth?: string;\n height?: string;\n maxHeight?: string;\n minHeight?: string;\n title?: string;\n hideCloseButton?: boolean;\n buttons?: React.ReactNode;\n size?: '1' | '2' | '3' | '4';\n};\n\nconst preventDefault: RadixDialog.DialogContentProps['onPointerDownOutside'] = (\n e\n) => {\n e.preventDefault();\n};\n\nfunction Content(props: ContentProps): React.ReactNode {\n const {\n children,\n style = {},\n width,\n maxWidth,\n minWidth,\n maxHeight,\n height,\n minHeight,\n title,\n buttons,\n size,\n hideCloseButton,\n className,\n ...rest\n } = props;\n const { dialogContainerRef } = usePortalContainer();\n\n return (\n <RadixDialog.Portal container={dialogContainerRef.current}>\n <Theme asChild>\n <RadixDialog.Overlay className=\"rt-BaseDialogScroll rt-DialogScroll DialogOverlay\">\n <RadixDialog.Content\n className={`DialogContent ${className || ''} rt-BaseDialogContent rt-DialogContent rt-r-size-${size||'3'}`}\n onPointerDownOutside={preventDefault}\n style={{\n width,\n maxWidth,\n minWidth,\n maxHeight,\n height,\n minHeight,\n ...style,\n }}\n {...rest}\n >\n <Flex gap=\"2\" justify=\"between\" width=\"100%\">\n <RadixDialog.Title asChild>\n {typeof title === 'string' && title !== '' ? (\n <Heading mb=\"2\" variant=\"heading3\">\n {title}\n </Heading>\n ) : (\n title\n )}\n </RadixDialog.Title>\n {!hideCloseButton && (\n <RadixDialog.Close asChild className=\"DialogClose\">\n <IconButton color=\"gray\" variant=\"ghost\">\n <Cross1Icon />\n </IconButton>\n </RadixDialog.Close>\n )}\n </Flex>\n {children}\n {buttons ? (\n <Flex gap=\"3\" justify=\"end\" mt=\"3\" width=\"100%\">\n {buttons}\n </Flex>\n ) : null}\n </RadixDialog.Content>\n </RadixDialog.Overlay>\n </Theme>\n </RadixDialog.Portal>\n );\n}\n\nfunction Close({\n children,\n ...rest\n}: RadixDialog.DialogCloseProps): React.ReactNode {\n return (\n <RadixDialog.Close asChild {...rest}>\n {children}\n </RadixDialog.Close>\n );\n}\n\nfunction Trigger({\n children,\n ...rest\n}: RadixDialog.DialogTriggerProps): React.ReactNode {\n return (\n <RadixDialog.Trigger asChild {...rest}>\n {children}\n </RadixDialog.Trigger>\n );\n}\n\nfunction Root(props: RadixDialog.DialogProps): React.ReactNode {\n const prevOpenRef = useRef<boolean | undefined>(undefined);\n const cleanupExecutedRef = useRef<boolean>(false);\n\n // 모달이 닫힌 후 포커스 복원 및 이벤트 정리\n useEffect(() => {\n const prevOpen = prevOpenRef.current;\n const currentOpen = props.open;\n\n // 현재 상태를 이전 상태로 업데이트 (if 분기의 early return과 무관하게 항상 실행)\n prevOpenRef.current = currentOpen;\n\n // 모달이 열린 상태에서 닫힌 상태로 변경될 때만 실행\n if (prevOpen === true && currentOpen === false && !cleanupExecutedRef.current) {\n cleanupExecutedRef.current = true;\n\n // 모달이 닫힌 후 약간의 지연을 두고 포커스 복원\n const timer = setTimeout(() => {\n try {\n // 활성 요소에 포커스 복원\n const activeElement = document.activeElement as HTMLElement | null;\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- 어떤 dom인지 확실하지 않음\n activeElement?.blur?.();\n\n // body의 pointer-events 복원\n document.body.style.pointerEvents = '';\n } catch {\n // 에러 무시\n } finally {\n cleanupExecutedRef.current = false;\n }\n }, 100);\n\n return () => {\n clearTimeout(timer);\n cleanupExecutedRef.current = false;\n };\n }\n }, [props.open]);\n\n // open=true 상태에서 컴포넌트가 언마운트될 때 body 스타일 복원\n useEffect(() => {\n return () => {\n if (prevOpenRef.current === true) {\n document.body.style.pointerEvents = '';\n }\n };\n }, []);\n\n return <RadixDialog.Root {...props} />;\n}\n\nexport const Dialog = {\n Root,\n Trigger,\n Content,\n Close,\n Description: RadixDialog.Description,\n Title: RadixDialog.Title,\n};\n","import React, { createContext, useContext, useRef } from 'react';\n\ninterface PortalProviderProps {\n children: React.ReactNode;\n}\n\ninterface PortalState {\n dialogContainerRef: React.RefObject<HTMLDivElement | null>;\n drawerContainerRef: React.RefObject<HTMLDivElement | null>;\n}\n\nconst PortalContext = createContext<PortalState>(\n null as unknown as PortalState\n);\n\nexport function PortalProvider({\n children,\n}: PortalProviderProps): React.ReactNode {\n const dialogContainerRef = useRef<HTMLDivElement | null>(null);\n const drawerContainerRef = useRef<HTMLDivElement | null>(null);\n\n return (\n <PortalContext.Provider value={{ dialogContainerRef, drawerContainerRef }}>\n {children}\n <div className=\"drawer-portal-container\" ref={drawerContainerRef} />\n <div className=\"dialog-portal-container\" ref={dialogContainerRef} />\n </PortalContext.Provider>\n );\n}\n\nexport const usePortalContainer = (): PortalState => {\n try {\n const state = useContext(PortalContext);\n return state;\n } catch (error) {\n throw new Error('PortalProvider not found');\n }\n};\n\nexport default PortalProvider;\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { useMemo } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\ntype HeadingVariant =\n | 'heading1'\n | 'heading2'\n | 'heading3'\n | 'heading4'\n | 'heading5';\nexport type HeadingProps = RadixHeadingProps & {\n variant?: Responsive<HeadingVariant>;\n};\n\ntype HeadingSize = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9';\n\nconst mapVariant = (variant?: HeadingVariant): HeadingSize | undefined => {\n switch (variant) {\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n case 'heading4':\n return '4';\n case 'heading5':\n return '3';\n default:\n return undefined;\n }\n};\n\nexport function Heading(props: HeadingProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n return variant\n ? mapWithResponsive({\n value: variant,\n mapFn: mapVariant,\n })\n : size;\n \n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","import type { Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args: {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n const {value, mapFn} = args;\n if(typeof value === 'string'){\n return mapFn(value);\n };\n \n if(typeof value === 'object'){\n const newObj: Partial<Record<Breakpoint, K>> = {};\n let key: Breakpoint;\n for(key in value){\n newObj[key] = mapFn(value[key]);\n }\n return newObj;\n }\n return value;\n};\n","import React, { forwardRef, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport { IconButton as RadixIconButton } from '@radix-ui/themes';\nimport { convertSize } from '../utils/convert-icon-button-size';\nimport type { ButtonProps } from './button.type';\n\nexport type IconButtonProps = ButtonProps;\nexport const IconButton = forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref): React.ReactNode => {\n const { size, style, variant, ...restProps } = props;\n\n const radixSize = useMemo(() => {\n return convertSize(size);\n }, [size]);\n\n const radixVariant = useMemo(() => {\n if (variant === 'transparent') return 'ghost';\n return variant;\n }, [variant]);\n\n const className = useMemo(() => {\n return clsx(props.className, { transparent: variant === 'transparent' });\n }, [props.className, variant]);\n\n return (\n <RadixIconButton\n style={style}\n type=\"button\"\n variant={radixVariant}\n {...restProps}\n className={className}\n ref={ref}\n size={radixSize}\n />\n );\n }\n);\n\nIconButton.displayName = 'IconButton';\n","import { type ButtonProps as RadixButtonProps } from '@radix-ui/themes';\nimport type { Breakpoint } from '@radix-ui/themes/props';\nimport type { ButtonProps } from '../atoms/button.type';\n\nexport const convertSizeStr = (\n size: ButtonProps['size']\n): '1' | '2' | '3' | '4' => {\n switch (size) {\n case 'small':\n return '1';\n case 'medium':\n return '2';\n case 'large':\n return '4';\n default:\n return '2';\n }\n};\n\nexport const convertSizeResponse = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string' || typeof size === 'undefined') {\n return convertSizeStr(size);\n }\n const radixSize: RadixButtonProps['size'] = {};\n let key: Breakpoint = 'initial';\n for (key in size) {\n radixSize[key] = convertSizeStr(size[key]);\n }\n return radixSize;\n};\n\nexport const convertSize = (\n size: ButtonProps['size']\n): RadixButtonProps['size'] => {\n if (typeof size === 'string') {\n return convertSizeStr(size);\n }\n return convertSizeResponse(size);\n};\n","export { Spinner, type SpinnerProps } from '@radix-ui/themes';\n","export { Box, type BoxProps } from '@radix-ui/themes';\n","export { Separator, type SeparatorProps } from '@radix-ui/themes';\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\n\nexport type TypoProps = RadixTextProps & {\n variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactNode => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n\n if (variant === undefined) return '2';\n\n return mapWithResponsive({\n value: variant,\n mapFn: (variantValue?: 'body' | 'caption' | 'subtitle') => {\n switch (variantValue) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n },\n });\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n"],"mappings":"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","names":["import_react","import_react_icons","import_themes","RadixButton","import_themes","import_react","import_react","import_jsx_runtime","import_themes","import_react","import_themes","import_jsx_runtime","Heading","RadixHeading","import_react","import_clsx","import_themes","convertSizeStr","convertSizeResponse","convertSize","import_jsx_runtime","convertSize","RadixIconButton","import_jsx_runtime","Content","Heading","Close","Trigger","Root","import_themes","import_themes","import_themes","import_themes","import_react","import_jsx_runtime","RadixText","import_themes","import_jsx_runtime"]}
|
package/package.json
CHANGED
|
@@ -47,28 +47,28 @@ export const ContentsCard = forwardRef<HTMLDivElement, ContentsCardProps>(
|
|
|
47
47
|
width: '100%',
|
|
48
48
|
display: 'grid',
|
|
49
49
|
cursor: 'pointer',
|
|
50
|
-
maxHeight: '450px',
|
|
51
50
|
}}
|
|
52
51
|
>
|
|
53
52
|
{/* 섬네일 */}
|
|
54
53
|
<Inset clip="padding-box" pb="0" side="top">
|
|
55
54
|
<Skeleton loading={isLoading}>
|
|
56
55
|
<Box
|
|
57
|
-
height="210px"
|
|
58
56
|
style={{
|
|
57
|
+
aspectRatio: '704 / 407',
|
|
59
58
|
backgroundImage: `url(${imageSrc})`,
|
|
60
59
|
backgroundSize: 'cover',
|
|
61
60
|
backgroundPosition: 'center',
|
|
61
|
+
backgroundRepeat: 'no-repeat',
|
|
62
62
|
}}
|
|
63
63
|
width="100%"
|
|
64
64
|
/>
|
|
65
65
|
</Skeleton>
|
|
66
66
|
</Inset>
|
|
67
67
|
{/* 제목, 설명 */}
|
|
68
|
-
<Flex direction="column"
|
|
68
|
+
<Flex direction="column" pb="4" px="3" py="4">
|
|
69
69
|
<Box>
|
|
70
70
|
<Skeleton loading={isLoading}>
|
|
71
|
-
<Heading
|
|
71
|
+
<Heading variant="heading5">
|
|
72
72
|
{title}
|
|
73
73
|
</Heading>
|
|
74
74
|
</Skeleton>
|
|
@@ -82,7 +82,7 @@ export const ContentsCard = forwardRef<HTMLDivElement, ContentsCardProps>(
|
|
|
82
82
|
align="center"
|
|
83
83
|
columns="1fr auto"
|
|
84
84
|
justify="between"
|
|
85
|
-
pt="
|
|
85
|
+
pt="4"
|
|
86
86
|
style={{ marginTop: 'auto' }}
|
|
87
87
|
width="100%"
|
|
88
88
|
>
|
|
@@ -161,23 +161,44 @@ function TrainingInfoGuidelineButton({
|
|
|
161
161
|
return (
|
|
162
162
|
<Button
|
|
163
163
|
onClick={onClick}
|
|
164
|
-
style={{
|
|
164
|
+
style={{
|
|
165
|
+
width: '100%',
|
|
166
|
+
height: 'auto',
|
|
167
|
+
minHeight: '48px',
|
|
168
|
+
textAlign: 'left',
|
|
169
|
+
paddingTop: 8,
|
|
170
|
+
paddingBottom: 8,
|
|
171
|
+
}}
|
|
165
172
|
variant="outline"
|
|
166
173
|
>
|
|
167
174
|
<Flex align="center" gap="2" width="100%">
|
|
168
|
-
{icon}
|
|
169
|
-
<Separator orientation="vertical" size="2" />
|
|
170
|
-
<Box>
|
|
171
|
-
<Typo
|
|
175
|
+
<Flex align="center" flexShrink="0">{icon}</Flex>
|
|
176
|
+
<Separator orientation="vertical" size="2" style={{ flexShrink: 0 }} />
|
|
177
|
+
<Box flexGrow="1" style={{ minWidth: 0 }}>
|
|
178
|
+
<Typo
|
|
179
|
+
as="div"
|
|
180
|
+
style={{
|
|
181
|
+
whiteSpace: 'normal',
|
|
182
|
+
wordBreak: 'break-word',
|
|
183
|
+
overflowWrap: 'anywhere',
|
|
184
|
+
}}
|
|
185
|
+
>
|
|
172
186
|
{title}
|
|
173
187
|
</Typo>
|
|
174
188
|
{typeof description === 'string' && description !== '' ? (
|
|
175
|
-
<Typo
|
|
189
|
+
<Typo
|
|
190
|
+
style={{
|
|
191
|
+
display: 'block',
|
|
192
|
+
whiteSpace: 'normal',
|
|
193
|
+
wordBreak: 'break-word',
|
|
194
|
+
overflowWrap: 'anywhere',
|
|
195
|
+
}}
|
|
196
|
+
variant="caption"
|
|
197
|
+
>
|
|
176
198
|
{description}
|
|
177
199
|
</Typo>
|
|
178
200
|
) : null}
|
|
179
201
|
</Box>
|
|
180
|
-
|
|
181
202
|
</Flex>
|
|
182
203
|
</Button>
|
|
183
204
|
);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/app/platform/contents-card.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Heading } from '@/atoms/heading';\nimport { Button } from '@/atoms/button';\nimport { DropdownMenu } from '@/atoms/dropdown-menu';\nimport { Box } from '@/atoms/box';\nimport { Flex } from '@/atoms/flex';\nimport { Grid } from '@/atoms/grid';\nimport { Skeleton } from '@/atoms/skeleton';\nimport { Typo } from '@/atoms/typo';\nimport { DotsVerticalIcon } from '@/icon';\nimport { Card, Inset } from '@/atoms';\n\nexport interface ContentsCardProps {\n title?: React.ReactNode;\n description?: string;\n id?: string;\n imageSrc?: string | null;\n imageAlt?: string;\n footer?: React.ReactNode;\n dropdownItems?: {\n label: string;\n onClick: () => void;\n }[];\n onClickCard?: () => void;\n isLoading?: boolean;\n}\n\nexport const ContentsCard = forwardRef<HTMLDivElement, ContentsCardProps>(\n (\n {\n title,\n description,\n imageSrc,\n footer,\n dropdownItems,\n onClickCard,\n isLoading = false,\n },\n ref\n ): React.ReactNode => {\n return (\n <Card\n onClick={onClickCard}\n ref={ref}\n style={{\n height: '100%',\n width: '100%',\n display: 'grid',\n cursor: 'pointer',\n maxHeight: '450px',\n }}\n >\n {/* 섬네일 */}\n <Inset clip=\"padding-box\" pb=\"0\" side=\"top\">\n <Skeleton loading={isLoading}>\n <Box\n height=\"210px\"\n style={{\n backgroundImage: `url(${imageSrc})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n }}\n width=\"100%\"\n />\n </Skeleton>\n </Inset>\n {/* 제목, 설명 */}\n <Flex direction=\"column\" p=\"4\" pb=\"3\">\n <Box>\n <Skeleton loading={isLoading}>\n <Heading mb=\"3\" variant=\"heading5\">\n {title}\n </Heading>\n </Skeleton>\n <Skeleton loading={isLoading}>\n <Typo as=\"p\" variant=\"caption\">\n {description}\n </Typo>\n </Skeleton>\n </Box>\n <Grid\n align=\"center\"\n columns=\"1fr auto\"\n justify=\"between\"\n pt=\"2\"\n style={{ marginTop: 'auto' }}\n width=\"100%\"\n >\n <Skeleton loading={isLoading}>\n <Flex gap=\"3\" overflow=\"hidden\">\n {footer}\n </Flex>\n </Skeleton>\n {Boolean(dropdownItems?.length) && (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger>\n <Button size=\"large\" variant=\"transparent\">\n <DotsVerticalIcon color=\"gray\" height=\"20px\" width=\"20px\" />\n </Button>\n </DropdownMenu.Trigger>\n <DropdownMenu.Content>\n {dropdownItems?.map((item) => (\n <DropdownMenu.Item\n key={item.label}\n onClick={(e) => {\n e.stopPropagation();\n item.onClick();\n }}\n >\n {item.label}\n </DropdownMenu.Item>\n ))}\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n )}\n </Grid>\n </Flex>\n </Card>\n );\n }\n);\nContentsCard.displayName = 'ContentsCard';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAuDtB,cAaF,YAbE;AA5BL,IAAM,eAAe;AAAA,EAC1B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,GACA,QACoB;AACpB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT;AAAA,QACA,OAAO;AAAA,UACL,QAAQ;AAAA,UACR,OAAO;AAAA,UACP,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,WAAW;AAAA,QACb;AAAA,QAGA;AAAA,8BAAC,SAAM,MAAK,eAAc,IAAG,KAAI,MAAK,OACpC,8BAAC,YAAS,SAAS,WACjB;AAAA,YAAC;AAAA;AAAA,cACC,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,iBAAiB,OAAO,QAAQ;AAAA,gBAChC,gBAAgB;AAAA,gBAChB,oBAAoB;AAAA,cACtB;AAAA,cACA,OAAM;AAAA;AAAA,UACR,GACF,GACF;AAAA,UAEA,qBAAC,QAAK,WAAU,UAAS,GAAE,KAAI,IAAG,KAChC;AAAA,iCAAC,OACC;AAAA,kCAAC,YAAS,SAAS,WACjB,8BAAC,WAAQ,IAAG,KAAI,SAAQ,YACrB,iBACH,GACF;AAAA,cACA,oBAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,IAAG,KAAI,SAAQ,WAClB,uBACH,GACF;AAAA,eACF;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,IAAG;AAAA,gBACH,OAAO,EAAE,WAAW,OAAO;AAAA,gBAC3B,OAAM;AAAA,gBAEN;AAAA,sCAAC,YAAS,SAAS,WACjB,8BAAC,QAAK,KAAI,KAAI,UAAS,UACpB,kBACH,GACF;AAAA,kBACC,QAAQ,+CAAe,MAAM,KAC5B,qBAAC,aAAa,MAAb,EACC;AAAA,wCAAC,aAAa,SAAb,EACC,8BAAC,UAAO,MAAK,SAAQ,SAAQ,eAC3B,8BAAC,oBAAiB,OAAM,QAAO,QAAO,QAAO,OAAM,QAAO,GAC5D,GACF;AAAA,oBACA,oBAAC,aAAa,SAAb,EACE,yDAAe,IAAI,CAAC,SACnB;AAAA,sBAAC,aAAa;AAAA,sBAAb;AAAA,wBAEC,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AAClB,+BAAK,QAAQ;AAAA,wBACf;AAAA,wBAEC,eAAK;AAAA;AAAA,sBAND,KAAK;AAAA,oBAOZ,IAEJ;AAAA,qBACF;AAAA;AAAA;AAAA,YAEJ;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;","names":[]}
|
|
File without changes
|