From 88136fc867acaed16bafb06bbefeb264580ff986 Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:27:48 +0900 Subject: [PATCH 01/14] feat: add UI section --- app/(tmp)/_components/Section.tsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) create mode 100644 app/(tmp)/_components/Section.tsx diff --git a/app/(tmp)/_components/Section.tsx b/app/(tmp)/_components/Section.tsx new file mode 100644 index 0000000..53baf32 --- /dev/null +++ b/app/(tmp)/_components/Section.tsx @@ -0,0 +1,14 @@ +interface SectionProps extends React.PropsWithChildren { + title: string; +} + +const Section = ({ title, children }: SectionProps) => { + return ( +
+

{title}

+ {children} +
+ ); +}; + +export default Section; From a4121ad80e156a6a21ee46bd98fa674aae792305 Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:29:53 +0900 Subject: [PATCH 02/14] feat: add Input UI --- .eslintcache | 2 +- app/(tmp)/sections/InputSection.tsx | 23 +++ components/ui/input.tsx | 25 +++ package.json | 1 + pnpm-lock.yaml | 252 +++++++++++++++++++++++++++- 5 files changed, 298 insertions(+), 5 deletions(-) create mode 100644 app/(tmp)/sections/InputSection.tsx create mode 100644 components/ui/input.tsx diff --git a/.eslintcache b/.eslintcache index 62cf951..0187616 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"C:\\Users\\cwkim\\Desktop\\front\\123.ts":"1"},{"size":7,"mtime":1712162347118,"results":"2","hashOfConfig":"3"},{"filePath":"4","messages":"5","suppressedMessages":"6","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"tv8480","C:\\Users\\cwkim\\Desktop\\front\\123.ts",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1"},{"size":291,"mtime":1712165152820,"results":"2","hashOfConfig":"3"},{"filePath":"4","messages":"5","suppressedMessages":"6","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h","/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/sections/InputSection.tsx b/app/(tmp)/sections/InputSection.tsx new file mode 100644 index 0000000..e766aea --- /dev/null +++ b/app/(tmp)/sections/InputSection.tsx @@ -0,0 +1,23 @@ +import { Input } from '@/components/ui/input'; + +import Section from '@/app/(tmp)/_components/Section'; + +const InputSection = () => { + return ( +
+
+ + + + + + + + + +
+
+ ); +}; + +export default InputSection; diff --git a/components/ui/input.tsx b/components/ui/input.tsx new file mode 100644 index 0000000..d2008f0 --- /dev/null +++ b/components/ui/input.tsx @@ -0,0 +1,25 @@ +import * as React from 'react'; + +import { cn } from '@/lib/utils'; + +export interface InputProps + extends React.InputHTMLAttributes {} + +const Input = React.forwardRef( + ({ className, type, ...props }, ref) => { + return ( + + ); + } +); +Input.displayName = 'Input'; + +export { Input }; diff --git a/package.json b/package.json index f02f969..3ad8f00 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "mobile": "next dev -H 0.0.0.0 -p 3000" }, "dependencies": { + "@radix-ui/react-accordion": "^1.1.2", "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", "lucide-react": "^0.364.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a272ecd..37e343f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,6 +5,9 @@ settings: excludeLinksFromLockfile: false dependencies: + '@radix-ui/react-accordion': + specifier: ^1.1.2 + version: 1.1.2(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) class-variance-authority: specifier: ^0.7.0 version: 0.7.0 @@ -305,6 +308,251 @@ packages: requiresBuild: true optional: true + /@radix-ui/primitive@1.0.1: + resolution: {integrity: sha512-yQ8oGX2GVsEYMWGxcovu1uGWPCxV5BFfeeYxqPmuAzUyLT9qmaMXSAhXpb0WrspIeqYzdJpkh2vHModJPgRIaw==} + dependencies: + '@babel/runtime': 7.24.1 + dev: false + + /@radix-ui/react-accordion@1.1.2(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-fDG7jcoNKVjSK6yfmuAs0EnPDro0WMXIhMtXdTBWqEioVW206ku+4Lw07e+13lUkFkpoEQ2PdeMIAGpdqEAmDg==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-collapsible': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-collection': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-direction': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-id': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-collapsible@1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-UBmVDkmR6IvDsloHVN+3rtx4Mi5TFvylYXpluuv0f37dtaz3H99bp8No0LGXRigVpl3UAT4l9j6bIchh42S/Gg==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-id': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-presence': 1.0.1(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-collection@1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-3SzW+0PW7yBBoQlT8wNcGtaxaD0XSu0uLUFgrtHY08Acx05TaHaOmVLR73c0j/cqpDy53KBMO7s0dx2wmOIDIA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-slot': 1.0.2(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-compose-refs@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-fDSBgd44FKHa1FRMU59qBMPFcl2PZE+2nmqunj+BWFyYYjnhIDWL2ItDs3rrbJDQOtzt5nIebLCQc4QRfz6LJw==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-context@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-ebbrdFoYTcuZ0v4wG5tedGnp9tzcV8awzsxYph7gXUyvnNLuTIcCk1q17JEbnVhXAKG9oX3KtchwiMIAYp9NLg==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-direction@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-RXcvnXgyvYvBEOhCBuddKecVkoMiI10Jcm5cTI7abJRAHYfFxeu+FBQs/DvdxSYucxR5mna0dNsL6QFlds5TMA==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-id@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-tI7sT/kqYp8p96yGWY1OAnLHrqDgzHefRBKQ2YAkBS5ja7QLcZ9Z/uY7bEjPUatf8RomoXM8/1sMj1IJaE5UzQ==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-presence@1.0.1(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-primitive@1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-yi58uVyoAcK/Nq1inRY56ZSjKypBNKTa/1mcL8qdl6oJeEaDbOldlzrGn7P6Q3Id5d+SYNGc5AJgc4vGhjs5+g==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-slot': 1.0.2(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-slot@1.0.2(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-YeTpuq4deV+6DusvVUW4ivBgnkHwECUu0BiN43L5UCDFgdhsRUWAghhTF5MbvNTPzmiFOx90asDSUjWuCNapwg==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-use-callback-ref@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-D94LjX4Sp0xJFVaoQOd3OO9k7tpBYNOXdVhkltUbGv2Qb9OXdrg/CpsjlZv7ia14Sylv398LswWBVVu5nqKzAQ==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-use-controllable-state@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-Svl5GY5FQeN758fWKrjM6Qb7asvXeiZltlT4U2gVfl8Gx5UAv2sMR0LWo8yhsIZh2oQ0eFdZ59aoOOMV7b47VA==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-use-layout-effect@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + /@rushstack/eslint-patch@1.10.1: resolution: {integrity: sha512-S3Kq8e7LqxkA9s7HKLqXGTGck1uwis5vAXan3FnU5yw1Ec5hsSGnq4s/UCaSqABPOnOTg7zASLyst7+ohgWexg==} dev: true @@ -331,20 +579,17 @@ packages: /@types/prop-types@15.7.12: resolution: {integrity: sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==} - dev: true /@types/react-dom@18.2.23: resolution: {integrity: sha512-ZQ71wgGOTmDYpnav2knkjr3qXdAFu0vsk8Ci5w3pGAIdj7/kKAyn+VsQDhXsmzzzepAiI9leWMmubXz690AI/A==} dependencies: '@types/react': 18.2.74 - dev: true /@types/react@18.2.74: resolution: {integrity: sha512-9AEqNZZyBx8OdZpxzQlaFEVCSFUM2YXJH46yPOiOpm078k6ZLOCcuAzGum/zK8YBwY+dbahVNbHrbgrAwIRlqw==} dependencies: '@types/prop-types': 15.7.12 csstype: 3.1.3 - dev: true /@types/semver@7.5.8: resolution: {integrity: sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==} @@ -928,7 +1173,6 @@ packages: /csstype@3.1.3: resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==} - dev: true /damerau-levenshtein@1.0.8: resolution: {integrity: sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==} From 84ffa0ba15b3556ac8002a4a1f05398c7aa0010b Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:33:28 +0900 Subject: [PATCH 03/14] feat: add RadioGroup UI --- .eslintcache | 2 +- app/(tmp)/sections/RadioGroupSection.tsx | 27 ++++++ components/ui/radio-group.tsx | 44 +++++++++ package.json | 2 + pnpm-lock.yaml | 115 +++++++++++++++++++++++ 5 files changed, 189 insertions(+), 1 deletion(-) create mode 100644 app/(tmp)/sections/RadioGroupSection.tsx create mode 100644 components/ui/radio-group.tsx diff --git a/.eslintcache b/.eslintcache index 0187616..4fcdcf8 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1"},{"size":291,"mtime":1712165152820,"results":"2","hashOfConfig":"3"},{"filePath":"4","messages":"5","suppressedMessages":"6","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h","/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3"},{"size":291,"mtime":1712165152820,"results":"4","hashOfConfig":"5"},{"size":545,"mtime":1712165315426,"results":"6","hashOfConfig":"5"},{"size":824,"mtime":1712165357052,"results":"7","hashOfConfig":"5"},{"filePath":"8","messages":"9","suppressedMessages":"10","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"11","messages":"12","suppressedMessages":"13","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"14","messages":"15","suppressedMessages":"16","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/sections/RadioGroupSection.tsx b/app/(tmp)/sections/RadioGroupSection.tsx new file mode 100644 index 0000000..1138780 --- /dev/null +++ b/app/(tmp)/sections/RadioGroupSection.tsx @@ -0,0 +1,27 @@ +import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group'; +import { Label } from '@/components/ui/label'; + +import Section from '@/app/(tmp)/_components/Section'; + +const RadioGroupSection = () => { + return ( +
+ +
+ + +
+
+ + +
+
+ + +
+
+
+ ); +}; + +export default RadioGroupSection; diff --git a/components/ui/radio-group.tsx b/components/ui/radio-group.tsx new file mode 100644 index 0000000..acd55f3 --- /dev/null +++ b/components/ui/radio-group.tsx @@ -0,0 +1,44 @@ +'use client'; + +import * as React from 'react'; +import * as RadioGroupPrimitive from '@radix-ui/react-radio-group'; +import { Circle } from 'lucide-react'; + +import { cn } from '@/lib/utils'; + +const RadioGroup = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => { + return ( + + ); +}); +RadioGroup.displayName = RadioGroupPrimitive.Root.displayName; + +const RadioGroupItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => { + return ( + + + + + + ); +}); +RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName; + +export { RadioGroup, RadioGroupItem }; diff --git a/package.json b/package.json index 3ad8f00..91ee366 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,8 @@ }, "dependencies": { "@radix-ui/react-accordion": "^1.1.2", + "@radix-ui/react-label": "^2.0.2", + "@radix-ui/react-radio-group": "^1.1.3", "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", "lucide-react": "^0.364.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 37e343f..f838ca2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,6 +8,12 @@ dependencies: '@radix-ui/react-accordion': specifier: ^1.1.2 version: 1.1.2(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-label': + specifier: ^2.0.2 + version: 2.0.2(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-radio-group': + specifier: ^1.1.3 + version: 1.1.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) class-variance-authority: specifier: ^0.7.0 version: 0.7.0 @@ -452,6 +458,27 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-label@2.0.2(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-N5ehvlM7qoTLx7nWPodsPYPgMzA5WM8zZChQg8nyFJKnDO5WHdba1vv5/H6IO5LtJMfD2Q3wh1qHFGNtK0w3bQ==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /@radix-ui/react-presence@1.0.1(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==} peerDependencies: @@ -495,6 +522,65 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false + /@radix-ui/react-radio-group@1.1.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-x+yELayyefNeKeTx4fjK6j99Fs6c4qKm3aY38G3swQVTN6xMpsrbigC0uHs2L//g8q4qR7qOcww8430jJmi2ag==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-direction': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-presence': 1.0.1(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-roving-focus': 1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-previous': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-size': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-roving-focus@1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-2mUg5Mgcu001VkGy+FfzZyzbmuUWzgWkj3rvv4yu+mLw03+mTzbxZHvfcGyFp2b8EkQeMkpRQ5FiA2Vr2O6TeQ==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-collection': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-direction': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-id': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /@radix-ui/react-slot@1.0.2(@types/react@18.2.74)(react@18.2.0): resolution: {integrity: sha512-YeTpuq4deV+6DusvVUW4ivBgnkHwECUu0BiN43L5UCDFgdhsRUWAghhTF5MbvNTPzmiFOx90asDSUjWuCNapwg==} peerDependencies: @@ -553,6 +639,35 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-use-previous@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-cV5La9DPwiQ7S0gf/0qiD6YgNqM5Fk97Kdrlc5yBcrF3jyEZQwm7vYFqMo4IfeHgJXsRaMvLABFtd0OVEmZhDw==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-use-size@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-ibay+VqrgcaI6veAojjofPATwledXiSmX+C0KrBk/xgpX9rBzPV3OsfwlhQdUOFbh+LKQorLYT+xTXW9V8yd0g==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + /@rushstack/eslint-patch@1.10.1: resolution: {integrity: sha512-S3Kq8e7LqxkA9s7HKLqXGTGck1uwis5vAXan3FnU5yw1Ec5hsSGnq4s/UCaSqABPOnOTg7zASLyst7+ohgWexg==} dev: true From 3d8edf7a64de29ba7e546732fe643a9b0e9c4720 Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:33:48 +0900 Subject: [PATCH 04/14] feat: add Label UI --- .eslintcache | 2 +- app/(tmp)/sections/LabelSection.tsx | 15 +++++++++++++++ components/ui/label.tsx | 26 ++++++++++++++++++++++++++ 3 files changed, 42 insertions(+), 1 deletion(-) create mode 100644 app/(tmp)/sections/LabelSection.tsx create mode 100644 components/ui/label.tsx diff --git a/.eslintcache b/.eslintcache index 4fcdcf8..2c88b99 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3"},{"size":291,"mtime":1712165152820,"results":"4","hashOfConfig":"5"},{"size":545,"mtime":1712165315426,"results":"6","hashOfConfig":"5"},{"size":824,"mtime":1712165357052,"results":"7","hashOfConfig":"5"},{"filePath":"8","messages":"9","suppressedMessages":"10","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"11","messages":"12","suppressedMessages":"13","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"14","messages":"15","suppressedMessages":"16","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5"},{"size":291,"mtime":1712165152820,"results":"6","hashOfConfig":"7"},{"size":545,"mtime":1712165315426,"results":"8","hashOfConfig":"7"},{"size":824,"mtime":1712165357052,"results":"9","hashOfConfig":"7"},{"size":893,"mtime":1712165415411,"results":"10","hashOfConfig":"7"},{"size":1481,"mtime":1712165465230,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","suppressedMessages":"14","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"15","messages":"16","suppressedMessages":"17","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","suppressedMessages":"20","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"21","messages":"22","suppressedMessages":"23","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"24","messages":"25","suppressedMessages":"26","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/sections/LabelSection.tsx b/app/(tmp)/sections/LabelSection.tsx new file mode 100644 index 0000000..3a5cf80 --- /dev/null +++ b/app/(tmp)/sections/LabelSection.tsx @@ -0,0 +1,15 @@ +import { Label } from '@/components/ui/label'; +import { Input } from '@/components/ui/input'; + +import Section from '@/app/(tmp)/_components/Section'; + +const LabelSection = () => { + return ( +
+ + +
+ ); +}; + +export default LabelSection; diff --git a/components/ui/label.tsx b/components/ui/label.tsx new file mode 100644 index 0000000..1e24ec0 --- /dev/null +++ b/components/ui/label.tsx @@ -0,0 +1,26 @@ +'use client'; + +import * as React from 'react'; +import * as LabelPrimitive from '@radix-ui/react-label'; +import { cva, type VariantProps } from 'class-variance-authority'; + +import { cn } from '@/lib/utils'; + +const labelVariants = cva( + 'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70' +); + +const Label = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps +>(({ className, ...props }, ref) => ( + +)); +Label.displayName = LabelPrimitive.Root.displayName; + +export { Label }; From 60482a073481ac9c29167424164edc206adb52cd Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:36:04 +0900 Subject: [PATCH 05/14] feat: add accordion UI --- .eslintcache | 2 +- app/(tmp)/sections/AccordionSection.tsx | 54 +++++++++++++++++++++++ components/ui/accordion.tsx | 58 +++++++++++++++++++++++++ 3 files changed, 113 insertions(+), 1 deletion(-) create mode 100644 app/(tmp)/sections/AccordionSection.tsx create mode 100644 components/ui/accordion.tsx diff --git a/.eslintcache b/.eslintcache index 2c88b99..cb89cd4 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5"},{"size":291,"mtime":1712165152820,"results":"6","hashOfConfig":"7"},{"size":545,"mtime":1712165315426,"results":"8","hashOfConfig":"7"},{"size":824,"mtime":1712165357052,"results":"9","hashOfConfig":"7"},{"size":893,"mtime":1712165415411,"results":"10","hashOfConfig":"7"},{"size":1481,"mtime":1712165465230,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","suppressedMessages":"14","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"15","messages":"16","suppressedMessages":"17","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","suppressedMessages":"20","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"21","messages":"22","suppressedMessages":"23","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"24","messages":"25","suppressedMessages":"26","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7"},{"size":291,"mtime":1712165152820,"results":"8","hashOfConfig":"9"},{"size":545,"mtime":1712165315426,"results":"10","hashOfConfig":"9"},{"size":824,"mtime":1712165357052,"results":"11","hashOfConfig":"9"},{"size":893,"mtime":1712165415411,"results":"12","hashOfConfig":"9"},{"size":1481,"mtime":1712165465230,"results":"13","hashOfConfig":"9"},{"size":346,"mtime":1712165556358,"results":"14","hashOfConfig":"9"},{"size":724,"mtime":1712165482192,"results":"15","hashOfConfig":"9"},{"filePath":"16","messages":"17","suppressedMessages":"18","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"19","messages":"20","suppressedMessages":"21","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"22","messages":"23","suppressedMessages":"24","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"25","messages":"26","suppressedMessages":"27","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"28","messages":"29","suppressedMessages":"30","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"31","messages":"32","suppressedMessages":"33","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"34","messages":"35","suppressedMessages":"36","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/sections/AccordionSection.tsx b/app/(tmp)/sections/AccordionSection.tsx new file mode 100644 index 0000000..4130277 --- /dev/null +++ b/app/(tmp)/sections/AccordionSection.tsx @@ -0,0 +1,54 @@ +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from '@/components/ui/accordion'; + +import Section from '@/app/(tmp)/_components/Section'; + +const AccordionSection = () => { + return ( +
+ + {FAQS.map((faq, index) => ( + + {faq.question} + {faq.answer} + + ))} + +
+ ); +}; + +const FAQS = [ + { + question: 'What exactly is PlusAlpha?', + answer: + 'PlusAlpha is a specialized online platform designed to cater to the needs of students studying AP Calculus in the USA. It provides a comprehensive array of math problems, resources, and tools specifically tailored to enhance learning and preparation for the AP Calculus exam.', + }, + { + question: 'How can PlusAlpha benefit me as an AP Calculus student?', + answer: + 'PlusAlpha offers a dynamic learning environment where students can access a wide range of practice problems, quizzes, and instructional materials aligned with the AP Calculus curriculum. By utilizing our platform, students can strengthen their understanding of calculus concepts, improve problem-solving skills, and ultimately boost their performance on the AP exam.', + }, + { + question: + 'Is PlusAlpha suitable for all levels of AP Calculus proficiency?', + answer: + 'Yes, PlusAlpha caters to students at various skill levels, from beginners to advanced learners. Our platform features content ranging from fundamental calculus principles to challenging problem sets, ensuring that students of all abilities can find resources suited to their needs and level of mastery.', + }, + { + question: 'How does PlusAlpha differ from other math problem websites?', + answer: + 'Unlike generic math problem websites, PlusAlpha focuses specifically on the AP Calculus curriculum, providing targeted resources and practice materials that directly align with the content and format of the AP exam. Additionally, PlusAlpha offers features such as progress tracking, personalized recommendations, and interactive tools designed to optimize the learning experience for AP Calculus students.', + }, + { + question: 'Is PlusAlpha accessible on different devices and platforms?', + answer: + 'Yes, PlusAlpha is designed to be accessible across various devices and platforms, including desktop computers, laptops, tablets, and smartphones. Whether you prefer to study at home or on the go, you can access our platform conveniently through any internet-connected device, allowing for flexible and convenient learning opportunities.', + }, +]; + +export default AccordionSection; diff --git a/components/ui/accordion.tsx b/components/ui/accordion.tsx new file mode 100644 index 0000000..84bf2eb --- /dev/null +++ b/components/ui/accordion.tsx @@ -0,0 +1,58 @@ +'use client'; + +import * as React from 'react'; +import * as AccordionPrimitive from '@radix-ui/react-accordion'; +import { ChevronDown } from 'lucide-react'; + +import { cn } from '@/lib/utils'; + +const Accordion = AccordionPrimitive.Root; + +const AccordionItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +AccordionItem.displayName = 'AccordionItem'; + +const AccordionTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + svg]:rotate-180', + className + )} + {...props} + > + {children} + + + +)); +AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName; + +const AccordionContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + +
{children}
+
+)); + +AccordionContent.displayName = AccordionPrimitive.Content.displayName; + +export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }; From 6b3fdc4e57fd2ab455266084f64db8ecb9fc65d7 Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:37:12 +0900 Subject: [PATCH 06/14] feat: add button UI --- .eslintcache | 2 +- app/(tmp)/sections/ButtonSection.tsx | 68 ++++++++++++++++++++++++++++ components/ui/button.tsx | 56 +++++++++++++++++++++++ package.json | 1 + pnpm-lock.yaml | 3 ++ 5 files changed, 129 insertions(+), 1 deletion(-) create mode 100644 app/(tmp)/sections/ButtonSection.tsx create mode 100644 components/ui/button.tsx diff --git a/.eslintcache b/.eslintcache index cb89cd4..2dab539 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7"},{"size":291,"mtime":1712165152820,"results":"8","hashOfConfig":"9"},{"size":545,"mtime":1712165315426,"results":"10","hashOfConfig":"9"},{"size":824,"mtime":1712165357052,"results":"11","hashOfConfig":"9"},{"size":893,"mtime":1712165415411,"results":"12","hashOfConfig":"9"},{"size":1481,"mtime":1712165465230,"results":"13","hashOfConfig":"9"},{"size":346,"mtime":1712165556358,"results":"14","hashOfConfig":"9"},{"size":724,"mtime":1712165482192,"results":"15","hashOfConfig":"9"},{"filePath":"16","messages":"17","suppressedMessages":"18","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"19","messages":"20","suppressedMessages":"21","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"22","messages":"23","suppressedMessages":"24","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"25","messages":"26","suppressedMessages":"27","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"28","messages":"29","suppressedMessages":"30","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"31","messages":"32","suppressedMessages":"33","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"34","messages":"35","suppressedMessages":"36","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7","/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx":"8","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"9"},{"size":291,"mtime":1712165152820,"results":"10","hashOfConfig":"11"},{"size":545,"mtime":1712165315426,"results":"12","hashOfConfig":"11"},{"size":824,"mtime":1712165357052,"results":"13","hashOfConfig":"11"},{"size":893,"mtime":1712165415411,"results":"14","hashOfConfig":"11"},{"size":1481,"mtime":1712165465230,"results":"15","hashOfConfig":"11"},{"size":346,"mtime":1712165556358,"results":"16","hashOfConfig":"11"},{"size":724,"mtime":1712165482192,"results":"17","hashOfConfig":"11"},{"size":2848,"mtime":1712165756872,"results":"18","hashOfConfig":"11"},{"size":1991,"mtime":1712165343484,"results":"19","hashOfConfig":"11"},{"filePath":"20","messages":"21","suppressedMessages":"22","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"23","messages":"24","suppressedMessages":"25","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"26","messages":"27","suppressedMessages":"28","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"29","messages":"30","suppressedMessages":"31","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"32","messages":"33","suppressedMessages":"34","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"35","messages":"36","suppressedMessages":"37","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","suppressedMessages":"40","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"41","messages":"42","suppressedMessages":"43","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"44","messages":"45","suppressedMessages":"46","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/sections/ButtonSection.tsx b/app/(tmp)/sections/ButtonSection.tsx new file mode 100644 index 0000000..fd18fb4 --- /dev/null +++ b/app/(tmp)/sections/ButtonSection.tsx @@ -0,0 +1,68 @@ +import { Button } from '@/components/ui/button'; + +import Section from '@/app/(tmp)/_components/Section'; + +const ButtonSection = () => { + return ( +
+
+
+ + +
+ +
+ + +
+ + + + + + + + +
+ +
+
+ +
+
+ +
+
+ +
+ + +
+ +
+ + + + + + + + + + + + +
+
+ ); +}; + +export default ButtonSection; diff --git a/components/ui/button.tsx b/components/ui/button.tsx new file mode 100644 index 0000000..81e2e6e --- /dev/null +++ b/components/ui/button.tsx @@ -0,0 +1,56 @@ +import * as React from 'react'; +import { Slot } from '@radix-ui/react-slot'; +import { cva, type VariantProps } from 'class-variance-authority'; + +import { cn } from '@/lib/utils'; + +const buttonVariants = cva( + 'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50', + { + variants: { + variant: { + default: 'bg-primary text-primary-foreground hover:bg-primary/90', + destructive: + 'bg-destructive text-destructive-foreground hover:bg-destructive/90', + outline: + 'border border-input bg-background hover:bg-accent hover:text-accent-foreground', + secondary: + 'bg-secondary text-secondary-foreground hover:bg-secondary/80', + ghost: 'hover:bg-accent hover:text-accent-foreground', + link: 'text-primary underline-offset-4 hover:underline', + }, + size: { + default: 'h-10 px-4 py-2', + sm: 'h-9 rounded-md px-3', + lg: 'h-11 rounded-md px-8', + icon: 'h-10 w-10', + }, + }, + defaultVariants: { + variant: 'default', + size: 'default', + }, + } +); + +export interface ButtonProps + extends React.ButtonHTMLAttributes, + VariantProps { + asChild?: boolean; +} + +const Button = React.forwardRef( + ({ className, variant, size, asChild = false, ...props }, ref) => { + const Comp = asChild ? Slot : 'button'; + return ( + + ); + } +); +Button.displayName = 'Button'; + +export { Button, buttonVariants }; diff --git a/package.json b/package.json index 91ee366..470119d 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "@radix-ui/react-accordion": "^1.1.2", "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-radio-group": "^1.1.3", + "@radix-ui/react-slot": "^1.0.2", "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", "lucide-react": "^0.364.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f838ca2..25921ef 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -14,6 +14,9 @@ dependencies: '@radix-ui/react-radio-group': specifier: ^1.1.3 version: 1.1.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-slot': + specifier: ^1.0.2 + version: 1.0.2(@types/react@18.2.74)(react@18.2.0) class-variance-authority: specifier: ^0.7.0 version: 0.7.0 From 9a1ad2dd4eb4bccfc2ec932fd22e4017a2484781 Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:38:44 +0900 Subject: [PATCH 07/14] feat: add Card && Select UI --- .eslintcache | 2 +- app/(tmp)/sections/CardSection.tsx | 65 +++++ components/ui/card.tsx | 86 +++++++ components/ui/select.tsx | 160 ++++++++++++ package.json | 1 + pnpm-lock.yaml | 374 +++++++++++++++++++++++++++++ 6 files changed, 687 insertions(+), 1 deletion(-) create mode 100644 app/(tmp)/sections/CardSection.tsx create mode 100644 components/ui/card.tsx create mode 100644 components/ui/select.tsx diff --git a/.eslintcache b/.eslintcache index 2dab539..0bfd2f8 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7","/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx":"8","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"9"},{"size":291,"mtime":1712165152820,"results":"10","hashOfConfig":"11"},{"size":545,"mtime":1712165315426,"results":"12","hashOfConfig":"11"},{"size":824,"mtime":1712165357052,"results":"13","hashOfConfig":"11"},{"size":893,"mtime":1712165415411,"results":"14","hashOfConfig":"11"},{"size":1481,"mtime":1712165465230,"results":"15","hashOfConfig":"11"},{"size":346,"mtime":1712165556358,"results":"16","hashOfConfig":"11"},{"size":724,"mtime":1712165482192,"results":"17","hashOfConfig":"11"},{"size":2848,"mtime":1712165756872,"results":"18","hashOfConfig":"11"},{"size":1991,"mtime":1712165343484,"results":"19","hashOfConfig":"11"},{"filePath":"20","messages":"21","suppressedMessages":"22","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"23","messages":"24","suppressedMessages":"25","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"26","messages":"27","suppressedMessages":"28","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"29","messages":"30","suppressedMessages":"31","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"32","messages":"33","suppressedMessages":"34","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"35","messages":"36","suppressedMessages":"37","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","suppressedMessages":"40","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"41","messages":"42","suppressedMessages":"43","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"44","messages":"45","suppressedMessages":"46","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7","/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx":"8","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"9","/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx":"10","/Users/chanwookim/Desktop/running/components/ui/button.tsx":"11","/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx":"12","/Users/chanwookim/Desktop/running/components/ui/card.tsx":"13","/Users/chanwookim/Desktop/running/components/ui/select.tsx":"14"},{"size":291,"mtime":1712165152820,"results":"15","hashOfConfig":"16"},{"size":545,"mtime":1712165315426,"results":"17","hashOfConfig":"16"},{"size":824,"mtime":1712165357052,"results":"18","hashOfConfig":"16"},{"size":893,"mtime":1712165415411,"results":"19","hashOfConfig":"16"},{"size":1481,"mtime":1712165465230,"results":"20","hashOfConfig":"16"},{"size":346,"mtime":1712165556358,"results":"21","hashOfConfig":"16"},{"size":724,"mtime":1712165482192,"results":"22","hashOfConfig":"16"},{"size":2848,"mtime":1712165756872,"results":"23","hashOfConfig":"16"},{"size":1991,"mtime":1712165343484,"results":"24","hashOfConfig":"16"},{"size":2541,"mtime":1712165801418,"results":"25","hashOfConfig":"16"},{"size":1835,"mtime":1712165813850,"results":"26","hashOfConfig":"16"},{"size":2015,"mtime":1712165863378,"results":"27","hashOfConfig":"16"},{"size":1877,"mtime":1712165881969,"results":"28","hashOfConfig":"16"},{"size":5629,"mtime":1712165886878,"results":"29","hashOfConfig":"16"},{"filePath":"30","messages":"31","suppressedMessages":"32","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"33","messages":"34","suppressedMessages":"35","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","suppressedMessages":"38","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"39","messages":"40","suppressedMessages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"42","messages":"43","suppressedMessages":"44","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"45","messages":"46","suppressedMessages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"48","messages":"49","suppressedMessages":"50","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"51","messages":"52","suppressedMessages":"53","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"54","messages":"55","suppressedMessages":"56","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"57","messages":"58","suppressedMessages":"59","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","suppressedMessages":"62","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","suppressedMessages":"65","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","suppressedMessages":"68","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"69","messages":"70","suppressedMessages":"71","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/button.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/card.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/select.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/sections/CardSection.tsx b/app/(tmp)/sections/CardSection.tsx new file mode 100644 index 0000000..2882154 --- /dev/null +++ b/app/(tmp)/sections/CardSection.tsx @@ -0,0 +1,65 @@ +import { Button } from '@/components/ui/button'; +import { + Card, + CardContent, + CardDescription, + CardFooter, + CardHeader, + CardTitle, +} from '@/components/ui/card'; +import { Input } from '@/components/ui/input'; +import { Label } from '@/components/ui/label'; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from '@/components/ui/select'; + +import Section from '@/app/(tmp)/_components/Section'; + +const CardSection = () => { + return ( +
+ + + Create project + + Deploy your new project in one-click. + + + +
+
+
+ + +
+
+ + +
+
+
+
+ + + + +
+
+ ); +}; + +export default CardSection; diff --git a/components/ui/card.tsx b/components/ui/card.tsx new file mode 100644 index 0000000..fca7be4 --- /dev/null +++ b/components/ui/card.tsx @@ -0,0 +1,86 @@ +import * as React from 'react'; + +import { cn } from '@/lib/utils'; + +const Card = React.forwardRef< + HTMLDivElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +
+)); +Card.displayName = 'Card'; + +const CardHeader = React.forwardRef< + HTMLDivElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +
+)); +CardHeader.displayName = 'CardHeader'; + +const CardTitle = React.forwardRef< + HTMLParagraphElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +

