@deckai/deck-ui 0.0.13 → 0.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +22 -4
- package/dist/components/AboutCard.cjs +1 -9
- package/dist/components/AboutCard.cjs.map +1 -1
- package/dist/components/AboutCard.d.cts +1 -2
- package/dist/components/AboutCard.d.ts +1 -2
- package/dist/components/AboutCard.js +1 -9
- package/dist/components/AboutCard.js.map +1 -1
- package/dist/components/Accordion.cjs +2 -0
- package/dist/components/Accordion.cjs.map +1 -0
- package/dist/components/Accordion.d.cts +26 -0
- package/dist/components/Accordion.d.ts +26 -0
- package/dist/components/Accordion.js +2 -0
- package/dist/components/Accordion.js.map +1 -0
- package/dist/components/AddWorkCard.cjs +117 -0
- package/dist/components/AddWorkCard.cjs.map +1 -0
- package/dist/components/AddWorkCard.d.cts +9 -0
- package/dist/components/AddWorkCard.d.ts +9 -0
- package/dist/components/AddWorkCard.js +117 -0
- package/dist/components/AddWorkCard.js.map +1 -0
- package/dist/components/Avatar.cjs +1 -1
- package/dist/components/Avatar.cjs.map +1 -1
- package/dist/components/Avatar.js +1 -1
- package/dist/components/Avatar.js.map +1 -1
- package/dist/components/Badge.cjs +1 -1
- package/dist/components/Badge.cjs.map +1 -1
- package/dist/components/Badge.js +1 -1
- package/dist/components/Badge.js.map +1 -1
- package/dist/components/Breadcrumbs.cjs +1 -1
- package/dist/components/Breadcrumbs.cjs.map +1 -1
- package/dist/components/Breadcrumbs.js +1 -1
- package/dist/components/Breadcrumbs.js.map +1 -1
- package/dist/components/Button.cjs +2 -2
- package/dist/components/Button.cjs.map +1 -1
- package/dist/components/Button.js +2 -2
- package/dist/components/Button.js.map +1 -1
- package/dist/components/Carousel.cjs +2 -0
- package/dist/components/Carousel.cjs.map +1 -0
- package/dist/components/Carousel.d.cts +12 -0
- package/dist/components/Carousel.d.ts +12 -0
- package/dist/components/Carousel.js +2 -0
- package/dist/components/Carousel.js.map +1 -0
- package/dist/components/Collapsible.cjs +1 -1
- package/dist/components/Collapsible.cjs.map +1 -1
- package/dist/components/Collapsible.js +1 -1
- package/dist/components/Collapsible.js.map +1 -1
- package/dist/components/Combobox.cjs +1 -1
- package/dist/components/Combobox.cjs.map +1 -1
- package/dist/components/Combobox.d.cts +12 -3
- package/dist/components/Combobox.d.ts +12 -3
- package/dist/components/Combobox.js +1 -1
- package/dist/components/Combobox.js.map +1 -1
- package/dist/components/ContactItem.cjs +1 -1
- package/dist/components/ContactItem.cjs.map +1 -1
- package/dist/components/ContactItem.js +1 -1
- package/dist/components/ContactItem.js.map +1 -1
- package/dist/components/Dropdown.cjs +2 -0
- package/dist/components/Dropdown.cjs.map +1 -0
- package/dist/components/Dropdown.d.cts +18 -0
- package/dist/components/Dropdown.d.ts +18 -0
- package/dist/components/Dropdown.js +2 -0
- package/dist/components/Dropdown.js.map +1 -0
- package/dist/components/EditButton.cjs +2 -2
- package/dist/components/EditButton.cjs.map +1 -1
- package/dist/components/EditButton.js +2 -2
- package/dist/components/EditButton.js.map +1 -1
- package/dist/components/Icon.cjs +1 -1
- package/dist/components/Icon.cjs.map +1 -1
- package/dist/components/Icon.d.cts +1 -1
- package/dist/components/Icon.d.ts +1 -1
- package/dist/components/Icon.js +1 -1
- package/dist/components/Icon.js.map +1 -1
- package/dist/components/IconRenderer.cjs +1 -1
- package/dist/components/IconRenderer.js +1 -1
- package/dist/components/Illustration.cjs +1 -1
- package/dist/components/Illustration.js +1 -1
- package/dist/components/Input.cjs +1 -1
- package/dist/components/Input.cjs.map +1 -1
- package/dist/components/Input.d.cts +4 -2
- package/dist/components/Input.d.ts +4 -2
- package/dist/components/Input.js +1 -1
- package/dist/components/Input.js.map +1 -1
- package/dist/components/Link.cjs +1 -1
- package/dist/components/Link.cjs.map +1 -1
- package/dist/components/Link.d.cts +1 -1
- package/dist/components/Link.d.ts +1 -1
- package/dist/components/Link.js +1 -1
- package/dist/components/Link.js.map +1 -1
- package/dist/components/Logo.cjs +1 -1
- package/dist/components/Logo.js +1 -1
- package/dist/components/MultiSelectCombobox.cjs +1 -1
- package/dist/components/MultiSelectCombobox.cjs.map +1 -1
- package/dist/components/MultiSelectCombobox.d.cts +6 -2
- package/dist/components/MultiSelectCombobox.d.ts +6 -2
- package/dist/components/MultiSelectCombobox.js +1 -1
- package/dist/components/MultiSelectCombobox.js.map +1 -1
- package/dist/components/Navbar.cjs +2 -2
- package/dist/components/Navbar.cjs.map +1 -1
- package/dist/components/Navbar.d.cts +6 -3
- package/dist/components/Navbar.d.ts +6 -3
- package/dist/components/Navbar.js +2 -2
- package/dist/components/Navbar.js.map +1 -1
- package/dist/components/NavbarItem.cjs +1 -1
- package/dist/components/NavbarItem.cjs.map +1 -1
- package/dist/components/NavbarItem.d.cts +1 -1
- package/dist/components/NavbarItem.d.ts +1 -1
- package/dist/components/NavbarItem.js +1 -1
- package/dist/components/NavbarItem.js.map +1 -1
- package/dist/components/Option.cjs +1 -1
- package/dist/components/Option.cjs.map +1 -1
- package/dist/components/Option.d.cts +7 -2
- package/dist/components/Option.d.ts +7 -2
- package/dist/components/Option.js +1 -1
- package/dist/components/Option.js.map +1 -1
- package/dist/components/Pressable.cjs +1 -1
- package/dist/components/Pressable.cjs.map +1 -1
- package/dist/components/Pressable.d.cts +1 -1
- package/dist/components/Pressable.d.ts +1 -1
- package/dist/components/Pressable.js +1 -1
- package/dist/components/Pressable.js.map +1 -1
- package/dist/components/ProfileCard.cjs +1 -9
- package/dist/components/ProfileCard.cjs.map +1 -1
- package/dist/components/ProfileCard.d.cts +1 -1
- package/dist/components/ProfileCard.d.ts +1 -1
- package/dist/components/ProfileCard.js +1 -9
- package/dist/components/ProfileCard.js.map +1 -1
- package/dist/components/ProgressBar.cjs +2 -0
- package/dist/components/ProgressBar.cjs.map +1 -0
- package/dist/components/ProgressBar.d.cts +21 -0
- package/dist/components/ProgressBar.d.ts +21 -0
- package/dist/components/ProgressBar.js +2 -0
- package/dist/components/ProgressBar.js.map +1 -0
- package/dist/components/SegmentedTabs.cjs +10 -0
- package/dist/components/SegmentedTabs.cjs.map +1 -0
- package/dist/components/SegmentedTabs.d.cts +16 -0
- package/dist/components/SegmentedTabs.d.ts +16 -0
- package/dist/components/SegmentedTabs.js +10 -0
- package/dist/components/SegmentedTabs.js.map +1 -0
- package/dist/components/Sidebar.cjs +1 -1
- package/dist/components/Sidebar.cjs.map +1 -1
- package/dist/components/Sidebar.js +1 -1
- package/dist/components/Sidebar.js.map +1 -1
- package/dist/components/SlideButton.cjs +3 -0
- package/dist/components/SlideButton.cjs.map +1 -0
- package/dist/components/SlideButton.d.cts +21 -0
- package/dist/components/SlideButton.d.ts +21 -0
- package/dist/components/SlideButton.js +3 -0
- package/dist/components/SlideButton.js.map +1 -0
- package/dist/components/SocialCard.cjs +1 -1
- package/dist/components/SocialCard.cjs.map +1 -1
- package/dist/components/SocialCard.js +1 -1
- package/dist/components/SocialCard.js.map +1 -1
- package/dist/components/Spinner.cjs +1 -1
- package/dist/components/Spinner.cjs.map +1 -1
- package/dist/components/Spinner.d.cts +36 -1
- package/dist/components/Spinner.d.ts +36 -1
- package/dist/components/Spinner.js +1 -1
- package/dist/components/Spinner.js.map +1 -1
- package/dist/components/Switch.cjs +1 -1
- package/dist/components/Switch.cjs.map +1 -1
- package/dist/components/Switch.js +1 -1
- package/dist/components/Switch.js.map +1 -1
- package/dist/components/Tabs.cjs +9 -1
- package/dist/components/Tabs.cjs.map +1 -1
- package/dist/components/Tabs.d.cts +1 -0
- package/dist/components/Tabs.d.ts +1 -0
- package/dist/components/Tabs.js +9 -1
- package/dist/components/Tabs.js.map +1 -1
- package/dist/components/Tag.cjs +1 -1
- package/dist/components/Tag.cjs.map +1 -1
- package/dist/components/Tag.js +1 -1
- package/dist/components/Tag.js.map +1 -1
- package/dist/components/Text.cjs +1 -1
- package/dist/components/Text.cjs.map +1 -1
- package/dist/components/Text.d.cts +6 -10
- package/dist/components/Text.d.ts +6 -10
- package/dist/components/Text.js +1 -1
- package/dist/components/Text.js.map +1 -1
- package/dist/components/TextArea.cjs +1 -1
- package/dist/components/TextArea.cjs.map +1 -1
- package/dist/components/TextArea.js +1 -1
- package/dist/components/TextArea.js.map +1 -1
- package/dist/components/Toast.cjs +10 -0
- package/dist/components/Toast.cjs.map +1 -0
- package/dist/components/Toast.d.cts +35 -0
- package/dist/components/Toast.d.ts +35 -0
- package/dist/components/Toast.js +10 -0
- package/dist/components/Toast.js.map +1 -0
- package/dist/components/ToastProvider.cjs +2 -0
- package/dist/components/ToastProvider.cjs.map +1 -0
- package/dist/components/ToastProvider.d.cts +8 -0
- package/dist/components/ToastProvider.d.ts +8 -0
- package/dist/components/ToastProvider.js +2 -0
- package/dist/components/ToastProvider.js.map +1 -0
- package/dist/components/Tooltip.cjs +1 -1
- package/dist/components/Tooltip.cjs.map +1 -1
- package/dist/components/Tooltip.d.cts +4 -1
- package/dist/components/Tooltip.d.ts +4 -1
- package/dist/components/Tooltip.js +1 -1
- package/dist/components/Tooltip.js.map +1 -1
- package/dist/components/WorkCard.cjs +1 -1
- package/dist/components/WorkCard.cjs.map +1 -1
- package/dist/components/WorkCard.d.cts +4 -3
- package/dist/components/WorkCard.d.ts +4 -3
- package/dist/components/WorkCard.js +1 -1
- package/dist/components/WorkCard.js.map +1 -1
- package/dist/index.cjs +111 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +42 -4
- package/dist/index.d.ts +42 -4
- package/dist/index.js +111 -3
- package/dist/index.js.map +1 -1
- package/dist/styles/styles.css +1 -1
- package/dist/{tailwind-CIZ10fKA.d.cts → tailwind-CuJn6tv4.d.cts} +4 -4
- package/dist/{tailwind-CIZ10fKA.d.ts → tailwind-CuJn6tv4.d.ts} +4 -4
- package/package.json +20 -16
package/README.md
CHANGED
|
@@ -17,7 +17,7 @@ import type { Metadata } from "next";
|
|
|
17
17
|
import "./globals.css";
|
|
18
18
|
import "@deckai/deck-ui/styles/styles.css";
|
|
19
19
|
import localFont from "next/font/local";
|
|
20
|
-
|
|
20
|
+
import { ToastProvider } from "@deckai/deck-ui";
|
|
21
21
|
const gilroy = localFont({
|
|
22
22
|
src: [
|
|
23
23
|
{
|
|
@@ -51,7 +51,9 @@ export default function RootLayout({
|
|
|
51
51
|
}>) {
|
|
52
52
|
return (
|
|
53
53
|
<html lang="en" className={`${gilroy.variable} antialiased`}>
|
|
54
|
-
<body>
|
|
54
|
+
<body>
|
|
55
|
+
<ToastProvider>{children}</ToastProvider>
|
|
56
|
+
</body>
|
|
55
57
|
</html>
|
|
56
58
|
);
|
|
57
59
|
}
|
|
@@ -86,6 +88,22 @@ import type { Config } from "tailwindcss";
|
|
|
86
88
|
|
|
87
89
|
See NextJS [docs](https://nextjs.org/docs/pages/building-your-application/optimizing/fonts#with-tailwind-css) for more options.
|
|
88
90
|
|
|
91
|
+
## with typescript
|
|
92
|
+
|
|
93
|
+
To use `deck-ui` with typescript, you'll need to add the following to your `tsconfig.json` file:
|
|
94
|
+
|
|
95
|
+
```json
|
|
96
|
+
{
|
|
97
|
+
"compilerOptions": {
|
|
98
|
+
"paths": {
|
|
99
|
+
"@deckai/deck-ui": ["./node_modules/@deckai/deck-ui/dist/index.d.ts"],
|
|
100
|
+
"@deckai/deck-ui/*": ["./node_modules/@deckai/deck-ui/dist/*"]
|
|
101
|
+
}
|
|
102
|
+
},
|
|
103
|
+
"include": ["node_modules/@deckai/deck-ui/dist/**/*.d.ts"]
|
|
104
|
+
}
|
|
105
|
+
```
|
|
106
|
+
|
|
89
107
|
## next config
|
|
90
108
|
|
|
91
109
|
Update your `next.config.ts` to automatically transpile the `deck-ui` package.
|
|
@@ -104,10 +122,10 @@ export default nextConfig;
|
|
|
104
122
|
|
|
105
123
|
## using components
|
|
106
124
|
|
|
107
|
-
next will handle all the tree shaking for you, so just import components from `@deckai/deck-ui
|
|
125
|
+
next will handle all the tree shaking for you, so just import components from `@deckai/deck-ui` directly.
|
|
108
126
|
|
|
109
127
|
```ts
|
|
110
|
-
import { Button } from "@deckai/deck-ui
|
|
128
|
+
import { Button } from "@deckai/deck-ui";
|
|
111
129
|
```
|
|
112
130
|
|
|
113
131
|
### Server Components Compatibility
|
|
@@ -1,10 +1,2 @@
|
|
|
1
|
-
'use strict';var
|
|
2
|
-
sm:px-7 px-4
|
|
3
|
-
py-2
|
|
4
|
-
inline-flex items-center justify-center
|
|
5
|
-
rounded-lg
|
|
6
|
-
transition-colors duration-200
|
|
7
|
-
disabled:opacity-50 disabled:pointer-events-none
|
|
8
|
-
hover:opacity-80 active:scale-95
|
|
9
|
-
truncate`,y,t==="filled"?K[r]:M[r],e),disabled:i||o,type:"button",...n},typeof s=="string"?c__namespace.createElement(p,{variant:["sm:body-default-bold","body-xxs-semibold"],color:"inherit"},s):s));G.displayName="Button";var S={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB"},F={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},q=e=>{if(!e)return {width:"24px",height:"24px"};let t=Array.isArray(e)?e:[e],r={},o;return t.forEach(s=>{if(typeof s=="number")o=`${s}px`;else {let[i,n]=s.split(":"),a=parseInt(n,10);r[`@media (min-width: ${F[i]})`]=`${a}px`;}}),{width:o||"24px",height:o||"24px",...Object.entries(r).reduce((s,[i,n])=>({...s,[i]:{width:n,height:n}}),{})}},C=c__namespace.default.forwardRef(({name:e,size:t=24,color:r="primary",title:o,className:s,style:i={},...n},a)=>{let d=icons.IconMap[e],u=q(t);return c__namespace.default.createElement("div",{className:l("flex justify-center items-center",s),style:{...u,"--icon-stroke":S[r],...i}},c__namespace.default.createElement(d,{ref:a,"aria-hidden":!o,"aria-label":o,stroke:e.includes("filled")?void 0:S[r],...n}))});C.displayName="Icon";var g=({children:e,type:t="button",className:r,disabled:o,...s})=>c__namespace.default.createElement("button",{type:t,disabled:o,className:`appearance-none hover:opacity-80 transition-all active:scale-95 ${y} ${r} ${o?"opacity-50 cursor-not-allowed":""}`,...s},e);var E=({className:e,onClick:t})=>c__namespace.default.createElement(g,{className:l("absolute lg:top-10 md:top-8 top-4 lg:right-10 md:right-8 right-4 lg:px-2 lg:py-2 px-1 py-1 rounded-lg",M.black,e),onClick:t},c__namespace.default.createElement(C,{color:"primary",name:"edit-2"}));E.displayName="EditButton";var v=({children:e,maxHeight:t=100})=>{let[r,o]=c__namespace.default.useState(!1),s=c.useRef(null),[i,n]=c.useState(t);c.useLayoutEffect(()=>{if(!s.current)return;let d=new ResizeObserver(u=>{for(let x of u)n(x.target.scrollHeight);});return d.observe(s.current),()=>d.disconnect()},[]);let a=i>t;return c__namespace.default.createElement(h__namespace.Root,{open:r,onOpenChange:o},c__namespace.default.createElement("div",{className:"relative"},c__namespace.default.createElement("div",{className:"overflow-hidden transition-[height] duration-300 ease-in-out",style:{height:r?`${i}px`:`${t}px`}},c__namespace.default.createElement("div",{ref:s,className:"w-full"},e)),a&&c__namespace.default.createElement(h__namespace.Trigger,{asChild:!0},c__namespace.default.createElement(g,{className:l("absolute -bottom-8 left-0 right-0","flex items-end justify-center","h-16 pt-8 pb-2",!r&&"bg-gradient-to-b from-transparent via-white to-white","hover:opacity-100 transition-opacity")},c__namespace.default.createElement(p,{variant:"label-default",color:"text-secondary"},r?"See less":"See more")))))};v.displayName="Collapsible";var De=({interests:e,contactItems:t,description:r,isEditMode:o=!1,onEditClick:s,...i})=>c__namespace.default.createElement("div",{className:"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4",...i},o&&c__namespace.default.createElement(E,{onClick:s}),c__namespace.default.createElement("div",{className:"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0"},c__namespace.default.createElement(v,{maxHeight:120},c__namespace.default.createElement(p,{variant:"body-default"},r))),c__namespace.default.createElement("span",{className:"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10"}),c__namespace.default.createElement("span",{className:"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10"}),c__namespace.default.createElement("div",{className:"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8"},t.map(n=>c__namespace.default.createElement(P,{key:n.title,...n}))));if (exports.default) module.exports = exports.default;exports.AboutCard=De;//# sourceMappingURL=AboutCard.cjs.map
|
|
1
|
+
'use strict';var a=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),y=require('@radix-ui/react-collapsible');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var a__default=/*#__PURE__*/_interopDefault(a);var y__namespace=/*#__PURE__*/_interopNamespace(y);var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},R=e=>{let[t,r]=e.split("-");return t==="heading"?A[r]||"p":t==="label"?"label":"p"},$={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},P=e=>e?(Array.isArray(e)?e:[e]).map(r=>{if(r.includes(":")){let[o,s]=r.split(":");return `${o}:text-${s}`}return `text-${r}`}).join(" "):"text-body-default",p=a__default.default.forwardRef(({variant:e="body-default",color:t="primary",as:r,className:o,children:s,weight:n,...i},m)=>{let d=P(e),b=t==="inherit"?"text-inherit":`text-text-${t}`,f=a__default.default.useMemo(()=>{let C=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return R(C)},[e]);return a__default.default.createElement(r||f,{ref:m,className:`font-sans antialiased ${d} ${b} ${n?`!${$[n]}`:""} ${o??""}`,...i},s)});p.displayName="Text";var h=({icon:e,size:t=40,className:r})=>{let o=a.useMemo(()=>{let i=new DOMParser().parseFromString(e,"image/svg+xml").querySelector("svg");if(!i)return null;i.setAttribute("width","100%"),i.setAttribute("height","100%"),i.setAttribute("preserveAspectRatio","xMidYMid meet");let m=i.getAttribute("viewBox")||"0 0 40 40";return i.setAttribute("viewBox",m),i.outerHTML},[e]);return o?a__default.default.createElement("div",{style:{width:t,height:t,display:"flex",alignItems:"center",justifyContent:"center"},className:r,dangerouslySetInnerHTML:{__html:o}}):null};h.displayName="IconRenderer";function c(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var u="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var L=({children:e,color:t="inherit",variant:r="body-default-semibold",href:o,className:s,...n})=>a__default.default.createElement(p,{variant:r,color:t},a__default.default.createElement("a",{href:o,className:c("hover:opacity-80 transition-all ease-in-out active:scale-95 hover:underline",u,s),...n},e));var E=({icon:e,children:t,href:r,...o})=>a__default.default.createElement("div",{className:"row gap-2 flex items-center"},a__default.default.createElement("div",{className:"bg-secondary-400 rounded-full p-2.5 items-center justify-center"},a__default.default.createElement(h,{icon:e,size:18,className:"text-text"})),a__default.default.createElement(L,{className:"hover:underline",href:r,...o,variant:["body-default-semibold","md:body-default-semibold"]},t));var x=a__default.default.forwardRef(({children:e,type:t="button",className:r,disabled:o,...s},n)=>a__default.default.createElement("button",{ref:n,type:t,disabled:o,className:c("appearance-none hover:opacity-80 transition-all active:scale-95",u,o&&"opacity-50 cursor-not-allowed",r),...s},e));x.displayName="Pressable";var H=({children:e,maxHeight:t=100})=>{let[r,o]=a__default.default.useState(!1),s=a.useRef(null),[n,i]=a.useState(t);a.useLayoutEffect(()=>{if(!s.current)return;let d=new ResizeObserver(b=>{for(let f of b)i(f.target.scrollHeight);});return d.observe(s.current),()=>d.disconnect()},[]);let m=n>t;return a__default.default.createElement(y__namespace.Root,{open:r,onOpenChange:o},a__default.default.createElement("div",{className:"relative"},a__default.default.createElement("div",{className:"overflow-hidden transition-[height] duration-300 ease-in-out",style:{height:r?`${n}px`:`${t}px`}},a__default.default.createElement("div",{ref:s,className:"w-full"},e)),m&&a__default.default.createElement(y__namespace.Trigger,{asChild:!0},a__default.default.createElement(x,{className:c("absolute -bottom-8 left-0 right-0","flex items-end justify-center","h-16 pt-8 pb-2",!r&&"bg-gradient-to-b from-transparent via-white to-white","hover:opacity-100 transition-opacity")},a__default.default.createElement(p,{variant:"label-default",color:"secondary"},r?"See less":"See more")))))};H.displayName="Collapsible";var he=({contactItems:e,description:t,isEditMode:r=!1,onEditClick:o,...s})=>a__default.default.createElement("div",{className:"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4",...s},a__default.default.createElement("div",{className:"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0 justify-center"},a__default.default.createElement(H,{maxHeight:120},a__default.default.createElement(p,{variant:"body-default"},t))),a__default.default.createElement("span",{className:"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10"}),a__default.default.createElement("span",{className:"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10"}),a__default.default.createElement("div",{className:"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8"},e.map(n=>a__default.default.createElement(E,{key:n.title,...n}))));exports.AboutCard=he;//# sourceMappingURL=AboutCard.cjs.map
|
|
10
2
|
//# sourceMappingURL=AboutCard.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Text.tsx","../../src/components/IconRenderer.tsx","../../src/utils/index.ts","../../src/utils/tailwind.ts","../../src/components/Link.tsx","../../src/components/ContactItem.tsx","../../src/components/EditButton.tsx","../../src/components/Button.tsx","../../src/components/Icon.tsx","../../src/components/Pressable.tsx","../../src/components/Collapsible.tsx","../../src/components/AboutCard.tsx"],"names":["HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","IconRenderer","icon","sanitizedSvg","useMemo","svg","viewBox","cn","inputs","twMerge","clsx","focusRingStyles","Link","href","ContactItem","linkProps","filled","outlined","Button","f","isLoading","disabled","COLOR_MAP","BREAKPOINT_MAP","processSizes","sizes","sizeArray","mediaQueries","baseSize","valueStr","value","acc","query","Icon","name","title","style","IconComponent","IconMap","sizeStyles","Pressable","type","EditButton","onClick","Collapsible","maxHeight","open","setOpen","contentRef","useRef","contentHeight","setContentHeight","useState","useLayoutEffect","resizeObserver","entries","entry","shouldShowTrigger","h","AboutCard","interests","contactItems","description","isEditMode","onEditClick","contactProps"],"mappings":"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","file":"AboutCard.cjs","sourcesContent":["import React from \"react\";\nimport {\n Colors,\n TextColorVariant,\n PrimaryShades,\n SecondaryShades,\n TertiaryShades,\n Typography\n} from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype ColorCategory = keyof Omit<Colors, \"stroke\" | \"background\">;\ntype ColorValue<T extends ColorCategory> = T extends \"text\"\n ? TextColorVariant\n : T extends \"primary\"\n ? keyof PrimaryShades\n : T extends \"secondary\"\n ? keyof SecondaryShades\n : T extends \"tertiary\"\n ? keyof TertiaryShades\n : never;\n\ntype ColorKey = {\n [T in ColorCategory]: `${T}-${ColorValue<T>}`;\n}[ColorCategory];\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: ColorKey | \"inherit\";\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"text-primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses =\n color && color === \"inherit\" ? \"inherit\" : color ? `text-${color}` : \"\";\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`font-sans antialiased ${typographyClasses} ${colorClasses} ${\n weight ? `!${fontWeight[weight]}` : \"\"\n } ${className ?? \"\"}`}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { useMemo } from \"react\";\n\nexport type IconRendererProps = {\n icon: string;\n size?: number;\n className?: string;\n};\n\nexport const IconRenderer = ({\n icon,\n size = 40,\n className\n}: IconRendererProps) => {\n const sanitizedSvg = useMemo(() => {\n const parser = new DOMParser();\n const doc = parser.parseFromString(icon, \"image/svg+xml\");\n const svg = doc.querySelector(\"svg\");\n\n if (!svg) return null;\n\n // Set size attributes but preserve aspect ratio\n svg.setAttribute(\"width\", \"100%\");\n svg.setAttribute(\"height\", \"100%\");\n svg.setAttribute(\"preserveAspectRatio\", \"xMidYMid meet\");\n\n // Get the original viewBox or use the default\n const viewBox = svg.getAttribute(\"viewBox\") || \"0 0 40 40\";\n svg.setAttribute(\"viewBox\", viewBox);\n\n return svg.outerHTML;\n }, [icon]);\n\n if (!sanitizedSvg) return null;\n\n return (\n <div\n style={{\n width: size,\n height: size,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\"\n }}\n className={className}\n dangerouslySetInnerHTML={{ __html: sanitizedSvg }}\n />\n );\n};\n\nIconRenderer.displayName = \"IconRenderer\";\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n\n const safelist: string[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n return [\n ...typographyClasses,\n ...responsiveTypographyClasses\n // ... rest of your safelist\n ];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\";\n\nexport const focusRingStylesCoerced = \"ring-2 ring-ring ring-offset-2\";\n","import React from \"react\";\nimport { Text, TextProps } from \"./Text\";\nimport { cn } from \"../utils\";\nimport { focusRingStyles } from \"../utils/tailwind\";\n\nexport type LinkProps = {\n href: string;\n children: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n} & Pick<TextProps, \"variant\" | \"color\"> &\n React.AnchorHTMLAttributes<HTMLAnchorElement>;\n\nexport const Link = ({\n children,\n color = \"text-primary\",\n variant = \"body-default-semibold\",\n href,\n className,\n ...props\n}: LinkProps) => (\n <Text variant={variant} color={color}>\n <a\n href={href}\n className={cn(\n \"hover:opacity-80 transition-all active:scale-95 hover:underline\",\n focusRingStyles,\n className\n )}\n {...props}\n >\n {children}\n </a>\n </Text>\n);\n","import React, { HTMLAttributes } from \"react\";\nimport { IconRenderer } from \"./IconRenderer\";\nimport { Link } from \"./Link\";\n\nexport type ContactItemProps = {\n // TODO: figure out how to get filled icons to work correctly\n icon: string;\n children: React.ReactNode;\n href: string;\n} & Omit<HTMLAttributes<HTMLAnchorElement>, \"color\">;\n\nexport const ContactItem = ({\n icon,\n children,\n href,\n ...linkProps\n}: ContactItemProps) => (\n <div className=\"row gap-2 flex items-center\">\n <div className=\"bg-secondary-400 rounded-full p-2.5 items-center justify-center\">\n <IconRenderer icon={icon} size={24} className=\"text-primary\" />\n </div>\n <Link\n className=\"hover:underline\"\n href={href}\n {...linkProps}\n variant={[\"body-default-semibold\", \"md:body-default-medium\"]}\n >\n {children}\n </Link>\n </div>\n);\n","import React from \"react\";\nimport { cn } from \"../utils\";\nimport { outlined } from \"./Button\";\nimport { Icon } from \"./Icon\";\nimport { Pressable } from \"./Pressable\";\n\nexport type EditButtonProps = {\n className?: string;\n onClick?: () => void;\n};\n\nexport const EditButton = ({ className, onClick }: EditButtonProps) => {\n return (\n <Pressable\n className={cn(\n \"absolute lg:top-10 md:top-8 top-4 lg:right-10 md:right-8 right-4 lg:px-2 lg:py-2 px-1 py-1 rounded-lg\",\n outlined.black,\n className\n )}\n onClick={onClick}\n >\n <Icon color=\"primary\" name=\"edit-2\" />\n </Pressable>\n );\n};\n\nEditButton.displayName = \"EditButton\";\n","import * as React from \"react\";\nimport { Text } from \"./Text\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type ButtonProps = {\n /** @default filled */\n variant?: \"filled\" | \"outlined\";\n /** @default primary */\n color?: \"black\" | \"accent\" | \"secondary\";\n isLoading?: boolean;\n children: React.ReactNode;\n className?: string;\n disabled?: boolean;\n start?: React.ReactNode;\n end?: React.ReactNode;\n} & React.ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const filled = {\n black: \"bg-text-primary text-white\",\n // fade it slightly\n accent: \"bg-primary-100 text-white\",\n secondary: \"bg-secondary-100 text-secondary\"\n};\n\nexport const outlined = {\n black: \"border border-text-primary text-text-primary\",\n accent: \"border border-primary-100 text-primary-100\",\n secondary: \"border border-text-secondary text-secondary\"\n};\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant = \"filled\",\n color = \"black\",\n isLoading = false,\n children,\n disabled,\n ...props\n },\n ref\n ) => (\n <button\n ref={ref}\n className={cn(\n `\n sm:px-7 px-4\n py-2\n inline-flex items-center justify-center\n rounded-lg \n transition-colors duration-200\n disabled:opacity-50 disabled:pointer-events-none\n hover:opacity-80 active:scale-95 \n truncate`,\n focusRingStyles,\n variant === \"filled\" ? filled[color] : outlined[color],\n className\n )}\n disabled={disabled || isLoading}\n type=\"button\"\n {...props}\n >\n {typeof children === \"string\" ? (\n <Text\n variant={[\"sm:body-default-bold\", \"body-xxs-semibold\"]}\n color=\"inherit\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </button>\n )\n);\n\nButton.displayName = \"Button\";\n","import React, { SVGProps } from \"react\";\nimport { IconName, IconMap } from \"@deckai/icons\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\n\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveSize = number | `${Breakpoint}:${number}`;\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"#080808\",\n secondary: \"#666666\",\n white: \"#ffffff\",\n primaryBlue: \"#089CCB\"\n};\n\nconst BREAKPOINT_MAP: Record<Breakpoint, string> = {\n sm: \"640px\",\n md: \"768px\",\n lg: \"1024px\",\n xl: \"1280px\",\n \"2xl\": \"1536px\"\n};\n\nconst processSizes = (\n sizes: ResponsiveSize | ResponsiveSize[] | undefined\n): React.CSSProperties => {\n if (!sizes) return { width: \"24px\", height: \"24px\" };\n\n const sizeArray = Array.isArray(sizes) ? sizes : [sizes];\n const mediaQueries: Record<string, string> = {};\n let baseSize: string | undefined;\n\n // Process each size\n sizeArray.forEach((size) => {\n if (typeof size === \"number\") {\n baseSize = `${size}px`;\n } else {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n mediaQueries[`@media (min-width: ${BREAKPOINT_MAP[breakpoint]})`] =\n `${value}px`;\n }\n });\n\n // Create the style object with the correct structure\n return {\n width: baseSize || \"24px\",\n height: baseSize || \"24px\",\n ...Object.entries(mediaQueries).reduce(\n (acc, [query, size]) => ({\n ...acc,\n [query]: {\n width: size,\n height: size\n }\n }),\n {}\n )\n };\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const sizeStyles = processSizes(size);\n\n return (\n <div\n className={cn(\"flex justify-center items-center\", className)}\n style={{\n ...sizeStyles,\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable: React.FC<PressableProps> = ({\n children,\n type = \"button\",\n className,\n disabled,\n ...props\n}) => (\n <button\n // eslint-disable-next-line react/butt on-has-type\n type={type}\n disabled={disabled}\n className={`appearance-none hover:opacity-80 transition-all active:scale-95 ${focusRingStyles} ${className} ${disabled ? \"opacity-50 cursor-not-allowed\" : \"\"}`}\n {...props}\n >\n {children}\n </button>\n);\n","import React, { useRef, useLayoutEffect, useState } from \"react\";\nimport * as RadixCollapsible from \"@radix-ui/react-collapsible\";\nimport { Pressable } from \"./Pressable\";\nimport { Text } from \"./Text\";\nimport { cn } from \"../utils\";\n\nexport type CollapsibleProps = {\n children: React.ReactNode;\n maxHeight?: number;\n};\n\nexport const Collapsible = ({\n children,\n maxHeight = 100\n}: CollapsibleProps) => {\n const [open, setOpen] = React.useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const [contentHeight, setContentHeight] = useState<number>(maxHeight);\n\n // Measure content height on mount and resize\n useLayoutEffect(() => {\n if (!contentRef.current) return;\n\n const resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n setContentHeight(entry.target.scrollHeight);\n }\n });\n\n resizeObserver.observe(contentRef.current);\n return () => resizeObserver.disconnect();\n }, []);\n\n const shouldShowTrigger = contentHeight > maxHeight;\n\n return (\n <RadixCollapsible.Root open={open} onOpenChange={setOpen}>\n <div className=\"relative\">\n <div\n className=\"overflow-hidden transition-[height] duration-300 ease-in-out\"\n style={{\n height: open ? `${contentHeight}px` : `${maxHeight}px`\n }}\n >\n <div ref={contentRef} className=\"w-full\">\n {children}\n </div>\n </div>\n\n {shouldShowTrigger && (\n <RadixCollapsible.Trigger asChild>\n <Pressable\n className={cn(\n \"absolute -bottom-8 left-0 right-0\",\n \"flex items-end justify-center\",\n \"h-16 pt-8 pb-2\",\n !open && \"bg-gradient-to-b from-transparent via-white to-white\",\n \"hover:opacity-100 transition-opacity\"\n )}\n >\n <Text variant=\"label-default\" color=\"text-secondary\">\n {open ? \"See less\" : \"See more\"}\n </Text>\n </Pressable>\n </RadixCollapsible.Trigger>\n )}\n </div>\n </RadixCollapsible.Root>\n );\n};\n\nCollapsible.displayName = \"Collapsible\";\n","import React from \"react\";\nimport { Text } from \"./Text\";\nimport { ContactItem, ContactItemProps } from \"./ContactItem\";\nimport { EditButton } from \"./EditButton\";\nimport { Collapsible } from \"./Collapsible\";\n\nexport type AboutCardProps = {\n interests: string[];\n contactItems: ContactItemProps[];\n description: string;\n isEditMode?: boolean;\n onEditClick?: () => void;\n};\n\nexport const AboutCard = ({\n interests,\n contactItems,\n description,\n isEditMode = false,\n onEditClick,\n ...props\n}: AboutCardProps) => (\n <div\n className=\"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4\"\n {...props}\n >\n {isEditMode && <EditButton onClick={onEditClick} />}\n <div className=\"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0\">\n <Collapsible maxHeight={120}>\n <Text variant=\"body-default\">{description}</Text>\n </Collapsible>\n </div>\n {/* vertical divider for desktop */}\n <span className=\"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10\" />\n {/* horizontal divider for mobile */}\n <span className=\"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10\" />\n <div className=\"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8\">\n {contactItems.map((contactProps) => (\n <ContactItem key={contactProps.title} {...contactProps} />\n ))}\n </div>\n </div>\n);\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/Text.tsx","../../src/components/IconRenderer.tsx","../../src/utils/index.ts","../../src/utils/tailwind.ts","../../src/components/Link.tsx","../../src/components/ContactItem.tsx","../../src/components/Collapsible.tsx","../../src/components/Pressable.tsx","../../src/components/AboutCard.tsx"],"names":["HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","IconRenderer","icon","sanitizedSvg","useMemo","svg","viewBox","cn","inputs","twMerge","clsx","focusRingStyles","Link","href","ContactItem","linkProps","Pressable","type","disabled","Collapsible","maxHeight","open","setOpen","contentRef","useRef","contentHeight","setContentHeight","useState","useLayoutEffect","resizeObserver","entries","entry","shouldShowTrigger","y","AboutCard","contactItems","description","isEditMode","onEditClick","contactProps"],"mappings":"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","file":"AboutCard.cjs","sourcesContent":["import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses =\n color === \"inherit\" ? \"text-inherit\" : `text-text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`font-sans antialiased ${typographyClasses} ${colorClasses} ${\n weight ? `!${fontWeight[weight]}` : \"\"\n } ${className ?? \"\"}`}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { useMemo } from \"react\";\n\nexport type IconRendererProps = {\n icon: string;\n size?: number;\n className?: string;\n};\n\nexport const IconRenderer = ({\n icon,\n size = 40,\n className\n}: IconRendererProps) => {\n const sanitizedSvg = useMemo(() => {\n const parser = new DOMParser();\n const doc = parser.parseFromString(icon, \"image/svg+xml\");\n const svg = doc.querySelector(\"svg\");\n\n if (!svg) return null;\n\n // Set size attributes but preserve aspect ratio\n svg.setAttribute(\"width\", \"100%\");\n svg.setAttribute(\"height\", \"100%\");\n svg.setAttribute(\"preserveAspectRatio\", \"xMidYMid meet\");\n\n // Get the original viewBox or use the default\n const viewBox = svg.getAttribute(\"viewBox\") || \"0 0 40 40\";\n svg.setAttribute(\"viewBox\", viewBox);\n\n return svg.outerHTML;\n }, [icon]);\n\n if (!sanitizedSvg) return null;\n\n return (\n <div\n style={{\n width: size,\n height: size,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\"\n }}\n className={className}\n dangerouslySetInnerHTML={{ __html: sanitizedSvg }}\n />\n );\n};\n\nIconRenderer.displayName = \"IconRenderer\";\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n\n const safelist: string[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n return [\n ...typographyClasses,\n ...responsiveTypographyClasses\n // ... rest of your safelist\n ];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\";\n\nexport const focusRingStylesCoerced = \"ring-2 ring-ring ring-offset-2\";\n","import React from \"react\";\nimport { Text, TextProps } from \"./Text\";\nimport { cn } from \"../utils\";\nimport { focusRingStyles } from \"../utils/tailwind\";\n\nexport type LinkProps = {\n href: string;\n children: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n} & Pick<TextProps, \"variant\" | \"color\"> &\n React.AnchorHTMLAttributes<HTMLAnchorElement>;\n\nexport const Link = ({\n children,\n color = \"inherit\",\n variant = \"body-default-semibold\",\n href,\n className,\n ...props\n}: LinkProps) => (\n <Text variant={variant} color={color}>\n <a\n href={href}\n className={cn(\n \"hover:opacity-80 transition-all ease-in-out active:scale-95 hover:underline\",\n focusRingStyles,\n className\n )}\n {...props}\n >\n {children}\n </a>\n </Text>\n);\n","import React, { HTMLAttributes } from \"react\";\nimport { IconRenderer } from \"./IconRenderer\";\nimport { Link } from \"./Link\";\n\nexport type ContactItemProps = {\n // TODO: figure out how to get filled icons to work correctly\n icon: string;\n children: React.ReactNode;\n href: string;\n} & Omit<HTMLAttributes<HTMLAnchorElement>, \"color\">;\n\nexport const ContactItem = ({\n icon,\n children,\n href,\n ...linkProps\n}: ContactItemProps) => (\n <div className=\"row gap-2 flex items-center\">\n <div className=\"bg-secondary-400 rounded-full p-2.5 items-center justify-center\">\n <IconRenderer icon={icon} size={18} className=\"text-text\" />\n </div>\n <Link\n className=\"hover:underline\"\n href={href}\n {...linkProps}\n variant={[\"body-default-semibold\", \"md:body-default-semibold\"]}\n >\n {children}\n </Link>\n </div>\n);\n","import React, { useRef, useLayoutEffect, useState } from \"react\";\nimport * as RadixCollapsible from \"@radix-ui/react-collapsible\";\nimport { Pressable } from \"./Pressable\";\nimport { Text } from \"./Text\";\nimport { cn } from \"../utils\";\n\nexport type CollapsibleProps = {\n children: React.ReactNode;\n maxHeight?: number;\n};\n\nexport const Collapsible = ({\n children,\n maxHeight = 100\n}: CollapsibleProps) => {\n const [open, setOpen] = React.useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const [contentHeight, setContentHeight] = useState<number>(maxHeight);\n\n // Measure content height on mount and resize\n useLayoutEffect(() => {\n if (!contentRef.current) return;\n\n const resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n setContentHeight(entry.target.scrollHeight);\n }\n });\n\n resizeObserver.observe(contentRef.current);\n return () => resizeObserver.disconnect();\n }, []);\n\n const shouldShowTrigger = contentHeight > maxHeight;\n\n return (\n <RadixCollapsible.Root open={open} onOpenChange={setOpen}>\n <div className=\"relative\">\n <div\n className=\"overflow-hidden transition-[height] duration-300 ease-in-out\"\n style={{\n height: open ? `${contentHeight}px` : `${maxHeight}px`\n }}\n >\n <div ref={contentRef} className=\"w-full\">\n {children}\n </div>\n </div>\n\n {shouldShowTrigger && (\n <RadixCollapsible.Trigger asChild>\n <Pressable\n className={cn(\n \"absolute -bottom-8 left-0 right-0\",\n \"flex items-end justify-center\",\n \"h-16 pt-8 pb-2\",\n !open && \"bg-gradient-to-b from-transparent via-white to-white\",\n \"hover:opacity-100 transition-opacity\"\n )}\n >\n <Text variant=\"label-default\" color=\"secondary\">\n {open ? \"See less\" : \"See more\"}\n </Text>\n </Pressable>\n </RadixCollapsible.Trigger>\n )}\n </div>\n </RadixCollapsible.Root>\n );\n};\n\nCollapsible.displayName = \"Collapsible\";\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import React from \"react\";\nimport { Text } from \"./Text\";\nimport { ContactItem, ContactItemProps } from \"./ContactItem\";\nimport { Collapsible } from \"./Collapsible\";\n\nexport type AboutCardProps = {\n contactItems: ContactItemProps[];\n description: string;\n isEditMode?: boolean;\n onEditClick?: () => void;\n};\n\nexport const AboutCard = ({\n contactItems,\n description,\n isEditMode = false,\n onEditClick,\n ...props\n}: AboutCardProps) => (\n <div\n className=\"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4\"\n {...props}\n >\n <div className=\"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0 justify-center\">\n <Collapsible maxHeight={120}>\n <Text variant=\"body-default\">{description}</Text>\n </Collapsible>\n </div>\n {/* vertical divider for desktop */}\n <span className=\"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10\" />\n {/* horizontal divider for mobile */}\n <span className=\"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10\" />\n <div className=\"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8\">\n {contactItems.map((contactProps) => (\n <ContactItem key={contactProps.title} {...contactProps} />\n ))}\n </div>\n </div>\n);\n"]}
|
|
@@ -2,12 +2,11 @@ import React__default from 'react';
|
|
|
2
2
|
import { ContactItemProps } from './ContactItem.cjs';
|
|
3
3
|
|
|
4
4
|
type AboutCardProps = {
|
|
5
|
-
interests: string[];
|
|
6
5
|
contactItems: ContactItemProps[];
|
|
7
6
|
description: string;
|
|
8
7
|
isEditMode?: boolean;
|
|
9
8
|
onEditClick?: () => void;
|
|
10
9
|
};
|
|
11
|
-
declare const AboutCard: ({
|
|
10
|
+
declare const AboutCard: ({ contactItems, description, isEditMode, onEditClick, ...props }: AboutCardProps) => React__default.JSX.Element;
|
|
12
11
|
|
|
13
12
|
export { AboutCard, type AboutCardProps };
|
|
@@ -2,12 +2,11 @@ import React__default from 'react';
|
|
|
2
2
|
import { ContactItemProps } from './ContactItem.js';
|
|
3
3
|
|
|
4
4
|
type AboutCardProps = {
|
|
5
|
-
interests: string[];
|
|
6
5
|
contactItems: ContactItemProps[];
|
|
7
6
|
description: string;
|
|
8
7
|
isEditMode?: boolean;
|
|
9
8
|
onEditClick?: () => void;
|
|
10
9
|
};
|
|
11
|
-
declare const AboutCard: ({
|
|
10
|
+
declare const AboutCard: ({ contactItems, description, isEditMode, onEditClick, ...props }: AboutCardProps) => React__default.JSX.Element;
|
|
12
11
|
|
|
13
12
|
export { AboutCard, type AboutCardProps };
|
|
@@ -1,10 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
sm:px-7 px-4
|
|
3
|
-
py-2
|
|
4
|
-
inline-flex items-center justify-center
|
|
5
|
-
rounded-lg
|
|
6
|
-
transition-colors duration-200
|
|
7
|
-
disabled:opacity-50 disabled:pointer-events-none
|
|
8
|
-
hover:opacity-80 active:scale-95
|
|
9
|
-
truncate`,y,t==="filled"?K[r]:M[r],e),disabled:i||o,type:"button",...n},typeof s=="string"?c.createElement(p,{variant:["sm:body-default-bold","body-xxs-semibold"],color:"inherit"},s):s));G.displayName="Button";var S={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB"},F={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},q=e=>{if(!e)return {width:"24px",height:"24px"};let t=Array.isArray(e)?e:[e],r={},o;return t.forEach(s=>{if(typeof s=="number")o=`${s}px`;else {let[i,n]=s.split(":"),a=parseInt(n,10);r[`@media (min-width: ${F[i]})`]=`${a}px`;}}),{width:o||"24px",height:o||"24px",...Object.entries(r).reduce((s,[i,n])=>({...s,[i]:{width:n,height:n}}),{})}},C=c__default.forwardRef(({name:e,size:t=24,color:r="primary",title:o,className:s,style:i={},...n},a)=>{let d=IconMap[e],u=q(t);return c__default.createElement("div",{className:l("flex justify-center items-center",s),style:{...u,"--icon-stroke":S[r],...i}},c__default.createElement(d,{ref:a,"aria-hidden":!o,"aria-label":o,stroke:e.includes("filled")?void 0:S[r],...n}))});C.displayName="Icon";var g=({children:e,type:t="button",className:r,disabled:o,...s})=>c__default.createElement("button",{type:t,disabled:o,className:`appearance-none hover:opacity-80 transition-all active:scale-95 ${y} ${r} ${o?"opacity-50 cursor-not-allowed":""}`,...s},e);var E=({className:e,onClick:t})=>c__default.createElement(g,{className:l("absolute lg:top-10 md:top-8 top-4 lg:right-10 md:right-8 right-4 lg:px-2 lg:py-2 px-1 py-1 rounded-lg",M.black,e),onClick:t},c__default.createElement(C,{color:"primary",name:"edit-2"}));E.displayName="EditButton";var v=({children:e,maxHeight:t=100})=>{let[r,o]=c__default.useState(!1),s=useRef(null),[i,n]=useState(t);useLayoutEffect(()=>{if(!s.current)return;let d=new ResizeObserver(u=>{for(let x of u)n(x.target.scrollHeight);});return d.observe(s.current),()=>d.disconnect()},[]);let a=i>t;return c__default.createElement(h.Root,{open:r,onOpenChange:o},c__default.createElement("div",{className:"relative"},c__default.createElement("div",{className:"overflow-hidden transition-[height] duration-300 ease-in-out",style:{height:r?`${i}px`:`${t}px`}},c__default.createElement("div",{ref:s,className:"w-full"},e)),a&&c__default.createElement(h.Trigger,{asChild:!0},c__default.createElement(g,{className:l("absolute -bottom-8 left-0 right-0","flex items-end justify-center","h-16 pt-8 pb-2",!r&&"bg-gradient-to-b from-transparent via-white to-white","hover:opacity-100 transition-opacity")},c__default.createElement(p,{variant:"label-default",color:"text-secondary"},r?"See less":"See more")))))};v.displayName="Collapsible";var De=({interests:e,contactItems:t,description:r,isEditMode:o=!1,onEditClick:s,...i})=>c__default.createElement("div",{className:"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4",...i},o&&c__default.createElement(E,{onClick:s}),c__default.createElement("div",{className:"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0"},c__default.createElement(v,{maxHeight:120},c__default.createElement(p,{variant:"body-default"},r))),c__default.createElement("span",{className:"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10"}),c__default.createElement("span",{className:"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10"}),c__default.createElement("div",{className:"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8"},t.map(n=>c__default.createElement(P,{key:n.title,...n}))));if (exports.default) module.exports = exports.default;export{De as AboutCard};//# sourceMappingURL=AboutCard.js.map
|
|
1
|
+
import a,{useRef,useState,useLayoutEffect,useMemo}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import*as y from'@radix-ui/react-collapsible';var A={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},R=e=>{let[t,r]=e.split("-");return t==="heading"?A[r]||"p":t==="label"?"label":"p"},$={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},P=e=>e?(Array.isArray(e)?e:[e]).map(r=>{if(r.includes(":")){let[o,s]=r.split(":");return `${o}:text-${s}`}return `text-${r}`}).join(" "):"text-body-default",p=a.forwardRef(({variant:e="body-default",color:t="primary",as:r,className:o,children:s,weight:n,...i},m)=>{let d=P(e),b=t==="inherit"?"text-inherit":`text-text-${t}`,f=a.useMemo(()=>{let C=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return R(C)},[e]);return a.createElement(r||f,{ref:m,className:`font-sans antialiased ${d} ${b} ${n?`!${$[n]}`:""} ${o??""}`,...i},s)});p.displayName="Text";var h=({icon:e,size:t=40,className:r})=>{let o=useMemo(()=>{let i=new DOMParser().parseFromString(e,"image/svg+xml").querySelector("svg");if(!i)return null;i.setAttribute("width","100%"),i.setAttribute("height","100%"),i.setAttribute("preserveAspectRatio","xMidYMid meet");let m=i.getAttribute("viewBox")||"0 0 40 40";return i.setAttribute("viewBox",m),i.outerHTML},[e]);return o?a.createElement("div",{style:{width:t,height:t,display:"flex",alignItems:"center",justifyContent:"center"},className:r,dangerouslySetInnerHTML:{__html:o}}):null};h.displayName="IconRenderer";function c(...e){return twMerge(clsx(e))}var u="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2";var L=({children:e,color:t="inherit",variant:r="body-default-semibold",href:o,className:s,...n})=>a.createElement(p,{variant:r,color:t},a.createElement("a",{href:o,className:c("hover:opacity-80 transition-all ease-in-out active:scale-95 hover:underline",u,s),...n},e));var E=({icon:e,children:t,href:r,...o})=>a.createElement("div",{className:"row gap-2 flex items-center"},a.createElement("div",{className:"bg-secondary-400 rounded-full p-2.5 items-center justify-center"},a.createElement(h,{icon:e,size:18,className:"text-text"})),a.createElement(L,{className:"hover:underline",href:r,...o,variant:["body-default-semibold","md:body-default-semibold"]},t));var x=a.forwardRef(({children:e,type:t="button",className:r,disabled:o,...s},n)=>a.createElement("button",{ref:n,type:t,disabled:o,className:c("appearance-none hover:opacity-80 transition-all active:scale-95",u,o&&"opacity-50 cursor-not-allowed",r),...s},e));x.displayName="Pressable";var H=({children:e,maxHeight:t=100})=>{let[r,o]=a.useState(!1),s=useRef(null),[n,i]=useState(t);useLayoutEffect(()=>{if(!s.current)return;let d=new ResizeObserver(b=>{for(let f of b)i(f.target.scrollHeight);});return d.observe(s.current),()=>d.disconnect()},[]);let m=n>t;return a.createElement(y.Root,{open:r,onOpenChange:o},a.createElement("div",{className:"relative"},a.createElement("div",{className:"overflow-hidden transition-[height] duration-300 ease-in-out",style:{height:r?`${n}px`:`${t}px`}},a.createElement("div",{ref:s,className:"w-full"},e)),m&&a.createElement(y.Trigger,{asChild:!0},a.createElement(x,{className:c("absolute -bottom-8 left-0 right-0","flex items-end justify-center","h-16 pt-8 pb-2",!r&&"bg-gradient-to-b from-transparent via-white to-white","hover:opacity-100 transition-opacity")},a.createElement(p,{variant:"label-default",color:"secondary"},r?"See less":"See more")))))};H.displayName="Collapsible";var he=({contactItems:e,description:t,isEditMode:r=!1,onEditClick:o,...s})=>a.createElement("div",{className:"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4",...s},a.createElement("div",{className:"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0 justify-center"},a.createElement(H,{maxHeight:120},a.createElement(p,{variant:"body-default"},t))),a.createElement("span",{className:"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10"}),a.createElement("span",{className:"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10"}),a.createElement("div",{className:"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8"},e.map(n=>a.createElement(E,{key:n.title,...n}))));export{he as AboutCard};//# sourceMappingURL=AboutCard.js.map
|
|
10
2
|
//# sourceMappingURL=AboutCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Text.tsx","../../src/components/IconRenderer.tsx","../../src/utils/index.ts","../../src/utils/tailwind.ts","../../src/components/Link.tsx","../../src/components/ContactItem.tsx","../../src/components/EditButton.tsx","../../src/components/Button.tsx","../../src/components/Icon.tsx","../../src/components/Pressable.tsx","../../src/components/Collapsible.tsx","../../src/components/AboutCard.tsx"],"names":["HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","IconRenderer","icon","sanitizedSvg","useMemo","svg","viewBox","cn","inputs","twMerge","clsx","focusRingStyles","Link","href","ContactItem","linkProps","filled","outlined","Button","f","isLoading","disabled","COLOR_MAP","BREAKPOINT_MAP","processSizes","sizes","sizeArray","mediaQueries","baseSize","valueStr","value","acc","query","Icon","name","title","style","IconComponent","IconMap","sizeStyles","Pressable","type","EditButton","onClick","Collapsible","maxHeight","open","setOpen","contentRef","useRef","contentHeight","setContentHeight","useState","useLayoutEffect","resizeObserver","entries","entry","shouldShowTrigger","AboutCard","interests","contactItems","description","isEditMode","onEditClick","contactProps"],"mappings":"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","file":"AboutCard.js","sourcesContent":["import React from \"react\";\nimport {\n Colors,\n TextColorVariant,\n PrimaryShades,\n SecondaryShades,\n TertiaryShades,\n Typography\n} from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype ColorCategory = keyof Omit<Colors, \"stroke\" | \"background\">;\ntype ColorValue<T extends ColorCategory> = T extends \"text\"\n ? TextColorVariant\n : T extends \"primary\"\n ? keyof PrimaryShades\n : T extends \"secondary\"\n ? keyof SecondaryShades\n : T extends \"tertiary\"\n ? keyof TertiaryShades\n : never;\n\ntype ColorKey = {\n [T in ColorCategory]: `${T}-${ColorValue<T>}`;\n}[ColorCategory];\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: ColorKey | \"inherit\";\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"text-primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses =\n color && color === \"inherit\" ? \"inherit\" : color ? `text-${color}` : \"\";\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`font-sans antialiased ${typographyClasses} ${colorClasses} ${\n weight ? `!${fontWeight[weight]}` : \"\"\n } ${className ?? \"\"}`}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { useMemo } from \"react\";\n\nexport type IconRendererProps = {\n icon: string;\n size?: number;\n className?: string;\n};\n\nexport const IconRenderer = ({\n icon,\n size = 40,\n className\n}: IconRendererProps) => {\n const sanitizedSvg = useMemo(() => {\n const parser = new DOMParser();\n const doc = parser.parseFromString(icon, \"image/svg+xml\");\n const svg = doc.querySelector(\"svg\");\n\n if (!svg) return null;\n\n // Set size attributes but preserve aspect ratio\n svg.setAttribute(\"width\", \"100%\");\n svg.setAttribute(\"height\", \"100%\");\n svg.setAttribute(\"preserveAspectRatio\", \"xMidYMid meet\");\n\n // Get the original viewBox or use the default\n const viewBox = svg.getAttribute(\"viewBox\") || \"0 0 40 40\";\n svg.setAttribute(\"viewBox\", viewBox);\n\n return svg.outerHTML;\n }, [icon]);\n\n if (!sanitizedSvg) return null;\n\n return (\n <div\n style={{\n width: size,\n height: size,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\"\n }}\n className={className}\n dangerouslySetInnerHTML={{ __html: sanitizedSvg }}\n />\n );\n};\n\nIconRenderer.displayName = \"IconRenderer\";\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n\n const safelist: string[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n return [\n ...typographyClasses,\n ...responsiveTypographyClasses\n // ... rest of your safelist\n ];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\";\n\nexport const focusRingStylesCoerced = \"ring-2 ring-ring ring-offset-2\";\n","import React from \"react\";\nimport { Text, TextProps } from \"./Text\";\nimport { cn } from \"../utils\";\nimport { focusRingStyles } from \"../utils/tailwind\";\n\nexport type LinkProps = {\n href: string;\n children: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n} & Pick<TextProps, \"variant\" | \"color\"> &\n React.AnchorHTMLAttributes<HTMLAnchorElement>;\n\nexport const Link = ({\n children,\n color = \"text-primary\",\n variant = \"body-default-semibold\",\n href,\n className,\n ...props\n}: LinkProps) => (\n <Text variant={variant} color={color}>\n <a\n href={href}\n className={cn(\n \"hover:opacity-80 transition-all active:scale-95 hover:underline\",\n focusRingStyles,\n className\n )}\n {...props}\n >\n {children}\n </a>\n </Text>\n);\n","import React, { HTMLAttributes } from \"react\";\nimport { IconRenderer } from \"./IconRenderer\";\nimport { Link } from \"./Link\";\n\nexport type ContactItemProps = {\n // TODO: figure out how to get filled icons to work correctly\n icon: string;\n children: React.ReactNode;\n href: string;\n} & Omit<HTMLAttributes<HTMLAnchorElement>, \"color\">;\n\nexport const ContactItem = ({\n icon,\n children,\n href,\n ...linkProps\n}: ContactItemProps) => (\n <div className=\"row gap-2 flex items-center\">\n <div className=\"bg-secondary-400 rounded-full p-2.5 items-center justify-center\">\n <IconRenderer icon={icon} size={24} className=\"text-primary\" />\n </div>\n <Link\n className=\"hover:underline\"\n href={href}\n {...linkProps}\n variant={[\"body-default-semibold\", \"md:body-default-medium\"]}\n >\n {children}\n </Link>\n </div>\n);\n","import React from \"react\";\nimport { cn } from \"../utils\";\nimport { outlined } from \"./Button\";\nimport { Icon } from \"./Icon\";\nimport { Pressable } from \"./Pressable\";\n\nexport type EditButtonProps = {\n className?: string;\n onClick?: () => void;\n};\n\nexport const EditButton = ({ className, onClick }: EditButtonProps) => {\n return (\n <Pressable\n className={cn(\n \"absolute lg:top-10 md:top-8 top-4 lg:right-10 md:right-8 right-4 lg:px-2 lg:py-2 px-1 py-1 rounded-lg\",\n outlined.black,\n className\n )}\n onClick={onClick}\n >\n <Icon color=\"primary\" name=\"edit-2\" />\n </Pressable>\n );\n};\n\nEditButton.displayName = \"EditButton\";\n","import * as React from \"react\";\nimport { Text } from \"./Text\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type ButtonProps = {\n /** @default filled */\n variant?: \"filled\" | \"outlined\";\n /** @default primary */\n color?: \"black\" | \"accent\" | \"secondary\";\n isLoading?: boolean;\n children: React.ReactNode;\n className?: string;\n disabled?: boolean;\n start?: React.ReactNode;\n end?: React.ReactNode;\n} & React.ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const filled = {\n black: \"bg-text-primary text-white\",\n // fade it slightly\n accent: \"bg-primary-100 text-white\",\n secondary: \"bg-secondary-100 text-secondary\"\n};\n\nexport const outlined = {\n black: \"border border-text-primary text-text-primary\",\n accent: \"border border-primary-100 text-primary-100\",\n secondary: \"border border-text-secondary text-secondary\"\n};\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant = \"filled\",\n color = \"black\",\n isLoading = false,\n children,\n disabled,\n ...props\n },\n ref\n ) => (\n <button\n ref={ref}\n className={cn(\n `\n sm:px-7 px-4\n py-2\n inline-flex items-center justify-center\n rounded-lg \n transition-colors duration-200\n disabled:opacity-50 disabled:pointer-events-none\n hover:opacity-80 active:scale-95 \n truncate`,\n focusRingStyles,\n variant === \"filled\" ? filled[color] : outlined[color],\n className\n )}\n disabled={disabled || isLoading}\n type=\"button\"\n {...props}\n >\n {typeof children === \"string\" ? (\n <Text\n variant={[\"sm:body-default-bold\", \"body-xxs-semibold\"]}\n color=\"inherit\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </button>\n )\n);\n\nButton.displayName = \"Button\";\n","import React, { SVGProps } from \"react\";\nimport { IconName, IconMap } from \"@deckai/icons\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\n\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveSize = number | `${Breakpoint}:${number}`;\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"#080808\",\n secondary: \"#666666\",\n white: \"#ffffff\",\n primaryBlue: \"#089CCB\"\n};\n\nconst BREAKPOINT_MAP: Record<Breakpoint, string> = {\n sm: \"640px\",\n md: \"768px\",\n lg: \"1024px\",\n xl: \"1280px\",\n \"2xl\": \"1536px\"\n};\n\nconst processSizes = (\n sizes: ResponsiveSize | ResponsiveSize[] | undefined\n): React.CSSProperties => {\n if (!sizes) return { width: \"24px\", height: \"24px\" };\n\n const sizeArray = Array.isArray(sizes) ? sizes : [sizes];\n const mediaQueries: Record<string, string> = {};\n let baseSize: string | undefined;\n\n // Process each size\n sizeArray.forEach((size) => {\n if (typeof size === \"number\") {\n baseSize = `${size}px`;\n } else {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n mediaQueries[`@media (min-width: ${BREAKPOINT_MAP[breakpoint]})`] =\n `${value}px`;\n }\n });\n\n // Create the style object with the correct structure\n return {\n width: baseSize || \"24px\",\n height: baseSize || \"24px\",\n ...Object.entries(mediaQueries).reduce(\n (acc, [query, size]) => ({\n ...acc,\n [query]: {\n width: size,\n height: size\n }\n }),\n {}\n )\n };\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const sizeStyles = processSizes(size);\n\n return (\n <div\n className={cn(\"flex justify-center items-center\", className)}\n style={{\n ...sizeStyles,\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable: React.FC<PressableProps> = ({\n children,\n type = \"button\",\n className,\n disabled,\n ...props\n}) => (\n <button\n // eslint-disable-next-line react/butt on-has-type\n type={type}\n disabled={disabled}\n className={`appearance-none hover:opacity-80 transition-all active:scale-95 ${focusRingStyles} ${className} ${disabled ? \"opacity-50 cursor-not-allowed\" : \"\"}`}\n {...props}\n >\n {children}\n </button>\n);\n","import React, { useRef, useLayoutEffect, useState } from \"react\";\nimport * as RadixCollapsible from \"@radix-ui/react-collapsible\";\nimport { Pressable } from \"./Pressable\";\nimport { Text } from \"./Text\";\nimport { cn } from \"../utils\";\n\nexport type CollapsibleProps = {\n children: React.ReactNode;\n maxHeight?: number;\n};\n\nexport const Collapsible = ({\n children,\n maxHeight = 100\n}: CollapsibleProps) => {\n const [open, setOpen] = React.useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const [contentHeight, setContentHeight] = useState<number>(maxHeight);\n\n // Measure content height on mount and resize\n useLayoutEffect(() => {\n if (!contentRef.current) return;\n\n const resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n setContentHeight(entry.target.scrollHeight);\n }\n });\n\n resizeObserver.observe(contentRef.current);\n return () => resizeObserver.disconnect();\n }, []);\n\n const shouldShowTrigger = contentHeight > maxHeight;\n\n return (\n <RadixCollapsible.Root open={open} onOpenChange={setOpen}>\n <div className=\"relative\">\n <div\n className=\"overflow-hidden transition-[height] duration-300 ease-in-out\"\n style={{\n height: open ? `${contentHeight}px` : `${maxHeight}px`\n }}\n >\n <div ref={contentRef} className=\"w-full\">\n {children}\n </div>\n </div>\n\n {shouldShowTrigger && (\n <RadixCollapsible.Trigger asChild>\n <Pressable\n className={cn(\n \"absolute -bottom-8 left-0 right-0\",\n \"flex items-end justify-center\",\n \"h-16 pt-8 pb-2\",\n !open && \"bg-gradient-to-b from-transparent via-white to-white\",\n \"hover:opacity-100 transition-opacity\"\n )}\n >\n <Text variant=\"label-default\" color=\"text-secondary\">\n {open ? \"See less\" : \"See more\"}\n </Text>\n </Pressable>\n </RadixCollapsible.Trigger>\n )}\n </div>\n </RadixCollapsible.Root>\n );\n};\n\nCollapsible.displayName = \"Collapsible\";\n","import React from \"react\";\nimport { Text } from \"./Text\";\nimport { ContactItem, ContactItemProps } from \"./ContactItem\";\nimport { EditButton } from \"./EditButton\";\nimport { Collapsible } from \"./Collapsible\";\n\nexport type AboutCardProps = {\n interests: string[];\n contactItems: ContactItemProps[];\n description: string;\n isEditMode?: boolean;\n onEditClick?: () => void;\n};\n\nexport const AboutCard = ({\n interests,\n contactItems,\n description,\n isEditMode = false,\n onEditClick,\n ...props\n}: AboutCardProps) => (\n <div\n className=\"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4\"\n {...props}\n >\n {isEditMode && <EditButton onClick={onEditClick} />}\n <div className=\"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0\">\n <Collapsible maxHeight={120}>\n <Text variant=\"body-default\">{description}</Text>\n </Collapsible>\n </div>\n {/* vertical divider for desktop */}\n <span className=\"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10\" />\n {/* horizontal divider for mobile */}\n <span className=\"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10\" />\n <div className=\"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8\">\n {contactItems.map((contactProps) => (\n <ContactItem key={contactProps.title} {...contactProps} />\n ))}\n </div>\n </div>\n);\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/Text.tsx","../../src/components/IconRenderer.tsx","../../src/utils/index.ts","../../src/utils/tailwind.ts","../../src/components/Link.tsx","../../src/components/ContactItem.tsx","../../src/components/Collapsible.tsx","../../src/components/Pressable.tsx","../../src/components/AboutCard.tsx"],"names":["HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","IconRenderer","icon","sanitizedSvg","useMemo","svg","viewBox","cn","inputs","twMerge","clsx","focusRingStyles","Link","href","ContactItem","linkProps","Pressable","type","disabled","Collapsible","maxHeight","open","setOpen","contentRef","useRef","contentHeight","setContentHeight","useState","useLayoutEffect","resizeObserver","entries","entry","shouldShowTrigger","AboutCard","contactItems","description","isEditMode","onEditClick","contactProps"],"mappings":"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","file":"AboutCard.js","sourcesContent":["import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses =\n color === \"inherit\" ? \"text-inherit\" : `text-text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`font-sans antialiased ${typographyClasses} ${colorClasses} ${\n weight ? `!${fontWeight[weight]}` : \"\"\n } ${className ?? \"\"}`}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { useMemo } from \"react\";\n\nexport type IconRendererProps = {\n icon: string;\n size?: number;\n className?: string;\n};\n\nexport const IconRenderer = ({\n icon,\n size = 40,\n className\n}: IconRendererProps) => {\n const sanitizedSvg = useMemo(() => {\n const parser = new DOMParser();\n const doc = parser.parseFromString(icon, \"image/svg+xml\");\n const svg = doc.querySelector(\"svg\");\n\n if (!svg) return null;\n\n // Set size attributes but preserve aspect ratio\n svg.setAttribute(\"width\", \"100%\");\n svg.setAttribute(\"height\", \"100%\");\n svg.setAttribute(\"preserveAspectRatio\", \"xMidYMid meet\");\n\n // Get the original viewBox or use the default\n const viewBox = svg.getAttribute(\"viewBox\") || \"0 0 40 40\";\n svg.setAttribute(\"viewBox\", viewBox);\n\n return svg.outerHTML;\n }, [icon]);\n\n if (!sanitizedSvg) return null;\n\n return (\n <div\n style={{\n width: size,\n height: size,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\"\n }}\n className={className}\n dangerouslySetInnerHTML={{ __html: sanitizedSvg }}\n />\n );\n};\n\nIconRenderer.displayName = \"IconRenderer\";\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n\n const safelist: string[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n return [\n ...typographyClasses,\n ...responsiveTypographyClasses\n // ... rest of your safelist\n ];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\";\n\nexport const focusRingStylesCoerced = \"ring-2 ring-ring ring-offset-2\";\n","import React from \"react\";\nimport { Text, TextProps } from \"./Text\";\nimport { cn } from \"../utils\";\nimport { focusRingStyles } from \"../utils/tailwind\";\n\nexport type LinkProps = {\n href: string;\n children: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n} & Pick<TextProps, \"variant\" | \"color\"> &\n React.AnchorHTMLAttributes<HTMLAnchorElement>;\n\nexport const Link = ({\n children,\n color = \"inherit\",\n variant = \"body-default-semibold\",\n href,\n className,\n ...props\n}: LinkProps) => (\n <Text variant={variant} color={color}>\n <a\n href={href}\n className={cn(\n \"hover:opacity-80 transition-all ease-in-out active:scale-95 hover:underline\",\n focusRingStyles,\n className\n )}\n {...props}\n >\n {children}\n </a>\n </Text>\n);\n","import React, { HTMLAttributes } from \"react\";\nimport { IconRenderer } from \"./IconRenderer\";\nimport { Link } from \"./Link\";\n\nexport type ContactItemProps = {\n // TODO: figure out how to get filled icons to work correctly\n icon: string;\n children: React.ReactNode;\n href: string;\n} & Omit<HTMLAttributes<HTMLAnchorElement>, \"color\">;\n\nexport const ContactItem = ({\n icon,\n children,\n href,\n ...linkProps\n}: ContactItemProps) => (\n <div className=\"row gap-2 flex items-center\">\n <div className=\"bg-secondary-400 rounded-full p-2.5 items-center justify-center\">\n <IconRenderer icon={icon} size={18} className=\"text-text\" />\n </div>\n <Link\n className=\"hover:underline\"\n href={href}\n {...linkProps}\n variant={[\"body-default-semibold\", \"md:body-default-semibold\"]}\n >\n {children}\n </Link>\n </div>\n);\n","import React, { useRef, useLayoutEffect, useState } from \"react\";\nimport * as RadixCollapsible from \"@radix-ui/react-collapsible\";\nimport { Pressable } from \"./Pressable\";\nimport { Text } from \"./Text\";\nimport { cn } from \"../utils\";\n\nexport type CollapsibleProps = {\n children: React.ReactNode;\n maxHeight?: number;\n};\n\nexport const Collapsible = ({\n children,\n maxHeight = 100\n}: CollapsibleProps) => {\n const [open, setOpen] = React.useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const [contentHeight, setContentHeight] = useState<number>(maxHeight);\n\n // Measure content height on mount and resize\n useLayoutEffect(() => {\n if (!contentRef.current) return;\n\n const resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n setContentHeight(entry.target.scrollHeight);\n }\n });\n\n resizeObserver.observe(contentRef.current);\n return () => resizeObserver.disconnect();\n }, []);\n\n const shouldShowTrigger = contentHeight > maxHeight;\n\n return (\n <RadixCollapsible.Root open={open} onOpenChange={setOpen}>\n <div className=\"relative\">\n <div\n className=\"overflow-hidden transition-[height] duration-300 ease-in-out\"\n style={{\n height: open ? `${contentHeight}px` : `${maxHeight}px`\n }}\n >\n <div ref={contentRef} className=\"w-full\">\n {children}\n </div>\n </div>\n\n {shouldShowTrigger && (\n <RadixCollapsible.Trigger asChild>\n <Pressable\n className={cn(\n \"absolute -bottom-8 left-0 right-0\",\n \"flex items-end justify-center\",\n \"h-16 pt-8 pb-2\",\n !open && \"bg-gradient-to-b from-transparent via-white to-white\",\n \"hover:opacity-100 transition-opacity\"\n )}\n >\n <Text variant=\"label-default\" color=\"secondary\">\n {open ? \"See less\" : \"See more\"}\n </Text>\n </Pressable>\n </RadixCollapsible.Trigger>\n )}\n </div>\n </RadixCollapsible.Root>\n );\n};\n\nCollapsible.displayName = \"Collapsible\";\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import React from \"react\";\nimport { Text } from \"./Text\";\nimport { ContactItem, ContactItemProps } from \"./ContactItem\";\nimport { Collapsible } from \"./Collapsible\";\n\nexport type AboutCardProps = {\n contactItems: ContactItemProps[];\n description: string;\n isEditMode?: boolean;\n onEditClick?: () => void;\n};\n\nexport const AboutCard = ({\n contactItems,\n description,\n isEditMode = false,\n onEditClick,\n ...props\n}: AboutCardProps) => (\n <div\n className=\"border border-secondary rounded-2xl sm:p-10 p-4 relative flex sm:flex-row flex-col pt-8 sm:pt-4\"\n {...props}\n >\n <div className=\"flex sm:basis-1/2 basis-full flex-col gap-2 sm:pr-10 pb-6 sm:pb-0 justify-center\">\n <Collapsible maxHeight={120}>\n <Text variant=\"body-default\">{description}</Text>\n </Collapsible>\n </div>\n {/* vertical divider for desktop */}\n <span className=\"hidden sm:block absolute bg-secondary-50 w-[1px] inset-x-1/2 inset-y-10\" />\n {/* horizontal divider for mobile */}\n <span className=\"block sm:hidden bg-secondary-50 w-full h-[1px] inset-x-10\" />\n <div className=\"flex flex-col gap-4 sm:pl-10 pt-6 sm:pt-8\">\n {contactItems.map((contactProps) => (\n <ContactItem key={contactProps.title} {...contactProps} />\n ))}\n </div>\n </div>\n);\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use strict';var n=require('react'),c=require('@radix-ui/react-accordion'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),icons=require('@deckai/icons');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var n__namespace=/*#__PURE__*/_interopNamespace(n);var c__namespace=/*#__PURE__*/_interopNamespace(c);function d(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var h={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888"},x={sm:"640px",md:"768px",lg:"1024px",xl:"1280px","2xl":"1536px"},L=e=>{if(!e)return {width:"24px",height:"24px"};let o=Array.isArray(e)?e:[e],t={},i;return o.forEach(r=>{if(typeof r=="number")i=`${r}px`;else {let[s,l]=r.split(":"),p=parseInt(l,10);t[`@media (min-width: ${x[s]})`]=`${p}px`;}}),{width:i||"24px",height:i||"24px",...Object.entries(t).reduce((r,[s,l])=>({...r,[s]:{width:l,height:l}}),{})}},g=n__namespace.default.forwardRef(({name:e,size:o=24,color:t="primary",title:i,className:r,style:s={},...l},p)=>{let a=icons.IconMap[e],m=L(o);return n__namespace.default.createElement("div",{className:d("flex justify-center items-center",r),style:{...m,"--icon-stroke":h[t],...s}},n__namespace.default.createElement(a,{ref:p,"aria-hidden":!i,"aria-label":i,stroke:e.includes("filled")?void 0:h[t],...l}))});g.displayName="Icon";var R={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},E=e=>{let[o,t]=e.split("-");return o==="heading"?R[t]||"p":o==="label"?"label":"p"},P={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},v=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[i,r]=t.split(":");return `${i}:text-${r}`}return `text-${t}`}).join(" "):"text-body-default",T=n__namespace.default.forwardRef(({variant:e="body-default",color:o="primary",as:t,className:i,children:r,weight:s,...l},p)=>{let a=v(e),m=o==="inherit"?"text-inherit":`text-text-${o}`,f=n__namespace.default.useMemo(()=>{let b=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return E(b)},[e]);return n__namespace.default.createElement(t||f,{ref:p,className:`font-sans antialiased ${a} ${m} ${s?`!${P[s]}`:""} ${i??""}`,...l},r)});T.displayName="Text";var C=n__namespace.forwardRef(({items:e,type:o="single",defaultValue:t,value:i,onValueChange:r,className:s,...l},p)=>n__namespace.createElement(c__namespace.Root,{ref:p,type:o,defaultValue:t,value:i,onValueChange:r,className:d("w-full",s),...l},e.map(a=>n__namespace.createElement(c__namespace.Item,{key:a.value,value:a.value,disabled:a.disabled,className:"w-full"},n__namespace.createElement(c__namespace.Header,null,n__namespace.createElement(c__namespace.Trigger,{className:d("flex w-full items-center gap-2 justify-between px-3 py-2 rounded bg-background-50 hover:bg-background-100 mt-4","disabled:cursor-not-allowed","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100")},n__namespace.createElement("div",{className:"flex items-center gap-3"},n__namespace.createElement(T,{variant:"body-default-semibold",className:a.disabled?"text-text-disabled":""},a.title)),n__namespace.createElement(g,{name:"arrow-down",size:18,"aria-hidden":!0,color:a.disabled?"disabled":"primary",className:"transition-transform duration-200 data-[state=open]:rotate-180"}))),n__namespace.createElement(c__namespace.Content,{className:d("overflow-hidden will-change-[height] data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up")},n__namespace.createElement("div",{className:"py-2 px-3"},a.content))))));C.displayName="Accordion";exports.Accordion=C;//# sourceMappingURL=Accordion.cjs.map
|
|
2
|
+
//# sourceMappingURL=Accordion.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Icon.tsx","../../src/components/Text.tsx","../../src/components/Accordion.tsx"],"names":["cn","inputs","twMerge","clsx","COLOR_MAP","BREAKPOINT_MAP","processSizes","sizes","sizeArray","mediaQueries","baseSize","size","breakpoint","valueStr","value","acc","query","Icon","React","name","color","title","className","style","props","ref","IconComponent","IconMap","sizeStyles","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","fontWeight","processVariants","variants","typographyClass","Text","as","children","weight","typographyClasses","colorClasses","suggestedElement","baseVariant","Accordion","n","items","type","defaultValue","onValueChange","c","item"],"mappings":"gkBAGO,SAASA,CAAMC,CAAAA,GAAAA,CAAAA,CAAsB,CAC1C,OAAOC,qBAAQC,CAAAA,SAAAA,CAAKF,CAAM,CAAC,CAC7B,CCcA,IAAMG,CAAwC,CAAA,CAC5C,OAAS,CAAA,SAAA,CACT,SAAW,CAAA,SAAA,CACX,KAAO,CAAA,SAAA,CACP,YAAa,SACb,CAAA,QAAA,CAAU,SACZ,CAAA,CAEMC,CAA6C,CAAA,CACjD,EAAI,CAAA,OAAA,CACJ,GAAI,OACJ,CAAA,EAAA,CAAI,QACJ,CAAA,EAAA,CAAI,QACJ,CAAA,KAAA,CAAO,QACT,CAAA,CAEMC,EACJC,CACwB,EAAA,CACxB,GAAI,CAACA,EAAO,OAAO,CAAE,KAAO,CAAA,MAAA,CAAQ,OAAQ,MAAO,CAAA,CAEnD,IAAMC,CAAAA,CAAY,KAAM,CAAA,OAAA,CAAQD,CAAK,CAAA,CAAIA,EAAQ,CAACA,CAAK,CACjDE,CAAAA,CAAAA,CAAuC,EAAC,CAC1CC,CAGJ,CAAA,OAAAF,EAAU,OAASG,CAAAA,CAAAA,EAAS,CAC1B,GAAI,OAAOA,CAAAA,EAAS,QAClBD,CAAAA,CAAAA,CAAW,GAAGC,CAAI,CAAA,EAAA,CAAA,CAAA,KACb,CACL,GAAM,CAACC,CAAAA,CAAYC,CAAQ,CAAA,CAAIF,EAAK,KAAM,CAAA,GAAG,CACvCG,CAAAA,CAAAA,CAAQ,QAASD,CAAAA,CAAAA,CAAU,EAAE,CAAA,CACnCJ,EAAa,CAAsBJ,mBAAAA,EAAAA,CAAAA,CAAeO,CAAU,CAAC,CAAG,CAAA,CAAA,CAAA,CAC9D,CAAGE,EAAAA,CAAK,KACZ,CACF,CAAC,CAGM,CAAA,CACL,KAAOJ,CAAAA,CAAAA,EAAY,MACnB,CAAA,MAAA,CAAQA,GAAY,MACpB,CAAA,GAAG,MAAO,CAAA,OAAA,CAAQD,CAAY,CAAE,CAAA,MAAA,CAC9B,CAACM,CAAAA,CAAK,CAACC,CAAOL,CAAAA,CAAI,CAAO,IAAA,CACvB,GAAGI,CAAAA,CACH,CAACC,CAAK,EAAG,CACP,KAAA,CAAOL,CACP,CAAA,MAAA,CAAQA,CACV,CACF,CACA,CAAA,CAAA,EACF,CACF,CACF,CAEaM,CAAAA,CAAAA,CAAOC,oBAAM,CAAA,UAAA,CACxB,CACE,CACE,KAAAC,CACA,CAAA,IAAA,CAAAR,CAAO,CAAA,EAAA,CACP,KAAAS,CAAAA,CAAAA,CAAQ,SACR,CAAA,KAAA,CAAAC,EACA,SAAAC,CAAAA,CAAAA,CACA,KAAAC,CAAAA,CAAAA,CAAQ,EAAC,CACT,GAAGC,CACL,EACAC,CACG,GAAA,CACH,IAAMC,CAAAA,CAAgBC,aAAQR,CAAAA,CAAI,CAC5BS,CAAAA,CAAAA,CAAatB,EAAaK,CAAI,CAAA,CAEpC,OACEO,oBAAAA,CAAA,aAAC,CAAA,KAAA,CAAA,CACC,SAAWlB,CAAAA,CAAAA,CAAG,mCAAoCsB,CAAS,CAAA,CAC3D,KAAO,CAAA,CACL,GAAGM,CACF,CAAA,eAAA,CAA4BxB,CAAUgB,CAAAA,CAAK,EAC5C,GAAGG,CACL,CAEAL,CAAAA,CAAAA,oBAAAA,CAAA,aAACQ,CAAAA,CAAAA,CAAA,CACC,GAAA,CAAKD,EACL,aAAa,CAAA,CAACJ,CACd,CAAA,YAAA,CAAYA,CACZ,CAAA,MAAA,CAAQF,CAAK,CAAA,QAAA,CAAS,QAAQ,CAAI,CAAA,KAAA,CAAA,CAAYf,CAAUgB,CAAAA,CAAK,CAC5D,CAAA,GAAGI,CACN,CAAA,CACF,CAEJ,CACF,CAAA,CAEAP,CAAK,CAAA,WAAA,CAAc,MC9GnB,CAsEA,IAAMY,CAAmD,CAAA,CACvD,EAAI,CAAA,IAAA,CACJ,EAAI,CAAA,IAAA,CACJ,EAAI,CAAA,IAAA,CACJ,GAAI,IACJ,CAAA,EAAA,CAAI,IACN,CAAA,CAEMC,CAAyBC,CAAAA,CAAAA,EAAwC,CACrE,GAAM,CAACC,CAAUrB,CAAAA,CAAI,CAAIoB,CAAAA,CAAAA,CAAQ,KAAM,CAAA,GAAG,CAE1C,CAAA,OAAIC,IAAa,SACRH,CAAAA,CAAAA,CAAoBlB,CAAI,CAAA,EAAK,IAGlCqB,CAAa,GAAA,OAAA,CACR,OAGF,CAAA,GACT,EAIMC,CAAqC,CAAA,CACzC,KAAO,CAAA,YAAA,CACP,OAAS,CAAA,cAAA,CACT,QAAU,CAAA,eAAA,CACV,KAAM,WACR,CAAA,CA0BMC,CACJC,CAAAA,CAAAA,EAEKA,CAEgB,CAAA,CAAA,KAAA,CAAM,OAAQA,CAAAA,CAAQ,EAAIA,CAAW,CAAA,CAACA,CAAQ,CAAA,EAGhE,GAAKJ,CAAAA,CAAAA,EAAY,CAChB,GAAIA,EAAQ,QAAS,CAAA,GAAG,CAAG,CAAA,CACzB,GAAM,CAACnB,CAAYwB,CAAAA,CAAe,EAAIL,CAAQ,CAAA,KAAA,CAAM,GAAG,CAAA,CACvD,OAAO,CAAA,EAAGnB,CAAU,CAAA,MAAA,EAASwB,CAAe,CAC9C,CAAA,CACA,OAAO,CAAA,KAAA,EAAQL,CAAO,CAAA,CACxB,CAAC,CAAA,CACA,KAAK,GAAG,CAAA,CAZW,mBAeXM,CAAAA,CAAAA,CAAOnB,oBAAM,CAAA,UAAA,CACxB,CACE,CACE,QAAAa,CAAU,CAAA,cAAA,CACV,KAAAX,CAAAA,CAAAA,CAAQ,UACR,EAAAkB,CAAAA,CAAAA,CACA,SAAAhB,CAAAA,CAAAA,CACA,SAAAiB,CACA,CAAA,MAAA,CAAAC,CACA,CAAA,GAAGhB,CACL,CAAA,CACAC,CACG,GAAA,CAEH,IAAMgB,CAAoBP,CAAAA,CAAAA,CAAgBH,CAAO,CAAA,CAG3CW,CACJtB,CAAAA,CAAAA,GAAU,SAAY,CAAA,cAAA,CAAiB,aAAaA,CAAK,CAAA,CAAA,CAErDuB,CAAmBzB,CAAAA,oBAAAA,CAAM,OAAQ,CAAA,IAAM,CAC3C,IAAM0B,EACJ,OAAOb,CAAAA,EAAY,QACfA,CAAAA,CAAAA,CAAQ,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,GACnB,KAAM,CAAA,OAAA,CAAQA,CAAO,CAAA,CACnBA,CAAQ,CAAA,CAAC,CAAE,CAAA,KAAA,CAAM,GAAG,CAAE,CAAA,GAAA,EACtB,CAAA,cAAA,CACR,OAAOD,CAAAA,CAAsBc,CAA4B,CAC3D,EAAG,CAACb,CAAO,CAAC,CAAA,CAIZ,OAEEb,oBAAAA,CAAA,aAJiBoB,CAAAA,CAAAA,EAAMK,EAItB,CACC,GAAA,CAAKlB,CACL,CAAA,SAAA,CAAW,yBAAyBgB,CAAiB,CAAA,CAAA,EAAIC,CAAY,CAAA,CAAA,EACnEF,EAAS,CAAIP,CAAAA,EAAAA,CAAAA,CAAWO,CAAM,CAAC,CAAK,CAAA,CAAA,EACtC,CAAIlB,CAAAA,EAAAA,CAAAA,EAAa,EAAE,CAClB,CAAA,CAAA,GAAGE,CAEHe,CAAAA,CAAAA,CACH,CAEJ,CACF,CAEAF,CAAAA,CAAAA,CAAK,YAAc,MC1JZ,CAAA,IAAMQ,CAAkB,CAAAC,YAAA,CAAA,UAAA,CAI7B,CACE,CACE,KAAAC,CAAAA,CAAAA,CACA,KAAAC,CAAO,CAAA,QAAA,CACP,YAAAC,CAAAA,CAAAA,CACA,KAAAnC,CAAAA,CAAAA,CACA,aAAAoC,CAAAA,CAAAA,CACA,UAAA5B,CACA,CAAA,GAAGE,CACL,CAAA,CACAC,CAIE,GAAAqB,YAAA,CAAA,aAAA,CAAoBK,YAAnB,CAAA,IAAA,CAAA,CACC,IAAK1B,CACL,CAAA,IAAA,CAAMuB,CACN,CAAA,YAAA,CAAcC,CACd,CAAA,KAAA,CAAOnC,CACP,CAAA,aAAA,CAAeoC,EACf,SAAWlD,CAAAA,CAAAA,CAAG,QAAUsB,CAAAA,CAAS,CAChC,CAAA,GAAGE,CAEHuB,CAAAA,CAAAA,CAAAA,CAAM,IAAKK,CACV,EAAAN,YAAA,CAAA,aAAA,CAAoBK,YAAnB,CAAA,IAAA,CAAA,CACC,IAAKC,CAAK,CAAA,KAAA,CACV,KAAOA,CAAAA,CAAAA,CAAK,MACZ,QAAUA,CAAAA,CAAAA,CAAK,QACf,CAAA,SAAA,CAAU,QAEV,CAAA,CAAAN,YAAA,CAAA,aAAA,CAAoBK,YAAnB,CAAA,MAAA,CAAA,IAAA,CACCL,2BAAoBK,YAAnB,CAAA,OAAA,CAAA,CACC,SAAWnD,CAAAA,CAAAA,CACT,gHACA,CAAA,6BAAA,CACA,gFACF,CAAA,CAAA,CAEA8C,2BAAC,KAAI,CAAA,CAAA,SAAA,CAAU,yBACb,CAAA,CAAAA,YAAA,CAAA,aAAA,CAACT,CAAA,CAAA,CACC,OAAQ,CAAA,uBAAA,CACR,UAAWe,CAAK,CAAA,QAAA,CAAW,oBAAuB,CAAA,EAAA,CAAA,CAEjDA,EAAK,KACR,CACF,CACA,CAAAN,YAAA,CAAA,aAAA,CAAC7B,EAAA,CACC,IAAA,CAAK,YACL,CAAA,IAAA,CAAM,EACN,CAAA,aAAA,CAAW,CACX,CAAA,CAAA,KAAA,CAAOmC,EAAK,QAAW,CAAA,UAAA,CAAa,SACpC,CAAA,SAAA,CAAU,gEACZ,CAAA,CACF,CACF,CAAA,CACAN,2BAAoBK,YAAnB,CAAA,OAAA,CAAA,CACC,SAAWnD,CAAAA,CAAAA,CACT,wHACF,CAAA,CAAA,CAEA8C,YAAC,CAAA,aAAA,CAAA,KAAA,CAAA,CAAI,UAAU,WAAaM,CAAAA,CAAAA,CAAAA,CAAK,OAAQ,CAC3C,CACF,CACD,CACH,CAGN,EAEAP,EAAU,WAAc,CAAA,WAAA","file":"Accordion.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React, { SVGProps } from \"react\";\nimport { IconName, IconMap } from \"@deckai/icons\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\n\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveSize = number | `${Breakpoint}:${number}`;\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"#080808\",\n secondary: \"#666666\",\n white: \"#ffffff\",\n primaryBlue: \"#089CCB\",\n disabled: \"#888888\"\n};\n\nconst BREAKPOINT_MAP: Record<Breakpoint, string> = {\n sm: \"640px\",\n md: \"768px\",\n lg: \"1024px\",\n xl: \"1280px\",\n \"2xl\": \"1536px\"\n};\n\nconst processSizes = (\n sizes: ResponsiveSize | ResponsiveSize[] | undefined\n): React.CSSProperties => {\n if (!sizes) return { width: \"24px\", height: \"24px\" };\n\n const sizeArray = Array.isArray(sizes) ? sizes : [sizes];\n const mediaQueries: Record<string, string> = {};\n let baseSize: string | undefined;\n\n // Process each size\n sizeArray.forEach((size) => {\n if (typeof size === \"number\") {\n baseSize = `${size}px`;\n } else {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n mediaQueries[`@media (min-width: ${BREAKPOINT_MAP[breakpoint]})`] =\n `${value}px`;\n }\n });\n\n // Create the style object with the correct structure\n return {\n width: baseSize || \"24px\",\n height: baseSize || \"24px\",\n ...Object.entries(mediaQueries).reduce(\n (acc, [query, size]) => ({\n ...acc,\n [query]: {\n width: size,\n height: size\n }\n }),\n {}\n )\n };\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const sizeStyles = processSizes(size);\n\n return (\n <div\n className={cn(\"flex justify-center items-center\", className)}\n style={{\n ...sizeStyles,\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses =\n color === \"inherit\" ? \"text-inherit\" : `text-text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`font-sans antialiased ${typographyClasses} ${colorClasses} ${\n weight ? `!${fontWeight[weight]}` : \"\"\n } ${className ?? \"\"}`}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport { cn } from \"../utils\";\nimport { Icon } from \"./Icon\";\nimport { Text } from \"./Text\";\n\nexport type AccordionItem = {\n value: string;\n title: React.ReactNode;\n content: React.ReactNode;\n disabled?: boolean;\n};\n\nexport type AccordionProps = {\n /** Array of items to show in the accordion */\n items: AccordionItem[];\n /** Type of accordion (single item open or multiple) */\n type?:\n | AccordionPrimitive.AccordionSingleProps[\"type\"]\n | AccordionPrimitive.AccordionMultipleProps[\"type\"];\n /** Default value(s) to be expanded */\n defaultValue?:\n | AccordionPrimitive.AccordionSingleProps[\"defaultValue\"]\n | AccordionPrimitive.AccordionMultipleProps[\"defaultValue\"];\n /** Current value(s) for controlled component */\n value?:\n | AccordionPrimitive.AccordionSingleProps[\"value\"]\n | AccordionPrimitive.AccordionMultipleProps[\"value\"];\n /** Callback when value changes */\n onValueChange?:\n | AccordionPrimitive.AccordionSingleProps[\"onValueChange\"]\n | AccordionPrimitive.AccordionMultipleProps[\"onValueChange\"];\n /** Optional className for custom styling */\n className?: string;\n};\n\nexport const Accordion = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Root>,\n AccordionProps\n>(\n (\n {\n items,\n type = \"single\",\n defaultValue,\n value,\n onValueChange,\n className,\n ...props\n },\n ref\n ) => {\n return (\n // @ts-expect-error TODO: Fix this\n <AccordionPrimitive.Root\n ref={ref}\n type={type}\n defaultValue={defaultValue}\n value={value}\n onValueChange={onValueChange}\n className={cn(\"w-full\", className)}\n {...props}\n >\n {items.map((item) => (\n <AccordionPrimitive.Item\n key={item.value}\n value={item.value}\n disabled={item.disabled}\n className=\"w-full\"\n >\n <AccordionPrimitive.Header>\n <AccordionPrimitive.Trigger\n className={cn(\n \"flex w-full items-center gap-2 justify-between px-3 py-2 rounded bg-background-50 hover:bg-background-100 mt-4\",\n \"disabled:cursor-not-allowed\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\"\n )}\n >\n <div className=\"flex items-center gap-3\">\n <Text\n variant=\"body-default-semibold\"\n className={item.disabled ? \"text-text-disabled\" : \"\"}\n >\n {item.title}\n </Text>\n </div>\n <Icon\n name=\"arrow-down\"\n size={18}\n aria-hidden\n color={item.disabled ? \"disabled\" : \"primary\"}\n className=\"transition-transform duration-200 data-[state=open]:rotate-180\"\n />\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n <AccordionPrimitive.Content\n className={cn(\n \"overflow-hidden will-change-[height] data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up\"\n )}\n >\n <div className=\"py-2 px-3\">{item.content}</div>\n </AccordionPrimitive.Content>\n </AccordionPrimitive.Item>\n ))}\n </AccordionPrimitive.Root>\n );\n }\n);\n\nAccordion.displayName = \"Accordion\";\n"]}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
3
|
+
|
|
4
|
+
type AccordionItem = {
|
|
5
|
+
value: string;
|
|
6
|
+
title: React.ReactNode;
|
|
7
|
+
content: React.ReactNode;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
};
|
|
10
|
+
type AccordionProps = {
|
|
11
|
+
/** Array of items to show in the accordion */
|
|
12
|
+
items: AccordionItem[];
|
|
13
|
+
/** Type of accordion (single item open or multiple) */
|
|
14
|
+
type?: AccordionPrimitive.AccordionSingleProps["type"] | AccordionPrimitive.AccordionMultipleProps["type"];
|
|
15
|
+
/** Default value(s) to be expanded */
|
|
16
|
+
defaultValue?: AccordionPrimitive.AccordionSingleProps["defaultValue"] | AccordionPrimitive.AccordionMultipleProps["defaultValue"];
|
|
17
|
+
/** Current value(s) for controlled component */
|
|
18
|
+
value?: AccordionPrimitive.AccordionSingleProps["value"] | AccordionPrimitive.AccordionMultipleProps["value"];
|
|
19
|
+
/** Callback when value changes */
|
|
20
|
+
onValueChange?: AccordionPrimitive.AccordionSingleProps["onValueChange"] | AccordionPrimitive.AccordionMultipleProps["onValueChange"];
|
|
21
|
+
/** Optional className for custom styling */
|
|
22
|
+
className?: string;
|
|
23
|
+
};
|
|
24
|
+
declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
|
|
25
|
+
|
|
26
|
+
export { Accordion, type AccordionItem, type AccordionProps };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
3
|
+
|
|
4
|
+
type AccordionItem = {
|
|
5
|
+
value: string;
|
|
6
|
+
title: React.ReactNode;
|
|
7
|
+
content: React.ReactNode;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
};
|
|
10
|
+
type AccordionProps = {
|
|
11
|
+
/** Array of items to show in the accordion */
|
|
12
|
+
items: AccordionItem[];
|
|
13
|
+
/** Type of accordion (single item open or multiple) */
|
|
14
|
+
type?: AccordionPrimitive.AccordionSingleProps["type"] | AccordionPrimitive.AccordionMultipleProps["type"];
|
|
15
|
+
/** Default value(s) to be expanded */
|
|
16
|
+
defaultValue?: AccordionPrimitive.AccordionSingleProps["defaultValue"] | AccordionPrimitive.AccordionMultipleProps["defaultValue"];
|
|
17
|
+
/** Current value(s) for controlled component */
|
|
18
|
+
value?: AccordionPrimitive.AccordionSingleProps["value"] | AccordionPrimitive.AccordionMultipleProps["value"];
|
|
19
|
+
/** Callback when value changes */
|
|
20
|
+
onValueChange?: AccordionPrimitive.AccordionSingleProps["onValueChange"] | AccordionPrimitive.AccordionMultipleProps["onValueChange"];
|
|
21
|
+
/** Optional className for custom styling */
|
|
22
|
+
className?: string;
|
|
23
|
+
};
|
|
24
|
+
declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
|
|
25
|
+
|
|
26
|
+
export { Accordion, type AccordionItem, type AccordionProps };
|