@yeongseoksong/framework 1.2.0 → 1.4.0
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/README.md +334 -5
- package/dist/store/index.cjs +384 -0
- package/dist/store/index.d.mts +207 -0
- package/dist/store/index.d.ts +207 -0
- package/dist/store/index.mjs +355 -0
- package/dist/ui/index.cjs +1063 -494
- package/dist/ui/index.d.mts +259 -17
- package/dist/ui/index.d.ts +259 -17
- package/dist/ui/index.mjs +1022 -464
- package/dist/util/index.cjs +144 -20
- package/dist/util/index.d.mts +87 -12
- package/dist/util/index.d.ts +87 -12
- package/dist/util/index.mjs +139 -18
- package/package.json +15 -2
package/dist/ui/index.cjs
CHANGED
|
@@ -64,6 +64,10 @@ __export(ui_exports, {
|
|
|
64
64
|
Logo: () => Logo,
|
|
65
65
|
MainLayout: () => MainLayout,
|
|
66
66
|
PageLayout: () => PageLayout,
|
|
67
|
+
PageLayoutBrand: () => PageLayoutBrand,
|
|
68
|
+
PageLayoutImage: () => PageLayoutImage,
|
|
69
|
+
PageLayoutMinimal: () => PageLayoutMinimal,
|
|
70
|
+
PageLayoutPlain: () => PageLayoutPlain,
|
|
67
71
|
SdBadge: () => SdBadge,
|
|
68
72
|
SdBadgeDefault: () => SdBadgeDefault,
|
|
69
73
|
SdBadgePrimary: () => SdBadgePrimary,
|
|
@@ -99,17 +103,40 @@ __export(ui_exports, {
|
|
|
99
103
|
SdFeatures: () => SdFeatures,
|
|
100
104
|
SdFooter: () => SdFooter,
|
|
101
105
|
SdHeader: () => SdHeader,
|
|
106
|
+
SdHeaderMega: () => SdHeaderMega,
|
|
107
|
+
SdHeaderSimple: () => SdHeaderSimple,
|
|
102
108
|
SdInput: () => SdInput,
|
|
109
|
+
SdInputAutocomplete: () => SdInputAutocomplete,
|
|
110
|
+
SdInputCheckbox: () => SdInputCheckbox,
|
|
111
|
+
SdInputColor: () => SdInputColor,
|
|
112
|
+
SdInputDate: () => SdInputDate,
|
|
113
|
+
SdInputDateRange: () => SdInputDateRange,
|
|
103
114
|
SdInputEmail: () => SdInputEmail,
|
|
115
|
+
SdInputFile: () => SdInputFile,
|
|
116
|
+
SdInputJson: () => SdInputJson,
|
|
117
|
+
SdInputMultiSelect: () => SdInputMultiSelect,
|
|
118
|
+
SdInputNativeSelect: () => SdInputNativeSelect,
|
|
119
|
+
SdInputNumber: () => SdInputNumber,
|
|
104
120
|
SdInputPassword: () => SdInputPassword,
|
|
121
|
+
SdInputPinCode: () => SdInputPinCode,
|
|
122
|
+
SdInputRadioGroup: () => SdInputRadioGroup,
|
|
123
|
+
SdInputRating: () => SdInputRating,
|
|
124
|
+
SdInputSegmented: () => SdInputSegmented,
|
|
105
125
|
SdInputSelect: () => SdInputSelect,
|
|
126
|
+
SdInputSlider: () => SdInputSlider,
|
|
127
|
+
SdInputSwitch: () => SdInputSwitch,
|
|
128
|
+
SdInputTags: () => SdInputTags,
|
|
106
129
|
SdInputText: () => SdInputText,
|
|
107
130
|
SdInputTextarea: () => SdInputTextarea,
|
|
131
|
+
SdInputTime: () => SdInputTime,
|
|
108
132
|
SdLink: () => SdLink,
|
|
109
133
|
SdLinkBody: () => SdLinkBody,
|
|
110
134
|
SdLinkHint: () => SdLinkHint,
|
|
111
135
|
SdLinkStrong: () => SdLinkStrong,
|
|
112
136
|
SdLinkSub: () => SdLinkSub,
|
|
137
|
+
SdLoginView: () => SdLoginView,
|
|
138
|
+
SdLoginViewCard: () => SdLoginViewCard,
|
|
139
|
+
SdLoginViewSplit: () => SdLoginViewSplit,
|
|
113
140
|
SdMap: () => SdMap,
|
|
114
141
|
SdMapSingle: () => SdMapSingle,
|
|
115
142
|
SdMapTabs: () => SdMapTabs,
|
|
@@ -122,6 +149,9 @@ __export(ui_exports, {
|
|
|
122
149
|
SdQuote: () => SdQuote,
|
|
123
150
|
SdQuoteCard: () => SdQuoteCard,
|
|
124
151
|
SdQuotePlain: () => SdQuotePlain,
|
|
152
|
+
SdResult: () => SdResult,
|
|
153
|
+
SdResultError: () => SdResultError,
|
|
154
|
+
SdResultSuccess: () => SdResultSuccess,
|
|
125
155
|
SdSkeleton: () => SdSkeleton,
|
|
126
156
|
SdSkeletonAvatar: () => SdSkeletonAvatar,
|
|
127
157
|
SdSkeletonCard: () => SdSkeletonCard,
|
|
@@ -169,6 +199,16 @@ __export(ui_exports, {
|
|
|
169
199
|
SdTitleDisplay: () => SdTitleDisplay,
|
|
170
200
|
SdTitleSection: () => SdTitleSection,
|
|
171
201
|
SdTitleSub: () => SdTitleSub,
|
|
202
|
+
SdToast: () => SdToast,
|
|
203
|
+
SdToastClean: () => SdToastClean,
|
|
204
|
+
SdToastError: () => SdToastError,
|
|
205
|
+
SdToastHide: () => SdToastHide,
|
|
206
|
+
SdToastInfo: () => SdToastInfo,
|
|
207
|
+
SdToastLoading: () => SdToastLoading,
|
|
208
|
+
SdToastProvider: () => SdToastProvider,
|
|
209
|
+
SdToastSuccess: () => SdToastSuccess,
|
|
210
|
+
SdToastUpdate: () => SdToastUpdate,
|
|
211
|
+
SdToastWarning: () => SdToastWarning,
|
|
172
212
|
theme: () => theme
|
|
173
213
|
});
|
|
174
214
|
module.exports = __toCommonJS(ui_exports);
|
|
@@ -328,6 +368,36 @@ var SdTitleSub = SdTitle.Sub;
|
|
|
328
368
|
|
|
329
369
|
// ui/atom/Text.tsx
|
|
330
370
|
var import_core5 = require("@mantine/core");
|
|
371
|
+
|
|
372
|
+
// ui/typography.ts
|
|
373
|
+
var textStyles = {
|
|
374
|
+
/** 최상위 강조 */
|
|
375
|
+
Strong: { fw: 700, c: "slate.9", fz: "md", style: { letterSpacing: "-0.04em" } },
|
|
376
|
+
/** 기본 본문 */
|
|
377
|
+
Body: { fw: 500, c: "slate.7", fz: "sm", lh: 1.7 },
|
|
378
|
+
/** 보조 정보 */
|
|
379
|
+
Sub: { fw: 400, c: "slate.5", fz: "xs", lh: 1.6 },
|
|
380
|
+
/** 최소 강조 — 밀도 높은 목록 */
|
|
381
|
+
Hint: { fw: 400, c: "slate.4", fz: "xs", lh: 1.5 },
|
|
382
|
+
/** 섹션 라벨 */
|
|
383
|
+
Eyebrow: {
|
|
384
|
+
fw: 700,
|
|
385
|
+
c: "primary.6",
|
|
386
|
+
fz: "xs",
|
|
387
|
+
style: { letterSpacing: "0.12em", textTransform: "uppercase" }
|
|
388
|
+
},
|
|
389
|
+
/** 오류 메시지 */
|
|
390
|
+
Error: { fw: 400, c: "red.6", fz: "sm" },
|
|
391
|
+
/** 숫자 — 자릿수 정렬 */
|
|
392
|
+
Numeric: {
|
|
393
|
+
fw: 700,
|
|
394
|
+
c: "slate.8",
|
|
395
|
+
fz: "md",
|
|
396
|
+
style: { fontVariantNumeric: "tabular-nums", letterSpacing: "-0.02em" }
|
|
397
|
+
}
|
|
398
|
+
};
|
|
399
|
+
|
|
400
|
+
// ui/atom/Text.tsx
|
|
331
401
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
332
402
|
function createText(defaults) {
|
|
333
403
|
return function SdText2(_a4) {
|
|
@@ -337,23 +407,13 @@ function createText(defaults) {
|
|
|
337
407
|
};
|
|
338
408
|
}
|
|
339
409
|
var SdText = {
|
|
340
|
-
Strong: createText(
|
|
341
|
-
Body: createText(
|
|
342
|
-
Sub: createText(
|
|
343
|
-
Eyebrow: createText(
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
style: { letterSpacing: "0.12em", textTransform: "uppercase" }
|
|
348
|
-
}),
|
|
349
|
-
Error: createText({ fw: 400, c: "red.6", fz: "sm" }),
|
|
350
|
-
Hint: createText({ fw: 400, c: "slate.4", fz: "xs", lh: 1.5 }),
|
|
351
|
-
Numeric: createText({
|
|
352
|
-
fw: 700,
|
|
353
|
-
c: "slate.8",
|
|
354
|
-
fz: "md",
|
|
355
|
-
style: { fontVariantNumeric: "tabular-nums", letterSpacing: "-0.02em" }
|
|
356
|
-
})
|
|
410
|
+
Strong: createText(textStyles.Strong),
|
|
411
|
+
Body: createText(textStyles.Body),
|
|
412
|
+
Sub: createText(textStyles.Sub),
|
|
413
|
+
Eyebrow: createText(textStyles.Eyebrow),
|
|
414
|
+
Error: createText(textStyles.Error),
|
|
415
|
+
Hint: createText(textStyles.Hint),
|
|
416
|
+
Numeric: createText(textStyles.Numeric)
|
|
357
417
|
};
|
|
358
418
|
var SdTextStrong = SdText.Strong;
|
|
359
419
|
var SdTextBody = SdText.Body;
|
|
@@ -547,7 +607,7 @@ var SdBadge = {
|
|
|
547
607
|
/** 성공/완료 */
|
|
548
608
|
Success: createBadge({ variant: "light", color: "green" }),
|
|
549
609
|
/** 주의/경고 */
|
|
550
|
-
Warning: createBadge({ variant: "light", color: "
|
|
610
|
+
Warning: createBadge({ variant: "light", color: "amber" })
|
|
551
611
|
};
|
|
552
612
|
var SdBadgeDefault = SdBadge.Default;
|
|
553
613
|
var SdBadgePrimary = SdBadge.Primary;
|
|
@@ -556,48 +616,127 @@ var SdBadgeWarning = SdBadge.Warning;
|
|
|
556
616
|
|
|
557
617
|
// ui/atom/Input.tsx
|
|
558
618
|
var import_core12 = require("@mantine/core");
|
|
619
|
+
var import_dates = require("@mantine/dates");
|
|
559
620
|
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
560
|
-
function
|
|
561
|
-
return function SdInput2(
|
|
562
|
-
|
|
563
|
-
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core12.TextInput, __spreadValues(__spreadValues({}, defaults), props));
|
|
564
|
-
};
|
|
565
|
-
}
|
|
566
|
-
function createTextarea(defaults) {
|
|
567
|
-
return function SdInputTextarea2(_a4) {
|
|
568
|
-
var props = __objRest(_a4, []);
|
|
569
|
-
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core12.Textarea, __spreadValues(__spreadValues({}, defaults), props));
|
|
621
|
+
function createInput(Component, defaults) {
|
|
622
|
+
return function SdInput2(props) {
|
|
623
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Component, __spreadValues(__spreadValues({}, defaults), props));
|
|
570
624
|
};
|
|
571
625
|
}
|
|
572
|
-
function
|
|
573
|
-
return function
|
|
574
|
-
var
|
|
575
|
-
|
|
626
|
+
function createWrappedInput(Component, defaults) {
|
|
627
|
+
return function SdWrappedInput(_a4) {
|
|
628
|
+
var _b = _a4, {
|
|
629
|
+
label,
|
|
630
|
+
description,
|
|
631
|
+
error,
|
|
632
|
+
required,
|
|
633
|
+
withAsterisk
|
|
634
|
+
} = _b, rest = __objRest(_b, [
|
|
635
|
+
"label",
|
|
636
|
+
"description",
|
|
637
|
+
"error",
|
|
638
|
+
"required",
|
|
639
|
+
"withAsterisk"
|
|
640
|
+
]);
|
|
641
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
642
|
+
import_core12.Input.Wrapper,
|
|
643
|
+
{
|
|
644
|
+
label,
|
|
645
|
+
description,
|
|
646
|
+
error,
|
|
647
|
+
required,
|
|
648
|
+
withAsterisk,
|
|
649
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Component, __spreadValues(__spreadValues({}, defaults), rest))
|
|
650
|
+
}
|
|
651
|
+
);
|
|
576
652
|
};
|
|
577
653
|
}
|
|
578
|
-
function
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
};
|
|
654
|
+
function SdInputRadio(_a4) {
|
|
655
|
+
var _b = _a4, { data, orientation = "horizontal" } = _b, props = __objRest(_b, ["data", "orientation"]);
|
|
656
|
+
const Layout = orientation === "vertical" ? import_core12.Stack : import_core12.Group;
|
|
657
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core12.Radio.Group, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Layout, { gap: "sm", mt: "xs", children: data.map((item) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core12.Radio, { value: item.value, label: item.label, disabled: item.disabled }, item.value)) }) }));
|
|
583
658
|
}
|
|
584
659
|
var SdInput = {
|
|
660
|
+
// ── 텍스트 ──
|
|
585
661
|
/** 일반 텍스트 — 이름, 회사명 등 */
|
|
586
|
-
Text:
|
|
662
|
+
Text: createInput(import_core12.TextInput),
|
|
587
663
|
/** 이메일 입력 */
|
|
588
|
-
Email:
|
|
664
|
+
Email: createInput(import_core12.TextInput, { type: "email" }),
|
|
589
665
|
/** 비밀번호 입력 — 마스킹 토글 포함 */
|
|
590
|
-
Password:
|
|
666
|
+
Password: createInput(import_core12.PasswordInput),
|
|
591
667
|
/** 멀티라인 텍스트 — 문의 메시지 등 */
|
|
592
|
-
Textarea:
|
|
668
|
+
Textarea: createInput(import_core12.Textarea, { autosize: true, minRows: 3 }),
|
|
669
|
+
/** JSON 입력 — 포맷·검증 버튼 포함 */
|
|
670
|
+
Json: createInput(import_core12.JsonInput, { autosize: true, minRows: 4, formatOnBlur: true }),
|
|
671
|
+
// ── 숫자 ──
|
|
672
|
+
/** 숫자 입력 — 증감 컨트롤 포함 */
|
|
673
|
+
Number: createInput(import_core12.NumberInput),
|
|
674
|
+
/** 범위 선택 슬라이더 */
|
|
675
|
+
Slider: createWrappedInput(import_core12.Slider),
|
|
676
|
+
/** 별점 */
|
|
677
|
+
Rating: createWrappedInput(import_core12.Rating),
|
|
678
|
+
/** 인증번호 등 자리수가 고정된 코드 */
|
|
679
|
+
PinCode: createWrappedInput(import_core12.PinInput),
|
|
680
|
+
// ── 선택 ──
|
|
593
681
|
/** 드롭다운 선택 */
|
|
594
|
-
Select:
|
|
682
|
+
Select: createInput(import_core12.Select),
|
|
683
|
+
/** 브라우저 기본 select — 모바일·간단한 목록 */
|
|
684
|
+
NativeSelect: createInput(import_core12.NativeSelect),
|
|
685
|
+
/** 다중 선택 */
|
|
686
|
+
MultiSelect: createInput(import_core12.MultiSelect),
|
|
687
|
+
/** 입력하며 후보를 좁히는 자동완성(자유 입력 허용) */
|
|
688
|
+
Autocomplete: createInput(import_core12.Autocomplete),
|
|
689
|
+
/** 자유롭게 추가하는 태그 목록 */
|
|
690
|
+
Tags: createInput(import_core12.TagsInput),
|
|
691
|
+
/** 라디오 그룹 — data로 항목을 넘긴다 */
|
|
692
|
+
Radio: SdInputRadio,
|
|
693
|
+
/** 두세 개 중 하나 — 탭처럼 보이는 선택 */
|
|
694
|
+
Segmented: createWrappedInput(import_core12.SegmentedControl),
|
|
695
|
+
// ── 불리언 ──
|
|
696
|
+
/** 체크박스 — getInputProps(name, { type: 'checkbox' }) */
|
|
697
|
+
Checkbox: createInput(import_core12.Checkbox),
|
|
698
|
+
/** 스위치 — 즉시 반영되는 on/off */
|
|
699
|
+
Switch: createInput(import_core12.Switch),
|
|
700
|
+
// ── 기타 ──
|
|
701
|
+
/** 파일 선택 */
|
|
702
|
+
File: createInput(import_core12.FileInput, { clearable: true }),
|
|
703
|
+
/** 색상 선택 */
|
|
704
|
+
Color: createInput(import_core12.ColorInput),
|
|
705
|
+
// ── 날짜·시간 (@mantine/dates) ──
|
|
706
|
+
/** 날짜 — 직접 입력 + 달력 팝오버. 값은 'YYYY-MM-DD' 문자열 */
|
|
707
|
+
Date: createInput(import_dates.DateInput, { valueFormat: "YYYY-MM-DD", clearable: true }),
|
|
708
|
+
/** 기간 — 시작·종료 두 날짜 */
|
|
709
|
+
DateRange: createInput(import_dates.DatePickerInput, {
|
|
710
|
+
type: "range",
|
|
711
|
+
valueFormat: "YYYY-MM-DD",
|
|
712
|
+
clearable: true
|
|
713
|
+
}),
|
|
714
|
+
/** 시각 */
|
|
715
|
+
Time: createInput(import_dates.TimeInput)
|
|
595
716
|
};
|
|
596
717
|
var SdInputText = SdInput.Text;
|
|
597
718
|
var SdInputEmail = SdInput.Email;
|
|
598
719
|
var SdInputPassword = SdInput.Password;
|
|
599
720
|
var SdInputTextarea = SdInput.Textarea;
|
|
721
|
+
var SdInputJson = SdInput.Json;
|
|
722
|
+
var SdInputNumber = SdInput.Number;
|
|
723
|
+
var SdInputSlider = SdInput.Slider;
|
|
724
|
+
var SdInputRating = SdInput.Rating;
|
|
725
|
+
var SdInputPinCode = SdInput.PinCode;
|
|
600
726
|
var SdInputSelect = SdInput.Select;
|
|
727
|
+
var SdInputNativeSelect = SdInput.NativeSelect;
|
|
728
|
+
var SdInputMultiSelect = SdInput.MultiSelect;
|
|
729
|
+
var SdInputAutocomplete = SdInput.Autocomplete;
|
|
730
|
+
var SdInputTags = SdInput.Tags;
|
|
731
|
+
var SdInputRadioGroup = SdInput.Radio;
|
|
732
|
+
var SdInputSegmented = SdInput.Segmented;
|
|
733
|
+
var SdInputCheckbox = SdInput.Checkbox;
|
|
734
|
+
var SdInputSwitch = SdInput.Switch;
|
|
735
|
+
var SdInputFile = SdInput.File;
|
|
736
|
+
var SdInputColor = SdInput.Color;
|
|
737
|
+
var SdInputDate = SdInput.Date;
|
|
738
|
+
var SdInputDateRange = SdInput.DateRange;
|
|
739
|
+
var SdInputTime = SdInput.Time;
|
|
601
740
|
|
|
602
741
|
// ui/atom/Skeleton.tsx
|
|
603
742
|
var import_core13 = require("@mantine/core");
|
|
@@ -659,7 +798,7 @@ var SdSkeletonAvatar = SkeletonAvatar;
|
|
|
659
798
|
// ui/atom/Link.tsx
|
|
660
799
|
var import_core14 = require("@mantine/core");
|
|
661
800
|
|
|
662
|
-
//
|
|
801
|
+
// ui/style.util.ts
|
|
663
802
|
function toCssColor(value) {
|
|
664
803
|
if (typeof value !== "string") return "";
|
|
665
804
|
return value.includes(".") ? `var(--mantine-color-${value.replace(".", "-")})` : value;
|
|
@@ -668,11 +807,16 @@ function toCssColor(value) {
|
|
|
668
807
|
// ui/atom/Link.tsx
|
|
669
808
|
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
670
809
|
var HOVER_COLOR = "var(--mantine-color-primary-6)";
|
|
671
|
-
function createLink(defaults) {
|
|
810
|
+
function createLink(defaults, Fallback) {
|
|
672
811
|
return function SdLink2(_a4) {
|
|
673
812
|
var _b = _a4, { children, onMouseEnter, onMouseLeave } = _b, props = __objRest(_b, ["children", "onMouseEnter", "onMouseLeave"]);
|
|
674
813
|
var _a5;
|
|
675
814
|
const baseColor = toCssColor((_a5 = props.c) != null ? _a5 : defaults.c);
|
|
815
|
+
const resolved = typeof children === "string" ? t(children) : children;
|
|
816
|
+
if (!props.href) {
|
|
817
|
+
const _b2 = props, { href: _href, target: _target, rel: _rel } = _b2, textProps = __objRest(_b2, ["href", "target", "rel"]);
|
|
818
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Fallback, __spreadProps(__spreadValues({}, textProps), { children }));
|
|
819
|
+
}
|
|
676
820
|
const handleEnter = (e) => {
|
|
677
821
|
e.currentTarget.style.color = HOVER_COLOR;
|
|
678
822
|
onMouseEnter == null ? void 0 : onMouseEnter(e);
|
|
@@ -687,29 +831,88 @@ function createLink(defaults) {
|
|
|
687
831
|
style: { transition: "color 0.15s" },
|
|
688
832
|
onMouseEnter: handleEnter,
|
|
689
833
|
onMouseLeave: handleLeave,
|
|
690
|
-
children
|
|
834
|
+
children: resolved
|
|
691
835
|
})
|
|
692
836
|
);
|
|
693
837
|
};
|
|
694
838
|
}
|
|
839
|
+
function linkStyle(base2, extra) {
|
|
840
|
+
return Object.assign({ underline: "never" }, base2, extra);
|
|
841
|
+
}
|
|
695
842
|
var SdLink = {
|
|
696
843
|
/** 최상위 강조 — 눈에 띄어야 하는 단일 링크 */
|
|
697
|
-
Strong: createLink(
|
|
844
|
+
Strong: createLink(linkStyle(textStyles.Strong), SdText.Strong),
|
|
698
845
|
/** 기본 — 본문·네비게이션 수준의 일반 링크 */
|
|
699
|
-
Body: createLink(
|
|
846
|
+
Body: createLink(linkStyle(textStyles.Body), SdText.Body),
|
|
700
847
|
/** 보조 — 연락처·정책 등 부가 정보 */
|
|
701
|
-
Sub: createLink(
|
|
848
|
+
Sub: createLink(linkStyle(textStyles.Sub), SdText.Sub),
|
|
702
849
|
/** 최소 강조 — 링크 목록처럼 밀도가 높고 톤을 낮춰야 하는 곳 */
|
|
703
|
-
Hint: createLink(
|
|
850
|
+
Hint: createLink(linkStyle(textStyles.Hint), SdText.Hint)
|
|
704
851
|
};
|
|
705
852
|
var SdLinkStrong = SdLink.Strong;
|
|
706
853
|
var SdLinkBody = SdLink.Body;
|
|
707
854
|
var SdLinkSub = SdLink.Sub;
|
|
708
855
|
var SdLinkHint = SdLink.Hint;
|
|
709
856
|
|
|
857
|
+
// ui/atom/Toast.tsx
|
|
858
|
+
var import_notifications = require("@mantine/notifications");
|
|
859
|
+
var import_icons_react2 = require("@tabler/icons-react");
|
|
860
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
861
|
+
var toastStyles = {
|
|
862
|
+
/** 성공 — 저장·전송 완료 */
|
|
863
|
+
Success: { color: "green", icon: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_icons_react2.IconCheck, { size: 18 }), title: "\uC644\uB8CC" },
|
|
864
|
+
/** 실패 — 요청 오류·검증 실패 */
|
|
865
|
+
Error: { color: "red", icon: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_icons_react2.IconX, { size: 18 }), title: "\uC624\uB958" },
|
|
866
|
+
/** 주의 — 되돌릴 수 없는 동작 안내 등 */
|
|
867
|
+
Warning: { color: "amber", icon: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_icons_react2.IconAlertTriangle, { size: 18 }), title: "\uC8FC\uC758" },
|
|
868
|
+
/** 안내 — 중립 정보 */
|
|
869
|
+
Info: { color: "primary", icon: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_icons_react2.IconInfoCircle, { size: 18 }), title: "\uC548\uB0B4" },
|
|
870
|
+
/** 진행 중 — 스피너 + 자동 닫힘 없음. Update로 결과 변형으로 바꾼다. */
|
|
871
|
+
Loading: { loading: true, autoClose: false, withCloseButton: false, title: "\uCC98\uB9AC \uC911" }
|
|
872
|
+
};
|
|
873
|
+
function createToast(defaults) {
|
|
874
|
+
return function SdToast2(message, options) {
|
|
875
|
+
return import_notifications.notifications.show(__spreadValues(__spreadProps(__spreadValues({}, defaults), { message }), options));
|
|
876
|
+
};
|
|
877
|
+
}
|
|
878
|
+
var SdToast = {
|
|
879
|
+
Success: createToast(toastStyles.Success),
|
|
880
|
+
Error: createToast(toastStyles.Error),
|
|
881
|
+
Warning: createToast(toastStyles.Warning),
|
|
882
|
+
Info: createToast(toastStyles.Info),
|
|
883
|
+
Loading: createToast(toastStyles.Loading),
|
|
884
|
+
/**
|
|
885
|
+
* 이미 떠 있는 알림을 다른 변형으로 교체한다 — `Loading` → `Success`/`Error` 전환용.
|
|
886
|
+
* `loading: false`·`autoClose`를 먼저 깔아 두므로 스피너가 그대로 남지 않는다.
|
|
887
|
+
*/
|
|
888
|
+
Update: (id, variant, message, options) => import_notifications.notifications.update(__spreadValues(__spreadProps(__spreadValues({
|
|
889
|
+
id,
|
|
890
|
+
loading: false,
|
|
891
|
+
autoClose: 4e3,
|
|
892
|
+
withCloseButton: true
|
|
893
|
+
}, toastStyles[variant]), {
|
|
894
|
+
message
|
|
895
|
+
}), options)),
|
|
896
|
+
/** 특정 알림 닫기 */
|
|
897
|
+
Hide: (id) => import_notifications.notifications.hide(id),
|
|
898
|
+
/** 떠 있는 알림 전부 닫기 */
|
|
899
|
+
Clean: () => import_notifications.notifications.clean()
|
|
900
|
+
};
|
|
901
|
+
function SdToastProvider(props) {
|
|
902
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_notifications.Notifications, __spreadValues({ position: "top-right", autoClose: 4e3, limit: 3 }, props));
|
|
903
|
+
}
|
|
904
|
+
var SdToastSuccess = SdToast.Success;
|
|
905
|
+
var SdToastError = SdToast.Error;
|
|
906
|
+
var SdToastWarning = SdToast.Warning;
|
|
907
|
+
var SdToastInfo = SdToast.Info;
|
|
908
|
+
var SdToastLoading = SdToast.Loading;
|
|
909
|
+
var SdToastUpdate = SdToast.Update;
|
|
910
|
+
var SdToastHide = SdToast.Hide;
|
|
911
|
+
var SdToastClean = SdToast.Clean;
|
|
912
|
+
|
|
710
913
|
// ui/molecule/TextBox.tsx
|
|
711
914
|
var import_core15 = require("@mantine/core");
|
|
712
|
-
var
|
|
915
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
713
916
|
function createTextBox(titleVariant, defaultGap = "xs", descVariant = "Body", color_ = void 0) {
|
|
714
917
|
return function SdTextBox2(_a4) {
|
|
715
918
|
var _b = _a4, {
|
|
@@ -733,10 +936,10 @@ function createTextBox(titleVariant, defaultGap = "xs", descVariant = "Body", co
|
|
|
733
936
|
const variant = variantOverride != null ? variantOverride : titleVariant;
|
|
734
937
|
const TitleComponent = SdTitle[variant];
|
|
735
938
|
const DescComponent = SdText[descVariant];
|
|
736
|
-
return /* @__PURE__ */ (0,
|
|
737
|
-
label && /* @__PURE__ */ (0,
|
|
738
|
-
/* @__PURE__ */ (0,
|
|
739
|
-
description && /* @__PURE__ */ (0,
|
|
939
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_core15.Stack, __spreadProps(__spreadValues({ gap: defaultGap }, stackProps), { children: [
|
|
940
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SdText.Eyebrow, { children: label }),
|
|
941
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(TitleComponent, { c: colorRes, children: title }),
|
|
942
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DescComponent, { c: colorRes, maw: maxDescWidth, mt: 4, children: description }),
|
|
740
943
|
children
|
|
741
944
|
] }));
|
|
742
945
|
};
|
|
@@ -756,23 +959,24 @@ var SdTextBoxSub = SdTextBox.Sub;
|
|
|
756
959
|
var import_core16 = require("@mantine/core");
|
|
757
960
|
|
|
758
961
|
// util/sort.util.ts
|
|
759
|
-
function filterAndSort(items) {
|
|
760
|
-
|
|
962
|
+
function filterAndSort(items, direction = "asc") {
|
|
963
|
+
const sign = direction === "asc" ? 1 : -1;
|
|
964
|
+
return (items != null ? items : []).filter((item) => item.isShow).sort((a, b) => (a.order - b.order) * sign);
|
|
761
965
|
}
|
|
762
966
|
|
|
763
967
|
// ui/molecule/Features.tsx
|
|
764
|
-
var
|
|
968
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
765
969
|
function SdFeatures({ items, cols = { base: 1, sm: 2, md: 3 } }) {
|
|
766
970
|
const visible = filterAndSort(items);
|
|
767
|
-
return /* @__PURE__ */ (0,
|
|
971
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.SimpleGrid, { cols, spacing: "xl", children: visible.map((item) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core16.Card, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core16.Stack, { gap: "sm", children: [
|
|
768
972
|
item.icon,
|
|
769
|
-
/* @__PURE__ */ (0,
|
|
973
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SdTextBox.Card, { label: item.label, title: item.title, description: item.description })
|
|
770
974
|
] }, item.id) }, item.id)) });
|
|
771
975
|
}
|
|
772
976
|
|
|
773
977
|
// ui/molecule/Timeline.tsx
|
|
774
978
|
var import_core17 = require("@mantine/core");
|
|
775
|
-
var
|
|
979
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
776
980
|
function SdTimeline({ items }) {
|
|
777
981
|
const grouped = items.filter((item) => item.isShow).sort((a, b) => b.year - a.year || b.month - a.month).reduce((acc, item) => {
|
|
778
982
|
var _a4, _b;
|
|
@@ -781,32 +985,32 @@ function SdTimeline({ items }) {
|
|
|
781
985
|
return acc;
|
|
782
986
|
}, {});
|
|
783
987
|
const years = Object.keys(grouped).map(Number).sort((a, b) => b - a);
|
|
784
|
-
return /* @__PURE__ */ (0,
|
|
988
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Timeline, { active: items.length, bulletSize: 24, lineWidth: 2, children: years.map((year) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Timeline.Item, { title: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(SdTitle.Sub, { children: [
|
|
785
989
|
year,
|
|
786
990
|
"\uB144"
|
|
787
|
-
] }), children: /* @__PURE__ */ (0,
|
|
788
|
-
/* @__PURE__ */ (0,
|
|
991
|
+
] }), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_core17.Stack, { gap: 6, mt: "xs", children: grouped[year].map((event) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_core17.Group, { gap: "md", align: "center", wrap: "nowrap", children: [
|
|
992
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(SdText.Eyebrow, { miw: 28, children: [
|
|
789
993
|
event.month,
|
|
790
994
|
"\uC6D4"
|
|
791
995
|
] }),
|
|
792
|
-
/* @__PURE__ */ (0,
|
|
996
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SdText.Sub, { style: { flex: 1 }, children: event.description })
|
|
793
997
|
] }, event.id)) }) }, year)) });
|
|
794
998
|
}
|
|
795
999
|
|
|
796
1000
|
// ui/molecule/Steps.tsx
|
|
797
1001
|
var import_core18 = require("@mantine/core");
|
|
798
|
-
var
|
|
799
|
-
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
1002
|
+
var import_icons_react3 = require("@tabler/icons-react");
|
|
800
1003
|
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1004
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
801
1005
|
function BubbleStep({ item, index, isLast }) {
|
|
802
|
-
return /* @__PURE__ */ (0,
|
|
803
|
-
/* @__PURE__ */ (0,
|
|
1006
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_core18.Group, { align: "flex-start", gap: "lg", wrap: "nowrap", children: [
|
|
1007
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
804
1008
|
import_core18.Box,
|
|
805
1009
|
{
|
|
806
1010
|
style: { display: "flex", flexDirection: "column", alignItems: "center", flexShrink: 0 },
|
|
807
1011
|
children: [
|
|
808
|
-
/* @__PURE__ */ (0,
|
|
809
|
-
!isLast && /* @__PURE__ */ (0,
|
|
1012
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SdNumberIcon, { value: String(index + 1).padStart(2, "0") }),
|
|
1013
|
+
!isLast && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
810
1014
|
import_core18.Box,
|
|
811
1015
|
{
|
|
812
1016
|
style: {
|
|
@@ -821,7 +1025,7 @@ function BubbleStep({ item, index, isLast }) {
|
|
|
821
1025
|
]
|
|
822
1026
|
}
|
|
823
1027
|
),
|
|
824
|
-
/* @__PURE__ */ (0,
|
|
1028
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
825
1029
|
SdTextBox.Card,
|
|
826
1030
|
{
|
|
827
1031
|
title: item.title,
|
|
@@ -833,11 +1037,11 @@ function BubbleStep({ item, index, isLast }) {
|
|
|
833
1037
|
] });
|
|
834
1038
|
}
|
|
835
1039
|
function Bubble({ items }) {
|
|
836
|
-
return /* @__PURE__ */ (0,
|
|
1040
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Box, { children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(BubbleStep, { item, index: i, isLast: i === items.length - 1 }, i)) });
|
|
837
1041
|
}
|
|
838
1042
|
function CardStep({ item, index }) {
|
|
839
|
-
return /* @__PURE__ */ (0,
|
|
840
|
-
/* @__PURE__ */ (0,
|
|
1043
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_core18.Card, { withBorder: true, radius: "md", p: 0, style: { height: "100%", overflow: "hidden" }, children: [
|
|
1044
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
841
1045
|
import_core18.Box,
|
|
842
1046
|
{
|
|
843
1047
|
py: "lg",
|
|
@@ -846,41 +1050,41 @@ function CardStep({ item, index }) {
|
|
|
846
1050
|
justifyContent: "center",
|
|
847
1051
|
background: "var(--mantine-color-primary-0)"
|
|
848
1052
|
},
|
|
849
|
-
children: /* @__PURE__ */ (0,
|
|
1053
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(SdText.Eyebrow, { children: [
|
|
850
1054
|
"STEP ",
|
|
851
1055
|
String(index + 1).padStart(2, "0")
|
|
852
1056
|
] })
|
|
853
1057
|
}
|
|
854
1058
|
),
|
|
855
|
-
/* @__PURE__ */ (0,
|
|
1059
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Box, { p: "lg", style: { textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SdTextBox.Card, { title: item.title, description: item.description }) })
|
|
856
1060
|
] });
|
|
857
1061
|
}
|
|
858
1062
|
function CardArrow({ direction }) {
|
|
859
|
-
return /* @__PURE__ */ (0,
|
|
1063
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.ThemeIcon, { size: 36, radius: "xl", variant: "light", color: "primary", children: direction === "right" ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_icons_react3.IconArrowRight, { size: 20, stroke: 2.5 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_icons_react3.IconArrowDown, { size: 20, stroke: 2.5 }) });
|
|
860
1064
|
}
|
|
861
1065
|
function CardVariant({ items }) {
|
|
862
|
-
return /* @__PURE__ */ (0,
|
|
863
|
-
/* @__PURE__ */ (0,
|
|
864
|
-
/* @__PURE__ */ (0,
|
|
865
|
-
i < items.length - 1 && /* @__PURE__ */ (0,
|
|
1066
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
1067
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Stack, { gap: "sm", hiddenFrom: "sm", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime19.Fragment, { children: [
|
|
1068
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CardStep, { item, index: i }),
|
|
1069
|
+
i < items.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Box, { style: { display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CardArrow, { direction: "down" }) })
|
|
866
1070
|
] }, i)) }),
|
|
867
|
-
/* @__PURE__ */ (0,
|
|
868
|
-
/* @__PURE__ */ (0,
|
|
869
|
-
i < items.length - 1 && /* @__PURE__ */ (0,
|
|
1071
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Group, { wrap: "nowrap", align: "stretch", gap: 0, visibleFrom: "sm", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime19.Fragment, { children: [
|
|
1072
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Box, { style: { flex: 1, minWidth: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CardStep, { item, index: i }) }),
|
|
1073
|
+
i < items.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Box, { style: { display: "flex", alignItems: "center", padding: "0 8px" }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CardArrow, { direction: "right" }) })
|
|
870
1074
|
] }, i)) })
|
|
871
1075
|
] });
|
|
872
1076
|
}
|
|
873
1077
|
function StripStep({ item, index }) {
|
|
874
|
-
return /* @__PURE__ */ (0,
|
|
875
|
-
/* @__PURE__ */ (0,
|
|
1078
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Box, { pl: "md", style: { borderLeft: "3px solid var(--mantine-color-primary-6)" }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_core18.Stack, { gap: 4, children: [
|
|
1079
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(SdText.Eyebrow, { children: [
|
|
876
1080
|
"STEP ",
|
|
877
1081
|
String(index + 1).padStart(2, "0")
|
|
878
1082
|
] }),
|
|
879
|
-
/* @__PURE__ */ (0,
|
|
1083
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SdTextBox.Card, { title: item.title, description: item.description })
|
|
880
1084
|
] }) });
|
|
881
1085
|
}
|
|
882
1086
|
function Strip({ items }) {
|
|
883
|
-
return /* @__PURE__ */ (0,
|
|
1087
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core18.Stack, { gap: "xl", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(StripStep, { item, index: i }, i)) });
|
|
884
1088
|
}
|
|
885
1089
|
var SdSteps = { Bubble, Card: CardVariant, Strip };
|
|
886
1090
|
var SdStepsBubble = SdSteps.Bubble;
|
|
@@ -889,14 +1093,14 @@ var SdStepsStrip = SdSteps.Strip;
|
|
|
889
1093
|
|
|
890
1094
|
// ui/molecule/Testimonial.tsx
|
|
891
1095
|
var import_core19 = require("@mantine/core");
|
|
892
|
-
var
|
|
1096
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
893
1097
|
function AuthorRow({ item }) {
|
|
894
|
-
return /* @__PURE__ */ (0,
|
|
895
|
-
item.avatar && /* @__PURE__ */ (0,
|
|
896
|
-
!item.avatar && /* @__PURE__ */ (0,
|
|
897
|
-
/* @__PURE__ */ (0,
|
|
898
|
-
/* @__PURE__ */ (0,
|
|
899
|
-
/* @__PURE__ */ (0,
|
|
1098
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core19.Group, { gap: "sm", wrap: "nowrap", children: [
|
|
1099
|
+
item.avatar && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.Avatar, { src: item.avatar, size: "md", radius: "xl" }),
|
|
1100
|
+
!item.avatar && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.Avatar, { size: "md", radius: "xl", color: "primary", children: item.name.charAt(0) }),
|
|
1101
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core19.Stack, { gap: 0, children: [
|
|
1102
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SdText.Strong, { fz: "sm", children: item.name }),
|
|
1103
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(SdText.Sub, { children: [
|
|
900
1104
|
item.role,
|
|
901
1105
|
item.company ? ` \xB7 ${item.company}` : ""
|
|
902
1106
|
] })
|
|
@@ -905,28 +1109,28 @@ function AuthorRow({ item }) {
|
|
|
905
1109
|
}
|
|
906
1110
|
function CardTestimonial(_a4) {
|
|
907
1111
|
var _b = _a4, { item } = _b, boxProps = __objRest(_b, ["item"]);
|
|
908
|
-
return /* @__PURE__ */ (0,
|
|
909
|
-
item.rating && /* @__PURE__ */ (0,
|
|
910
|
-
/* @__PURE__ */ (0,
|
|
911
|
-
/* @__PURE__ */ (0,
|
|
912
|
-
item.lines.map((line, i) => /* @__PURE__ */ (0,
|
|
1112
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.Card, __spreadProps(__spreadValues({ h: "100%" }, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core19.Stack, { gap: "md", h: "100%", children: [
|
|
1113
|
+
item.rating && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.Rating, { value: item.rating, readOnly: true, size: "sm", color: "primary" }),
|
|
1114
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core19.Stack, { gap: "xs", style: { flex: 1 }, children: [
|
|
1115
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SdTitle.Display, { c: "primary.6", lh: 0.8, "aria-hidden": true, children: "\u201C" }),
|
|
1116
|
+
item.lines.map((line, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SdText.Body, { children: line }, i))
|
|
913
1117
|
] }),
|
|
914
|
-
/* @__PURE__ */ (0,
|
|
1118
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(AuthorRow, { item })
|
|
915
1119
|
] }) }));
|
|
916
1120
|
}
|
|
917
1121
|
function Strip2(_a4) {
|
|
918
1122
|
var _b = _a4, { item } = _b, boxProps = __objRest(_b, ["item"]);
|
|
919
|
-
return /* @__PURE__ */ (0,
|
|
920
|
-
item.rating && /* @__PURE__ */ (0,
|
|
921
|
-
/* @__PURE__ */ (0,
|
|
922
|
-
/* @__PURE__ */ (0,
|
|
923
|
-
/* @__PURE__ */ (0,
|
|
1123
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.Box, __spreadProps(__spreadValues({}, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core19.Stack, { gap: "md", children: [
|
|
1124
|
+
item.rating && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.Rating, { value: item.rating, readOnly: true, size: "sm", color: "primary" }),
|
|
1125
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_core19.Group, { gap: 4, align: "flex-start", children: [
|
|
1126
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SdTitle.Display, { c: "primary.6", lh: 0.8, "aria-hidden": true, children: "\u201C" }),
|
|
1127
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.Stack, { gap: "xs", style: { flex: 1 }, children: item.lines.map((line, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SdText.Body, { children: line }, i)) })
|
|
924
1128
|
] }),
|
|
925
|
-
/* @__PURE__ */ (0,
|
|
1129
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(AuthorRow, { item })
|
|
926
1130
|
] }) }));
|
|
927
1131
|
}
|
|
928
1132
|
function Grid({ items, cols = { base: 1, sm: 2, md: 3 } }) {
|
|
929
|
-
return /* @__PURE__ */ (0,
|
|
1133
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_core19.SimpleGrid, { cols, spacing: "xl", style: { alignItems: "stretch" }, children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CardTestimonial, { item }, i)) });
|
|
930
1134
|
}
|
|
931
1135
|
var SdTestimonial = {
|
|
932
1136
|
/** 카드형 — 그리드 배치용 */
|
|
@@ -942,81 +1146,81 @@ var SdTestimonialGrid = SdTestimonial.Grid;
|
|
|
942
1146
|
|
|
943
1147
|
// ui/molecule/PricingCard.tsx
|
|
944
1148
|
var import_core20 = require("@mantine/core");
|
|
945
|
-
var
|
|
946
|
-
var
|
|
1149
|
+
var import_icons_react4 = require("@tabler/icons-react");
|
|
1150
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
947
1151
|
function Default(_a4) {
|
|
948
1152
|
var _b = _a4, { item, onSelect } = _b, cardProps = __objRest(_b, ["item", "onSelect"]);
|
|
949
1153
|
var _a5;
|
|
950
|
-
return /* @__PURE__ */ (0,
|
|
951
|
-
/* @__PURE__ */ (0,
|
|
952
|
-
/* @__PURE__ */ (0,
|
|
953
|
-
/* @__PURE__ */ (0,
|
|
954
|
-
item.isPopular && /* @__PURE__ */ (0,
|
|
1154
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core20.Card, __spreadProps(__spreadValues({ withBorder: true, style: { position: "relative" } }, cardProps), { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Stack, { gap: "xl", children: [
|
|
1155
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Stack, { gap: "xs", children: [
|
|
1156
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Group, { justify: "space-between", align: "flex-start", children: [
|
|
1157
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdTitle.Card, { children: item.name }),
|
|
1158
|
+
item.isPopular && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdBadge.Primary, { children: "\uCD94\uCC9C" })
|
|
955
1159
|
] }),
|
|
956
|
-
item.description && /* @__PURE__ */ (0,
|
|
1160
|
+
item.description && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdText.Sub, { children: item.description })
|
|
957
1161
|
] }),
|
|
958
|
-
/* @__PURE__ */ (0,
|
|
959
|
-
/* @__PURE__ */ (0,
|
|
960
|
-
item.period && /* @__PURE__ */ (0,
|
|
1162
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Group, { gap: 4, align: "baseline", children: [
|
|
1163
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdTitle.Display, { children: item.price }),
|
|
1164
|
+
item.period && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(SdText.Sub, { children: [
|
|
961
1165
|
"/ ",
|
|
962
1166
|
item.period
|
|
963
1167
|
] })
|
|
964
1168
|
] }),
|
|
965
|
-
/* @__PURE__ */ (0,
|
|
966
|
-
/* @__PURE__ */ (0,
|
|
967
|
-
/* @__PURE__ */ (0,
|
|
1169
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core20.Divider, {}),
|
|
1170
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core20.Stack, { gap: "sm", children: item.features.map((f, i) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Group, { gap: "sm", wrap: "nowrap", children: [
|
|
1171
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
968
1172
|
import_core20.ThemeIcon,
|
|
969
1173
|
{
|
|
970
1174
|
size: "xs",
|
|
971
1175
|
radius: "xl",
|
|
972
1176
|
color: f.included ? "primary" : "slate",
|
|
973
1177
|
variant: f.included ? "filled" : "subtle",
|
|
974
|
-
children: f.included ? /* @__PURE__ */ (0,
|
|
1178
|
+
children: f.included ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons_react4.IconCheck, { size: 12 }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons_react4.IconX, { size: 12 })
|
|
975
1179
|
}
|
|
976
1180
|
),
|
|
977
|
-
/* @__PURE__ */ (0,
|
|
1181
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdText.Body, { fz: "sm", c: f.included ? "slate.7" : "slate.4", children: f.text })
|
|
978
1182
|
] }, i)) }),
|
|
979
|
-
/* @__PURE__ */ (0,
|
|
1183
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdButton.Outline, { fullWidth: true, onClick: () => onSelect == null ? void 0 : onSelect(item), children: (_a5 = item.ctaLabel) != null ? _a5 : "\uC2DC\uC791\uD558\uAE30" })
|
|
980
1184
|
] }) }));
|
|
981
1185
|
}
|
|
982
1186
|
function Featured(_a4) {
|
|
983
1187
|
var _b = _a4, { item, onSelect } = _b, cardProps = __objRest(_b, ["item", "onSelect"]);
|
|
984
1188
|
var _a5;
|
|
985
|
-
return /* @__PURE__ */ (0,
|
|
986
|
-
/* @__PURE__ */ (0,
|
|
987
|
-
/* @__PURE__ */ (0,
|
|
988
|
-
/* @__PURE__ */ (0,
|
|
989
|
-
item.isPopular && /* @__PURE__ */ (0,
|
|
1189
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core20.Card, __spreadProps(__spreadValues({ bg: "primary.6", style: { position: "relative" } }, cardProps), { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Stack, { gap: "xl", children: [
|
|
1190
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Stack, { gap: "xs", children: [
|
|
1191
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Group, { justify: "space-between", align: "flex-start", children: [
|
|
1192
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdTitle.Card, { c: "white", children: item.name }),
|
|
1193
|
+
item.isPopular && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdBadge.Default, { c: "white", style: { borderColor: "rgba(255,255,255,0.5)" }, children: "\uCD94\uCC9C" })
|
|
990
1194
|
] }),
|
|
991
|
-
item.description && /* @__PURE__ */ (0,
|
|
1195
|
+
item.description && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdText.Body, { c: "primary.1", children: item.description })
|
|
992
1196
|
] }),
|
|
993
|
-
/* @__PURE__ */ (0,
|
|
994
|
-
/* @__PURE__ */ (0,
|
|
995
|
-
item.period && /* @__PURE__ */ (0,
|
|
1197
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Group, { gap: 4, align: "baseline", children: [
|
|
1198
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdTitle.Display, { c: "white", children: item.price }),
|
|
1199
|
+
item.period && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(SdText.Body, { c: "primary.2", children: [
|
|
996
1200
|
"/ ",
|
|
997
1201
|
item.period
|
|
998
1202
|
] })
|
|
999
1203
|
] }),
|
|
1000
|
-
/* @__PURE__ */ (0,
|
|
1001
|
-
/* @__PURE__ */ (0,
|
|
1002
|
-
/* @__PURE__ */ (0,
|
|
1204
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core20.Divider, { color: "primary.4" }),
|
|
1205
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core20.Stack, { gap: "sm", children: item.features.map((f, i) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_core20.Group, { gap: "sm", wrap: "nowrap", children: [
|
|
1206
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1003
1207
|
import_core20.ThemeIcon,
|
|
1004
1208
|
{
|
|
1005
1209
|
size: "xs",
|
|
1006
1210
|
radius: "xl",
|
|
1007
1211
|
color: "white",
|
|
1008
1212
|
variant: f.included ? "filled" : "subtle",
|
|
1009
|
-
children: f.included ? /* @__PURE__ */ (0,
|
|
1213
|
+
children: f.included ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons_react4.IconCheck, { size: 12, color: "var(--mantine-color-primary-6)" }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons_react4.IconX, { size: 12, color: "rgba(255,255,255,0.4)" })
|
|
1010
1214
|
}
|
|
1011
1215
|
),
|
|
1012
|
-
/* @__PURE__ */ (0,
|
|
1216
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdText.Body, { fz: "sm", c: f.included ? "white" : "primary.3", children: f.text })
|
|
1013
1217
|
] }, i)) }),
|
|
1014
|
-
/* @__PURE__ */ (0,
|
|
1218
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SdButton.White, { fullWidth: true, onClick: () => onSelect == null ? void 0 : onSelect(item), children: (_a5 = item.ctaLabel) != null ? _a5 : "\uC2DC\uC791\uD558\uAE30" })
|
|
1015
1219
|
] }) }));
|
|
1016
1220
|
}
|
|
1017
1221
|
function Grid2({ items, cols = { base: 1, sm: 2, md: 3 }, onSelect }) {
|
|
1018
|
-
return /* @__PURE__ */ (0,
|
|
1019
|
-
(item, i) => item.isPopular ? /* @__PURE__ */ (0,
|
|
1222
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_core20.SimpleGrid, { cols, spacing: "xl", style: { alignItems: "stretch" }, children: items.map(
|
|
1223
|
+
(item, i) => item.isPopular ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Featured, { item, onSelect }, i) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Default, { item, onSelect }, i)
|
|
1020
1224
|
) });
|
|
1021
1225
|
}
|
|
1022
1226
|
var SdPricingCard = {
|
|
@@ -1033,30 +1237,30 @@ var SdPricingCardGrid = SdPricingCard.Grid;
|
|
|
1033
1237
|
|
|
1034
1238
|
// ui/molecule/Faq.tsx
|
|
1035
1239
|
var import_core21 = require("@mantine/core");
|
|
1036
|
-
var
|
|
1240
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
1037
1241
|
function Default2(_a4) {
|
|
1038
1242
|
var _b = _a4, { items } = _b, boxProps = __objRest(_b, ["items"]);
|
|
1039
|
-
return /* @__PURE__ */ (0,
|
|
1040
|
-
/* @__PURE__ */ (0,
|
|
1041
|
-
/* @__PURE__ */ (0,
|
|
1243
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Box, __spreadProps(__spreadValues({}, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Accordion, { variant: "separated", radius: "md", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core21.Accordion.Item, { value: String(i), children: [
|
|
1244
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SdText.Strong, { fz: "sm", children: item.question }) }),
|
|
1245
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SdText.Body, { fz: "sm", children: item.answer }) })
|
|
1042
1246
|
] }, i)) }) }));
|
|
1043
1247
|
}
|
|
1044
1248
|
function Filled(_a4) {
|
|
1045
1249
|
var _b = _a4, { items } = _b, boxProps = __objRest(_b, ["items"]);
|
|
1046
|
-
return /* @__PURE__ */ (0,
|
|
1047
|
-
/* @__PURE__ */ (0,
|
|
1048
|
-
/* @__PURE__ */ (0,
|
|
1250
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Box, __spreadProps(__spreadValues({}, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Accordion, { variant: "filled", radius: "md", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core21.Accordion.Item, { value: String(i), children: [
|
|
1251
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SdText.Strong, { fz: "sm", children: item.question }) }),
|
|
1252
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_core21.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SdText.Body, { fz: "sm", children: item.answer }) })
|
|
1049
1253
|
] }, i)) }) }));
|
|
1050
1254
|
}
|
|
1051
1255
|
function WithHeader(_a4) {
|
|
1052
1256
|
var _b = _a4, { label, title, description, items } = _b, boxProps = __objRest(_b, ["label", "title", "description", "items"]);
|
|
1053
|
-
return /* @__PURE__ */ (0,
|
|
1054
|
-
/* @__PURE__ */ (0,
|
|
1055
|
-
label && /* @__PURE__ */ (0,
|
|
1056
|
-
/* @__PURE__ */ (0,
|
|
1057
|
-
description && /* @__PURE__ */ (0,
|
|
1257
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core21.Stack, __spreadProps(__spreadValues({ gap: "xl" }, boxProps), { children: [
|
|
1258
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_core21.Stack, { gap: "xs", children: [
|
|
1259
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SdText.Eyebrow, { children: label }),
|
|
1260
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SdTitle.Section, { children: title }),
|
|
1261
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SdText.Body, { children: description })
|
|
1058
1262
|
] }),
|
|
1059
|
-
/* @__PURE__ */ (0,
|
|
1263
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Default2, { items })
|
|
1060
1264
|
] }));
|
|
1061
1265
|
}
|
|
1062
1266
|
var SdFaq = {
|
|
@@ -1073,7 +1277,7 @@ var SdFaqWithHeader = SdFaq.WithHeader;
|
|
|
1073
1277
|
|
|
1074
1278
|
// ui/molecule/Cta.tsx
|
|
1075
1279
|
var import_core22 = require("@mantine/core");
|
|
1076
|
-
var
|
|
1280
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1077
1281
|
function Banner(_a4) {
|
|
1078
1282
|
var _b = _a4, {
|
|
1079
1283
|
label,
|
|
@@ -1092,15 +1296,15 @@ function Banner(_a4) {
|
|
|
1092
1296
|
"onPrimary",
|
|
1093
1297
|
"onSecondary"
|
|
1094
1298
|
]);
|
|
1095
|
-
return /* @__PURE__ */ (0,
|
|
1096
|
-
/* @__PURE__ */ (0,
|
|
1097
|
-
label && /* @__PURE__ */ (0,
|
|
1098
|
-
/* @__PURE__ */ (0,
|
|
1099
|
-
description && /* @__PURE__ */ (0,
|
|
1299
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core22.Box, __spreadProps(__spreadValues({ bg: "primary.7", py: { base: "xl", md: 80 }, px: { base: "md", md: "xl" } }, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core22.Center, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Stack, { gap: "xl", align: "center", maw: 600, children: [
|
|
1300
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Stack, { gap: "sm", align: "center", children: [
|
|
1301
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdText.Eyebrow, { c: "primary.3", children: label }),
|
|
1302
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdTitle.Section, { c: "white", ta: "center", children: title }),
|
|
1303
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdText.Body, { c: "primary.2", ta: "center", children: description })
|
|
1100
1304
|
] }),
|
|
1101
|
-
/* @__PURE__ */ (0,
|
|
1102
|
-
/* @__PURE__ */ (0,
|
|
1103
|
-
secondaryLabel && /* @__PURE__ */ (0,
|
|
1305
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Group, { gap: "sm", children: [
|
|
1306
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdButton.White, { size: "md", onClick: onPrimary, children: primaryLabel }),
|
|
1307
|
+
secondaryLabel && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdButton.Ghost, { size: "md", c: "primary.2", onClick: onSecondary, children: secondaryLabel })
|
|
1104
1308
|
] })
|
|
1105
1309
|
] }) }) }));
|
|
1106
1310
|
}
|
|
@@ -1122,7 +1326,7 @@ function Subtle(_a4) {
|
|
|
1122
1326
|
"onPrimary",
|
|
1123
1327
|
"onSecondary"
|
|
1124
1328
|
]);
|
|
1125
|
-
return /* @__PURE__ */ (0,
|
|
1329
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1126
1330
|
import_core22.Box,
|
|
1127
1331
|
__spreadProps(__spreadValues({
|
|
1128
1332
|
bg: "primary.0",
|
|
@@ -1130,15 +1334,15 @@ function Subtle(_a4) {
|
|
|
1130
1334
|
px: { base: "md", md: "xl" },
|
|
1131
1335
|
style: { borderRadius: "var(--mantine-radius-lg)" }
|
|
1132
1336
|
}, boxProps), {
|
|
1133
|
-
children: /* @__PURE__ */ (0,
|
|
1134
|
-
/* @__PURE__ */ (0,
|
|
1135
|
-
label && /* @__PURE__ */ (0,
|
|
1136
|
-
/* @__PURE__ */ (0,
|
|
1137
|
-
description && /* @__PURE__ */ (0,
|
|
1337
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_core22.Center, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Stack, { gap: "lg", align: "center", maw: 560, children: [
|
|
1338
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Stack, { gap: "sm", align: "center", children: [
|
|
1339
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdText.Eyebrow, { children: label }),
|
|
1340
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdTitle.Section, { ta: "center", children: title }),
|
|
1341
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdText.Body, { ta: "center", children: description })
|
|
1138
1342
|
] }),
|
|
1139
|
-
/* @__PURE__ */ (0,
|
|
1140
|
-
/* @__PURE__ */ (0,
|
|
1141
|
-
secondaryLabel && /* @__PURE__ */ (0,
|
|
1343
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Group, { gap: "sm", children: [
|
|
1344
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdButton.Primary, { size: "md", onClick: onPrimary, children: primaryLabel }),
|
|
1345
|
+
secondaryLabel && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdButton.Outline, { size: "md", onClick: onSecondary, children: secondaryLabel })
|
|
1142
1346
|
] })
|
|
1143
1347
|
] }) })
|
|
1144
1348
|
})
|
|
@@ -1162,7 +1366,7 @@ function Inline(_a4) {
|
|
|
1162
1366
|
"onPrimary",
|
|
1163
1367
|
"onSecondary"
|
|
1164
1368
|
]);
|
|
1165
|
-
return /* @__PURE__ */ (0,
|
|
1369
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1166
1370
|
import_core22.Box,
|
|
1167
1371
|
__spreadProps(__spreadValues({
|
|
1168
1372
|
py: { base: "xl", md: 48 },
|
|
@@ -1172,15 +1376,15 @@ function Inline(_a4) {
|
|
|
1172
1376
|
borderBottom: "1px solid var(--mantine-color-slate-2)"
|
|
1173
1377
|
}
|
|
1174
1378
|
}, boxProps), {
|
|
1175
|
-
children: /* @__PURE__ */ (0,
|
|
1176
|
-
/* @__PURE__ */ (0,
|
|
1177
|
-
label && /* @__PURE__ */ (0,
|
|
1178
|
-
/* @__PURE__ */ (0,
|
|
1179
|
-
description && /* @__PURE__ */ (0,
|
|
1379
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Group, { justify: "space-between", align: "center", gap: "xl", children: [
|
|
1380
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Stack, { gap: "xs", style: { flex: 1 }, children: [
|
|
1381
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdText.Eyebrow, { children: label }),
|
|
1382
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdTitle.Card, { children: title }),
|
|
1383
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdText.Sub, { children: description })
|
|
1180
1384
|
] }),
|
|
1181
|
-
/* @__PURE__ */ (0,
|
|
1182
|
-
/* @__PURE__ */ (0,
|
|
1183
|
-
secondaryLabel && /* @__PURE__ */ (0,
|
|
1385
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_core22.Group, { gap: "sm", wrap: "nowrap", children: [
|
|
1386
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdButton.Primary, { size: "md", onClick: onPrimary, children: primaryLabel }),
|
|
1387
|
+
secondaryLabel && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SdButton.Outline, { size: "md", onClick: onSecondary, children: secondaryLabel })
|
|
1184
1388
|
] })
|
|
1185
1389
|
] })
|
|
1186
1390
|
})
|
|
@@ -1206,26 +1410,26 @@ var import_link3 = __toESM(require("next/link"));
|
|
|
1206
1410
|
// ui/molecule/SolutionCard.tsx
|
|
1207
1411
|
var import_core23 = require("@mantine/core");
|
|
1208
1412
|
var import_link2 = __toESM(require("next/link"));
|
|
1209
|
-
var
|
|
1413
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1210
1414
|
function SolutionCardItem(_a4) {
|
|
1211
1415
|
var _b = _a4, { item, onSelect } = _b, cardProps = __objRest(_b, ["item", "onSelect"]);
|
|
1212
1416
|
var _a5, _b2;
|
|
1213
|
-
return /* @__PURE__ */ (0,
|
|
1417
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core23.Card, __spreadProps(__spreadValues({ withBorder: true, h: "100%", style: { display: "flex", flexDirection: "column" } }, cardProps), { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core23.Stack, { gap: "md", style: { flex: 1 }, children: [
|
|
1214
1418
|
item.icon,
|
|
1215
|
-
/* @__PURE__ */ (0,
|
|
1216
|
-
/* @__PURE__ */ (0,
|
|
1217
|
-
/* @__PURE__ */ (0,
|
|
1218
|
-
item.href ? /* @__PURE__ */ (0,
|
|
1419
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SdBadge.Primary, { children: item.category }),
|
|
1420
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SdTitle.Card, { children: item.title }),
|
|
1421
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SdText.Body, { children: item.description }),
|
|
1422
|
+
item.href ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_core23.Button, { variant: "subtle", color: "slate", component: import_link2.default, href: item.href, mt: "auto", children: [
|
|
1219
1423
|
(_a5 = item.ctaLabel) != null ? _a5 : "\uC790\uC138\uD788 \uBCF4\uAE30",
|
|
1220
1424
|
" \u2192"
|
|
1221
|
-
] }) : /* @__PURE__ */ (0,
|
|
1425
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(SdButton.Ghost, { onClick: () => onSelect == null ? void 0 : onSelect(item), mt: "auto", children: [
|
|
1222
1426
|
(_b2 = item.ctaLabel) != null ? _b2 : "\uC790\uC138\uD788 \uBCF4\uAE30",
|
|
1223
1427
|
" \u2192"
|
|
1224
1428
|
] })
|
|
1225
1429
|
] }) }));
|
|
1226
1430
|
}
|
|
1227
1431
|
function Grid3({ items, cols = { base: 1, sm: 2, md: 3 }, onSelect }) {
|
|
1228
|
-
return /* @__PURE__ */ (0,
|
|
1432
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_core23.SimpleGrid, { cols, spacing: "xl", children: items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SolutionCardItem, { item, onSelect }, i)) });
|
|
1229
1433
|
}
|
|
1230
1434
|
var SdSolutionCard = {
|
|
1231
1435
|
/** 단일 compact 카드 */
|
|
@@ -1237,28 +1441,28 @@ var SdSolutionCardItem = SdSolutionCard.Item;
|
|
|
1237
1441
|
var SdSolutionCardGrid = SdSolutionCard.Grid;
|
|
1238
1442
|
|
|
1239
1443
|
// ui/molecule/Solution.tsx
|
|
1240
|
-
var
|
|
1444
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1241
1445
|
function Filtered({ items, allLabel = "\uC804\uCCB4", cols, onSelect }) {
|
|
1242
1446
|
const categories = ["all", ...Array.from(new Set(items.map((i) => i.category)))];
|
|
1243
1447
|
const [active, setActive] = (0, import_react.useState)("all");
|
|
1244
1448
|
const filtered = active === "all" ? items : items.filter((i) => i.category === active);
|
|
1245
|
-
return /* @__PURE__ */ (0,
|
|
1246
|
-
/* @__PURE__ */ (0,
|
|
1247
|
-
/* @__PURE__ */ (0,
|
|
1449
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_core24.Stack, { gap: "xl", children: [
|
|
1450
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SdTabs.Pills, { value: active, onChange: (v) => setActive(v != null ? v : "all"), children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SdTabs.Pills.List, { children: categories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SdTabs.Pills.Tab, { value: cat, children: cat === "all" ? allLabel : cat }, cat)) }) }),
|
|
1451
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SdSolutionCard.Grid, { items: filtered, cols, onSelect })
|
|
1248
1452
|
] });
|
|
1249
1453
|
}
|
|
1250
1454
|
function List({ items, onSelect }) {
|
|
1251
|
-
return /* @__PURE__ */ (0,
|
|
1455
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core24.Stack, { gap: 0, children: items.map((item, i) => {
|
|
1252
1456
|
var _a4, _b;
|
|
1253
|
-
return /* @__PURE__ */ (0,
|
|
1254
|
-
i > 0 && /* @__PURE__ */ (0,
|
|
1255
|
-
/* @__PURE__ */ (0,
|
|
1256
|
-
item.icon && /* @__PURE__ */ (0,
|
|
1257
|
-
/* @__PURE__ */ (0,
|
|
1258
|
-
/* @__PURE__ */ (0,
|
|
1259
|
-
/* @__PURE__ */ (0,
|
|
1260
|
-
/* @__PURE__ */ (0,
|
|
1261
|
-
item.href ? /* @__PURE__ */ (0,
|
|
1457
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { children: [
|
|
1458
|
+
i > 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core24.Divider, {}),
|
|
1459
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_core24.Group, { align: "flex-start", py: "lg", gap: "lg", children: [
|
|
1460
|
+
item.icon && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_core24.ThemeIcon, { variant: "light", color: "primary", size: "xl", radius: "md", children: item.icon }),
|
|
1461
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_core24.Stack, { gap: "xs", style: { flex: 1 }, children: [
|
|
1462
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SdBadge.Primary, { children: item.category }),
|
|
1463
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SdTitle.Card, { children: item.title }),
|
|
1464
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SdText.Body, { children: item.description }),
|
|
1465
|
+
item.href ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
1262
1466
|
import_core24.Button,
|
|
1263
1467
|
{
|
|
1264
1468
|
variant: "subtle",
|
|
@@ -1271,7 +1475,7 @@ function List({ items, onSelect }) {
|
|
|
1271
1475
|
" \u2192"
|
|
1272
1476
|
]
|
|
1273
1477
|
}
|
|
1274
|
-
) : /* @__PURE__ */ (0,
|
|
1478
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
1275
1479
|
SdButton.Ghost,
|
|
1276
1480
|
{
|
|
1277
1481
|
onClick: () => onSelect == null ? void 0 : onSelect(item),
|
|
@@ -1298,7 +1502,7 @@ var SdSolutionList = SdSolution.List;
|
|
|
1298
1502
|
|
|
1299
1503
|
// ui/molecule/Clients.tsx
|
|
1300
1504
|
var import_core25 = require("@mantine/core");
|
|
1301
|
-
var
|
|
1505
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1302
1506
|
var grayStyle = {
|
|
1303
1507
|
filter: "grayscale(1) opacity(0.5)",
|
|
1304
1508
|
transition: "filter 0.25s"
|
|
@@ -1307,7 +1511,7 @@ var colorStyle = {
|
|
|
1307
1511
|
filter: "grayscale(0) opacity(1)"
|
|
1308
1512
|
};
|
|
1309
1513
|
function LogoImage({ client, height }) {
|
|
1310
|
-
return /* @__PURE__ */ (0,
|
|
1514
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core25.Tooltip, { label: client.name, withArrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core25.Anchor, { href: client.url, target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1311
1515
|
"img",
|
|
1312
1516
|
{
|
|
1313
1517
|
src: client.logo,
|
|
@@ -1323,7 +1527,7 @@ function Grid4({
|
|
|
1323
1527
|
cols = { base: 2, sm: 3, md: 4, lg: 6 },
|
|
1324
1528
|
logoHeight = 40
|
|
1325
1529
|
}) {
|
|
1326
|
-
return /* @__PURE__ */ (0,
|
|
1530
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core25.SimpleGrid, { cols, spacing: "xl", children: items.map((client, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1327
1531
|
import_core25.Box,
|
|
1328
1532
|
{
|
|
1329
1533
|
style: {
|
|
@@ -1332,7 +1536,7 @@ function Grid4({
|
|
|
1332
1536
|
justifyContent: "center",
|
|
1333
1537
|
padding: "12px 8px"
|
|
1334
1538
|
},
|
|
1335
|
-
children: /* @__PURE__ */ (0,
|
|
1539
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(LogoImage, { client, height: logoHeight })
|
|
1336
1540
|
},
|
|
1337
1541
|
i
|
|
1338
1542
|
)) });
|
|
@@ -1340,9 +1544,9 @@ function Grid4({
|
|
|
1340
1544
|
var KEYFRAME = `@keyframes sd-clients-marquee { from { transform: translateX(0) } to { transform: translateX(-50%) } }`;
|
|
1341
1545
|
function Marquee({ items, speed = 40, logoHeight = 36, gap = 64 }) {
|
|
1342
1546
|
const doubled = [...items, ...items];
|
|
1343
|
-
return /* @__PURE__ */ (0,
|
|
1344
|
-
/* @__PURE__ */ (0,
|
|
1345
|
-
/* @__PURE__ */ (0,
|
|
1547
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_core25.Box, { style: { overflow: "hidden" }, children: [
|
|
1548
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("style", { children: KEYFRAME }),
|
|
1549
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1346
1550
|
import_core25.Box,
|
|
1347
1551
|
{
|
|
1348
1552
|
style: {
|
|
@@ -1360,7 +1564,7 @@ function Marquee({ items, speed = 40, logoHeight = 36, gap = 64 }) {
|
|
|
1360
1564
|
;
|
|
1361
1565
|
e.currentTarget.style.animationPlayState = "running";
|
|
1362
1566
|
},
|
|
1363
|
-
children: doubled.map((client, i) => /* @__PURE__ */ (0,
|
|
1567
|
+
children: doubled.map((client, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(LogoImage, { client, height: logoHeight }, i))
|
|
1364
1568
|
}
|
|
1365
1569
|
)
|
|
1366
1570
|
] });
|
|
@@ -1377,10 +1581,10 @@ var SdClientsMarquee = Marquee;
|
|
|
1377
1581
|
// ui/molecule/Map.tsx
|
|
1378
1582
|
var import_react2 = require("react");
|
|
1379
1583
|
var import_core26 = require("@mantine/core");
|
|
1380
|
-
var
|
|
1584
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1381
1585
|
function MapFrame({ address, height }) {
|
|
1382
|
-
return /* @__PURE__ */ (0,
|
|
1383
|
-
/* @__PURE__ */ (0,
|
|
1586
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core26.Stack, { gap: "xs", children: [
|
|
1587
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core26.Box, { style: { borderRadius: "var(--mantine-radius-md)", overflow: "hidden", height }, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1384
1588
|
"iframe",
|
|
1385
1589
|
{
|
|
1386
1590
|
src: address.embbedUrl,
|
|
@@ -1393,7 +1597,7 @@ function MapFrame({ address, height }) {
|
|
|
1393
1597
|
title: address.label
|
|
1394
1598
|
}
|
|
1395
1599
|
) }),
|
|
1396
|
-
/* @__PURE__ */ (0,
|
|
1600
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(SdText.Sub, { children: [
|
|
1397
1601
|
"[",
|
|
1398
1602
|
address.label,
|
|
1399
1603
|
"] ",
|
|
@@ -1404,18 +1608,18 @@ function MapFrame({ address, height }) {
|
|
|
1404
1608
|
function Single(_a4) {
|
|
1405
1609
|
var _b = _a4, { address, height = 400 } = _b, boxProps = __objRest(_b, ["address", "height"]);
|
|
1406
1610
|
if (!address.embbedUrl) return null;
|
|
1407
|
-
return /* @__PURE__ */ (0,
|
|
1611
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_core26.Box, __spreadProps(__spreadValues({}, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(MapFrame, { address, height }) }));
|
|
1408
1612
|
}
|
|
1409
1613
|
function Tabs2({ addresses, height = 400 }) {
|
|
1410
1614
|
var _a4, _b, _c;
|
|
1411
1615
|
const mapped = addresses.filter((a) => a.embbedUrl);
|
|
1412
1616
|
const [active, setActive] = (0, import_react2.useState)((_b = (_a4 = mapped[0]) == null ? void 0 : _a4.label) != null ? _b : "");
|
|
1413
1617
|
if (mapped.length === 0) return null;
|
|
1414
|
-
if (mapped.length === 1) return /* @__PURE__ */ (0,
|
|
1618
|
+
if (mapped.length === 1) return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(MapFrame, { address: mapped[0], height });
|
|
1415
1619
|
const current = (_c = mapped.find((a) => a.label === active)) != null ? _c : mapped[0];
|
|
1416
|
-
return /* @__PURE__ */ (0,
|
|
1417
|
-
/* @__PURE__ */ (0,
|
|
1418
|
-
/* @__PURE__ */ (0,
|
|
1620
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_core26.Stack, { gap: "md", children: [
|
|
1621
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(SdTabs.Pills, { value: active, onChange: (v) => setActive(v != null ? v : mapped[0].label), children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(SdTabs.Pills.List, { children: mapped.map((addr) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(SdTabs.Pills.Tab, { value: addr.label, children: addr.label }, addr.label)) }) }),
|
|
1622
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(MapFrame, { address: current, height })
|
|
1419
1623
|
] });
|
|
1420
1624
|
}
|
|
1421
1625
|
var SdMap = {
|
|
@@ -1430,8 +1634,8 @@ var SdMapTabs = Tabs2;
|
|
|
1430
1634
|
// ui/organism/HeroCarousel.tsx
|
|
1431
1635
|
var import_carousel = require("@mantine/carousel");
|
|
1432
1636
|
var import_core27 = require("@mantine/core");
|
|
1433
|
-
var
|
|
1434
|
-
var
|
|
1637
|
+
var import_icons_react5 = require("@tabler/icons-react");
|
|
1638
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1435
1639
|
var variantMap = {
|
|
1436
1640
|
primary: SdButton.Primary,
|
|
1437
1641
|
secondary: SdButton.Secondary,
|
|
@@ -1441,25 +1645,25 @@ var variantMap = {
|
|
|
1441
1645
|
function CtaButton({ cta }) {
|
|
1442
1646
|
var _a4;
|
|
1443
1647
|
const Button3 = variantMap[(_a4 = cta.variant) != null ? _a4 : "primary"];
|
|
1444
|
-
return /* @__PURE__ */ (0,
|
|
1648
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core27.Anchor, { href: cta.href, underline: "never", children: cta.icon ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button3, { size: "md", rightSection: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_icons_react5.IconArrowNarrowRight, {}), children: cta.label }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button3, { size: "md", children: cta.label }) });
|
|
1445
1649
|
}
|
|
1446
1650
|
function HeroCarousel({ slides, children }) {
|
|
1447
|
-
if (children) return /* @__PURE__ */ (0,
|
|
1651
|
+
if (children) return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx_runtime29.Fragment, { children });
|
|
1448
1652
|
const filterdSlides = filterAndSort(slides);
|
|
1449
|
-
return /* @__PURE__ */ (0,
|
|
1653
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_carousel.Carousel, { withIndicators: true, height: "60svh", children: filterdSlides.map((slide, i) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_carousel.Carousel.Slide, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1450
1654
|
import_core27.Box,
|
|
1451
1655
|
{
|
|
1452
1656
|
style: {
|
|
1453
1657
|
height: "100%",
|
|
1454
|
-
backgroundImage: `url(${slide.image})`,
|
|
1658
|
+
backgroundImage: `linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45)), url(${slide.image})`,
|
|
1455
1659
|
backgroundSize: "cover",
|
|
1456
1660
|
backgroundPosition: "center",
|
|
1457
1661
|
display: "flex",
|
|
1458
1662
|
alignItems: "center",
|
|
1459
1663
|
justifyContent: "center"
|
|
1460
1664
|
},
|
|
1461
|
-
children: /* @__PURE__ */ (0,
|
|
1462
|
-
/* @__PURE__ */ (0,
|
|
1665
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_core27.Stack, { align: "center", style: { textAlign: "center", maxWidth: 780 }, px: "xl", children: [
|
|
1666
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1463
1667
|
SdTextBox.Hero,
|
|
1464
1668
|
{
|
|
1465
1669
|
title: slide.title,
|
|
@@ -1468,7 +1672,7 @@ function HeroCarousel({ slides, children }) {
|
|
|
1468
1672
|
align: "center"
|
|
1469
1673
|
}
|
|
1470
1674
|
),
|
|
1471
|
-
slide.ctas && slide.ctas.length > 0 && /* @__PURE__ */ (0,
|
|
1675
|
+
slide.ctas && slide.ctas.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_core27.Group, { gap: "sm", mt: "md", children: slide.ctas.map((cta, i2) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CtaButton, { cta }, cta.href)) })
|
|
1472
1676
|
] })
|
|
1473
1677
|
}
|
|
1474
1678
|
) }, i)) });
|
|
@@ -1476,21 +1680,50 @@ function HeroCarousel({ slides, children }) {
|
|
|
1476
1680
|
|
|
1477
1681
|
// ui/organism/Header.tsx
|
|
1478
1682
|
var import_core28 = require("@mantine/core");
|
|
1683
|
+
var import_icons_react6 = require("@tabler/icons-react");
|
|
1479
1684
|
var import_hooks = require("@mantine/hooks");
|
|
1480
|
-
var
|
|
1685
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1481
1686
|
var BAR_HEIGHT = 60;
|
|
1482
|
-
function
|
|
1483
|
-
const [opened, { toggle, close }] = (0, import_hooks.useDisclosure)();
|
|
1687
|
+
function useNavTree(navItems) {
|
|
1484
1688
|
const visibleItems = filterAndSort(navItems);
|
|
1485
|
-
|
|
1486
|
-
|
|
1487
|
-
|
|
1689
|
+
return {
|
|
1690
|
+
topItems: visibleItems.filter((item) => !item.parentId),
|
|
1691
|
+
childrenOf: (parentId) => visibleItems.filter((item) => item.parentId === parentId),
|
|
1692
|
+
hasAnyChildren: visibleItems.some((item) => item.parentId)
|
|
1693
|
+
};
|
|
1694
|
+
}
|
|
1695
|
+
function MobileNav({ opened, close, topItems, childrenOf, loginFlag }) {
|
|
1696
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Drawer, { opened, onClose: close, hiddenFrom: "sm", size: "xs", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core28.Stack, { gap: 0, children: [
|
|
1697
|
+
topItems.map((item) => {
|
|
1698
|
+
const kids = childrenOf(item.id);
|
|
1699
|
+
if (kids.length === 0) {
|
|
1700
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Box, { px: "sm", py: 8, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdLink.Body, { href: item.href, onClick: close, children: item.label }) }, item.id);
|
|
1701
|
+
}
|
|
1702
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1703
|
+
import_core28.NavLink,
|
|
1704
|
+
{
|
|
1705
|
+
label: item.label,
|
|
1706
|
+
component: item.href ? "a" : "button",
|
|
1707
|
+
href: item.href,
|
|
1708
|
+
childrenOffset: 28,
|
|
1709
|
+
onClick: kids.length > 0 ? void 0 : close,
|
|
1710
|
+
children: kids.map((kid) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.NavLink, { label: kid.label, href: kid.href, onClick: close }, kid.id))
|
|
1711
|
+
},
|
|
1712
|
+
item.id
|
|
1713
|
+
);
|
|
1714
|
+
}),
|
|
1715
|
+
loginFlag && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Stack, { gap: "xs", mt: "md", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdButton.Primary, { size: "xs", children: "\uB85C\uADF8\uC778" }) })
|
|
1716
|
+
] }) });
|
|
1717
|
+
}
|
|
1718
|
+
function MegaHeader({ navItems, loginFlag }) {
|
|
1719
|
+
const [opened, { toggle, close }] = (0, import_hooks.useDisclosure)();
|
|
1720
|
+
const { topItems, childrenOf, hasAnyChildren } = useNavTree(navItems);
|
|
1488
1721
|
const { hovered, ref: hoverRef } = (0, import_hooks.useHover)();
|
|
1489
1722
|
const { focused, ref: focusRef } = (0, import_hooks.useFocusWithin)();
|
|
1490
1723
|
const rootRef = (0, import_hooks.useMergedRef)(hoverRef, focusRef);
|
|
1491
1724
|
const expanded = hasAnyChildren && (hovered || focused);
|
|
1492
|
-
return /* @__PURE__ */ (0,
|
|
1493
|
-
/* @__PURE__ */ (0,
|
|
1725
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
|
|
1726
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1494
1727
|
import_core28.Box,
|
|
1495
1728
|
{
|
|
1496
1729
|
ref: rootRef,
|
|
@@ -1501,12 +1734,12 @@ function SdHeader({ navItems, loginFlag, children }) {
|
|
|
1501
1734
|
borderBottom: expanded ? "1px solid var(--mantine-color-slate-2)" : void 0,
|
|
1502
1735
|
transition: "box-shadow 0.15s"
|
|
1503
1736
|
},
|
|
1504
|
-
children: /* @__PURE__ */ (0,
|
|
1505
|
-
/* @__PURE__ */ (0,
|
|
1506
|
-
/* @__PURE__ */ (0,
|
|
1737
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core28.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
1738
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Group, { h: BAR_HEIGHT, align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Logo, {}) }),
|
|
1739
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Group, { gap: "xl", align: "flex-start", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
|
|
1507
1740
|
const kids = childrenOf(item.id);
|
|
1508
|
-
return /* @__PURE__ */ (0,
|
|
1509
|
-
/* @__PURE__ */ (0,
|
|
1741
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core28.Stack, { gap: 0, align: "center", children: [
|
|
1742
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Group, { h: BAR_HEIGHT, align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdLink.Body, { href: item.href, children: item.label }) }),
|
|
1510
1743
|
kids.length > 0 && /*
|
|
1511
1744
|
Mantine Collapse를 쓰지 않는다 — 접힐 때 display:none이 되어
|
|
1512
1745
|
하위 링크가 폭 계산에서 빠졌다가 펼칠 때 다시 들어오면서
|
|
@@ -1514,7 +1747,7 @@ function SdHeader({ navItems, loginFlag, children }) {
|
|
|
1514
1747
|
height 0 + overflow hidden은 폭 기여를 유지하므로 간격이 고정된다.
|
|
1515
1748
|
visibility:hidden이 접힌 상태의 링크를 탭 순서에서도 빼준다.
|
|
1516
1749
|
*/
|
|
1517
|
-
/* @__PURE__ */ (0,
|
|
1750
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1518
1751
|
import_core28.Box,
|
|
1519
1752
|
{
|
|
1520
1753
|
"aria-hidden": !expanded,
|
|
@@ -1525,68 +1758,123 @@ function SdHeader({ navItems, loginFlag, children }) {
|
|
|
1525
1758
|
visibility: expanded ? "visible" : "hidden",
|
|
1526
1759
|
transition: "opacity 0.15s ease"
|
|
1527
1760
|
},
|
|
1528
|
-
children: /* @__PURE__ */ (0,
|
|
1761
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Stack, { gap: "xs", pt: 4, pb: "lg", align: "center", children: kids.map((kid) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdLink.Sub, { href: kid.href, children: kid.label }, kid.id)) })
|
|
1529
1762
|
}
|
|
1530
1763
|
)
|
|
1531
1764
|
] }, item.id);
|
|
1532
1765
|
}) }),
|
|
1533
|
-
/* @__PURE__ */ (0,
|
|
1534
|
-
/* @__PURE__ */ (0,
|
|
1535
|
-
loginFlag && /* @__PURE__ */ (0,
|
|
1536
|
-
children
|
|
1766
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core28.Group, { h: BAR_HEIGHT, align: "center", gap: "sm", wrap: "nowrap", children: [
|
|
1767
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Burger, { hiddenFrom: "sm", opened, onClick: toggle }),
|
|
1768
|
+
loginFlag && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Group, { gap: "sm", visibleFrom: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdButton.Primary, { size: "xs", children: "\uB85C\uADF8\uC778" }) })
|
|
1537
1769
|
] })
|
|
1538
1770
|
] }) })
|
|
1539
1771
|
}
|
|
1540
1772
|
),
|
|
1541
|
-
/* @__PURE__ */ (0,
|
|
1542
|
-
|
|
1773
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1774
|
+
MobileNav,
|
|
1775
|
+
{
|
|
1776
|
+
opened,
|
|
1777
|
+
close,
|
|
1778
|
+
topItems,
|
|
1779
|
+
childrenOf,
|
|
1780
|
+
loginFlag
|
|
1781
|
+
}
|
|
1782
|
+
)
|
|
1783
|
+
] });
|
|
1784
|
+
}
|
|
1785
|
+
function SimpleHeader({ navItems, loginFlag }) {
|
|
1786
|
+
const [opened, { toggle, close }] = (0, import_hooks.useDisclosure)();
|
|
1787
|
+
const { topItems, childrenOf } = useNavTree(navItems);
|
|
1788
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
|
|
1789
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Box, { bg: "var(--mantine-color-body)", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core28.Group, { h: BAR_HEIGHT, justify: "space-between", align: "center", wrap: "nowrap", children: [
|
|
1790
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Logo, {}),
|
|
1791
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Group, { gap: "xl", align: "center", wrap: "nowrap", visibleFrom: "sm", children: topItems.map((item) => {
|
|
1543
1792
|
const kids = childrenOf(item.id);
|
|
1544
1793
|
if (kids.length === 0) {
|
|
1545
|
-
return /* @__PURE__ */ (0,
|
|
1794
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdLink.Body, { href: item.href, children: item.label }, item.id);
|
|
1546
1795
|
}
|
|
1547
|
-
return
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
|
|
1796
|
+
return (
|
|
1797
|
+
/*
|
|
1798
|
+
trigger="click-hover" — 마우스는 hover로, 키보드/터치는 click으로 연다.
|
|
1799
|
+
Menu.Target은 ref를 받을 수 있는 단일 엘리먼트여야 하므로
|
|
1800
|
+
SdLink/SdText가 아니라 Box를 타깃으로 두고 라벨을 그 안에 넣는다.
|
|
1801
|
+
*/
|
|
1802
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
1803
|
+
import_core28.Menu,
|
|
1804
|
+
{
|
|
1805
|
+
trigger: "click-hover",
|
|
1806
|
+
openDelay: 50,
|
|
1807
|
+
closeDelay: 120,
|
|
1808
|
+
position: "bottom",
|
|
1809
|
+
offset: 12,
|
|
1810
|
+
shadow: "md",
|
|
1811
|
+
radius: "md",
|
|
1812
|
+
withinPortal: true,
|
|
1813
|
+
children: [
|
|
1814
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Menu.Target, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Box, { style: { cursor: "pointer" }, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core28.Group, { gap: 4, align: "center", wrap: "nowrap", children: [
|
|
1815
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdLink.Body, { href: item.href, children: item.label }),
|
|
1816
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_icons_react6.IconChevronDown, { size: 14, stroke: 2 })
|
|
1817
|
+
] }) }) }),
|
|
1818
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Menu.Dropdown, { children: kids.map(
|
|
1819
|
+
(kid) => kid.href ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Menu.Item, { component: "a", href: kid.href, children: kid.label }, kid.id) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Menu.Label, { children: kid.label }, kid.id)
|
|
1820
|
+
) })
|
|
1821
|
+
]
|
|
1822
|
+
},
|
|
1823
|
+
item.id
|
|
1824
|
+
)
|
|
1557
1825
|
);
|
|
1558
|
-
}),
|
|
1559
|
-
|
|
1560
|
-
|
|
1826
|
+
}) }),
|
|
1827
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_core28.Group, { align: "center", gap: "sm", wrap: "nowrap", children: [
|
|
1828
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Burger, { hiddenFrom: "sm", opened, onClick: toggle }),
|
|
1829
|
+
loginFlag && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_core28.Group, { gap: "sm", visibleFrom: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SdButton.Primary, { size: "xs", children: "\uB85C\uADF8\uC778" }) })
|
|
1830
|
+
] })
|
|
1831
|
+
] }) }) }),
|
|
1832
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1833
|
+
MobileNav,
|
|
1834
|
+
{
|
|
1835
|
+
opened,
|
|
1836
|
+
close,
|
|
1837
|
+
topItems,
|
|
1838
|
+
childrenOf,
|
|
1839
|
+
loginFlag
|
|
1840
|
+
}
|
|
1841
|
+
)
|
|
1561
1842
|
] });
|
|
1562
1843
|
}
|
|
1844
|
+
var SdHeader = Object.assign(MegaHeader, { Mega: MegaHeader, Simple: SimpleHeader });
|
|
1845
|
+
var SdHeaderMega = MegaHeader;
|
|
1846
|
+
var SdHeaderSimple = SimpleHeader;
|
|
1563
1847
|
|
|
1564
1848
|
// ui/organism/Footer.tsx
|
|
1565
1849
|
var import_core29 = require("@mantine/core");
|
|
1566
|
-
var
|
|
1567
|
-
var
|
|
1850
|
+
var import_icons_react7 = require("@tabler/icons-react");
|
|
1851
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1568
1852
|
function FooterNavColumns({ items }) {
|
|
1569
1853
|
const topLevel = items.filter((item) => !item.parentId);
|
|
1570
1854
|
const getChildren = (parentId) => items.filter((item) => item.parentId === parentId);
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1855
|
+
const CHILD_THRESH = 4;
|
|
1856
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, { children: topLevel.map((group) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Grid.Col, { span: { base: 6, sm: 4, md: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core29.Stack, { gap: "xs", children: [
|
|
1857
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdLink.Sub, { href: group.href, children: group.label }, group.id),
|
|
1858
|
+
getChildren(group.id).map((link, id) => {
|
|
1859
|
+
if (id >= CHILD_THRESH) return;
|
|
1860
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdLink.Hint, { href: link.href, children: link.label }, link.id);
|
|
1861
|
+
})
|
|
1574
1862
|
] }) }, group.id)) });
|
|
1575
1863
|
}
|
|
1576
1864
|
var SOCIAL_ICONS = {
|
|
1577
|
-
x:
|
|
1578
|
-
youtube:
|
|
1579
|
-
instagram:
|
|
1580
|
-
facebook:
|
|
1581
|
-
linkedin:
|
|
1582
|
-
github:
|
|
1583
|
-
blog:
|
|
1865
|
+
x: import_icons_react7.IconBrandX,
|
|
1866
|
+
youtube: import_icons_react7.IconBrandYoutube,
|
|
1867
|
+
instagram: import_icons_react7.IconBrandInstagram,
|
|
1868
|
+
facebook: import_icons_react7.IconBrandFacebook,
|
|
1869
|
+
linkedin: import_icons_react7.IconBrandLinkedin,
|
|
1870
|
+
github: import_icons_react7.IconBrandGithub,
|
|
1871
|
+
blog: import_icons_react7.IconWorld
|
|
1584
1872
|
};
|
|
1585
1873
|
function FooterSocials({ items }) {
|
|
1586
|
-
return /* @__PURE__ */ (0,
|
|
1874
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Group, { gap: 0, wrap: "nowrap", children: items.map((item) => {
|
|
1587
1875
|
var _a4, _b;
|
|
1588
|
-
const Icon = (_a4 = SOCIAL_ICONS[item.platform]) != null ? _a4 :
|
|
1589
|
-
return /* @__PURE__ */ (0,
|
|
1876
|
+
const Icon = (_a4 = SOCIAL_ICONS[item.platform]) != null ? _a4 : import_icons_react7.IconWorld;
|
|
1877
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1590
1878
|
import_core29.ActionIcon,
|
|
1591
1879
|
{
|
|
1592
1880
|
component: "a",
|
|
@@ -1597,54 +1885,54 @@ function FooterSocials({ items }) {
|
|
|
1597
1885
|
color: "gray",
|
|
1598
1886
|
variant: "subtle",
|
|
1599
1887
|
"aria-label": (_b = item.label) != null ? _b : item.platform,
|
|
1600
|
-
children: /* @__PURE__ */ (0,
|
|
1888
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Icon, { size: 18, stroke: 1.5 })
|
|
1601
1889
|
},
|
|
1602
1890
|
item.url
|
|
1603
1891
|
);
|
|
1604
1892
|
}) });
|
|
1605
1893
|
}
|
|
1606
1894
|
function InfoCell({ label, children }) {
|
|
1607
|
-
return /* @__PURE__ */ (0,
|
|
1608
|
-
/* @__PURE__ */ (0,
|
|
1609
|
-
typeof children === "string" ? /* @__PURE__ */ (0,
|
|
1895
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core29.Group, { gap: 6, wrap: "nowrap", align: "baseline", children: [
|
|
1896
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdText.Sub, { c: "slate.4", style: { whiteSpace: "nowrap" }, children: label }),
|
|
1897
|
+
typeof children === "string" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdText.Sub, { children }) : children
|
|
1610
1898
|
] });
|
|
1611
1899
|
}
|
|
1612
1900
|
function FooterCompanyInfo({ company }) {
|
|
1613
1901
|
const sortedAddresses = [...company.addresses].sort((a, b) => a.order - b.order);
|
|
1614
|
-
return /* @__PURE__ */ (0,
|
|
1615
|
-
/* @__PURE__ */ (0,
|
|
1616
|
-
/* @__PURE__ */ (0,
|
|
1617
|
-
sortedAddresses.map((addr) => /* @__PURE__ */ (0,
|
|
1618
|
-
/* @__PURE__ */ (0,
|
|
1619
|
-
company.fax && /* @__PURE__ */ (0,
|
|
1620
|
-
/* @__PURE__ */ (0,
|
|
1902
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core29.SimpleGrid, { cols: { base: 2, sm: 2, md: 1 }, spacing: "md", verticalSpacing: 0, children: [
|
|
1903
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(InfoCell, { label: "\uC0C1\uD638", children: company.name }),
|
|
1904
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(InfoCell, { label: "\uC0AC\uC5C5\uC790\uB4F1\uB85D\uBC88\uD638", children: company.registrationNumber }),
|
|
1905
|
+
sortedAddresses.map((addr) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(InfoCell, { label: addr.label, children: addr.address }, addr.label)),
|
|
1906
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(InfoCell, { label: "Tel", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdLink.Sub, { href: `tel:${company.tel}`, children: company.tel }) }),
|
|
1907
|
+
company.fax && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(InfoCell, { label: "Fax", children: company.fax }),
|
|
1908
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(InfoCell, { label: "Email", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdLink.Sub, { href: `mailto:${company.email}`, children: company.email }) })
|
|
1621
1909
|
] });
|
|
1622
1910
|
}
|
|
1623
1911
|
function SdFooter({ company, navItems, policyLinks, description }) {
|
|
1624
1912
|
const visibleNav = filterAndSort(navItems);
|
|
1625
1913
|
const visiblePolicy = filterAndSort(policyLinks);
|
|
1626
|
-
return /* @__PURE__ */ (0,
|
|
1627
|
-
/* @__PURE__ */ (0,
|
|
1628
|
-
description && /* @__PURE__ */ (0,
|
|
1629
|
-
/* @__PURE__ */ (0,
|
|
1630
|
-
/* @__PURE__ */ (0,
|
|
1631
|
-
visibleNav.length > 0 && /* @__PURE__ */ (0,
|
|
1914
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Box, { component: "footer", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdContainer, { py: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core29.Stack, { children: [
|
|
1915
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Logo, { size: "sm" }),
|
|
1916
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SdText.Sub, { children: description }),
|
|
1917
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core29.Flex, { direction: { base: "column", md: "row" }, gap: 48, align: "flex-start", children: [
|
|
1918
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Box, { flex: { base: "0 0 auto", md: "1 1 0" }, w: { base: "100%", md: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(FooterCompanyInfo, { company }) }),
|
|
1919
|
+
visibleNav.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Box, { flex: { base: "0 0 auto", md: "2 1 0" }, w: { base: "100%", md: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Grid, { style: { "--grid-gutter": "24px" }, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(FooterNavColumns, { items: visibleNav }) }) })
|
|
1632
1920
|
] }),
|
|
1633
|
-
/* @__PURE__ */ (0,
|
|
1634
|
-
/* @__PURE__ */ (0,
|
|
1635
|
-
/* @__PURE__ */ (0,
|
|
1921
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Divider, {}),
|
|
1922
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core29.Group, { justify: "space-between", wrap: "wrap", gap: "xs", children: [
|
|
1923
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(SdText.Sub, { children: [
|
|
1636
1924
|
"\xA9 ",
|
|
1637
1925
|
company.copyrightYear,
|
|
1638
1926
|
" ",
|
|
1639
|
-
company.name,
|
|
1927
|
+
t(company.name),
|
|
1640
1928
|
". All rights reserved."
|
|
1641
1929
|
] }),
|
|
1642
|
-
/* @__PURE__ */ (0,
|
|
1643
|
-
visiblePolicy.length > 0 && /* @__PURE__ */ (0,
|
|
1644
|
-
const Link4 = item.highlight ? SdLink.
|
|
1645
|
-
return /* @__PURE__ */ (0,
|
|
1930
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_core29.Group, { gap: "lg", wrap: "wrap", children: [
|
|
1931
|
+
visiblePolicy.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_core29.Group, { gap: "lg", children: visiblePolicy.map((item) => {
|
|
1932
|
+
const Link4 = item.highlight ? SdLink.Body : SdLink.Sub;
|
|
1933
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Link4, { href: item.href, children: item.label }, item.id);
|
|
1646
1934
|
}) }),
|
|
1647
|
-
company.socials && company.socials.length > 0 && /* @__PURE__ */ (0,
|
|
1935
|
+
company.socials && company.socials.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(FooterSocials, { items: company.socials })
|
|
1648
1936
|
] })
|
|
1649
1937
|
] })
|
|
1650
1938
|
] }) }) });
|
|
@@ -1652,7 +1940,7 @@ function SdFooter({ company, navItems, policyLinks, description }) {
|
|
|
1652
1940
|
|
|
1653
1941
|
// ui/organism/FeatureSection.tsx
|
|
1654
1942
|
var import_core30 = require("@mantine/core");
|
|
1655
|
-
var
|
|
1943
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1656
1944
|
function SdFeatureSection(_a4) {
|
|
1657
1945
|
var _b = _a4, {
|
|
1658
1946
|
label,
|
|
@@ -1669,8 +1957,8 @@ function SdFeatureSection(_a4) {
|
|
|
1669
1957
|
"cols",
|
|
1670
1958
|
"py"
|
|
1671
1959
|
]);
|
|
1672
|
-
return /* @__PURE__ */ (0,
|
|
1673
|
-
/* @__PURE__ */ (0,
|
|
1960
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(SdContainer, __spreadProps(__spreadValues({ py }, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_core30.Stack, { gap: "xl", children: [
|
|
1961
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1674
1962
|
SdTextBox.Section,
|
|
1675
1963
|
{
|
|
1676
1964
|
label,
|
|
@@ -1681,13 +1969,13 @@ function SdFeatureSection(_a4) {
|
|
|
1681
1969
|
align: "center"
|
|
1682
1970
|
}
|
|
1683
1971
|
),
|
|
1684
|
-
/* @__PURE__ */ (0,
|
|
1972
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(SdFeatures, { items, cols })
|
|
1685
1973
|
] }) }));
|
|
1686
1974
|
}
|
|
1687
1975
|
|
|
1688
1976
|
// ui/organism/TimelineSection.tsx
|
|
1689
1977
|
var import_core31 = require("@mantine/core");
|
|
1690
|
-
var
|
|
1978
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1691
1979
|
function SdTimelineSection(_a4) {
|
|
1692
1980
|
var _b = _a4, {
|
|
1693
1981
|
label,
|
|
@@ -1702,15 +1990,15 @@ function SdTimelineSection(_a4) {
|
|
|
1702
1990
|
"items",
|
|
1703
1991
|
"py"
|
|
1704
1992
|
]);
|
|
1705
|
-
return /* @__PURE__ */ (0,
|
|
1706
|
-
/* @__PURE__ */ (0,
|
|
1707
|
-
/* @__PURE__ */ (0,
|
|
1993
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Center, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core31.Stack, __spreadProps(__spreadValues({ py, gap: "md" }, boxProps), { children: [
|
|
1994
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(SdTextBox.Section, { label, title, description }),
|
|
1995
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Center, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(SdTimeline, { items }) })
|
|
1708
1996
|
] })) });
|
|
1709
1997
|
}
|
|
1710
1998
|
|
|
1711
1999
|
// ui/organism/StepsSection.tsx
|
|
1712
2000
|
var import_core32 = require("@mantine/core");
|
|
1713
|
-
var
|
|
2001
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1714
2002
|
function SdStepsSection(_a4) {
|
|
1715
2003
|
var _b = _a4, {
|
|
1716
2004
|
label,
|
|
@@ -1725,17 +2013,17 @@ function SdStepsSection(_a4) {
|
|
|
1725
2013
|
"items",
|
|
1726
2014
|
"py"
|
|
1727
2015
|
]);
|
|
1728
|
-
return /* @__PURE__ */ (0,
|
|
1729
|
-
(label || title || description) && /* @__PURE__ */ (0,
|
|
1730
|
-
/* @__PURE__ */ (0,
|
|
2016
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SdContainer, __spreadProps(__spreadValues({ py }, boxProps), { children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core32.Stack, { gap: "xl", children: [
|
|
2017
|
+
(label || title || description) && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SdTextBox.Section, { label, title, description }),
|
|
2018
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SdSteps.Bubble, { items })
|
|
1731
2019
|
] }) }));
|
|
1732
2020
|
}
|
|
1733
2021
|
|
|
1734
2022
|
// ui/organism/ErrorView.tsx
|
|
1735
2023
|
var import_core33 = require("@mantine/core");
|
|
1736
|
-
var
|
|
2024
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
1737
2025
|
function StatusCode({ code }) {
|
|
1738
|
-
return /* @__PURE__ */ (0,
|
|
2026
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
1739
2027
|
import_core33.Text,
|
|
1740
2028
|
{
|
|
1741
2029
|
fz: 160,
|
|
@@ -1749,15 +2037,15 @@ function StatusCode({ code }) {
|
|
|
1749
2037
|
);
|
|
1750
2038
|
}
|
|
1751
2039
|
function Page({ error, onReset, onHome }) {
|
|
1752
|
-
return /* @__PURE__ */ (0,
|
|
1753
|
-
/* @__PURE__ */ (0,
|
|
1754
|
-
/* @__PURE__ */ (0,
|
|
1755
|
-
/* @__PURE__ */ (0,
|
|
1756
|
-
/* @__PURE__ */ (0,
|
|
2040
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Center, { mih: "60vh", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Stack, { align: "center", gap: "lg", ta: "center", children: [
|
|
2041
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(StatusCode, { code: "500" }),
|
|
2042
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Stack, { gap: "sm", align: "center", children: [
|
|
2043
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdTitle.Section, { children: "\uC11C\uBC84\uC5D0\uC11C \uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4" }),
|
|
2044
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdText.Body, { maw: 480, children: "\uC608\uAE30\uCE58 \uC54A\uC740 \uC624\uB958\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4. \uC7A0\uC2DC \uD6C4 \uB2E4\uC2DC \uC2DC\uB3C4\uD574 \uC8FC\uC138\uC694." })
|
|
1757
2045
|
] }),
|
|
1758
|
-
/* @__PURE__ */ (0,
|
|
1759
|
-
/* @__PURE__ */ (0,
|
|
1760
|
-
onHome && /* @__PURE__ */ (0,
|
|
2046
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Group, { gap: "sm", justify: "center", children: [
|
|
2047
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdButton.Primary, { onClick: onReset, children: "\uB2E4\uC2DC \uC2DC\uB3C4" }),
|
|
2048
|
+
onHome && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdButton.Ghost, { onClick: onHome, children: "\uD648\uC73C\uB85C" })
|
|
1761
2049
|
] })
|
|
1762
2050
|
] }) }) });
|
|
1763
2051
|
}
|
|
@@ -1769,15 +2057,15 @@ function NotFound({
|
|
|
1769
2057
|
},
|
|
1770
2058
|
onBack = () => window.history.back()
|
|
1771
2059
|
}) {
|
|
1772
|
-
return /* @__PURE__ */ (0,
|
|
1773
|
-
/* @__PURE__ */ (0,
|
|
1774
|
-
/* @__PURE__ */ (0,
|
|
1775
|
-
/* @__PURE__ */ (0,
|
|
1776
|
-
/* @__PURE__ */ (0,
|
|
2060
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Center, { mih: "60vh", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Stack, { align: "center", gap: "lg", ta: "center", children: [
|
|
2061
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(StatusCode, { code: "404" }),
|
|
2062
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Stack, { gap: "sm", align: "center", children: [
|
|
2063
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdTitle.Section, { children: title }),
|
|
2064
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdText.Body, { maw: 480, children: description })
|
|
1777
2065
|
] }),
|
|
1778
|
-
/* @__PURE__ */ (0,
|
|
1779
|
-
onHome && /* @__PURE__ */ (0,
|
|
1780
|
-
onBack && /* @__PURE__ */ (0,
|
|
2066
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Group, { gap: "sm", justify: "center", children: [
|
|
2067
|
+
onHome && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdButton.Primary, { onClick: onHome, children: "\uD648\uC73C\uB85C" }),
|
|
2068
|
+
onBack && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SdButton.Ghost, { onClick: onBack, children: "\uB4A4\uB85C \uAC00\uAE30" })
|
|
1781
2069
|
] })
|
|
1782
2070
|
] }) }) });
|
|
1783
2071
|
}
|
|
@@ -1790,177 +2078,376 @@ var SdErrorView = {
|
|
|
1790
2078
|
var SdErrorViewPage = SdErrorView.Page;
|
|
1791
2079
|
var SdErrorViewNotFound = SdErrorView.NotFound;
|
|
1792
2080
|
|
|
1793
|
-
// ui/
|
|
2081
|
+
// ui/organism/LoginView.tsx
|
|
1794
2082
|
var import_core34 = require("@mantine/core");
|
|
1795
|
-
var
|
|
2083
|
+
var import_icons_react8 = require("@tabler/icons-react");
|
|
2084
|
+
|
|
2085
|
+
// ui/surface.ts
|
|
2086
|
+
var brandSurface = {
|
|
2087
|
+
background: `
|
|
2088
|
+
radial-gradient(90% 120% at 12% 0%, var(--mantine-color-primary-7) 0%, transparent 58%),
|
|
2089
|
+
radial-gradient(70% 100% at 100% 100%, var(--mantine-color-primary-9) 0%, transparent 55%),
|
|
2090
|
+
var(--mantine-color-slate-9)`
|
|
2091
|
+
};
|
|
2092
|
+
var brandDotTexture = {
|
|
2093
|
+
backgroundImage: "radial-gradient(rgba(255,255,255,0.10) 1px, transparent 1px)",
|
|
2094
|
+
backgroundSize: "18px 18px",
|
|
2095
|
+
maskImage: "linear-gradient(180deg, rgba(0,0,0,0.9) 0%, transparent 70%)",
|
|
2096
|
+
WebkitMaskImage: "linear-gradient(180deg, rgba(0,0,0,0.9) 0%, transparent 70%)",
|
|
2097
|
+
pointerEvents: "none"
|
|
2098
|
+
};
|
|
2099
|
+
|
|
2100
|
+
// ui/organism/LoginView.tsx
|
|
2101
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
2102
|
+
var SOCIAL_META = {
|
|
2103
|
+
google: { Icon: import_icons_react8.IconBrandGoogle, label: "\uAD6C\uAE00\uB85C \uB85C\uADF8\uC778" },
|
|
2104
|
+
kakao: { Icon: import_icons_react8.IconBrandKakaoTalk, label: "\uCE74\uCE74\uC624\uB85C \uB85C\uADF8\uC778" },
|
|
2105
|
+
naver: { Icon: import_icons_react8.IconCircleLetterN, label: "\uB124\uC774\uBC84\uB85C \uB85C\uADF8\uC778" },
|
|
2106
|
+
apple: { Icon: import_icons_react8.IconBrandApple, label: "\uC560\uD50C\uB85C \uB85C\uADF8\uC778" },
|
|
2107
|
+
github: { Icon: import_icons_react8.IconBrandGithub, label: "\uAE43\uD5C8\uBE0C\uB85C \uB85C\uADF8\uC778" }
|
|
2108
|
+
};
|
|
2109
|
+
function LoginForm({
|
|
2110
|
+
onSubmit,
|
|
2111
|
+
loading,
|
|
2112
|
+
error,
|
|
2113
|
+
submitLabel = "\uB85C\uADF8\uC778",
|
|
2114
|
+
withRemember = true,
|
|
2115
|
+
findPasswordHref,
|
|
2116
|
+
signUpHref,
|
|
2117
|
+
socials,
|
|
2118
|
+
children
|
|
2119
|
+
}) {
|
|
2120
|
+
function handleSubmit(event) {
|
|
2121
|
+
var _a4, _b;
|
|
2122
|
+
event.preventDefault();
|
|
2123
|
+
const data = new FormData(event.currentTarget);
|
|
2124
|
+
onSubmit == null ? void 0 : onSubmit({
|
|
2125
|
+
email: String((_a4 = data.get("email")) != null ? _a4 : ""),
|
|
2126
|
+
password: String((_b = data.get("password")) != null ? _b : ""),
|
|
2127
|
+
remember: data.get("remember") === "on"
|
|
2128
|
+
});
|
|
2129
|
+
}
|
|
2130
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("form", { onSubmit: handleSubmit, noValidate: true, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "md", children: [
|
|
2131
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SdText.Error, { children: error }),
|
|
2132
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2133
|
+
SdInput.Email,
|
|
2134
|
+
{
|
|
2135
|
+
name: "email",
|
|
2136
|
+
label: "\uC774\uBA54\uC77C",
|
|
2137
|
+
placeholder: "name@example.com",
|
|
2138
|
+
autoComplete: "email",
|
|
2139
|
+
required: true
|
|
2140
|
+
}
|
|
2141
|
+
),
|
|
2142
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2143
|
+
SdInput.Password,
|
|
2144
|
+
{
|
|
2145
|
+
name: "password",
|
|
2146
|
+
label: "\uBE44\uBC00\uBC88\uD638",
|
|
2147
|
+
placeholder: "\uBE44\uBC00\uBC88\uD638\uB97C \uC785\uB825\uD558\uC138\uC694",
|
|
2148
|
+
autoComplete: "current-password",
|
|
2149
|
+
required: true
|
|
2150
|
+
}
|
|
2151
|
+
),
|
|
2152
|
+
(withRemember || findPasswordHref) && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Group, { justify: "space-between", align: "center", wrap: "nowrap", children: [
|
|
2153
|
+
withRemember ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Checkbox, { name: "remember", size: "xs", label: "\uC790\uB3D9 \uB85C\uADF8\uC778" }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", {}),
|
|
2154
|
+
findPasswordHref && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SdLink.Sub, { href: findPasswordHref, children: "\uBE44\uBC00\uBC88\uD638\uB97C \uC78A\uC73C\uC168\uB098\uC694?" })
|
|
2155
|
+
] }),
|
|
2156
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2157
|
+
SdButton.Primary,
|
|
2158
|
+
{
|
|
2159
|
+
type: "submit",
|
|
2160
|
+
fullWidth: true,
|
|
2161
|
+
loading,
|
|
2162
|
+
leftSection: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_icons_react8.IconLogin2, { size: 16 }),
|
|
2163
|
+
children: submitLabel
|
|
2164
|
+
}
|
|
2165
|
+
),
|
|
2166
|
+
socials && socials.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
|
|
2167
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Divider, { label: "\uB610\uB294", labelPosition: "center" }),
|
|
2168
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Stack, { gap: "xs", children: socials.map((social) => {
|
|
2169
|
+
var _a4;
|
|
2170
|
+
const { Icon, label } = SOCIAL_META[social.provider];
|
|
2171
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2172
|
+
SdButton.Outline,
|
|
2173
|
+
{
|
|
2174
|
+
color: "slate",
|
|
2175
|
+
fullWidth: true,
|
|
2176
|
+
type: "button",
|
|
2177
|
+
onClick: social.onClick,
|
|
2178
|
+
leftSection: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Icon, { size: 16 }),
|
|
2179
|
+
children: (_a4 = social.label) != null ? _a4 : label
|
|
2180
|
+
},
|
|
2181
|
+
social.provider
|
|
2182
|
+
);
|
|
2183
|
+
}) })
|
|
2184
|
+
] }),
|
|
2185
|
+
signUpHref && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Group, { gap: 6, justify: "center", children: [
|
|
2186
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SdText.Sub, { children: "\uC544\uC9C1 \uACC4\uC815\uC774 \uC5C6\uC73C\uC2E0\uAC00\uC694?" }),
|
|
2187
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SdLink.Sub, { href: signUpHref, c: "primary.6", children: "\uD68C\uC6D0\uAC00\uC785" })
|
|
2188
|
+
] }),
|
|
2189
|
+
children
|
|
2190
|
+
] }) });
|
|
2191
|
+
}
|
|
2192
|
+
function FormHeader({ title, description }) {
|
|
2193
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "lg", children: [
|
|
2194
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Logo, { size: "sm" }),
|
|
2195
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SdTextBox.Card, { title, description: description != null ? description : "" })
|
|
2196
|
+
] });
|
|
2197
|
+
}
|
|
2198
|
+
function Card7(_a4) {
|
|
2199
|
+
var _b = _a4, {
|
|
2200
|
+
title = "\uB85C\uADF8\uC778",
|
|
2201
|
+
description = "%c \uC11C\uBE44\uC2A4\uB97C \uC774\uC6A9\uD558\uB824\uBA74 \uB85C\uADF8\uC778\uD574 \uC8FC\uC138\uC694.",
|
|
2202
|
+
mih = "100svh"
|
|
2203
|
+
} = _b, formProps = __objRest(_b, [
|
|
2204
|
+
"title",
|
|
2205
|
+
"description",
|
|
2206
|
+
"mih"
|
|
2207
|
+
]);
|
|
2208
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Center, { mih, bg: "slate.0", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Paper, { w: "100%", maw: 420, p: { base: "lg", sm: "xl" }, radius: "lg", withBorder: true, shadow: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "xl", children: [
|
|
2209
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(FormHeader, { title, description }),
|
|
2210
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(LoginForm, __spreadValues({}, formProps))
|
|
2211
|
+
] }) }) });
|
|
2212
|
+
}
|
|
2213
|
+
function Split(_a4) {
|
|
2214
|
+
var _b = _a4, {
|
|
2215
|
+
title = "\uB85C\uADF8\uC778",
|
|
2216
|
+
description = "\uACC4\uC815 \uC815\uBCF4\uB97C \uC785\uB825\uD574 \uC8FC\uC138\uC694.",
|
|
2217
|
+
brandTitle = "%c",
|
|
2218
|
+
brandDescription = "\uD558\uB098\uC758 \uACC4\uC815\uC73C\uB85C \uBAA8\uB4E0 \uC11C\uBE44\uC2A4\uB97C \uC774\uC6A9\uD558\uC138\uC694.",
|
|
2219
|
+
mih = "100svh"
|
|
2220
|
+
} = _b, formProps = __objRest(_b, [
|
|
2221
|
+
"title",
|
|
2222
|
+
"description",
|
|
2223
|
+
"brandTitle",
|
|
2224
|
+
"brandDescription",
|
|
2225
|
+
"mih"
|
|
2226
|
+
]);
|
|
2227
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.SimpleGrid, { cols: { base: 1, md: 2 }, spacing: 0, mih, children: [
|
|
2228
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
2229
|
+
import_core34.Box,
|
|
2230
|
+
{
|
|
2231
|
+
visibleFrom: "md",
|
|
2232
|
+
pos: "relative",
|
|
2233
|
+
style: __spreadValues({ overflow: "hidden", display: "flex", alignItems: "flex-end" }, brandSurface),
|
|
2234
|
+
children: [
|
|
2235
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, { "aria-hidden": true, pos: "absolute", inset: 0, style: brandDotTexture }),
|
|
2236
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, { pos: "relative", p: 48, style: { zIndex: 1, width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2237
|
+
SdTextBox.Hero,
|
|
2238
|
+
{
|
|
2239
|
+
title: brandTitle,
|
|
2240
|
+
description: brandDescription,
|
|
2241
|
+
gap: "sm",
|
|
2242
|
+
maxDescWidth: 420,
|
|
2243
|
+
ta: "left",
|
|
2244
|
+
align: "flex-start"
|
|
2245
|
+
}
|
|
2246
|
+
) })
|
|
2247
|
+
]
|
|
2248
|
+
}
|
|
2249
|
+
),
|
|
2250
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Center, { p: { base: "md", sm: "xl" }, bg: "white", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "xl", w: "100%", maw: 400, children: [
|
|
2251
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(FormHeader, { title, description }),
|
|
2252
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(LoginForm, __spreadValues({}, formProps))
|
|
2253
|
+
] }) })
|
|
2254
|
+
] });
|
|
2255
|
+
}
|
|
2256
|
+
var SdLoginView = {
|
|
2257
|
+
/** 중앙 정렬 카드 — 기본 로그인 화면 */
|
|
2258
|
+
Card: Card7,
|
|
2259
|
+
/** 좌측 브랜드 패널 + 우측 폼 — 넓은 화면용 */
|
|
2260
|
+
Split
|
|
2261
|
+
};
|
|
2262
|
+
var SdLoginViewCard = SdLoginView.Card;
|
|
2263
|
+
var SdLoginViewSplit = SdLoginView.Split;
|
|
2264
|
+
|
|
2265
|
+
// ui/organism/Result.tsx
|
|
2266
|
+
var import_core35 = require("@mantine/core");
|
|
2267
|
+
var import_icons_react9 = require("@tabler/icons-react");
|
|
2268
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
2269
|
+
function ResultIcon({ color, Icon }) {
|
|
2270
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Center, { w: 88, h: 88, bg: `${color}.0`, style: { borderRadius: "50%" }, "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Icon, { size: 48, stroke: 1.5, color: `var(--mantine-color-${color}-6)` }) });
|
|
2271
|
+
}
|
|
2272
|
+
function createResult(defaults) {
|
|
2273
|
+
return function SdResult2({
|
|
2274
|
+
title = defaults.title,
|
|
2275
|
+
description,
|
|
2276
|
+
primaryAction,
|
|
2277
|
+
secondaryAction,
|
|
2278
|
+
children,
|
|
2279
|
+
mih = "60vh"
|
|
2280
|
+
}) {
|
|
2281
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Center, { mih, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(SdContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { align: "center", gap: "lg", ta: "center", children: [
|
|
2282
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ResultIcon, { color: defaults.color, Icon: defaults.Icon }),
|
|
2283
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { gap: "sm", align: "center", children: [
|
|
2284
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(SdTitle.Section, { children: title }),
|
|
2285
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(SdText.Body, { maw: 480, children: description })
|
|
2286
|
+
] }),
|
|
2287
|
+
children && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Box, { children }),
|
|
2288
|
+
(primaryAction || secondaryAction) && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Group, { gap: "sm", justify: "center", children: [
|
|
2289
|
+
primaryAction && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(SdButton.Primary, { onClick: primaryAction.onClick, children: primaryAction.label }),
|
|
2290
|
+
secondaryAction && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(SdButton.Ghost, { onClick: secondaryAction.onClick, children: secondaryAction.label })
|
|
2291
|
+
] })
|
|
2292
|
+
] }) }) });
|
|
2293
|
+
};
|
|
2294
|
+
}
|
|
2295
|
+
var SdResult = {
|
|
2296
|
+
/** 성공 — 가입 완료·결제 완료 등 */
|
|
2297
|
+
Success: createResult({
|
|
2298
|
+
color: "green",
|
|
2299
|
+
Icon: import_icons_react9.IconCircleCheck,
|
|
2300
|
+
title: "\uC644\uB8CC\uB418\uC5C8\uC2B5\uB2C8\uB2E4"
|
|
2301
|
+
}),
|
|
2302
|
+
/** 실패 — 결제 실패·처리 중 오류 등. 서버 오류·404는 SdErrorView를 쓴다. */
|
|
2303
|
+
Error: createResult({
|
|
2304
|
+
color: "red",
|
|
2305
|
+
Icon: import_icons_react9.IconCircleX,
|
|
2306
|
+
title: "\uBB38\uC81C\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4"
|
|
2307
|
+
})
|
|
2308
|
+
};
|
|
2309
|
+
var SdResultSuccess = SdResult.Success;
|
|
2310
|
+
var SdResultError = SdResult.Error;
|
|
2311
|
+
|
|
2312
|
+
// ui/template/MainLayout.tsx
|
|
2313
|
+
var import_core36 = require("@mantine/core");
|
|
2314
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
2315
|
+
var headers = {
|
|
2316
|
+
mega: SdHeader.Mega,
|
|
2317
|
+
simple: SdHeader.Simple
|
|
2318
|
+
};
|
|
1796
2319
|
function MainLayout({
|
|
1797
2320
|
children,
|
|
1798
2321
|
navItems,
|
|
1799
|
-
companyInfo
|
|
2322
|
+
companyInfo,
|
|
2323
|
+
loginFlag,
|
|
2324
|
+
headerVariant = "mega"
|
|
1800
2325
|
}) {
|
|
1801
|
-
|
|
1802
|
-
|
|
1803
|
-
/* @__PURE__ */ (0,
|
|
1804
|
-
/* @__PURE__ */ (0,
|
|
2326
|
+
const Header = headers[headerVariant];
|
|
2327
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core36.AppShell, { header: { height: 60 }, children: [
|
|
2328
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.AppShell.Header, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Header, { navItems, loginFlag }) }),
|
|
2329
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.AppShell.Main, { children }),
|
|
2330
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SdFooter, { company: companyInfo, navItems })
|
|
1805
2331
|
] });
|
|
1806
2332
|
}
|
|
1807
2333
|
|
|
1808
2334
|
// ui/template/PageLayout.tsx
|
|
1809
|
-
var
|
|
1810
|
-
var
|
|
2335
|
+
var import_core37 = require("@mantine/core");
|
|
2336
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2337
|
+
var HERO_MIN_H = "38svh";
|
|
2338
|
+
var HERO_PY = { base: 56, sm: 88 };
|
|
2339
|
+
var HERO_MAW = 680;
|
|
1811
2340
|
function Content({ children }) {
|
|
1812
|
-
return /* @__PURE__ */ (0,
|
|
2341
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(SdContainer, { py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Stack, { gap: "xl", children }) });
|
|
1813
2342
|
}
|
|
1814
2343
|
function LayoutGap() {
|
|
1815
|
-
return /* @__PURE__ */ (0,
|
|
2344
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Space, { h: 48 });
|
|
1816
2345
|
}
|
|
1817
2346
|
function Minimal({ label, title, description, children }) {
|
|
1818
|
-
return /* @__PURE__ */ (0,
|
|
1819
|
-
/* @__PURE__ */ (0,
|
|
1820
|
-
/* @__PURE__ */ (0,
|
|
2347
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(Plain2, { children: [
|
|
2348
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(SdTextBox.Section, { label, title, description: description != null ? description : "" }),
|
|
2349
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Divider, {}),
|
|
1821
2350
|
children
|
|
1822
|
-
] })
|
|
2351
|
+
] });
|
|
1823
2352
|
}
|
|
1824
2353
|
function Plain2({ children }) {
|
|
1825
|
-
return /* @__PURE__ */ (0,
|
|
1826
|
-
/* @__PURE__ */ (0,
|
|
1827
|
-
/* @__PURE__ */ (0,
|
|
2354
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_jsx_runtime39.Fragment, { children: [
|
|
2355
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(LayoutGap, {}),
|
|
2356
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Content, { children })
|
|
2357
|
+
] });
|
|
2358
|
+
}
|
|
2359
|
+
function HeroCopy({ label, title, description }) {
|
|
2360
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Stack, { gap: "md", maw: HERO_MAW, children: [
|
|
2361
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Group, { gap: "sm", align: "center", wrap: "nowrap", children: [
|
|
2362
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Box, { w: 28, h: 2, bg: "primary.3", style: { borderRadius: 2 } }),
|
|
2363
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(SdText.Eyebrow, { c: "primary.1", children: label })
|
|
2364
|
+
] }),
|
|
2365
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2366
|
+
SdTextBox.Hero,
|
|
2367
|
+
{
|
|
2368
|
+
title,
|
|
2369
|
+
description,
|
|
2370
|
+
gap: "sm",
|
|
2371
|
+
maxDescWidth: 560,
|
|
2372
|
+
ta: "left",
|
|
2373
|
+
align: "flex-start"
|
|
2374
|
+
}
|
|
2375
|
+
)
|
|
1828
2376
|
] });
|
|
1829
2377
|
}
|
|
1830
2378
|
function Image2({ image, label, title, description, children }) {
|
|
1831
|
-
return /* @__PURE__ */ (0,
|
|
1832
|
-
/* @__PURE__ */ (0,
|
|
1833
|
-
|
|
2379
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_jsx_runtime39.Fragment, { children: [
|
|
2380
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
2381
|
+
import_core37.Box,
|
|
1834
2382
|
{
|
|
2383
|
+
pos: "relative",
|
|
1835
2384
|
style: {
|
|
1836
|
-
|
|
1837
|
-
minHeight: "30svh",
|
|
2385
|
+
minHeight: HERO_MIN_H,
|
|
1838
2386
|
display: "flex",
|
|
1839
|
-
alignItems: "
|
|
2387
|
+
alignItems: "flex-end",
|
|
1840
2388
|
backgroundImage: image ? `url(${image})` : void 0,
|
|
1841
2389
|
backgroundSize: "cover",
|
|
1842
2390
|
backgroundPosition: "center",
|
|
1843
2391
|
backgroundColor: "var(--mantine-color-slate-9)"
|
|
1844
2392
|
},
|
|
1845
2393
|
children: [
|
|
1846
|
-
/* @__PURE__ */ (0,
|
|
1847
|
-
|
|
2394
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2395
|
+
import_core37.Box,
|
|
1848
2396
|
{
|
|
2397
|
+
"aria-hidden": true,
|
|
2398
|
+
pos: "absolute",
|
|
2399
|
+
inset: 0,
|
|
1849
2400
|
style: {
|
|
1850
|
-
|
|
1851
|
-
inset: 0,
|
|
1852
|
-
background: "rgba(0, 0, 0, 0.55)"
|
|
2401
|
+
background: "linear-gradient(180deg, rgba(15,23,42,0.25) 0%, rgba(15,23,42,0.72) 62%, rgba(15,23,42,0.94) 100%)"
|
|
1853
2402
|
}
|
|
1854
2403
|
}
|
|
1855
2404
|
),
|
|
1856
|
-
/* @__PURE__ */ (0,
|
|
1857
|
-
import_core35.Box,
|
|
1858
|
-
{
|
|
1859
|
-
py: 48,
|
|
1860
|
-
px: 40,
|
|
1861
|
-
maw: 420,
|
|
1862
|
-
style: {
|
|
1863
|
-
backdropFilter: "blur(24px)",
|
|
1864
|
-
WebkitBackdropFilter: "blur(24px)",
|
|
1865
|
-
background: "rgba(255,255,255,0.10)",
|
|
1866
|
-
borderRadius: "var(--mantine-radius-md)",
|
|
1867
|
-
border: "1px solid rgba(255,255,255,0.18)"
|
|
1868
|
-
},
|
|
1869
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1870
|
-
SdTextBox.Hero,
|
|
1871
|
-
{
|
|
1872
|
-
label,
|
|
1873
|
-
title,
|
|
1874
|
-
description,
|
|
1875
|
-
ta: "left",
|
|
1876
|
-
align: "flex-start"
|
|
1877
|
-
}
|
|
1878
|
-
)
|
|
1879
|
-
}
|
|
1880
|
-
) })
|
|
2405
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(SdContainer, { pos: "relative", py: HERO_PY, style: { zIndex: 1, width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(HeroCopy, { label, title, description }) })
|
|
1881
2406
|
]
|
|
1882
2407
|
}
|
|
1883
2408
|
),
|
|
1884
|
-
/* @__PURE__ */ (0,
|
|
2409
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Content, { children })
|
|
1885
2410
|
] });
|
|
1886
2411
|
}
|
|
1887
2412
|
function Brand({ label, title, description, children }) {
|
|
1888
|
-
return /* @__PURE__ */ (0,
|
|
1889
|
-
/* @__PURE__ */ (0,
|
|
1890
|
-
|
|
2413
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_jsx_runtime39.Fragment, { children: [
|
|
2414
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
2415
|
+
import_core37.Box,
|
|
1891
2416
|
{
|
|
1892
|
-
|
|
1893
|
-
|
|
1894
|
-
minHeight:
|
|
2417
|
+
pos: "relative",
|
|
2418
|
+
style: __spreadValues({
|
|
2419
|
+
minHeight: HERO_MIN_H,
|
|
1895
2420
|
display: "flex",
|
|
1896
|
-
alignItems: "
|
|
2421
|
+
alignItems: "flex-end",
|
|
1897
2422
|
overflow: "hidden",
|
|
1898
|
-
|
|
1899
|
-
},
|
|
2423
|
+
borderBottom: "1px solid var(--mantine-color-slate-8)"
|
|
2424
|
+
}, brandSurface),
|
|
1900
2425
|
children: [
|
|
1901
|
-
/* @__PURE__ */ (0,
|
|
1902
|
-
|
|
1903
|
-
{
|
|
1904
|
-
style: {
|
|
1905
|
-
position: "absolute",
|
|
1906
|
-
top: -80,
|
|
1907
|
-
right: -80,
|
|
1908
|
-
width: 360,
|
|
1909
|
-
height: 360,
|
|
1910
|
-
borderRadius: "50%",
|
|
1911
|
-
background: "rgba(255,255,255,0.06)",
|
|
1912
|
-
pointerEvents: "none"
|
|
1913
|
-
}
|
|
1914
|
-
}
|
|
1915
|
-
),
|
|
1916
|
-
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1917
|
-
import_core35.Box,
|
|
1918
|
-
{
|
|
1919
|
-
style: {
|
|
1920
|
-
position: "absolute",
|
|
1921
|
-
bottom: -60,
|
|
1922
|
-
left: -60,
|
|
1923
|
-
width: 240,
|
|
1924
|
-
height: 240,
|
|
1925
|
-
borderRadius: "50%",
|
|
1926
|
-
background: "rgba(255,255,255,0.04)",
|
|
1927
|
-
pointerEvents: "none"
|
|
1928
|
-
}
|
|
1929
|
-
}
|
|
1930
|
-
),
|
|
1931
|
-
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SdContainer, { style: { position: "relative", zIndex: 1, width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1932
|
-
SdTextBox.Hero,
|
|
1933
|
-
{
|
|
1934
|
-
label,
|
|
1935
|
-
title,
|
|
1936
|
-
description,
|
|
1937
|
-
ta: "center",
|
|
1938
|
-
align: "center",
|
|
1939
|
-
maw: 640,
|
|
1940
|
-
mx: "auto",
|
|
1941
|
-
pt: 80,
|
|
1942
|
-
pb: 64
|
|
1943
|
-
}
|
|
1944
|
-
) })
|
|
2426
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Box, { "aria-hidden": true, pos: "absolute", inset: 0, style: brandDotTexture }),
|
|
2427
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(SdContainer, { pos: "relative", py: HERO_PY, style: { zIndex: 1, width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(HeroCopy, { label, title, description }) })
|
|
1945
2428
|
]
|
|
1946
2429
|
}
|
|
1947
2430
|
),
|
|
1948
|
-
/* @__PURE__ */ (0,
|
|
2431
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Content, { children })
|
|
1949
2432
|
] });
|
|
1950
2433
|
}
|
|
1951
2434
|
var PageLayout = {
|
|
1952
|
-
/**
|
|
2435
|
+
/** 사진 배경 + 하단 스크림 + 좌측 정렬 텍스트 */
|
|
1953
2436
|
Image: Image2,
|
|
1954
2437
|
/** SdTextBox.Section 타이틀 + Plain 컨테이너 */
|
|
1955
2438
|
Minimal,
|
|
1956
|
-
/** primary
|
|
2439
|
+
/** slate 바탕 + primary 라이트 + 도트 텍스처 */
|
|
1957
2440
|
Brand,
|
|
1958
2441
|
/** 히어로 없이 SdContainer + py="xl" 만 */
|
|
1959
2442
|
Plain: Plain2
|
|
1960
2443
|
};
|
|
2444
|
+
var PageLayoutImage = PageLayout.Image;
|
|
2445
|
+
var PageLayoutMinimal = PageLayout.Minimal;
|
|
2446
|
+
var PageLayoutBrand = PageLayout.Brand;
|
|
2447
|
+
var PageLayoutPlain = PageLayout.Plain;
|
|
1961
2448
|
|
|
1962
2449
|
// ui/theme.ts
|
|
1963
|
-
var
|
|
2450
|
+
var import_core38 = require("@mantine/core");
|
|
1964
2451
|
var primary = [
|
|
1965
2452
|
"#e7f0fb",
|
|
1966
2453
|
"#c8dcf4",
|
|
@@ -2010,33 +2497,75 @@ var slate = [
|
|
|
2010
2497
|
"#0f172a"
|
|
2011
2498
|
// 9 slate-900
|
|
2012
2499
|
];
|
|
2013
|
-
var
|
|
2014
|
-
"#
|
|
2015
|
-
|
|
2016
|
-
"#
|
|
2017
|
-
|
|
2018
|
-
"#
|
|
2019
|
-
|
|
2020
|
-
"#
|
|
2021
|
-
|
|
2022
|
-
"#
|
|
2023
|
-
|
|
2500
|
+
var red = [
|
|
2501
|
+
"#fef2f2",
|
|
2502
|
+
// 0 red-50
|
|
2503
|
+
"#fee2e2",
|
|
2504
|
+
// 1 red-100
|
|
2505
|
+
"#fecaca",
|
|
2506
|
+
// 2 red-200
|
|
2507
|
+
"#fca5a5",
|
|
2508
|
+
// 3 red-300
|
|
2509
|
+
"#f87171",
|
|
2510
|
+
// 4 red-400
|
|
2511
|
+
"#ef4444",
|
|
2512
|
+
// 5 red-500
|
|
2513
|
+
"#dc2626",
|
|
2514
|
+
// 6 red-600
|
|
2515
|
+
"#b91c1c",
|
|
2516
|
+
// 7 red-700
|
|
2517
|
+
"#991b1b",
|
|
2518
|
+
// 8 red-800
|
|
2519
|
+
"#7f1d1d"
|
|
2520
|
+
// 9 red-900
|
|
2521
|
+
];
|
|
2522
|
+
var green = [
|
|
2523
|
+
"#f0fdf4",
|
|
2524
|
+
// 0 green-50
|
|
2525
|
+
"#dcfce7",
|
|
2526
|
+
// 1 green-100
|
|
2527
|
+
"#bbf7d0",
|
|
2528
|
+
// 2 green-200
|
|
2529
|
+
"#86efac",
|
|
2530
|
+
// 3 green-300
|
|
2531
|
+
"#4ade80",
|
|
2532
|
+
// 4 green-400
|
|
2533
|
+
"#22c55e",
|
|
2534
|
+
// 5 green-500
|
|
2535
|
+
"#16a34a",
|
|
2536
|
+
// 6 green-600
|
|
2537
|
+
"#15803d",
|
|
2538
|
+
// 7 green-700
|
|
2539
|
+
"#166534",
|
|
2540
|
+
// 8 green-800
|
|
2541
|
+
"#14532d"
|
|
2542
|
+
// 9 green-900
|
|
2024
2543
|
];
|
|
2025
|
-
var
|
|
2026
|
-
"#
|
|
2027
|
-
|
|
2028
|
-
"#
|
|
2029
|
-
|
|
2030
|
-
"#
|
|
2031
|
-
|
|
2032
|
-
"#
|
|
2033
|
-
|
|
2034
|
-
"#
|
|
2035
|
-
|
|
2544
|
+
var amber = [
|
|
2545
|
+
"#fffbeb",
|
|
2546
|
+
// 0 amber-50
|
|
2547
|
+
"#fef3c7",
|
|
2548
|
+
// 1 amber-100
|
|
2549
|
+
"#fde68a",
|
|
2550
|
+
// 2 amber-200
|
|
2551
|
+
"#fcd34d",
|
|
2552
|
+
// 3 amber-300
|
|
2553
|
+
"#fbbf24",
|
|
2554
|
+
// 4 amber-400
|
|
2555
|
+
"#f59e0b",
|
|
2556
|
+
// 5 amber-500
|
|
2557
|
+
"#d97706",
|
|
2558
|
+
// 6 amber-600
|
|
2559
|
+
"#b45309",
|
|
2560
|
+
// 7 amber-700
|
|
2561
|
+
"#92400e",
|
|
2562
|
+
// 8 amber-800
|
|
2563
|
+
"#78350f"
|
|
2564
|
+
// 9 amber-900
|
|
2036
2565
|
];
|
|
2037
|
-
var theme = (0,
|
|
2566
|
+
var theme = (0, import_core38.createTheme)({
|
|
2038
2567
|
/* ---- Color ---- */
|
|
2039
|
-
colors: { primary, secondary, slate,
|
|
2568
|
+
colors: { primary, secondary, slate, red, green, amber, dark: slate },
|
|
2040
2569
|
primaryColor: "primary",
|
|
2041
2570
|
primaryShade: { light: 6, dark: 5 },
|
|
2042
2571
|
/* ---- Type ---- */
|
|
@@ -2046,20 +2575,20 @@ var theme = (0, import_core36.createTheme)({
|
|
|
2046
2575
|
fontFamily: "'Noto Sans KR', ui-sans-serif, system-ui, sans-serif",
|
|
2047
2576
|
fontWeight: "700",
|
|
2048
2577
|
sizes: {
|
|
2049
|
-
h1: { fontSize: (0,
|
|
2050
|
-
h2: { fontSize: (0,
|
|
2051
|
-
h3: { fontSize: (0,
|
|
2052
|
-
h4: { fontSize: (0,
|
|
2053
|
-
h5: { fontSize: (0,
|
|
2054
|
-
h6: { fontSize: (0,
|
|
2578
|
+
h1: { fontSize: (0, import_core38.rem)(48), lineHeight: "1.1", fontWeight: "900" },
|
|
2579
|
+
h2: { fontSize: (0, import_core38.rem)(36), lineHeight: "1.1", fontWeight: "900" },
|
|
2580
|
+
h3: { fontSize: (0, import_core38.rem)(28), lineHeight: "1.15", fontWeight: "700" },
|
|
2581
|
+
h4: { fontSize: (0, import_core38.rem)(20), lineHeight: "1.3", fontWeight: "700" },
|
|
2582
|
+
h5: { fontSize: (0, import_core38.rem)(16), lineHeight: "1.4", fontWeight: "700" },
|
|
2583
|
+
h6: { fontSize: (0, import_core38.rem)(14), lineHeight: "1.4", fontWeight: "700" }
|
|
2055
2584
|
}
|
|
2056
2585
|
},
|
|
2057
2586
|
fontSizes: {
|
|
2058
|
-
xs: (0,
|
|
2059
|
-
sm: (0,
|
|
2060
|
-
md: (0,
|
|
2061
|
-
lg: (0,
|
|
2062
|
-
xl: (0,
|
|
2587
|
+
xs: (0, import_core38.rem)(14),
|
|
2588
|
+
sm: (0, import_core38.rem)(16),
|
|
2589
|
+
md: (0, import_core38.rem)(18),
|
|
2590
|
+
lg: (0, import_core38.rem)(20),
|
|
2591
|
+
xl: (0, import_core38.rem)(22)
|
|
2063
2592
|
},
|
|
2064
2593
|
lineHeights: {
|
|
2065
2594
|
xs: "1.4",
|
|
@@ -2070,18 +2599,18 @@ var theme = (0, import_core36.createTheme)({
|
|
|
2070
2599
|
},
|
|
2071
2600
|
defaultRadius: "md",
|
|
2072
2601
|
radius: {
|
|
2073
|
-
xs: (0,
|
|
2074
|
-
sm: (0,
|
|
2075
|
-
md: (0,
|
|
2076
|
-
lg: (0,
|
|
2077
|
-
xl: (0,
|
|
2602
|
+
xs: (0, import_core38.rem)(6),
|
|
2603
|
+
sm: (0, import_core38.rem)(8),
|
|
2604
|
+
md: (0, import_core38.rem)(10),
|
|
2605
|
+
lg: (0, import_core38.rem)(14),
|
|
2606
|
+
xl: (0, import_core38.rem)(18)
|
|
2078
2607
|
},
|
|
2079
2608
|
spacing: {
|
|
2080
|
-
xs: (0,
|
|
2081
|
-
sm: (0,
|
|
2082
|
-
md: (0,
|
|
2083
|
-
lg: (0,
|
|
2084
|
-
xl: (0,
|
|
2609
|
+
xs: (0, import_core38.rem)(8),
|
|
2610
|
+
sm: (0, import_core38.rem)(12),
|
|
2611
|
+
md: (0, import_core38.rem)(16),
|
|
2612
|
+
lg: (0, import_core38.rem)(24),
|
|
2613
|
+
xl: (0, import_core38.rem)(32)
|
|
2085
2614
|
},
|
|
2086
2615
|
shadows: {
|
|
2087
2616
|
xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
|
|
@@ -2181,6 +2710,10 @@ var theme = (0, import_core36.createTheme)({
|
|
|
2181
2710
|
Logo,
|
|
2182
2711
|
MainLayout,
|
|
2183
2712
|
PageLayout,
|
|
2713
|
+
PageLayoutBrand,
|
|
2714
|
+
PageLayoutImage,
|
|
2715
|
+
PageLayoutMinimal,
|
|
2716
|
+
PageLayoutPlain,
|
|
2184
2717
|
SdBadge,
|
|
2185
2718
|
SdBadgeDefault,
|
|
2186
2719
|
SdBadgePrimary,
|
|
@@ -2216,17 +2749,40 @@ var theme = (0, import_core36.createTheme)({
|
|
|
2216
2749
|
SdFeatures,
|
|
2217
2750
|
SdFooter,
|
|
2218
2751
|
SdHeader,
|
|
2752
|
+
SdHeaderMega,
|
|
2753
|
+
SdHeaderSimple,
|
|
2219
2754
|
SdInput,
|
|
2755
|
+
SdInputAutocomplete,
|
|
2756
|
+
SdInputCheckbox,
|
|
2757
|
+
SdInputColor,
|
|
2758
|
+
SdInputDate,
|
|
2759
|
+
SdInputDateRange,
|
|
2220
2760
|
SdInputEmail,
|
|
2761
|
+
SdInputFile,
|
|
2762
|
+
SdInputJson,
|
|
2763
|
+
SdInputMultiSelect,
|
|
2764
|
+
SdInputNativeSelect,
|
|
2765
|
+
SdInputNumber,
|
|
2221
2766
|
SdInputPassword,
|
|
2767
|
+
SdInputPinCode,
|
|
2768
|
+
SdInputRadioGroup,
|
|
2769
|
+
SdInputRating,
|
|
2770
|
+
SdInputSegmented,
|
|
2222
2771
|
SdInputSelect,
|
|
2772
|
+
SdInputSlider,
|
|
2773
|
+
SdInputSwitch,
|
|
2774
|
+
SdInputTags,
|
|
2223
2775
|
SdInputText,
|
|
2224
2776
|
SdInputTextarea,
|
|
2777
|
+
SdInputTime,
|
|
2225
2778
|
SdLink,
|
|
2226
2779
|
SdLinkBody,
|
|
2227
2780
|
SdLinkHint,
|
|
2228
2781
|
SdLinkStrong,
|
|
2229
2782
|
SdLinkSub,
|
|
2783
|
+
SdLoginView,
|
|
2784
|
+
SdLoginViewCard,
|
|
2785
|
+
SdLoginViewSplit,
|
|
2230
2786
|
SdMap,
|
|
2231
2787
|
SdMapSingle,
|
|
2232
2788
|
SdMapTabs,
|
|
@@ -2239,6 +2795,9 @@ var theme = (0, import_core36.createTheme)({
|
|
|
2239
2795
|
SdQuote,
|
|
2240
2796
|
SdQuoteCard,
|
|
2241
2797
|
SdQuotePlain,
|
|
2798
|
+
SdResult,
|
|
2799
|
+
SdResultError,
|
|
2800
|
+
SdResultSuccess,
|
|
2242
2801
|
SdSkeleton,
|
|
2243
2802
|
SdSkeletonAvatar,
|
|
2244
2803
|
SdSkeletonCard,
|
|
@@ -2286,5 +2845,15 @@ var theme = (0, import_core36.createTheme)({
|
|
|
2286
2845
|
SdTitleDisplay,
|
|
2287
2846
|
SdTitleSection,
|
|
2288
2847
|
SdTitleSub,
|
|
2848
|
+
SdToast,
|
|
2849
|
+
SdToastClean,
|
|
2850
|
+
SdToastError,
|
|
2851
|
+
SdToastHide,
|
|
2852
|
+
SdToastInfo,
|
|
2853
|
+
SdToastLoading,
|
|
2854
|
+
SdToastProvider,
|
|
2855
|
+
SdToastSuccess,
|
|
2856
|
+
SdToastUpdate,
|
|
2857
|
+
SdToastWarning,
|
|
2289
2858
|
theme
|
|
2290
2859
|
});
|