+)); +CardTitle.displayName = 'CardTitle'; + +const CardDescription = React.forwardRef< + HTMLParagraphElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +

+)); +CardDescription.displayName = 'CardDescription'; + +const CardContent = React.forwardRef< + HTMLDivElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +

+)); +CardContent.displayName = 'CardContent'; + +const CardFooter = React.forwardRef< + HTMLDivElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +
+)); +CardFooter.displayName = 'CardFooter'; + +export { + Card, + CardHeader, + CardFooter, + CardTitle, + CardDescription, + CardContent, +}; diff --git a/components/ui/select.tsx b/components/ui/select.tsx new file mode 100644 index 0000000..9f3ef21 --- /dev/null +++ b/components/ui/select.tsx @@ -0,0 +1,160 @@ +'use client'; + +import * as React from 'react'; +import * as SelectPrimitive from '@radix-ui/react-select'; +import { Check, ChevronDown, ChevronUp } from 'lucide-react'; + +import { cn } from '@/lib/utils'; + +const Select = SelectPrimitive.Root; + +const SelectGroup = SelectPrimitive.Group; + +const SelectValue = SelectPrimitive.Value; + +const SelectTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + span]:line-clamp-1', + className + )} + {...props} + > + {children} + + + + +)); +SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; + +const SelectScrollUpButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)); +SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName; + +const SelectScrollDownButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)); +SelectScrollDownButton.displayName = + SelectPrimitive.ScrollDownButton.displayName; + +const SelectContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, position = 'popper', ...props }, ref) => ( + + + + + {children} + + + + +)); +SelectContent.displayName = SelectPrimitive.Content.displayName; + +const SelectLabel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SelectLabel.displayName = SelectPrimitive.Label.displayName; + +const SelectItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + + + + + + {children} + +)); +SelectItem.displayName = SelectPrimitive.Item.displayName; + +const SelectSeparator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SelectSeparator.displayName = SelectPrimitive.Separator.displayName; + +export { + Select, + SelectGroup, + SelectValue, + SelectTrigger, + SelectContent, + SelectLabel, + SelectItem, + SelectSeparator, + SelectScrollUpButton, + SelectScrollDownButton, +}; diff --git a/package.json b/package.json index 470119d..5d09865 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "@radix-ui/react-accordion": "^1.1.2", "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-radio-group": "^1.1.3", + "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 25921ef..dc73d62 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -14,6 +14,9 @@ dependencies: '@radix-ui/react-radio-group': specifier: ^1.1.3 version: 1.1.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-select': + specifier: ^2.0.0 + version: 2.0.0(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) '@radix-ui/react-slot': specifier: ^1.0.2 version: 1.0.2(@types/react@18.2.74)(react@18.2.0) @@ -146,6 +149,34 @@ packages: engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dev: true + /@floating-ui/core@1.6.0: + resolution: {integrity: sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g==} + dependencies: + '@floating-ui/utils': 0.2.1 + dev: false + + /@floating-ui/dom@1.6.3: + resolution: {integrity: sha512-RnDthu3mzPlQ31Ss/BTwQ1zjzIhr3lk1gZB1OC56h/1vEtaXkESrOqL5fQVMfXpwGtRwX+YsZBdyHtJMQnkArw==} + dependencies: + '@floating-ui/core': 1.6.0 + '@floating-ui/utils': 0.2.1 + dev: false + + /@floating-ui/react-dom@2.0.8(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-HOdqOt3R3OGeTKidaLvJKcgg75S6tibQ3Tif4eyd91QnIJWr0NLvoXFpJA/j8HqkFSL68GDca9AuyWEHlhyClw==} + peerDependencies: + react: '>=16.8.0' + react-dom: '>=16.8.0' + dependencies: + '@floating-ui/dom': 1.6.3 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@floating-ui/utils@0.2.1: + resolution: {integrity: sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==} + dev: false + /@humanwhocodes/config-array@0.11.14: resolution: {integrity: sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==} engines: {node: '>=10.10.0'} @@ -317,6 +348,12 @@ packages: requiresBuild: true optional: true + /@radix-ui/number@1.0.1: + resolution: {integrity: sha512-T5gIdVO2mmPW3NNhjNgEP3cqMXjXL9UbO0BzWcXfvdBs+BohbQxvd/K5hSVKmn9/lbTdsQVKbUcP5WLCwvUbBg==} + dependencies: + '@babel/runtime': 7.24.1 + dev: false + /@radix-ui/primitive@1.0.1: resolution: {integrity: sha512-yQ8oGX2GVsEYMWGxcovu1uGWPCxV5BFfeeYxqPmuAzUyLT9qmaMXSAhXpb0WrspIeqYzdJpkh2vHModJPgRIaw==} dependencies: @@ -352,6 +389,27 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false + /@radix-ui/react-arrow@1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-wSP+pHsB/jQRaL6voubsQ/ZlrGBHHrOjmBnr19hxYgtS0WvAFwZhK2WP/YY5yF9uKECCEEDGxuLxq1NBK51wFA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /@radix-ui/react-collapsible@1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-UBmVDkmR6IvDsloHVN+3rtx4Mi5TFvylYXpluuv0f37dtaz3H99bp8No0LGXRigVpl3UAT4l9j6bIchh42S/Gg==} peerDependencies: @@ -446,6 +504,68 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-dismissable-layer@1.0.5(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-aJeDjQhywg9LBu2t/At58hCvr7pEm0o2Ke1x33B+MhjNmmZ17sy4KImo0KPLgsnc/zN7GPdce8Cnn0SWvwZO7g==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-escape-keydown': 1.0.3(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-focus-guards@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-Rect2dWbQ8waGzhMavsIbmSVCgYxkXLxxR3ZvCX79JOglzdEy4JXMb98lq4hPxUbLr77nP0UOGf4rcMU+s1pUA==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + + /@radix-ui/react-focus-scope@1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-sL04Mgvf+FmyvZeYfNu1EPAaaxD+aw7cYeIB9L9Fvq8+urhltTRaEo5ysKOpHuKPclsZcSUMKlN05x4u+CINpA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /@radix-ui/react-id@1.0.1(@types/react@18.2.74)(react@18.2.0): resolution: {integrity: sha512-tI7sT/kqYp8p96yGWY1OAnLHrqDgzHefRBKQ2YAkBS5ja7QLcZ9Z/uY7bEjPUatf8RomoXM8/1sMj1IJaE5UzQ==} peerDependencies: @@ -482,6 +602,57 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false + /@radix-ui/react-popper@1.1.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-cKpopj/5RHZWjrbF2846jBNacjQVwkP068DfmgrNJXpvVWrOvlAmE9xSiy5OqeE+Gi8D9fP+oDhUnPqNMY8/5w==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@floating-ui/react-dom': 2.0.8(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-arrow': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-rect': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-size': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/rect': 1.0.1 + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/react-portal@1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-Qki+C/EuGUVCQTOTD5vzJzJuMUlewbzuKyUy+/iHM2uwGiru9gZeBJtHAPKAEkB5KWGi9mP/CHKcY0wt1aW45Q==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /@radix-ui/react-presence@1.0.1(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==} peerDependencies: @@ -584,6 +755,47 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false + /@radix-ui/react-select@2.0.0(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-RH5b7af4oHtkcHS7pG6Sgv5rk5Wxa7XI8W5gvB1N/yiuDGZxko1ynvOiVhFM7Cis2A8zxF9bTOUVbRDzPepe6w==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/number': 1.0.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-collection': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-direction': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-dismissable-layer': 1.0.5(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-focus-guards': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-focus-scope': 1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-id': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-popper': 1.1.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-portal': 1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-slot': 1.0.2(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-layout-effect': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-previous': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-visually-hidden': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + aria-hidden: 1.2.4 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + react-remove-scroll: 2.5.5(@types/react@18.2.74)(react@18.2.0) + dev: false + /@radix-ui/react-slot@1.0.2(@types/react@18.2.74)(react@18.2.0): resolution: {integrity: sha512-YeTpuq4deV+6DusvVUW4ivBgnkHwECUu0BiN43L5UCDFgdhsRUWAghhTF5MbvNTPzmiFOx90asDSUjWuCNapwg==} peerDependencies: @@ -628,6 +840,21 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-use-escape-keydown@1.0.3(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-vyL82j40hcFicA+M4Ex7hVkB9vHgSse1ZWomAqV2Je3RleKGO5iM8KMOEtfoSB0PnIelMd2lATjTGMYqN5ylTg==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-use-callback-ref': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + /@radix-ui/react-use-layout-effect@1.0.1(@types/react@18.2.74)(react@18.2.0): resolution: {integrity: sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==} peerDependencies: @@ -656,6 +883,21 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-use-rect@1.0.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-Cq5DLuSiuYVKNU8orzJMbl15TXilTnJKUCltMVQg53BQOF1/C5toAaGrowkgksdBQ9H+SRL23g0HDmg9tvmxXw==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/rect': 1.0.1 + '@types/react': 18.2.74 + react: 18.2.0 + dev: false + /@radix-ui/react-use-size@1.0.1(@types/react@18.2.74)(react@18.2.0): resolution: {integrity: sha512-ibay+VqrgcaI6veAojjofPATwledXiSmX+C0KrBk/xgpX9rBzPV3OsfwlhQdUOFbh+LKQorLYT+xTXW9V8yd0g==} peerDependencies: @@ -671,6 +913,33 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-visually-hidden@1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-D4w41yN5YRKtu464TLnByKzMDG/JlMPHtfZgQAu9v6mNakUqGUI9vUrfQKz8NK41VMm/xbZbh76NUTVtIYqOMA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + + /@radix-ui/rect@1.0.1: + resolution: {integrity: sha512-fyrgCaedtvMg9NK3en0pnOYJdtfwxUcNolezkNPUsoX57X8oQk+NkqcvzHXD2uKNij6GXmWU9NDru2IWjrO4BQ==} + dependencies: + '@babel/runtime': 7.24.1 + dev: false + /@rushstack/eslint-patch@1.10.1: resolution: {integrity: sha512-S3Kq8e7LqxkA9s7HKLqXGTGck1uwis5vAXan3FnU5yw1Ec5hsSGnq4s/UCaSqABPOnOTg7zASLyst7+ohgWexg==} dev: true @@ -976,6 +1245,13 @@ packages: resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==} dev: true + /aria-hidden@1.2.4: + resolution: {integrity: sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==} + engines: {node: '>=10'} + dependencies: + tslib: 2.6.2 + dev: false + /aria-query@5.3.0: resolution: {integrity: sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==} dependencies: @@ -1373,6 +1649,10 @@ packages: engines: {node: '>=6'} dev: true + /detect-node-es@1.1.0: + resolution: {integrity: sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==} + dev: false + /didyoumean@1.2.2: resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==} @@ -2036,6 +2316,11 @@ packages: hasown: 2.0.2 dev: true + /get-nonce@1.0.1: + resolution: {integrity: sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==} + engines: {node: '>=6'} + dev: false + /get-stream@8.0.1: resolution: {integrity: sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==} engines: {node: '>=16'} @@ -2228,6 +2513,12 @@ packages: side-channel: 1.0.6 dev: true + /invariant@2.2.4: + resolution: {integrity: sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==} + dependencies: + loose-envify: 1.4.0 + dev: false + /is-array-buffer@3.0.4: resolution: {integrity: sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==} engines: {node: '>= 0.4'} @@ -3038,6 +3329,58 @@ packages: resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==} dev: true + /react-remove-scroll-bar@2.3.6(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-DtSYaao4mBmX+HDo5YWYdBWQwYIQQshUV/dVxFxK+KM26Wjwp1gZ6rv6OC3oujI6Bfu6Xyg3TwK533AQutsn/g==} + engines: {node: '>=10'} + peerDependencies: + '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@types/react': 18.2.74 + react: 18.2.0 + react-style-singleton: 2.2.1(@types/react@18.2.74)(react@18.2.0) + tslib: 2.6.2 + dev: false + + /react-remove-scroll@2.5.5(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-ImKhrzJJsyXJfBZ4bzu8Bwpka14c/fQt0k+cyFp/PBhTfyDnU5hjOtM4AG/0AMyy8oKzOTR0lDgJIM7pYXI0kw==} + engines: {node: '>=10'} + peerDependencies: + '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@types/react': 18.2.74 + react: 18.2.0 + react-remove-scroll-bar: 2.3.6(@types/react@18.2.74)(react@18.2.0) + react-style-singleton: 2.2.1(@types/react@18.2.74)(react@18.2.0) + tslib: 2.6.2 + use-callback-ref: 1.3.2(@types/react@18.2.74)(react@18.2.0) + use-sidecar: 1.1.2(@types/react@18.2.74)(react@18.2.0) + dev: false + + /react-style-singleton@2.2.1(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-ZWj0fHEMyWkHzKYUr2Bs/4zU6XLmq9HsgBURm7g5pAVfyn49DgUiNgY2d4lXRlYSiCif9YBGpQleewkcqddc7g==} + engines: {node: '>=10'} + peerDependencies: + '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@types/react': 18.2.74 + get-nonce: 1.0.1 + invariant: 2.2.4 + react: 18.2.0 + tslib: 2.6.2 + dev: false + /react@18.2.0: resolution: {integrity: sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==} engines: {node: '>=0.10.0'} @@ -3584,6 +3927,37 @@ packages: punycode: 2.3.1 dev: true + /use-callback-ref@1.3.2(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-elOQwe6Q8gqZgDA8mrh44qRTQqpIHDcZ3hXTLjBe1i4ph8XpNJnO+aQf3NaG+lriLopI4HMx9VjQLfPQ6vhnoA==} + engines: {node: '>=10'} + peerDependencies: + '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@types/react': 18.2.74 + react: 18.2.0 + tslib: 2.6.2 + dev: false + + /use-sidecar@1.1.2(@types/react@18.2.74)(react@18.2.0): + resolution: {integrity: sha512-epTbsLuzZ7lPClpz2TyryBfztm7m+28DlEv2ZCQ3MDr5ssiwyOwGH/e5F9CkfWjJ1t4clvI58yF822/GUkjjhw==} + engines: {node: '>=10'} + peerDependencies: + '@types/react': ^16.9.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@types/react': 18.2.74 + detect-node-es: 1.1.0 + react: 18.2.0 + tslib: 2.6.2 + dev: false + /util-deprecate@1.0.2: resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==} From 0cd5b4057ecf9590a4729f73e97048774a0239ee Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:44:26 +0900 Subject: [PATCH 08/14] feat : add UI page --- .eslintcache | 2 +- .../sections/AccordionSection.tsx | 0 .../sections/ButtonSection.tsx | 0 .../sections/CardSection.tsx | 0 .../sections/InputSection.tsx | 0 .../sections/LabelSection.tsx | 0 .../sections/RadioGroupSection.tsx | 0 app/(tmp)/ui/page.tsx | 21 +++++++++++++++++++ 8 files changed, 22 insertions(+), 1 deletion(-) rename app/(tmp)/{ => _components}/sections/AccordionSection.tsx (100%) rename app/(tmp)/{ => _components}/sections/ButtonSection.tsx (100%) rename app/(tmp)/{ => _components}/sections/CardSection.tsx (100%) rename app/(tmp)/{ => _components}/sections/InputSection.tsx (100%) rename app/(tmp)/{ => _components}/sections/LabelSection.tsx (100%) rename app/(tmp)/{ => _components}/sections/RadioGroupSection.tsx (100%) create mode 100644 app/(tmp)/ui/page.tsx diff --git a/.eslintcache b/.eslintcache index 0bfd2f8..119e88d 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7","/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx":"8","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"9","/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx":"10","/Users/chanwookim/Desktop/running/components/ui/button.tsx":"11","/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx":"12","/Users/chanwookim/Desktop/running/components/ui/card.tsx":"13","/Users/chanwookim/Desktop/running/components/ui/select.tsx":"14"},{"size":291,"mtime":1712165152820,"results":"15","hashOfConfig":"16"},{"size":545,"mtime":1712165315426,"results":"17","hashOfConfig":"16"},{"size":824,"mtime":1712165357052,"results":"18","hashOfConfig":"16"},{"size":893,"mtime":1712165415411,"results":"19","hashOfConfig":"16"},{"size":1481,"mtime":1712165465230,"results":"20","hashOfConfig":"16"},{"size":346,"mtime":1712165556358,"results":"21","hashOfConfig":"16"},{"size":724,"mtime":1712165482192,"results":"22","hashOfConfig":"16"},{"size":2848,"mtime":1712165756872,"results":"23","hashOfConfig":"16"},{"size":1991,"mtime":1712165343484,"results":"24","hashOfConfig":"16"},{"size":2541,"mtime":1712165801418,"results":"25","hashOfConfig":"16"},{"size":1835,"mtime":1712165813850,"results":"26","hashOfConfig":"16"},{"size":2015,"mtime":1712165863378,"results":"27","hashOfConfig":"16"},{"size":1877,"mtime":1712165881969,"results":"28","hashOfConfig":"16"},{"size":5629,"mtime":1712165886878,"results":"29","hashOfConfig":"16"},{"filePath":"30","messages":"31","suppressedMessages":"32","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"33","messages":"34","suppressedMessages":"35","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","suppressedMessages":"38","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"39","messages":"40","suppressedMessages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"42","messages":"43","suppressedMessages":"44","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"45","messages":"46","suppressedMessages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"48","messages":"49","suppressedMessages":"50","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"51","messages":"52","suppressedMessages":"53","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"54","messages":"55","suppressedMessages":"56","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"57","messages":"58","suppressedMessages":"59","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","suppressedMessages":"62","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","suppressedMessages":"65","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","suppressedMessages":"68","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"69","messages":"70","suppressedMessages":"71","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/button.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/card.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/select.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7","/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx":"8","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"9","/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx":"10","/Users/chanwookim/Desktop/running/components/ui/button.tsx":"11","/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx":"12","/Users/chanwookim/Desktop/running/components/ui/card.tsx":"13","/Users/chanwookim/Desktop/running/components/ui/select.tsx":"14"},{"size":291,"mtime":1712165152820,"results":"15","hashOfConfig":"16"},{"size":545,"mtime":1712165315426,"results":"17","hashOfConfig":"16"},{"size":824,"mtime":1712165357052,"results":"18","hashOfConfig":"16"},{"size":893,"mtime":1712165415411,"results":"19","hashOfConfig":"16"},{"size":1481,"mtime":1712165465230,"results":"20","hashOfConfig":"16"},{"size":346,"mtime":1712165556358,"results":"21","hashOfConfig":"16"},{"size":724,"mtime":1712165482192,"results":"22","hashOfConfig":"16"},{"size":2848,"mtime":1712165756872,"results":"23","hashOfConfig":"16"},{"size":1991,"mtime":1712165343484,"results":"24","hashOfConfig":"16"},{"size":2541,"mtime":1712165801418,"results":"25","hashOfConfig":"16"},{"size":1835,"mtime":1712165813850,"results":"26","hashOfConfig":"16"},{"size":2015,"mtime":1712165916134,"results":"27","hashOfConfig":"16"},{"size":1905,"mtime":1712165916134,"results":"28","hashOfConfig":"16"},{"size":5652,"mtime":1712165916134,"results":"29","hashOfConfig":"16"},{"filePath":"30","messages":"31","suppressedMessages":"32","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"33","messages":"34","suppressedMessages":"35","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","suppressedMessages":"38","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"39","messages":"40","suppressedMessages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"42","messages":"43","suppressedMessages":"44","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"45","messages":"46","suppressedMessages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"48","messages":"49","suppressedMessages":"50","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"51","messages":"52","suppressedMessages":"53","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"54","messages":"55","suppressedMessages":"56","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"57","messages":"58","suppressedMessages":"59","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","suppressedMessages":"62","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","suppressedMessages":"65","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","suppressedMessages":"68","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"69","messages":"70","suppressedMessages":"71","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/button.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/card.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/select.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/sections/AccordionSection.tsx b/app/(tmp)/_components/sections/AccordionSection.tsx similarity index 100% rename from app/(tmp)/sections/AccordionSection.tsx rename to app/(tmp)/_components/sections/AccordionSection.tsx diff --git a/app/(tmp)/sections/ButtonSection.tsx b/app/(tmp)/_components/sections/ButtonSection.tsx similarity index 100% rename from app/(tmp)/sections/ButtonSection.tsx rename to app/(tmp)/_components/sections/ButtonSection.tsx diff --git a/app/(tmp)/sections/CardSection.tsx b/app/(tmp)/_components/sections/CardSection.tsx similarity index 100% rename from app/(tmp)/sections/CardSection.tsx rename to app/(tmp)/_components/sections/CardSection.tsx diff --git a/app/(tmp)/sections/InputSection.tsx b/app/(tmp)/_components/sections/InputSection.tsx similarity index 100% rename from app/(tmp)/sections/InputSection.tsx rename to app/(tmp)/_components/sections/InputSection.tsx diff --git a/app/(tmp)/sections/LabelSection.tsx b/app/(tmp)/_components/sections/LabelSection.tsx similarity index 100% rename from app/(tmp)/sections/LabelSection.tsx rename to app/(tmp)/_components/sections/LabelSection.tsx diff --git a/app/(tmp)/sections/RadioGroupSection.tsx b/app/(tmp)/_components/sections/RadioGroupSection.tsx similarity index 100% rename from app/(tmp)/sections/RadioGroupSection.tsx rename to app/(tmp)/_components/sections/RadioGroupSection.tsx diff --git a/app/(tmp)/ui/page.tsx b/app/(tmp)/ui/page.tsx new file mode 100644 index 0000000..3a64c9b --- /dev/null +++ b/app/(tmp)/ui/page.tsx @@ -0,0 +1,21 @@ +import AccordionSection from '@/app/(tmp)/_components/sections/AccordionSection'; +import ButtonSection from '@/app/(tmp)/_components/sections/ButtonSection'; +import CardSection from '@/app/(tmp)/_components/sections/CardSection'; +import InputSection from '@/app/(tmp)/_components/sections/InputSection'; +import LabelSection from '@/app/(tmp)/_components/sections/LabelSection'; +import RadioGroupSection from '@/app/(tmp)/_components/sections/RadioGroupSection'; + +const UIPage = () => { + return ( +
+ + + + + + +
+ ); +}; + +export default UIPage; From 1431b560451307c18410ca52ff329abb3f17f849 Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 02:50:11 +0900 Subject: [PATCH 09/14] feat: add modal ui --- .eslintcache | 2 +- .../_components/sections/DialogSection.tsx | 41 +++++ app/(tmp)/ui/page.tsx | 2 + components/ui/alert-dialog.tsx | 141 ++++++++++++++++++ package.json | 1 + pnpm-lock.yaml | 63 ++++++++ 6 files changed, 249 insertions(+), 1 deletion(-) create mode 100644 app/(tmp)/_components/sections/DialogSection.tsx create mode 100644 components/ui/alert-dialog.tsx diff --git a/.eslintcache b/.eslintcache index 119e88d..d172496 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"3","/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"5","/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"7","/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx":"8","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"9","/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx":"10","/Users/chanwookim/Desktop/running/components/ui/button.tsx":"11","/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx":"12","/Users/chanwookim/Desktop/running/components/ui/card.tsx":"13","/Users/chanwookim/Desktop/running/components/ui/select.tsx":"14"},{"size":291,"mtime":1712165152820,"results":"15","hashOfConfig":"16"},{"size":545,"mtime":1712165315426,"results":"17","hashOfConfig":"16"},{"size":824,"mtime":1712165357052,"results":"18","hashOfConfig":"16"},{"size":893,"mtime":1712165415411,"results":"19","hashOfConfig":"16"},{"size":1481,"mtime":1712165465230,"results":"20","hashOfConfig":"16"},{"size":346,"mtime":1712165556358,"results":"21","hashOfConfig":"16"},{"size":724,"mtime":1712165482192,"results":"22","hashOfConfig":"16"},{"size":2848,"mtime":1712165756872,"results":"23","hashOfConfig":"16"},{"size":1991,"mtime":1712165343484,"results":"24","hashOfConfig":"16"},{"size":2541,"mtime":1712165801418,"results":"25","hashOfConfig":"16"},{"size":1835,"mtime":1712165813850,"results":"26","hashOfConfig":"16"},{"size":2015,"mtime":1712165916134,"results":"27","hashOfConfig":"16"},{"size":1905,"mtime":1712165916134,"results":"28","hashOfConfig":"16"},{"size":5652,"mtime":1712165916134,"results":"29","hashOfConfig":"16"},{"filePath":"30","messages":"31","suppressedMessages":"32","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"33","messages":"34","suppressedMessages":"35","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","suppressedMessages":"38","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"39","messages":"40","suppressedMessages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"42","messages":"43","suppressedMessages":"44","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"45","messages":"46","suppressedMessages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"48","messages":"49","suppressedMessages":"50","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"51","messages":"52","suppressedMessages":"53","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"54","messages":"55","suppressedMessages":"56","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"57","messages":"58","suppressedMessages":"59","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","suppressedMessages":"62","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","suppressedMessages":"65","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","suppressedMessages":"68","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"69","messages":"70","suppressedMessages":"71","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/ButtonSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/button.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/sections/CardSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/card.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/select.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"3","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"5","/Users/chanwookim/Desktop/running/components/ui/button.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/card.tsx":"7","/Users/chanwookim/Desktop/running/components/ui/select.tsx":"8","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/AccordionSection.tsx":"9","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/ButtonSection.tsx":"10","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/CardSection.tsx":"11","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/InputSection.tsx":"12","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/LabelSection.tsx":"13","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/RadioGroupSection.tsx":"14","/Users/chanwookim/Desktop/running/app/(tmp)/ui/page.tsx":"15"},{"size":291,"mtime":1712165152820,"results":"16","hashOfConfig":"17"},{"size":824,"mtime":1712165357052,"results":"18","hashOfConfig":"17"},{"size":1481,"mtime":1712165465230,"results":"19","hashOfConfig":"17"},{"size":724,"mtime":1712165482192,"results":"20","hashOfConfig":"17"},{"size":1991,"mtime":1712165343484,"results":"21","hashOfConfig":"17"},{"size":1835,"mtime":1712165813850,"results":"22","hashOfConfig":"17"},{"size":1905,"mtime":1712165916134,"results":"23","hashOfConfig":"17"},{"size":5652,"mtime":1712165916134,"results":"24","hashOfConfig":"17"},{"size":2848,"mtime":1712166100842,"results":"25","hashOfConfig":"17"},{"size":2541,"mtime":1712165801418,"results":"26","hashOfConfig":"17"},{"size":2015,"mtime":1712165916134,"results":"27","hashOfConfig":"17"},{"size":545,"mtime":1712165315426,"results":"28","hashOfConfig":"17"},{"size":346,"mtime":1712165556358,"results":"29","hashOfConfig":"17"},{"size":893,"mtime":1712165415411,"results":"30","hashOfConfig":"17"},{"size":699,"mtime":1712166258706,"results":"31","hashOfConfig":"17"},{"filePath":"32","messages":"33","suppressedMessages":"34","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"35","messages":"36","suppressedMessages":"37","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","suppressedMessages":"40","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"41","messages":"42","suppressedMessages":"43","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"44","messages":"45","suppressedMessages":"46","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"47","messages":"48","suppressedMessages":"49","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"50","messages":"51","suppressedMessages":"52","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"53","messages":"54","suppressedMessages":"55","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"56","messages":"57","suppressedMessages":"58","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"59","messages":"60","suppressedMessages":"61","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"62","messages":"63","suppressedMessages":"64","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"65","messages":"66","suppressedMessages":"67","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"68","messages":"69","suppressedMessages":"70","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"71","messages":"72","suppressedMessages":"73","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"74","messages":"75","suppressedMessages":"76","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/button.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/card.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/select.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/ButtonSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/CardSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/ui/page.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/_components/sections/DialogSection.tsx b/app/(tmp)/_components/sections/DialogSection.tsx new file mode 100644 index 0000000..900e091 --- /dev/null +++ b/app/(tmp)/_components/sections/DialogSection.tsx @@ -0,0 +1,41 @@ +import { + AlertDialog, + AlertDialogAction, + AlertDialogCancel, + AlertDialogContent, + AlertDialogDescription, + AlertDialogFooter, + AlertDialogHeader, + AlertDialogTitle, + AlertDialogTrigger, +} from '@/components/ui/alert-dialog'; +import { Button } from '@/components/ui/button'; + +import Section from '@/app/(tmp)/_components/Section'; + +const DialogSection = () => { + return ( +
+ + + + + + + Are you absolutely sure? + + This action cannot be undone. This will permanently delete your + account and remove your data from our servers. + + + + Cancel + Continue + + + +
+ ); +}; + +export default DialogSection; diff --git a/app/(tmp)/ui/page.tsx b/app/(tmp)/ui/page.tsx index 3a64c9b..c102355 100644 --- a/app/(tmp)/ui/page.tsx +++ b/app/(tmp)/ui/page.tsx @@ -4,6 +4,7 @@ import CardSection from '@/app/(tmp)/_components/sections/CardSection'; import InputSection from '@/app/(tmp)/_components/sections/InputSection'; import LabelSection from '@/app/(tmp)/_components/sections/LabelSection'; import RadioGroupSection from '@/app/(tmp)/_components/sections/RadioGroupSection'; +import DialogSection from '@/app/(tmp)/_components/sections/DialogSection'; const UIPage = () => { return ( @@ -14,6 +15,7 @@ const UIPage = () => { + ); }; diff --git a/components/ui/alert-dialog.tsx b/components/ui/alert-dialog.tsx new file mode 100644 index 0000000..5cba559 --- /dev/null +++ b/components/ui/alert-dialog.tsx @@ -0,0 +1,141 @@ +'use client'; + +import * as React from 'react'; +import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog'; + +import { cn } from '@/lib/utils'; +import { buttonVariants } from '@/components/ui/button'; + +const AlertDialog = AlertDialogPrimitive.Root; + +const AlertDialogTrigger = AlertDialogPrimitive.Trigger; + +const AlertDialogPortal = AlertDialogPrimitive.Portal; + +const AlertDialogOverlay = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName; + +const AlertDialogContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + + +)); +AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName; + +const AlertDialogHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +AlertDialogHeader.displayName = 'AlertDialogHeader'; + +const AlertDialogFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +AlertDialogFooter.displayName = 'AlertDialogFooter'; + +const AlertDialogTitle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName; + +const AlertDialogDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +AlertDialogDescription.displayName = + AlertDialogPrimitive.Description.displayName; + +const AlertDialogAction = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName; + +const AlertDialogCancel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName; + +export { + AlertDialog, + AlertDialogPortal, + AlertDialogOverlay, + AlertDialogTrigger, + AlertDialogContent, + AlertDialogHeader, + AlertDialogFooter, + AlertDialogTitle, + AlertDialogDescription, + AlertDialogAction, + AlertDialogCancel, +}; diff --git a/package.json b/package.json index 5d09865..8c08719 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ }, "dependencies": { "@radix-ui/react-accordion": "^1.1.2", + "@radix-ui/react-alert-dialog": "^1.0.5", "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-radio-group": "^1.1.3", "@radix-ui/react-select": "^2.0.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index dc73d62..a3c2891 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,6 +8,9 @@ dependencies: '@radix-ui/react-accordion': specifier: ^1.1.2 version: 1.1.2(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-alert-dialog': + specifier: ^1.0.5 + version: 1.0.5(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) '@radix-ui/react-label': specifier: ^2.0.2 version: 2.0.2(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) @@ -389,6 +392,32 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false + /@radix-ui/react-alert-dialog@1.0.5(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-OrVIOcZL0tl6xibeuGt5/+UxoT2N27KCFOPjFyfXMnchxSHZ/OW7cCX2nGlIYJrbHK/fczPcFzAwvNBB6XBNMA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-dialog': 1.0.5(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-slot': 1.0.2(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /@radix-ui/react-arrow@1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-wSP+pHsB/jQRaL6voubsQ/ZlrGBHHrOjmBnr19hxYgtS0WvAFwZhK2WP/YY5yF9uKECCEEDGxuLxq1NBK51wFA==} peerDependencies: @@ -490,6 +519,40 @@ packages: react: 18.2.0 dev: false + /@radix-ui/react-dialog@1.0.5(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-GjWJX/AUpB703eEBanuBnIWdIXg6NvJFCXcNlSZk4xdszCdhrJgBoUd1cGk67vFO+WdA2pfI/plOpqz/5GUP6Q==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.1 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-context': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-dismissable-layer': 1.0.5(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-focus-guards': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-focus-scope': 1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-id': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-portal': 1.0.4(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-presence': 1.0.1(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.23)(@types/react@18.2.74)(react-dom@18.2.0)(react@18.2.0) + '@radix-ui/react-slot': 1.0.2(@types/react@18.2.74)(react@18.2.0) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.74)(react@18.2.0) + '@types/react': 18.2.74 + '@types/react-dom': 18.2.23 + aria-hidden: 1.2.4 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + react-remove-scroll: 2.5.5(@types/react@18.2.74)(react@18.2.0) + dev: false + /@radix-ui/react-direction@1.0.1(@types/react@18.2.74)(react@18.2.0): resolution: {integrity: sha512-RXcvnXgyvYvBEOhCBuddKecVkoMiI10Jcm5cTI7abJRAHYfFxeu+FBQs/DvdxSYucxR5mna0dNsL6QFlds5TMA==} peerDependencies: From 0978c1e8a1bf026c9bcc2ba4d53af73eb1ac94ac Mon Sep 17 00:00:00 2001 From: kcwww Date: Thu, 4 Apr 2024 03:02:16 +0900 Subject: [PATCH 10/14] feat: add modal ui --- .eslintcache | 2 +- .../_components/sections/FormSection.tsx | 18 ++ components/ui/form.tsx | 177 ++++++++++++++++++ package.json | 2 + pnpm-lock.yaml | 23 ++- 5 files changed, 220 insertions(+), 2 deletions(-) create mode 100644 app/(tmp)/_components/sections/FormSection.tsx create mode 100644 components/ui/form.tsx diff --git a/.eslintcache b/.eslintcache index d172496..52c596e 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"3","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"5","/Users/chanwookim/Desktop/running/components/ui/button.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/card.tsx":"7","/Users/chanwookim/Desktop/running/components/ui/select.tsx":"8","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/AccordionSection.tsx":"9","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/ButtonSection.tsx":"10","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/CardSection.tsx":"11","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/InputSection.tsx":"12","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/LabelSection.tsx":"13","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/RadioGroupSection.tsx":"14","/Users/chanwookim/Desktop/running/app/(tmp)/ui/page.tsx":"15"},{"size":291,"mtime":1712165152820,"results":"16","hashOfConfig":"17"},{"size":824,"mtime":1712165357052,"results":"18","hashOfConfig":"17"},{"size":1481,"mtime":1712165465230,"results":"19","hashOfConfig":"17"},{"size":724,"mtime":1712165482192,"results":"20","hashOfConfig":"17"},{"size":1991,"mtime":1712165343484,"results":"21","hashOfConfig":"17"},{"size":1835,"mtime":1712165813850,"results":"22","hashOfConfig":"17"},{"size":1905,"mtime":1712165916134,"results":"23","hashOfConfig":"17"},{"size":5652,"mtime":1712165916134,"results":"24","hashOfConfig":"17"},{"size":2848,"mtime":1712166100842,"results":"25","hashOfConfig":"17"},{"size":2541,"mtime":1712165801418,"results":"26","hashOfConfig":"17"},{"size":2015,"mtime":1712165916134,"results":"27","hashOfConfig":"17"},{"size":545,"mtime":1712165315426,"results":"28","hashOfConfig":"17"},{"size":346,"mtime":1712165556358,"results":"29","hashOfConfig":"17"},{"size":893,"mtime":1712165415411,"results":"30","hashOfConfig":"17"},{"size":699,"mtime":1712166258706,"results":"31","hashOfConfig":"17"},{"filePath":"32","messages":"33","suppressedMessages":"34","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"35","messages":"36","suppressedMessages":"37","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","suppressedMessages":"40","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"41","messages":"42","suppressedMessages":"43","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"44","messages":"45","suppressedMessages":"46","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"47","messages":"48","suppressedMessages":"49","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"50","messages":"51","suppressedMessages":"52","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"53","messages":"54","suppressedMessages":"55","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"56","messages":"57","suppressedMessages":"58","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"59","messages":"60","suppressedMessages":"61","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"62","messages":"63","suppressedMessages":"64","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"65","messages":"66","suppressedMessages":"67","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"68","messages":"69","suppressedMessages":"70","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"71","messages":"72","suppressedMessages":"73","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"74","messages":"75","suppressedMessages":"76","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/button.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/card.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/select.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/ButtonSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/CardSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/ui/page.tsx",[],[]] \ No newline at end of file +[{"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx":"1","/Users/chanwookim/Desktop/running/components/ui/input.tsx":"2","/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx":"3","/Users/chanwookim/Desktop/running/components/ui/label.tsx":"4","/Users/chanwookim/Desktop/running/components/ui/accordion.tsx":"5","/Users/chanwookim/Desktop/running/components/ui/button.tsx":"6","/Users/chanwookim/Desktop/running/components/ui/card.tsx":"7","/Users/chanwookim/Desktop/running/components/ui/select.tsx":"8","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/AccordionSection.tsx":"9","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/ButtonSection.tsx":"10","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/CardSection.tsx":"11","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/InputSection.tsx":"12","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/LabelSection.tsx":"13","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/RadioGroupSection.tsx":"14","/Users/chanwookim/Desktop/running/app/(tmp)/ui/page.tsx":"15","/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/DialogSection.tsx":"16","/Users/chanwookim/Desktop/running/components/ui/alert-dialog.tsx":"17"},{"size":291,"mtime":1712165152820,"results":"18","hashOfConfig":"19"},{"size":824,"mtime":1712165357052,"results":"20","hashOfConfig":"19"},{"size":1481,"mtime":1712165465230,"results":"21","hashOfConfig":"19"},{"size":724,"mtime":1712165482192,"results":"22","hashOfConfig":"19"},{"size":1991,"mtime":1712165343484,"results":"23","hashOfConfig":"19"},{"size":1835,"mtime":1712165813850,"results":"24","hashOfConfig":"19"},{"size":1905,"mtime":1712165916134,"results":"25","hashOfConfig":"19"},{"size":5652,"mtime":1712165916134,"results":"26","hashOfConfig":"19"},{"size":2848,"mtime":1712166100842,"results":"27","hashOfConfig":"19"},{"size":2541,"mtime":1712165801418,"results":"28","hashOfConfig":"19"},{"size":2015,"mtime":1712165916134,"results":"29","hashOfConfig":"19"},{"size":545,"mtime":1712165315426,"results":"30","hashOfConfig":"19"},{"size":346,"mtime":1712165556358,"results":"31","hashOfConfig":"19"},{"size":893,"mtime":1712165415411,"results":"32","hashOfConfig":"19"},{"size":799,"mtime":1712166519793,"results":"33","hashOfConfig":"19"},{"size":1219,"mtime":1712166558315,"results":"34","hashOfConfig":"19"},{"size":4434,"mtime":1712166439898,"results":"35","hashOfConfig":"19"},{"filePath":"36","messages":"37","suppressedMessages":"38","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"eff72h",{"filePath":"39","messages":"40","suppressedMessages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"42","messages":"43","suppressedMessages":"44","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"45","messages":"46","suppressedMessages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"48","messages":"49","suppressedMessages":"50","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"51","messages":"52","suppressedMessages":"53","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"54","messages":"55","suppressedMessages":"56","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"57","messages":"58","suppressedMessages":"59","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","suppressedMessages":"62","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","suppressedMessages":"65","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","suppressedMessages":"68","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"69","messages":"70","suppressedMessages":"71","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"72","messages":"73","suppressedMessages":"74","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"75","messages":"76","suppressedMessages":"77","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"78","messages":"79","suppressedMessages":"80","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"81","messages":"82","suppressedMessages":"83","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"84","messages":"85","suppressedMessages":"86","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/chanwookim/Desktop/running/app/(tmp)/_components/Section.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/input.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/radio-group.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/label.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/accordion.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/button.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/card.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/select.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/AccordionSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/ButtonSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/CardSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/InputSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/LabelSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/RadioGroupSection.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/ui/page.tsx",[],[],"/Users/chanwookim/Desktop/running/app/(tmp)/_components/sections/DialogSection.tsx",[],[],"/Users/chanwookim/Desktop/running/components/ui/alert-dialog.tsx",[],[]] \ No newline at end of file diff --git a/app/(tmp)/_components/sections/FormSection.tsx b/app/(tmp)/_components/sections/FormSection.tsx new file mode 100644 index 0000000..96f9b1d --- /dev/null +++ b/app/(tmp)/_components/sections/FormSection.tsx @@ -0,0 +1,18 @@ +import { zodResolver } from '@hookform/resolvers/zod'; +import { useForm } from 'react-hook-form'; +import z from 'zod'; + +import Form from '@/app/(tmp)/_components/Form'; +import Section from '@/app/(tmp)/_components/Section'; + +const FormSection = () => { + return ( + <> +
+
+
+ + ); +}; + +export default FormSection; diff --git a/components/ui/form.tsx b/components/ui/form.tsx new file mode 100644 index 0000000..b948a8f --- /dev/null +++ b/components/ui/form.tsx @@ -0,0 +1,177 @@ +import * as React from 'react'; +import * as LabelPrimitive from '@radix-ui/react-label'; +import { Slot } from '@radix-ui/react-slot'; +import { + Controller, + ControllerProps, + FieldPath, + FieldValues, + FormProvider, + useFormContext, +} from 'react-hook-form'; + +import { cn } from '@/lib/utils'; +import { Label } from '@/components/ui/label'; + +const Form = FormProvider; + +type FormFieldContextValue< + TFieldValues extends FieldValues = FieldValues, + TName extends FieldPath = FieldPath, +> = { + name: TName; +}; + +const FormFieldContext = React.createContext( + {} as FormFieldContextValue +); + +const FormField = < + TFieldValues extends FieldValues = FieldValues, + TName extends FieldPath = FieldPath, +>({ + ...props +}: ControllerProps) => { + return ( + + + + ); +}; + +const useFormField = () => { + const fieldContext = React.useContext(FormFieldContext); + const itemContext = React.useContext(FormItemContext); + const { getFieldState, formState } = useFormContext(); + + const fieldState = getFieldState(fieldContext.name, formState); + + if (!fieldContext) { + throw new Error('useFormField should be used within '); + } + + const { id } = itemContext; + + return { + id, + name: fieldContext.name, + formItemId: `${id}-form-item`, + formDescriptionId: `${id}-form-item-description`, + formMessageId: `${id}-form-item-message`, + ...fieldState, + }; +}; + +type FormItemContextValue = { + id: string; +}; + +const FormItemContext = React.createContext( + {} as FormItemContextValue +); + +const FormItem = React.forwardRef< + HTMLDivElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => { + const id = React.useId(); + + return ( + +
+ + ); +}); +FormItem.displayName = 'FormItem'; + +const FormLabel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => { + const { error, formItemId } = useFormField(); + + return ( +