@oztix/roadie-components 2.0.1 → 2.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion.d.ts +42 -21
- package/dist/Accordion.d.ts.map +1 -0
- package/dist/Accordion.js +1 -2
- package/dist/Accordion.js.map +1 -1
- package/dist/Autocomplete.d.ts +101 -60
- package/dist/Autocomplete.d.ts.map +1 -0
- package/dist/Autocomplete.js +1 -2
- package/dist/Autocomplete.js.map +1 -1
- package/dist/Badge.d.ts +27 -16
- package/dist/Badge.d.ts.map +1 -0
- package/dist/Badge.js +1 -1
- package/dist/Badge.js.map +1 -1
- package/dist/Breadcrumb.d.ts +45 -23
- package/dist/Breadcrumb.d.ts.map +1 -0
- package/dist/Breadcrumb.js +1 -1
- package/dist/Breadcrumb.js.map +1 -1
- package/dist/Button-CDQ6ik0P.js +2 -0
- package/dist/Button-CDQ6ik0P.js.map +1 -0
- package/dist/Button-DdE0vCfo.js +2 -0
- package/dist/Button-DdE0vCfo.js.map +1 -0
- package/dist/Button-Dt1TGgrL.d.ts +26 -0
- package/dist/Button-Dt1TGgrL.d.ts.map +1 -0
- package/dist/Button.d.ts +3 -17
- package/dist/Button.js +1 -2
- package/dist/Card.d.ts +56 -30
- package/dist/Card.d.ts.map +1 -0
- package/dist/Card.js +1 -1
- package/dist/Card.js.map +1 -1
- package/dist/Code.d.ts +19 -13
- package/dist/Code.d.ts.map +1 -0
- package/dist/Code.js +1 -1
- package/dist/Code.js.map +1 -1
- package/dist/Combobox.d.ts +111 -63
- package/dist/Combobox.d.ts.map +1 -0
- package/dist/Combobox.js +1 -2
- package/dist/Combobox.js.map +1 -1
- package/dist/Field.d.ts +63 -46
- package/dist/Field.d.ts.map +1 -0
- package/dist/Field.js +1 -2
- package/dist/Field.js.map +1 -1
- package/dist/Fieldset.d.ts +34 -22
- package/dist/Fieldset.d.ts.map +1 -0
- package/dist/Fieldset.js +1 -2
- package/dist/Fieldset.js.map +1 -1
- package/dist/Highlight.d.ts +20 -15
- package/dist/Highlight.d.ts.map +1 -0
- package/dist/Highlight.js +1 -2
- package/dist/Highlight.js.map +1 -1
- package/dist/Indicator.d.ts +20 -12
- package/dist/Indicator.d.ts.map +1 -0
- package/dist/Indicator.js +1 -1
- package/dist/Indicator.js.map +1 -1
- package/dist/Input.d.ts +22 -14
- package/dist/Input.d.ts.map +1 -0
- package/dist/Input.js +1 -2
- package/dist/Input.js.map +1 -1
- package/dist/Label.d.ts +12 -8
- package/dist/Label.d.ts.map +1 -0
- package/dist/Label.js +1 -1
- package/dist/Label.js.map +1 -1
- package/dist/LinkButton-9nnOzX_0.js +2 -0
- package/dist/LinkButton-9nnOzX_0.js.map +1 -0
- package/dist/LinkButton.d.ts +2 -35
- package/dist/LinkButton.js +1 -2
- package/dist/Mark.d.ts +19 -12
- package/dist/Mark.d.ts.map +1 -0
- package/dist/Mark.js +1 -1
- package/dist/Mark.js.map +1 -1
- package/dist/Marquee.d.ts +27 -16
- package/dist/Marquee.d.ts.map +1 -0
- package/dist/Marquee.js +5 -2
- package/dist/Marquee.js.map +1 -1
- package/dist/Prose.d.ts +19 -12
- package/dist/Prose.d.ts.map +1 -0
- package/dist/Prose.js +1 -1
- package/dist/Prose.js.map +1 -1
- package/dist/RadioGroup.d.ts +62 -38
- package/dist/RadioGroup.d.ts.map +1 -0
- package/dist/RadioGroup.js +1 -2
- package/dist/RadioGroup.js.map +1 -1
- package/dist/Select.d.ts +129 -73
- package/dist/Select.d.ts.map +1 -0
- package/dist/Select.js +1 -2
- package/dist/Select.js.map +1 -1
- package/dist/Separator.d.ts +17 -12
- package/dist/Separator.d.ts.map +1 -0
- package/dist/Separator.js +1 -1
- package/dist/Separator.js.map +1 -1
- package/dist/SpotIllustration.d.ts +71 -50
- package/dist/SpotIllustration.d.ts.map +1 -0
- package/dist/SpotIllustration.js +1 -2
- package/dist/SpotIllustration.js.map +1 -1
- package/dist/Steps.d.ts +102 -62
- package/dist/Steps.d.ts.map +1 -0
- package/dist/Steps.js +1 -2
- package/dist/Steps.js.map +1 -1
- package/dist/Textarea.d.ts +22 -13
- package/dist/Textarea.d.ts.map +1 -0
- package/dist/Textarea.js +1 -2
- package/dist/Textarea.js.map +1 -1
- package/dist/index-0w-ydb3o.d.ts +50 -0
- package/dist/index-0w-ydb3o.d.ts.map +1 -0
- package/dist/index-C3_4djmE.d.ts +17 -0
- package/dist/index-C3_4djmE.d.ts.map +1 -0
- package/dist/index.d.ts +47 -49
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +23 -23
- package/dist/index.js.map +1 -1
- package/dist/variants-DTAwzBl3.js +2 -0
- package/dist/variants-DTAwzBl3.js.map +1 -0
- package/package.json +6 -5
- package/dist/Button-fnIVmjIB.d.ts +0 -18
- package/dist/Button.js.map +0 -1
- package/dist/LinkButton.js.map +0 -1
- package/dist/_chunks/chunk-3H22EQQ6.js +0 -2
- package/dist/_chunks/chunk-3H22EQQ6.js.map +0 -1
- package/dist/_chunks/chunk-42UB7PQB.js +0 -3
- package/dist/_chunks/chunk-42UB7PQB.js.map +0 -1
- package/dist/_chunks/chunk-4LGCF3SN.js +0 -3
- package/dist/_chunks/chunk-4LGCF3SN.js.map +0 -1
- package/dist/_chunks/chunk-AFSDN4WI.js +0 -2
- package/dist/_chunks/chunk-AFSDN4WI.js.map +0 -1
- package/dist/_chunks/chunk-BQEJDV7D.js +0 -3
- package/dist/_chunks/chunk-BQEJDV7D.js.map +0 -1
- package/dist/_chunks/chunk-DRVUAPKN.js +0 -2
- package/dist/_chunks/chunk-DRVUAPKN.js.map +0 -1
- package/dist/_chunks/chunk-EKOEXSAP.js +0 -2
- package/dist/_chunks/chunk-EKOEXSAP.js.map +0 -1
- package/dist/_chunks/chunk-FQNVMKKV.js +0 -7
- package/dist/_chunks/chunk-FQNVMKKV.js.map +0 -1
- package/dist/_chunks/chunk-IEDKSZAQ.js +0 -3
- package/dist/_chunks/chunk-IEDKSZAQ.js.map +0 -1
- package/dist/_chunks/chunk-JBHYUOI2.js +0 -3
- package/dist/_chunks/chunk-JBHYUOI2.js.map +0 -1
- package/dist/_chunks/chunk-JGTZ3GCR.js +0 -2
- package/dist/_chunks/chunk-JGTZ3GCR.js.map +0 -1
- package/dist/_chunks/chunk-LHNOY24C.js +0 -2
- package/dist/_chunks/chunk-LHNOY24C.js.map +0 -1
- package/dist/_chunks/chunk-LMV3JECI.js +0 -3
- package/dist/_chunks/chunk-LMV3JECI.js.map +0 -1
- package/dist/_chunks/chunk-MDRAL676.js +0 -3
- package/dist/_chunks/chunk-MDRAL676.js.map +0 -1
- package/dist/_chunks/chunk-N2HGY7W7.js +0 -3
- package/dist/_chunks/chunk-N2HGY7W7.js.map +0 -1
- package/dist/_chunks/chunk-NRVNUMJE.js +0 -2
- package/dist/_chunks/chunk-NRVNUMJE.js.map +0 -1
- package/dist/_chunks/chunk-OIAETOZT.js +0 -3
- package/dist/_chunks/chunk-OIAETOZT.js.map +0 -1
- package/dist/_chunks/chunk-OIZX63GZ.js +0 -2
- package/dist/_chunks/chunk-OIZX63GZ.js.map +0 -1
- package/dist/_chunks/chunk-OPR5JL7N.js +0 -3
- package/dist/_chunks/chunk-OPR5JL7N.js.map +0 -1
- package/dist/_chunks/chunk-SCS7WZ6Z.js +0 -3
- package/dist/_chunks/chunk-SCS7WZ6Z.js.map +0 -1
- package/dist/_chunks/chunk-VSKUGXQG.js +0 -3
- package/dist/_chunks/chunk-VSKUGXQG.js.map +0 -1
- package/dist/_chunks/chunk-WOU2B425.js +0 -3
- package/dist/_chunks/chunk-WOU2B425.js.map +0 -1
- package/dist/_chunks/chunk-XERFFH3S.js +0 -3
- package/dist/_chunks/chunk-XERFFH3S.js.map +0 -1
- package/dist/_chunks/chunk-XRFHVFJ5.js +0 -3
- package/dist/_chunks/chunk-XRFHVFJ5.js.map +0 -1
- package/dist/_chunks/chunk-ZXR32FYA.js +0 -2
- package/dist/_chunks/chunk-ZXR32FYA.js.map +0 -1
package/dist/Marquee.d.ts
CHANGED
|
@@ -1,21 +1,32 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import { ComponentProps } from
|
|
1
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
+
import { ComponentProps } from "react";
|
|
3
3
|
|
|
4
|
+
//#region src/components/Marquee/index.d.ts
|
|
4
5
|
interface MarqueeProps extends ComponentProps<'div'> {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
6
|
+
/** Scroll speed in pixels per second. @default 50 */
|
|
7
|
+
speed?: number;
|
|
8
|
+
/** Pause animation on hover. @default false */
|
|
9
|
+
pauseOnHover?: boolean;
|
|
10
|
+
/** Scroll direction. @default 'normal' */
|
|
11
|
+
direction?: 'normal' | 'reverse';
|
|
12
|
+
/** Gap between items in pixels. @default 16 */
|
|
13
|
+
gap?: number;
|
|
14
|
+
/** Accessible label for the marquee region. */
|
|
15
|
+
'aria-label'?: string;
|
|
15
16
|
}
|
|
16
|
-
declare function Marquee({
|
|
17
|
+
declare function Marquee({
|
|
18
|
+
children,
|
|
19
|
+
speed,
|
|
20
|
+
pauseOnHover,
|
|
21
|
+
direction,
|
|
22
|
+
gap,
|
|
23
|
+
className,
|
|
24
|
+
'aria-label': ariaLabel,
|
|
25
|
+
...props
|
|
26
|
+
}: MarqueeProps): _$react_jsx_runtime0.JSX.Element;
|
|
17
27
|
declare namespace Marquee {
|
|
18
|
-
|
|
28
|
+
var displayName: string;
|
|
19
29
|
}
|
|
20
|
-
|
|
21
|
-
export { Marquee,
|
|
30
|
+
//#endregion
|
|
31
|
+
export { Marquee, MarqueeProps };
|
|
32
|
+
//# sourceMappingURL=Marquee.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Marquee.d.ts","names":[],"sources":["../src/components/Marquee/index.tsx"],"mappings":";;;;UAMiB,YAAA,SAAqB,cAAA;;EAEpC,KAAA;EAFe;EAIf,YAAA;;EAEA,SAAA;EANoC;EAQpC,GAAA;EAJA;EAMA,YAAA;AAAA;AAAA,iBAGc,OAAA,CAAA;EACd,QAAA;EACA,KAAA;EACA,YAAA;EACA,SAAA;EACA,GAAA;EACA,SAAA;EAAA,cACc,SAAA;EAAA,GACX;AAAA,GACF,YAAA,GAAY,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,kBATC,OAAA;EAAA,IAAO,WAAA;AAAA"}
|
package/dist/Marquee.js
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
1
|
+
"use client";import{cn as e}from"@oztix/roadie-core/utils";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useEffect as r,useRef as i,useState as a}from"react";function o({children:o,speed:s=50,pauseOnHover:c=!1,direction:l=`normal`,gap:u=16,className:d,"aria-label":f,...p}){let m=i(null),h=i(null),g=i(null),[_,v]=a(0),[y,b]=a(1);r(()=>{let e=m.current,t=g.current;if(!e||!t)return;let n=()=>{let n=e.clientWidth,r=t.scrollWidth;r>0&&b(Math.ceil(n/r)+1)};n();let r=new ResizeObserver(n);return r.observe(e),r.observe(t),()=>r.disconnect()},[o,u]),r(()=>{let e=h.current;if(!e)return;let t=()=>{let t=e.scrollWidth/2;t>0&&v(t/s)};t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[s,y]);let x=`${u}px`,S=Array.from({length:y},(e,n)=>t(`div`,{className:`flex shrink-0 items-center`,style:{gap:x},children:o},n));return n(`div`,{ref:m,className:e(`relative max-w-full overflow-hidden`,d),"aria-label":f,...p,children:[t(`style`,{children:`
|
|
2
|
+
@keyframes roadie-marquee {
|
|
3
|
+
to { transform: translateX(-50%); }
|
|
4
|
+
}
|
|
5
|
+
`}),t(`div`,{ref:g,"aria-hidden":`true`,style:{position:`absolute`,visibility:`hidden`,pointerEvents:`none`,display:`flex`,width:`max-content`,height:0,overflow:`hidden`,gap:x},children:o}),n(`div`,{ref:h,style:{display:`flex`,width:`max-content`,gap:x,animationName:_>0?`roadie-marquee`:`none`,animationDuration:`${_}s`,animationTimingFunction:`linear`,animationIterationCount:`infinite`,animationDirection:l,animationPlayState:`running`},onMouseEnter:c?e=>{e.currentTarget.style.animationPlayState=`paused`}:void 0,onMouseLeave:c?e=>{e.currentTarget.style.animationPlayState=`running`}:void 0,children:[t(`div`,{className:`flex shrink-0 items-center`,style:{gap:x},children:S}),t(`div`,{className:`flex shrink-0 items-center`,style:{gap:x},"aria-hidden":`true`,children:S})]})]})}o.displayName=`Marquee`;export{o as Marquee};
|
|
3
6
|
//# sourceMappingURL=Marquee.js.map
|
package/dist/Marquee.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Marquee.js","names":[],"sources":["../src/components/Marquee/index.tsx"],"sourcesContent":["'use client'\n\nimport { type ComponentProps, useEffect, useRef, useState } from 'react'\n\nimport { cn } from '@oztix/roadie-core/utils'\n\nexport interface MarqueeProps extends ComponentProps<'div'> {\n /** Scroll speed in pixels per second. @default 50 */\n speed?: number\n /** Pause animation on hover. @default false */\n pauseOnHover?: boolean\n /** Scroll direction. @default 'normal' */\n direction?: 'normal' | 'reverse'\n /** Gap between items in pixels. @default 16 */\n gap?: number\n /** Accessible label for the marquee region. */\n 'aria-label'?: string\n}\n\nexport function Marquee({\n children,\n speed = 50,\n pauseOnHover = false,\n direction = 'normal',\n gap = 16,\n className,\n 'aria-label': ariaLabel,\n ...props\n}: MarqueeProps) {\n const outerRef = useRef<HTMLDivElement>(null)\n const trackRef = useRef<HTMLDivElement>(null)\n const measureRef = useRef<HTMLDivElement>(null)\n const [duration, setDuration] = useState(0)\n const [repeats, setRepeats] = useState(1)\n\n useEffect(() => {\n const outer = outerRef.current\n const measure = measureRef.current\n if (!outer || !measure) return\n\n const update = () => {\n const containerWidth = outer.clientWidth\n const contentWidth = measure.scrollWidth\n if (contentWidth > 0) {\n // Repeat enough times so one \"set\" is always wider than the container\n const needed = Math.ceil(containerWidth / contentWidth) + 1\n setRepeats(needed)\n }\n }\n\n update()\n\n const observer = new ResizeObserver(update)\n observer.observe(outer)\n observer.observe(measure)\n return () => observer.disconnect()\n }, [children, gap])\n\n useEffect(() => {\n const track = trackRef.current\n if (!track) return\n\n const updateDuration = () => {\n const halfWidth = track.scrollWidth / 2\n if (halfWidth > 0) {\n setDuration(halfWidth / speed)\n }\n }\n\n updateDuration()\n\n const observer = new ResizeObserver(updateDuration)\n observer.observe(track)\n return () => observer.disconnect()\n }, [speed, repeats])\n\n const gapPx = `${gap}px`\n\n const repeatedChildren = Array.from({ length: repeats }, (_, i) => (\n <div key={i} className='flex shrink-0 items-center' style={{ gap: gapPx }}>\n {children}\n </div>\n ))\n\n return (\n <div\n ref={outerRef}\n className={cn('relative max-w-full overflow-hidden', className)}\n aria-label={ariaLabel}\n {...props}\n >\n <style>{`\n @keyframes roadie-marquee {\n to { transform: translateX(-50%); }\n }\n `}</style>\n {/* Hidden measure element to get single-set width */}\n <div\n ref={measureRef}\n aria-hidden='true'\n style={{\n position: 'absolute',\n visibility: 'hidden',\n pointerEvents: 'none',\n display: 'flex',\n width: 'max-content',\n height: 0,\n overflow: 'hidden',\n gap: gapPx\n }}\n >\n {children}\n </div>\n <div\n ref={trackRef}\n style={{\n display: 'flex',\n width: 'max-content',\n gap: gapPx,\n animationName: duration > 0 ? 'roadie-marquee' : 'none',\n animationDuration: `${duration}s`,\n animationTimingFunction: 'linear',\n animationIterationCount: 'infinite',\n animationDirection: direction,\n animationPlayState: 'running'\n }}\n onMouseEnter={\n pauseOnHover\n ? (e) => {\n e.currentTarget.style.animationPlayState = 'paused'\n }\n : undefined\n }\n onMouseLeave={\n pauseOnHover\n ? (e) => {\n e.currentTarget.style.animationPlayState = 'running'\n }\n : undefined\n }\n >\n {/* Set A */}\n <div className='flex shrink-0 items-center' style={{ gap: gapPx }}>\n {repeatedChildren}\n </div>\n {/* Set B (clone for seamless loop) */}\n <div\n className='flex shrink-0 items-center'\n style={{ gap: gapPx }}\n aria-hidden='true'\n >\n {repeatedChildren}\n </div>\n </div>\n </div>\n )\n}\n\nMarquee.displayName = 'Marquee'\n"],"mappings":"yKAmBA,SAAgB,EAAQ,CACtB,WACA,QAAQ,GACR,eAAe,GACf,YAAY,SACZ,MAAM,GACN,YACA,aAAc,EACd,GAAG,GACY,CACf,IAAM,EAAW,EAAuB,KAAK,CACvC,EAAW,EAAuB,KAAK,CACvC,EAAa,EAAuB,KAAK,CACzC,CAAC,EAAU,GAAe,EAAS,EAAE,CACrC,CAAC,EAAS,GAAc,EAAS,EAAE,CAEzC,MAAgB,CACd,IAAM,EAAQ,EAAS,QACjB,EAAU,EAAW,QAC3B,GAAI,CAAC,GAAS,CAAC,EAAS,OAExB,IAAM,MAAe,CACnB,IAAM,EAAiB,EAAM,YACvB,EAAe,EAAQ,YACzB,EAAe,GAGjB,EADe,KAAK,KAAK,EAAiB,EAAa,CAAG,EACxC,EAItB,GAAQ,CAER,IAAM,EAAW,IAAI,eAAe,EAAO,CAG3C,OAFA,EAAS,QAAQ,EAAM,CACvB,EAAS,QAAQ,EAAQ,KACZ,EAAS,YAAY,EACjC,CAAC,EAAU,EAAI,CAAC,CAEnB,MAAgB,CACd,IAAM,EAAQ,EAAS,QACvB,GAAI,CAAC,EAAO,OAEZ,IAAM,MAAuB,CAC3B,IAAM,EAAY,EAAM,YAAc,EAClC,EAAY,GACd,EAAY,EAAY,EAAM,EAIlC,GAAgB,CAEhB,IAAM,EAAW,IAAI,eAAe,EAAe,CAEnD,OADA,EAAS,QAAQ,EAAM,KACV,EAAS,YAAY,EACjC,CAAC,EAAO,EAAQ,CAAC,CAEpB,IAAM,EAAQ,GAAG,EAAI,IAEf,EAAmB,MAAM,KAAK,CAAE,OAAQ,EAAS,EAAG,EAAG,IAC3D,EAAC,MAAD,CAAa,UAAU,6BAA6B,MAAO,CAAE,IAAK,EAAO,CACtE,WACG,CAFI,EAEJ,CACN,CAEF,OACE,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAG,sCAAuC,EAAU,CAC/D,aAAY,EACZ,GAAI,WAJN,CAME,EAAC,QAAD,CAAA,SAAQ;;;;QAIE,CAAA,CAEV,EAAC,MAAD,CACE,IAAK,EACL,cAAY,OACZ,MAAO,CACL,SAAU,WACV,WAAY,SACZ,cAAe,OACf,QAAS,OACT,MAAO,cACP,OAAQ,EACR,SAAU,SACV,IAAK,EACN,CAEA,WACG,CAAA,CACN,EAAC,MAAD,CACE,IAAK,EACL,MAAO,CACL,QAAS,OACT,MAAO,cACP,IAAK,EACL,cAAe,EAAW,EAAI,iBAAmB,OACjD,kBAAmB,GAAG,EAAS,GAC/B,wBAAyB,SACzB,wBAAyB,WACzB,mBAAoB,EACpB,mBAAoB,UACrB,CACD,aACE,EACK,GAAM,CACL,EAAE,cAAc,MAAM,mBAAqB,UAE7C,IAAA,GAEN,aACE,EACK,GAAM,CACL,EAAE,cAAc,MAAM,mBAAqB,WAE7C,IAAA,YAzBR,CA6BE,EAAC,MAAD,CAAK,UAAU,6BAA6B,MAAO,CAAE,IAAK,EAAO,UAC9D,EACG,CAAA,CAEN,EAAC,MAAD,CACE,UAAU,6BACV,MAAO,CAAE,IAAK,EAAO,CACrB,cAAY,gBAEX,EACG,CAAA,CACF,GACF,GAIV,EAAQ,YAAc"}
|
package/dist/Prose.d.ts
CHANGED
|
@@ -1,22 +1,29 @@
|
|
|
1
|
-
import
|
|
2
|
-
import * as
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { ComponentProps, ElementType } from "react";
|
|
4
|
+
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
5
|
|
|
6
|
+
//#region src/components/Prose/index.d.ts
|
|
6
7
|
declare const proseVariants: (props?: ({
|
|
7
|
-
|
|
8
|
-
} &
|
|
8
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
9
|
+
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
9
10
|
type ProseProps<T extends ElementType = 'div'> = {
|
|
10
|
-
|
|
11
|
-
|
|
11
|
+
as?: T;
|
|
12
|
+
className?: string;
|
|
12
13
|
} & VariantProps<typeof proseVariants> & Omit<ComponentProps<T>, 'as' | 'className' | 'size'>;
|
|
13
14
|
/**
|
|
14
15
|
* Prose container for long-form/rich content (CMS output, markdown, user HTML).
|
|
15
16
|
* Applies semantic typography styles to nested HTML elements.
|
|
16
17
|
*/
|
|
17
|
-
declare function Prose<T extends ElementType = 'div'>({
|
|
18
|
+
declare function Prose<T extends ElementType = 'div'>({
|
|
19
|
+
as,
|
|
20
|
+
className,
|
|
21
|
+
size,
|
|
22
|
+
...props
|
|
23
|
+
}: ProseProps<T>): _$react_jsx_runtime0.JSX.Element;
|
|
18
24
|
declare namespace Prose {
|
|
19
|
-
|
|
25
|
+
var displayName: string;
|
|
20
26
|
}
|
|
21
|
-
|
|
22
|
-
export { Prose,
|
|
27
|
+
//#endregion
|
|
28
|
+
export { Prose, ProseProps, proseVariants };
|
|
29
|
+
//# sourceMappingURL=Prose.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Prose.d.ts","names":[],"sources":["../src/components/Prose/index.tsx"],"mappings":";;;;;;cAMa,aAAA,GAAa,KAAA;;IAyEzB,iCAAA,CAAA,SAAA;AAAA,KAEW,UAAA,WAAqB,WAAA;EAC/B,EAAA,GAAK,CAAA;EACL,SAAA;AAAA,IACE,YAAA,QAAoB,aAAA,IACtB,IAAA,CAAK,cAAA,CAAe,CAAA;;;;;iBAMN,KAAA,WAAgB,WAAA,SAAA,CAAA;EAC9B,EAAA;EACA,SAAA;EACA,IAAA;EAAA,GACG;AAAA,GACF,UAAA,CAAW,CAAA,IAAE,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,kBALA,KAAA;EAAA,IAAK,WAAA;AAAA"}
|
package/dist/Prose.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import{cva as e}from"class-variance-authority";import{cn as t}from"@oztix/roadie-core/utils";import{jsx as n}from"react/jsx-runtime";const r=e([`text-prose text-normal`,`[&_a]:underline [&_a]:underline-offset-2`,`[&_ul]:list-disc [&_ul]:pl-6`,`[&_ol]:list-decimal [&_ol]:pl-6`,`[&_blockquote]:border-l-[3px] [&_blockquote]:border-normal [&_blockquote]:pl-4 [&_blockquote]:text-subtle`,`[&_:not(pre)>code]:bg-subtler [&_:not(pre)>code]:rounded-md [&_:not(pre)>code]:px-1.5 [&_:not(pre)>code]:py-0.5 [&_:not(pre)>code]:text-[0.9em] [&_:not(pre)>code]:font-mono`,`[&_pre]:bg-sunken [&_pre]:rounded-lg [&_pre]:overflow-x-auto [&_pre]:font-mono`,`[&_img]:rounded-lg`,`[&_table]:w-full`,`[&_th]:text-left [&_th]:font-semibold [&_th]:border-b [&_th]:border-subtle`,`[&_td]:border-b [&_td]:border-subtler`,`[&_strong]:font-semibold [&_strong]:text-strong`],{variants:{size:{sm:[`text-sm`,`[&>*+*]:mt-2`,`[&_h1]:text-display-ui-2 [&_h1]:text-strong [&_h1]:mt-4`,`[&_h2]:text-display-ui-3 [&_h2]:text-strong [&_h2]:mt-4`,`[&_h3]:text-display-ui-4 [&_h3]:text-strong [&_h3]:mt-3`,`[&_h4]:text-display-ui-5 [&_h4]:text-strong [&_h4]:mt-3`,`[&_h5]:text-display-ui-6 [&_h5]:text-strong [&_h5]:mt-2`,`[&_h6]:text-display-ui-6 [&_h6]:text-strong [&_h6]:mt-2`,`[&_ul>li+li]:mt-0.5 [&_ol>li+li]:mt-0.5`,`[&_pre]:p-3 [&_pre]:text-xs`,`[&_th]:py-1.5 [&_th]:pr-3 [&_td]:py-1.5 [&_td]:pr-3`,`[&_hr]:my-4`],md:[`[&>*+*]:mt-4`,`[&_h1]:text-display-prose-1 [&_h1]:text-strong [&_h1]:mt-8`,`[&_h2]:text-display-prose-2 [&_h2]:text-strong [&_h2]:mt-8`,`[&_h3]:text-display-prose-3 [&_h3]:text-strong [&_h3]:mt-6`,`[&_h4]:text-display-prose-4 [&_h4]:text-strong [&_h4]:mt-6`,`[&_h5]:text-display-prose-5 [&_h5]:text-strong [&_h5]:mt-4`,`[&_h6]:text-display-prose-6 [&_h6]:text-strong [&_h6]:mt-4`,`[&_ul>li+li]:mt-1 [&_ol>li+li]:mt-1`,`[&_pre]:p-4 [&_pre]:text-sm`,`[&_th]:py-2 [&_th]:pr-4 [&_td]:py-2 [&_td]:pr-4`,`[&_hr]:my-8`],lg:[`text-lg`,`[&>*+*]:mt-6`,`[&_h1]:text-display-prose-1 [&_h1]:text-strong [&_h1]:mt-12`,`[&_h2]:text-display-prose-2 [&_h2]:text-strong [&_h2]:mt-10`,`[&_h3]:text-display-prose-3 [&_h3]:text-strong [&_h3]:mt-8`,`[&_h4]:text-display-prose-4 [&_h4]:text-strong [&_h4]:mt-6`,`[&_h5]:text-display-prose-5 [&_h5]:text-strong [&_h5]:mt-6`,`[&_h6]:text-display-prose-6 [&_h6]:text-strong [&_h6]:mt-4`,`[&_ul>li+li]:mt-2 [&_ol>li+li]:mt-2`,`[&_pre]:p-6 [&_pre]:text-sm`,`[&_th]:py-3 [&_th]:pr-4 [&_td]:py-3 [&_td]:pr-4`,`[&_hr]:my-12`]}},defaultVariants:{size:`md`}});function i({as:e,className:i,size:a,...o}){return n(e||`div`,{className:t(r({size:a,className:i})),...o})}i.displayName=`Prose`;export{i as Prose,r as proseVariants};
|
|
2
2
|
//# sourceMappingURL=Prose.js.map
|
package/dist/Prose.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"Prose.js","names":[],"sources":["../src/components/Prose/index.tsx"],"sourcesContent":["import type { ComponentProps, ElementType } from 'react'\n\nimport { type VariantProps, cva } from 'class-variance-authority'\n\nimport { cn } from '@oztix/roadie-core/utils'\n\nexport const proseVariants = cva(\n [\n 'text-prose text-normal',\n // Links\n '[&_a]:underline [&_a]:underline-offset-2',\n // Lists\n '[&_ul]:list-disc [&_ul]:pl-6',\n '[&_ol]:list-decimal [&_ol]:pl-6',\n // Blockquote\n '[&_blockquote]:border-l-[3px] [&_blockquote]:border-normal [&_blockquote]:pl-4 [&_blockquote]:text-subtle',\n // Code\n '[&_:not(pre)>code]:bg-subtler [&_:not(pre)>code]:rounded-md [&_:not(pre)>code]:px-1.5 [&_:not(pre)>code]:py-0.5 [&_:not(pre)>code]:text-[0.9em] [&_:not(pre)>code]:font-mono',\n // Pre\n '[&_pre]:bg-sunken [&_pre]:rounded-lg [&_pre]:overflow-x-auto [&_pre]:font-mono',\n // Images\n '[&_img]:rounded-lg',\n // Tables\n '[&_table]:w-full',\n '[&_th]:text-left [&_th]:font-semibold [&_th]:border-b [&_th]:border-subtle',\n '[&_td]:border-b [&_td]:border-subtler',\n // Strong/em\n '[&_strong]:font-semibold [&_strong]:text-strong'\n ],\n {\n variants: {\n size: {\n sm: [\n 'text-sm',\n '[&>*+*]:mt-2',\n '[&_h1]:text-display-ui-2 [&_h1]:text-strong [&_h1]:mt-4',\n '[&_h2]:text-display-ui-3 [&_h2]:text-strong [&_h2]:mt-4',\n '[&_h3]:text-display-ui-4 [&_h3]:text-strong [&_h3]:mt-3',\n '[&_h4]:text-display-ui-5 [&_h4]:text-strong [&_h4]:mt-3',\n '[&_h5]:text-display-ui-6 [&_h5]:text-strong [&_h5]:mt-2',\n '[&_h6]:text-display-ui-6 [&_h6]:text-strong [&_h6]:mt-2',\n '[&_ul>li+li]:mt-0.5 [&_ol>li+li]:mt-0.5',\n '[&_pre]:p-3 [&_pre]:text-xs',\n '[&_th]:py-1.5 [&_th]:pr-3 [&_td]:py-1.5 [&_td]:pr-3',\n '[&_hr]:my-4'\n ],\n md: [\n '[&>*+*]:mt-4',\n '[&_h1]:text-display-prose-1 [&_h1]:text-strong [&_h1]:mt-8',\n '[&_h2]:text-display-prose-2 [&_h2]:text-strong [&_h2]:mt-8',\n '[&_h3]:text-display-prose-3 [&_h3]:text-strong [&_h3]:mt-6',\n '[&_h4]:text-display-prose-4 [&_h4]:text-strong [&_h4]:mt-6',\n '[&_h5]:text-display-prose-5 [&_h5]:text-strong [&_h5]:mt-4',\n '[&_h6]:text-display-prose-6 [&_h6]:text-strong [&_h6]:mt-4',\n '[&_ul>li+li]:mt-1 [&_ol>li+li]:mt-1',\n '[&_pre]:p-4 [&_pre]:text-sm',\n '[&_th]:py-2 [&_th]:pr-4 [&_td]:py-2 [&_td]:pr-4',\n '[&_hr]:my-8'\n ],\n lg: [\n 'text-lg',\n '[&>*+*]:mt-6',\n '[&_h1]:text-display-prose-1 [&_h1]:text-strong [&_h1]:mt-12',\n '[&_h2]:text-display-prose-2 [&_h2]:text-strong [&_h2]:mt-10',\n '[&_h3]:text-display-prose-3 [&_h3]:text-strong [&_h3]:mt-8',\n '[&_h4]:text-display-prose-4 [&_h4]:text-strong [&_h4]:mt-6',\n '[&_h5]:text-display-prose-5 [&_h5]:text-strong [&_h5]:mt-6',\n '[&_h6]:text-display-prose-6 [&_h6]:text-strong [&_h6]:mt-4',\n '[&_ul>li+li]:mt-2 [&_ol>li+li]:mt-2',\n '[&_pre]:p-6 [&_pre]:text-sm',\n '[&_th]:py-3 [&_th]:pr-4 [&_td]:py-3 [&_td]:pr-4',\n '[&_hr]:my-12'\n ]\n }\n },\n defaultVariants: {\n size: 'md'\n }\n }\n)\n\nexport type ProseProps<T extends ElementType = 'div'> = {\n as?: T\n className?: string\n} & VariantProps<typeof proseVariants> &\n Omit<ComponentProps<T>, 'as' | 'className' | 'size'>\n\n/**\n * Prose container for long-form/rich content (CMS output, markdown, user HTML).\n * Applies semantic typography styles to nested HTML elements.\n */\nexport function Prose<T extends ElementType = 'div'>({\n as,\n className,\n size,\n ...props\n}: ProseProps<T>) {\n const Component = as || 'div'\n return (\n <Component className={cn(proseVariants({ size, className }))} {...props} />\n )\n}\n\nProse.displayName = 'Prose'\n"],"mappings":"qIAMA,MAAa,EAAgB,EAC3B,CACE,yBAEA,2CAEA,+BACA,kCAEA,4GAEA,+KAEA,iFAEA,qBAEA,mBACA,6EACA,wCAEA,kDACD,CACD,CACE,SAAU,CACR,KAAM,CACJ,GAAI,CACF,UACA,eACA,0DACA,0DACA,0DACA,0DACA,0DACA,0DACA,0CACA,8BACA,sDACA,cACD,CACD,GAAI,CACF,eACA,6DACA,6DACA,6DACA,6DACA,6DACA,6DACA,sCACA,8BACA,kDACA,cACD,CACD,GAAI,CACF,UACA,eACA,8DACA,8DACA,6DACA,6DACA,6DACA,6DACA,sCACA,8BACA,kDACA,eACD,CACF,CACF,CACD,gBAAiB,CACf,KAAM,KACP,CACF,CACF,CAYD,SAAgB,EAAqC,CACnD,KACA,YACA,OACA,GAAG,GACa,CAEhB,OACE,EAFgB,GAAM,MAEtB,CAAW,UAAW,EAAG,EAAc,CAAE,OAAM,YAAW,CAAC,CAAC,CAAE,GAAI,EAAS,CAAA,CAI/E,EAAM,YAAc"}
|
package/dist/RadioGroup.d.ts
CHANGED
|
@@ -1,59 +1,83 @@
|
|
|
1
|
-
import
|
|
2
|
-
import * as
|
|
3
|
-
import { ComponentProps } from
|
|
4
|
-
import { Radio } from
|
|
5
|
-
import { RadioGroup as RadioGroup$1 } from
|
|
6
|
-
import
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { ComponentProps, RefAttributes } from "react";
|
|
4
|
+
import { Radio } from "@base-ui/react/radio";
|
|
5
|
+
import { RadioGroup as RadioGroup$1 } from "@base-ui/react/radio-group";
|
|
6
|
+
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
7
7
|
|
|
8
|
+
//#region src/components/RadioGroup/index.d.ts
|
|
8
9
|
type RadioGroupEmphasis = 'subtler' | 'normal';
|
|
9
10
|
declare const radioGroupVariants: (props?: ({
|
|
10
|
-
|
|
11
|
-
} &
|
|
11
|
+
direction?: "vertical" | "horizontal" | null | undefined;
|
|
12
|
+
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
12
13
|
declare const radioGroupItemVariants: (props?: ({
|
|
13
|
-
|
|
14
|
-
} &
|
|
15
|
-
type RadioGroupRootProps = RadioGroup$1.Props & VariantProps<typeof radioGroupVariants> & {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
14
|
+
emphasis?: "normal" | "subtler" | null | undefined;
|
|
15
|
+
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
16
|
+
type RadioGroupRootProps = RadioGroup$1.Props & RefAttributes<HTMLDivElement> & VariantProps<typeof radioGroupVariants> & {
|
|
17
|
+
emphasis?: RadioGroupEmphasis;
|
|
18
|
+
invalid?: boolean;
|
|
19
|
+
required?: boolean;
|
|
19
20
|
};
|
|
20
|
-
declare function RadioGroupRoot({
|
|
21
|
+
declare function RadioGroupRoot({
|
|
22
|
+
className,
|
|
23
|
+
direction,
|
|
24
|
+
emphasis,
|
|
25
|
+
invalid,
|
|
26
|
+
required,
|
|
27
|
+
...props
|
|
28
|
+
}: RadioGroupRootProps): _$react_jsx_runtime0.JSX.Element;
|
|
21
29
|
declare namespace RadioGroupRoot {
|
|
22
|
-
|
|
30
|
+
var displayName: string;
|
|
23
31
|
}
|
|
24
|
-
type RadioGroupItemProps = Radio.Root.Props & {
|
|
25
|
-
|
|
26
|
-
|
|
32
|
+
type RadioGroupItemProps = Radio.Root.Props & RefAttributes<HTMLButtonElement> & {
|
|
33
|
+
label?: string;
|
|
34
|
+
description?: string;
|
|
27
35
|
};
|
|
28
|
-
declare function RadioGroupItem({
|
|
36
|
+
declare function RadioGroupItem({
|
|
37
|
+
className,
|
|
38
|
+
label,
|
|
39
|
+
description,
|
|
40
|
+
children,
|
|
41
|
+
...props
|
|
42
|
+
}: RadioGroupItemProps): _$react_jsx_runtime0.JSX.Element;
|
|
29
43
|
declare namespace RadioGroupItem {
|
|
30
|
-
|
|
44
|
+
var displayName: string;
|
|
31
45
|
}
|
|
32
46
|
interface RadioGroupLabelProps extends ComponentProps<'label'> {
|
|
33
|
-
|
|
47
|
+
showIndicator?: boolean;
|
|
34
48
|
}
|
|
35
|
-
declare function RadioGroupLabel({
|
|
49
|
+
declare function RadioGroupLabel({
|
|
50
|
+
className,
|
|
51
|
+
showIndicator,
|
|
52
|
+
children,
|
|
53
|
+
...props
|
|
54
|
+
}: RadioGroupLabelProps): _$react_jsx_runtime0.JSX.Element;
|
|
36
55
|
declare namespace RadioGroupLabel {
|
|
37
|
-
|
|
56
|
+
var displayName: string;
|
|
38
57
|
}
|
|
39
|
-
interface RadioGroupHelperTextProps extends ComponentProps<'p'> {
|
|
40
|
-
|
|
41
|
-
|
|
58
|
+
interface RadioGroupHelperTextProps extends ComponentProps<'p'> {}
|
|
59
|
+
declare function RadioGroupHelperText({
|
|
60
|
+
className,
|
|
61
|
+
...props
|
|
62
|
+
}: RadioGroupHelperTextProps): _$react_jsx_runtime0.JSX.Element;
|
|
42
63
|
declare namespace RadioGroupHelperText {
|
|
43
|
-
|
|
44
|
-
}
|
|
45
|
-
interface RadioGroupErrorTextProps extends ComponentProps<'p'> {
|
|
64
|
+
var displayName: string;
|
|
46
65
|
}
|
|
47
|
-
|
|
66
|
+
interface RadioGroupErrorTextProps extends ComponentProps<'p'> {}
|
|
67
|
+
declare function RadioGroupErrorText({
|
|
68
|
+
className,
|
|
69
|
+
...props
|
|
70
|
+
}: RadioGroupErrorTextProps): _$react_jsx_runtime0.JSX.Element | null;
|
|
48
71
|
declare namespace RadioGroupErrorText {
|
|
49
|
-
|
|
72
|
+
var displayName: string;
|
|
50
73
|
}
|
|
51
74
|
declare const RadioGroup: typeof RadioGroupRoot & {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
75
|
+
Item: typeof RadioGroupItem;
|
|
76
|
+
Label: typeof RadioGroupLabel;
|
|
77
|
+
HelperText: typeof RadioGroupHelperText;
|
|
78
|
+
ErrorText: typeof RadioGroupErrorText;
|
|
56
79
|
};
|
|
57
80
|
type RadioGroupProps = RadioGroupRootProps;
|
|
58
|
-
|
|
59
|
-
export { RadioGroup,
|
|
81
|
+
//#endregion
|
|
82
|
+
export { RadioGroup, RadioGroupErrorTextProps, RadioGroupHelperTextProps, RadioGroupItemProps, RadioGroupLabelProps, RadioGroupProps, RadioGroupRootProps, radioGroupItemVariants, radioGroupVariants };
|
|
83
|
+
//# sourceMappingURL=RadioGroup.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioGroup.d.ts","names":[],"sources":["../src/components/RadioGroup/index.tsx"],"mappings":";;;;;;;;KAqBK,kBAAA;AAAA,cAoBQ,kBAAA,GAAkB,KAAA;;IAU7B,iCAAA,CAAA,SAAA;AAAA,cAIW,sBAAA,GAAsB,KAAA;;IAclC,iCAAA,CAAA,SAAA;AAAA,KAIW,mBAAA,GAAsB,YAAA,CAAoB,KAAA,GACpD,aAAA,CAAc,cAAA,IACd,YAAA,QAAoB,kBAAA;EAClB,QAAA,GAAW,kBAAA;EACX,OAAA;EACA,QAAA;AAAA;AAAA,iBAGK,cAAA,CAAA;EACP,SAAA;EACA,SAAA;EACA,QAAA;EACA,OAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,mBAAA,GAAmB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,kBAPb,cAAA;EAAA,IAAc,WAAA;AAAA;AAAA,KAwCX,mBAAA,GAAsB,KAAA,CAAM,IAAA,CAAK,KAAA,GAC3C,aAAA,CAAc,iBAAA;EACZ,KAAA;EACA,WAAA;AAAA;AAAA,iBAGK,cAAA,CAAA;EACP,SAAA;EACA,KAAA;EACA,WAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,mBAAA,GAAmB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,kBANb,cAAA;EAAA,IAAc,WAAA;AAAA;AAAA,UA6DN,oBAAA,SAA6B,cAAA;EAC5C,aAAA;AAAA;AAAA,iBAGO,eAAA,CAAA;EACP,SAAA;EACA,aAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,oBAAA,GAAoB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,kBALd,eAAA;EAAA,IAAe,WAAA;AAAA;AAAA,UAoCP,yBAAA,SAAkC,cAAA;AAAA,iBAE1C,oBAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,yBAAA,GAAyB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,kBAHnB,oBAAA;EAAA,IAAoB,WAAA;AAAA;AAAA,UAaZ,wBAAA,SAAiC,cAAA;AAAA,iBAEzC,mBAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,wBAAA,GAAwB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,kBAHlB,mBAAA;EAAA,IAAmB,WAAA;AAAA;AAAA,cAmBf,UAAA,SAAU,cAAA;;;;;;KAOX,eAAA,GAAkB,mBAAA"}
|
package/dist/RadioGroup.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
export{c as RadioGroup,b as radioGroupItemVariants,a as radioGroupVariants}from'./_chunks/chunk-XRFHVFJ5.js';import'./_chunks/chunk-N2HGY7W7.js';import'./_chunks/chunk-OIAETOZT.js';import'./_chunks/chunk-LMV3JECI.js';import'./_chunks/chunk-VSKUGXQG.js';import'./_chunks/chunk-IEDKSZAQ.js';import'./_chunks/chunk-4LGCF3SN.js';//# sourceMappingURL=RadioGroup.js.map
|
|
1
|
+
"use client";import{OptionalIndicator as e,RequiredIndicator as t}from"./Indicator.js";import{useFieldContext as n}from"./Field.js";import{cva as r}from"class-variance-authority";import{cn as i}from"@oztix/roadie-core/utils";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";import{createContext as c,use as l}from"react";import{Radio as u}from"@base-ui/react/radio";import{RadioGroup as d}from"@base-ui/react/radio-group";const f=c({emphasis:`subtler`,direction:`vertical`}),p=r(`flex flex-wrap`,{variants:{direction:{vertical:`flex-col gap-2`,horizontal:`flex-row gap-4`}},defaultVariants:{direction:`vertical`}}),m=r(`flex cursor-pointer select-none items-center`,{variants:{emphasis:{subtler:`gap-2 rounded-lg px-1.5 py-1 emphasis-subtler is-interactive`,normal:`justify-between gap-3 rounded-xl p-4 emphasis-normal is-interactive has-[:checked]:bg-[var(--color-accent-2)] has-[:checked]:border-[var(--color-accent-9)] has-[:focus-visible]:outline has-[:focus-visible]:outline-[length:var(--focus-ring-width)] has-[:focus-visible]:outline-[color-mix(in_oklch,var(--color-accent-9)_var(--focus-ring-opacity),transparent)] has-[:focus-visible]:outline-offset-0`}},defaultVariants:{emphasis:`subtler`}});function h({className:e,direction:t=`vertical`,emphasis:r=`subtler`,invalid:a,required:s,...c}){let l=n(),u=a??l.invalid,m=s??l.required,h=!!l.fieldId;return o(f,{value:{emphasis:r,direction:t??`vertical`,invalid:u,required:m},children:o(d,{className:i(p({direction:t,className:e})),...h&&{"aria-labelledby":l.labelId||void 0,"aria-describedby":u?l.errorTextId||void 0:l.helperTextId||void 0},...c})})}h.displayName=`RadioGroup`;function g({className:e,label:t,description:n,children:r,...c}){let{emphasis:d,direction:p}=l(f),h=o(u.Root,{className:i(`duration-moderate flex size-6 shrink-0 items-center justify-center rounded-full border border-subtle emphasis-sunken outline-0 outline-offset-0 outline-[color-mix(in_oklch,var(--color-accent-9)_var(--focus-ring-opacity),transparent)] transition-[background-color,border-color,outline-width,outline-color] data-[checked]:border-[var(--color-accent-9)] data-[checked]:bg-[var(--color-accent-3)]`,d!==`normal`&&`focus-visible:outline-[length:var(--focus-ring-width)]`),...c,children:o(u.Indicator,{className:`size-2.5 rounded-full bg-[var(--color-accent-9)]`})});return o(`label`,{className:i(m({emphasis:d,className:e}),p===`horizontal`&&d===`normal`&&`flex-1`),children:d===`normal`?s(a,{children:[s(`div`,{className:`grid gap-0.5`,children:[s(`span`,{className:`flex items-center gap-2`,children:[r,t&&o(`span`,{className:`text-base font-medium text-normal`,children:t})]}),n&&o(`span`,{className:`text-sm text-subtle`,children:n})]}),h]}):s(a,{children:[h,r,t&&o(`span`,{className:`text-sm text-normal`,children:t})]})})}g.displayName=`RadioGroup.Item`;function _({className:n,showIndicator:r,children:c,...u}){let{required:d}=l(f);return s(`label`,{className:i(`flex w-full items-center gap-1 text-sm font-medium text-normal`,n),...u,children:[c,r&&(d?s(a,{children:[` `,o(t,{})]}):s(a,{children:[` `,o(e,{})]}))]})}_.displayName=`RadioGroup.Label`;function v({className:e,...t}){return o(`p`,{className:i(`w-full text-sm text-subtle`,e),...t})}v.displayName=`RadioGroup.HelperText`;function y({className:e,...t}){let{invalid:n}=l(f);return n?o(`p`,{role:`alert`,className:i(`w-full text-sm text-subtle intent-danger`,e),...t}):null}y.displayName=`RadioGroup.ErrorText`;const b=Object.assign(h,{Item:g,Label:_,HelperText:v,ErrorText:y});export{b as RadioGroup,m as radioGroupItemVariants,p as radioGroupVariants};
|
|
3
2
|
//# sourceMappingURL=RadioGroup.js.map
|
package/dist/RadioGroup.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"RadioGroup.js","names":["RadioGroupPrimitive"],"sources":["../src/components/RadioGroup/index.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ComponentProps,\n type RefAttributes,\n createContext,\n use\n} from 'react'\n\nimport { Radio } from '@base-ui/react/radio'\nimport { RadioGroup as RadioGroupPrimitive } from '@base-ui/react/radio-group'\nimport { type VariantProps, cva } from 'class-variance-authority'\n\nimport { cn } from '@oztix/roadie-core/utils'\n\nimport { useFieldContext } from '../Field'\nimport { OptionalIndicator } from '../Indicator'\nimport { RequiredIndicator } from '../Indicator'\n\n/* ─── Types ─── */\n\ntype RadioGroupEmphasis = 'subtler' | 'normal'\n\n/* ─── Context ─── */\n\ntype RadioGroupDirection = 'vertical' | 'horizontal'\n\ninterface RadioGroupContextValue {\n emphasis: RadioGroupEmphasis\n direction: RadioGroupDirection\n invalid?: boolean\n required?: boolean\n}\n\nconst RadioGroupContext = createContext<RadioGroupContextValue>({\n emphasis: 'subtler',\n direction: 'vertical'\n})\n\n/* ─── Root variants ─── */\n\nexport const radioGroupVariants = cva('flex flex-wrap', {\n variants: {\n direction: {\n vertical: 'flex-col gap-2',\n horizontal: 'flex-row gap-4'\n }\n },\n defaultVariants: {\n direction: 'vertical'\n }\n})\n\n/* ─── Item variants ─── */\n\nexport const radioGroupItemVariants = cva(\n 'flex cursor-pointer select-none items-center',\n {\n variants: {\n emphasis: {\n subtler: 'gap-2 rounded-lg px-1.5 py-1 emphasis-subtler is-interactive',\n normal:\n 'justify-between gap-3 rounded-xl p-4 emphasis-normal is-interactive has-[:checked]:bg-[var(--color-accent-2)] has-[:checked]:border-[var(--color-accent-9)] has-[:focus-visible]:outline has-[:focus-visible]:outline-[length:var(--focus-ring-width)] has-[:focus-visible]:outline-[color-mix(in_oklch,var(--color-accent-9)_var(--focus-ring-opacity),transparent)] has-[:focus-visible]:outline-offset-0'\n }\n },\n defaultVariants: {\n emphasis: 'subtler'\n }\n }\n)\n\n/* ─── Root ─── */\n\nexport type RadioGroupRootProps = RadioGroupPrimitive.Props &\n RefAttributes<HTMLDivElement> &\n VariantProps<typeof radioGroupVariants> & {\n emphasis?: RadioGroupEmphasis\n invalid?: boolean\n required?: boolean\n }\n\nfunction RadioGroupRoot({\n className,\n direction = 'vertical',\n emphasis = 'subtler',\n invalid,\n required,\n ...props\n}: RadioGroupRootProps) {\n const fieldContext = useFieldContext()\n const resolvedInvalid = invalid ?? fieldContext.invalid\n const resolvedRequired = required ?? fieldContext.required\n const inField = !!fieldContext.fieldId\n\n return (\n <RadioGroupContext\n value={{\n emphasis,\n direction: direction ?? 'vertical',\n invalid: resolvedInvalid,\n required: resolvedRequired\n }}\n >\n <RadioGroupPrimitive\n className={cn(radioGroupVariants({ direction, className }))}\n {...(inField && {\n 'aria-labelledby': fieldContext.labelId || undefined,\n 'aria-describedby': resolvedInvalid\n ? fieldContext.errorTextId || undefined\n : fieldContext.helperTextId || undefined\n })}\n {...props}\n />\n </RadioGroupContext>\n )\n}\n\nRadioGroupRoot.displayName = 'RadioGroup'\n\n/* ─── Item ─── */\n\nexport type RadioGroupItemProps = Radio.Root.Props &\n RefAttributes<HTMLButtonElement> & {\n label?: string\n description?: string\n }\n\nfunction RadioGroupItem({\n className,\n label,\n description,\n children,\n ...props\n}: RadioGroupItemProps) {\n const { emphasis, direction } = use(RadioGroupContext)\n\n const radio = (\n <Radio.Root\n className={cn(\n 'duration-moderate flex size-6 shrink-0 items-center justify-center rounded-full border border-subtle emphasis-sunken outline-0 outline-offset-0 outline-[color-mix(in_oklch,var(--color-accent-9)_var(--focus-ring-opacity),transparent)] transition-[background-color,border-color,outline-width,outline-color] data-[checked]:border-[var(--color-accent-9)] data-[checked]:bg-[var(--color-accent-3)]',\n emphasis !== 'normal' &&\n 'focus-visible:outline-[length:var(--focus-ring-width)]'\n )}\n {...props}\n >\n <Radio.Indicator className='size-2.5 rounded-full bg-[var(--color-accent-9)]' />\n </Radio.Root>\n )\n\n return (\n <label\n className={cn(\n radioGroupItemVariants({ emphasis, className }),\n direction === 'horizontal' && emphasis === 'normal' && 'flex-1'\n )}\n >\n {emphasis === 'normal' ? (\n <>\n <div className='grid gap-0.5'>\n <span className='flex items-center gap-2'>\n {children}\n {label && (\n <span className='text-base font-medium text-normal'>\n {label}\n </span>\n )}\n </span>\n {description && (\n <span className='text-sm text-subtle'>{description}</span>\n )}\n </div>\n {radio}\n </>\n ) : (\n <>\n {radio}\n {children}\n {label && <span className='text-sm text-normal'>{label}</span>}\n </>\n )}\n </label>\n )\n}\n\nRadioGroupItem.displayName = 'RadioGroup.Item'\n\n/* ─── Label ─── */\n\nexport interface RadioGroupLabelProps extends ComponentProps<'label'> {\n showIndicator?: boolean\n}\n\nfunction RadioGroupLabel({\n className,\n showIndicator,\n children,\n ...props\n}: RadioGroupLabelProps) {\n const { required } = use(RadioGroupContext)\n return (\n <label\n className={cn(\n 'flex w-full items-center gap-1 text-sm font-medium text-normal',\n className\n )}\n {...props}\n >\n {children}\n {showIndicator &&\n (required ? (\n <>\n {' '}\n <RequiredIndicator />\n </>\n ) : (\n <>\n {' '}\n <OptionalIndicator />\n </>\n ))}\n </label>\n )\n}\n\nRadioGroupLabel.displayName = 'RadioGroup.Label'\n\n/* ─── Helper text ─── */\n\nexport interface RadioGroupHelperTextProps extends ComponentProps<'p'> {}\n\nfunction RadioGroupHelperText({\n className,\n ...props\n}: RadioGroupHelperTextProps) {\n return (\n <p className={cn('w-full text-sm text-subtle', className)} {...props} />\n )\n}\n\nRadioGroupHelperText.displayName = 'RadioGroup.HelperText'\n\n/* ─── Error text ─── */\n\nexport interface RadioGroupErrorTextProps extends ComponentProps<'p'> {}\n\nfunction RadioGroupErrorText({\n className,\n ...props\n}: RadioGroupErrorTextProps) {\n const { invalid } = use(RadioGroupContext)\n if (!invalid) return null\n return (\n <p\n role='alert'\n className={cn('w-full text-sm text-subtle intent-danger', className)}\n {...props}\n />\n )\n}\n\nRadioGroupErrorText.displayName = 'RadioGroup.ErrorText'\n\n/* ─── Compound export ─── */\n\nexport const RadioGroup = Object.assign(RadioGroupRoot, {\n Item: RadioGroupItem,\n Label: RadioGroupLabel,\n HelperText: RadioGroupHelperText,\n ErrorText: RadioGroupErrorText\n})\n\nexport type RadioGroupProps = RadioGroupRootProps\n"],"mappings":"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"}
|
package/dist/Select.d.ts
CHANGED
|
@@ -1,131 +1,187 @@
|
|
|
1
|
-
import
|
|
2
|
-
import * as
|
|
3
|
-
import {
|
|
4
|
-
import { Select as Select$1 } from
|
|
5
|
-
import
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { ComponentProps, RefAttributes } from "react";
|
|
4
|
+
import { Select as Select$1 } from "@base-ui/react/select";
|
|
5
|
+
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
6
|
|
|
7
|
+
//#region src/components/Select/index.d.ts
|
|
7
8
|
declare const selectTriggerVariants: (props?: ({
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
} &
|
|
9
|
+
intent?: "neutral" | "brand" | "brand-secondary" | "accent" | "danger" | "success" | "warning" | "info" | null | undefined;
|
|
10
|
+
emphasis?: "normal" | "subtle" | null | undefined;
|
|
11
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
12
|
+
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
12
13
|
type SelectRootProps = Select$1.Root.Props<unknown> & {
|
|
13
|
-
|
|
14
|
-
|
|
14
|
+
invalid?: boolean;
|
|
15
|
+
required?: boolean;
|
|
15
16
|
};
|
|
16
|
-
declare function SelectRoot({
|
|
17
|
+
declare function SelectRoot({
|
|
18
|
+
invalid,
|
|
19
|
+
required,
|
|
20
|
+
...props
|
|
21
|
+
}: SelectRootProps): _$react_jsx_runtime0.JSX.Element;
|
|
17
22
|
declare namespace SelectRoot {
|
|
18
|
-
|
|
23
|
+
var displayName: string;
|
|
19
24
|
}
|
|
20
25
|
type SelectTriggerProps = Select$1.Trigger.Props & RefAttributes<HTMLButtonElement> & VariantProps<typeof selectTriggerVariants>;
|
|
21
|
-
declare function SelectTrigger({
|
|
26
|
+
declare function SelectTrigger({
|
|
27
|
+
className,
|
|
28
|
+
intent,
|
|
29
|
+
emphasis,
|
|
30
|
+
size,
|
|
31
|
+
...props
|
|
32
|
+
}: SelectTriggerProps): _$react_jsx_runtime0.JSX.Element;
|
|
22
33
|
declare namespace SelectTrigger {
|
|
23
|
-
|
|
34
|
+
var displayName: string;
|
|
24
35
|
}
|
|
25
36
|
type SelectValueProps = Select$1.Value.Props & RefAttributes<HTMLSpanElement>;
|
|
26
|
-
declare function SelectValue({
|
|
37
|
+
declare function SelectValue({
|
|
38
|
+
className,
|
|
39
|
+
...props
|
|
40
|
+
}: SelectValueProps): _$react_jsx_runtime0.JSX.Element;
|
|
27
41
|
declare namespace SelectValue {
|
|
28
|
-
|
|
42
|
+
var displayName: string;
|
|
29
43
|
}
|
|
30
44
|
type SelectIconProps = Select$1.Icon.Props & RefAttributes<HTMLSpanElement>;
|
|
31
|
-
declare function SelectIcon({
|
|
45
|
+
declare function SelectIcon({
|
|
46
|
+
className,
|
|
47
|
+
children,
|
|
48
|
+
...props
|
|
49
|
+
}: SelectIconProps): _$react_jsx_runtime0.JSX.Element;
|
|
32
50
|
declare namespace SelectIcon {
|
|
33
|
-
|
|
51
|
+
var displayName: string;
|
|
34
52
|
}
|
|
35
53
|
type SelectPortalProps = Select$1.Portal.Props & RefAttributes<HTMLDivElement>;
|
|
36
|
-
declare function SelectPortal(props: SelectPortalProps):
|
|
54
|
+
declare function SelectPortal(props: SelectPortalProps): _$react_jsx_runtime0.JSX.Element;
|
|
37
55
|
declare namespace SelectPortal {
|
|
38
|
-
|
|
56
|
+
var displayName: string;
|
|
39
57
|
}
|
|
40
58
|
type SelectPositionerProps = Select$1.Positioner.Props & RefAttributes<HTMLDivElement>;
|
|
41
|
-
declare function SelectPositioner({
|
|
59
|
+
declare function SelectPositioner({
|
|
60
|
+
className,
|
|
61
|
+
...props
|
|
62
|
+
}: SelectPositionerProps): _$react_jsx_runtime0.JSX.Element;
|
|
42
63
|
declare namespace SelectPositioner {
|
|
43
|
-
|
|
64
|
+
var displayName: string;
|
|
44
65
|
}
|
|
45
66
|
type SelectPopupProps = Select$1.Popup.Props & RefAttributes<HTMLDivElement>;
|
|
46
|
-
declare function SelectPopup({
|
|
67
|
+
declare function SelectPopup({
|
|
68
|
+
className,
|
|
69
|
+
...props
|
|
70
|
+
}: SelectPopupProps): _$react_jsx_runtime0.JSX.Element;
|
|
47
71
|
declare namespace SelectPopup {
|
|
48
|
-
|
|
72
|
+
var displayName: string;
|
|
49
73
|
}
|
|
50
74
|
type SelectItemProps = Select$1.Item.Props & RefAttributes<HTMLDivElement>;
|
|
51
|
-
declare function SelectItem({
|
|
75
|
+
declare function SelectItem({
|
|
76
|
+
className,
|
|
77
|
+
children,
|
|
78
|
+
...props
|
|
79
|
+
}: SelectItemProps): _$react_jsx_runtime0.JSX.Element;
|
|
52
80
|
declare namespace SelectItem {
|
|
53
|
-
|
|
81
|
+
var displayName: string;
|
|
54
82
|
}
|
|
55
83
|
type SelectItemTextProps = Select$1.ItemText.Props & RefAttributes<HTMLSpanElement>;
|
|
56
|
-
declare function SelectItemText(props: SelectItemTextProps):
|
|
84
|
+
declare function SelectItemText(props: SelectItemTextProps): _$react_jsx_runtime0.JSX.Element;
|
|
57
85
|
declare namespace SelectItemText {
|
|
58
|
-
|
|
86
|
+
var displayName: string;
|
|
59
87
|
}
|
|
60
88
|
type SelectItemIndicatorProps = Select$1.ItemIndicator.Props & RefAttributes<HTMLSpanElement>;
|
|
61
|
-
declare function SelectItemIndicator({
|
|
89
|
+
declare function SelectItemIndicator({
|
|
90
|
+
className,
|
|
91
|
+
children,
|
|
92
|
+
...props
|
|
93
|
+
}: SelectItemIndicatorProps): _$react_jsx_runtime0.JSX.Element;
|
|
62
94
|
declare namespace SelectItemIndicator {
|
|
63
|
-
|
|
95
|
+
var displayName: string;
|
|
64
96
|
}
|
|
65
97
|
type SelectGroupProps = Select$1.Group.Props & RefAttributes<HTMLDivElement>;
|
|
66
|
-
declare function SelectGroup({
|
|
98
|
+
declare function SelectGroup({
|
|
99
|
+
className,
|
|
100
|
+
...props
|
|
101
|
+
}: SelectGroupProps): _$react_jsx_runtime0.JSX.Element;
|
|
67
102
|
declare namespace SelectGroup {
|
|
68
|
-
|
|
103
|
+
var displayName: string;
|
|
69
104
|
}
|
|
70
105
|
type SelectGroupLabelProps = Select$1.GroupLabel.Props & RefAttributes<HTMLDivElement>;
|
|
71
|
-
declare function SelectGroupLabel({
|
|
106
|
+
declare function SelectGroupLabel({
|
|
107
|
+
className,
|
|
108
|
+
...props
|
|
109
|
+
}: SelectGroupLabelProps): _$react_jsx_runtime0.JSX.Element;
|
|
72
110
|
declare namespace SelectGroupLabel {
|
|
73
|
-
|
|
111
|
+
var displayName: string;
|
|
74
112
|
}
|
|
75
113
|
type SelectLabelProps = Select$1.Label.Props & RefAttributes<HTMLDivElement> & {
|
|
76
|
-
|
|
114
|
+
showIndicator?: boolean;
|
|
77
115
|
};
|
|
78
|
-
declare function SelectLabel({
|
|
116
|
+
declare function SelectLabel({
|
|
117
|
+
className,
|
|
118
|
+
showIndicator,
|
|
119
|
+
children,
|
|
120
|
+
...props
|
|
121
|
+
}: SelectLabelProps): _$react_jsx_runtime0.JSX.Element;
|
|
79
122
|
declare namespace SelectLabel {
|
|
80
|
-
|
|
123
|
+
var displayName: string;
|
|
81
124
|
}
|
|
82
125
|
type SelectScrollUpArrowProps = Select$1.ScrollUpArrow.Props & RefAttributes<HTMLDivElement>;
|
|
83
|
-
declare function SelectScrollUpArrow({
|
|
126
|
+
declare function SelectScrollUpArrow({
|
|
127
|
+
className,
|
|
128
|
+
...props
|
|
129
|
+
}: SelectScrollUpArrowProps): _$react_jsx_runtime0.JSX.Element;
|
|
84
130
|
declare namespace SelectScrollUpArrow {
|
|
85
|
-
|
|
131
|
+
var displayName: string;
|
|
86
132
|
}
|
|
87
133
|
type SelectScrollDownArrowProps = Select$1.ScrollDownArrow.Props & RefAttributes<HTMLDivElement>;
|
|
88
|
-
declare function SelectScrollDownArrow({
|
|
134
|
+
declare function SelectScrollDownArrow({
|
|
135
|
+
className,
|
|
136
|
+
...props
|
|
137
|
+
}: SelectScrollDownArrowProps): _$react_jsx_runtime0.JSX.Element;
|
|
89
138
|
declare namespace SelectScrollDownArrow {
|
|
90
|
-
|
|
139
|
+
var displayName: string;
|
|
91
140
|
}
|
|
92
|
-
interface SelectHelperTextProps extends ComponentProps<'p'> {
|
|
93
|
-
|
|
94
|
-
|
|
141
|
+
interface SelectHelperTextProps extends ComponentProps<'p'> {}
|
|
142
|
+
declare function SelectHelperText({
|
|
143
|
+
className,
|
|
144
|
+
...props
|
|
145
|
+
}: SelectHelperTextProps): _$react_jsx_runtime0.JSX.Element;
|
|
95
146
|
declare namespace SelectHelperText {
|
|
96
|
-
|
|
97
|
-
}
|
|
98
|
-
interface SelectErrorTextProps extends ComponentProps<'p'> {
|
|
147
|
+
var displayName: string;
|
|
99
148
|
}
|
|
100
|
-
|
|
149
|
+
interface SelectErrorTextProps extends ComponentProps<'p'> {}
|
|
150
|
+
declare function SelectErrorText({
|
|
151
|
+
className,
|
|
152
|
+
...props
|
|
153
|
+
}: SelectErrorTextProps): _$react_jsx_runtime0.JSX.Element | null;
|
|
101
154
|
declare namespace SelectErrorText {
|
|
102
|
-
|
|
155
|
+
var displayName: string;
|
|
103
156
|
}
|
|
104
|
-
interface SelectContentProps extends SelectPopupProps {
|
|
105
|
-
|
|
106
|
-
|
|
157
|
+
interface SelectContentProps extends SelectPopupProps {}
|
|
158
|
+
declare function SelectContent({
|
|
159
|
+
children,
|
|
160
|
+
...props
|
|
161
|
+
}: SelectContentProps): _$react_jsx_runtime0.JSX.Element;
|
|
107
162
|
declare namespace SelectContent {
|
|
108
|
-
|
|
163
|
+
var displayName: string;
|
|
109
164
|
}
|
|
110
165
|
declare const Select: typeof SelectRoot & {
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
166
|
+
Trigger: typeof SelectTrigger;
|
|
167
|
+
Value: typeof SelectValue;
|
|
168
|
+
Icon: typeof SelectIcon;
|
|
169
|
+
Portal: typeof SelectPortal;
|
|
170
|
+
Positioner: typeof SelectPositioner;
|
|
171
|
+
Popup: typeof SelectPopup;
|
|
172
|
+
Content: typeof SelectContent;
|
|
173
|
+
Item: typeof SelectItem;
|
|
174
|
+
ItemText: typeof SelectItemText;
|
|
175
|
+
ItemIndicator: typeof SelectItemIndicator;
|
|
176
|
+
Group: typeof SelectGroup;
|
|
177
|
+
GroupLabel: typeof SelectGroupLabel;
|
|
178
|
+
Label: typeof SelectLabel;
|
|
179
|
+
HelperText: typeof SelectHelperText;
|
|
180
|
+
ErrorText: typeof SelectErrorText;
|
|
181
|
+
ScrollUpArrow: typeof SelectScrollUpArrow;
|
|
182
|
+
ScrollDownArrow: typeof SelectScrollDownArrow;
|
|
128
183
|
};
|
|
129
184
|
type SelectProps = SelectRootProps;
|
|
130
|
-
|
|
131
|
-
export { Select, SelectContent,
|
|
185
|
+
//#endregion
|
|
186
|
+
export { Select, SelectContent, SelectContentProps, SelectErrorText, SelectErrorTextProps, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectHelperText, SelectHelperTextProps, SelectIcon, SelectIconProps, SelectItem, SelectItemIndicator, SelectItemIndicatorProps, SelectItemProps, SelectItemText, SelectItemTextProps, SelectLabel, SelectLabelProps, SelectPopup, SelectPopupProps, SelectPortal, SelectPortalProps, SelectPositioner, SelectPositionerProps, SelectProps, SelectRoot, SelectRootProps, SelectScrollDownArrow, SelectScrollDownArrowProps, SelectScrollUpArrow, SelectScrollUpArrowProps, SelectTrigger, SelectTriggerProps, type SelectTriggerProps as SelectTriggerVariantProps, SelectValue, SelectValueProps, selectTriggerVariants };
|
|
187
|
+
//# sourceMappingURL=Select.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Select.d.ts","names":[],"sources":["../src/components/Select/index.tsx"],"mappings":"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"}
|
package/dist/Select.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
export{t as Select,s as SelectContent,r as SelectErrorText,l as SelectGroup,m as SelectGroupLabel,q as SelectHelperText,e as SelectIcon,i as SelectItem,k as SelectItemIndicator,j as SelectItemText,n as SelectLabel,h as SelectPopup,f as SelectPortal,g as SelectPositioner,b as SelectRoot,p as SelectScrollDownArrow,o as SelectScrollUpArrow,c as SelectTrigger,d as SelectValue,a as selectTriggerVariants}from'./_chunks/chunk-BQEJDV7D.js';import'./_chunks/chunk-N2HGY7W7.js';import'./_chunks/chunk-OIAETOZT.js';import'./_chunks/chunk-LMV3JECI.js';import'./_chunks/chunk-VSKUGXQG.js';import'./_chunks/chunk-IEDKSZAQ.js';import'./_chunks/chunk-4LGCF3SN.js';//# sourceMappingURL=Select.js.map
|
|
1
|
+
"use client";import{t as e}from"./variants-DTAwzBl3.js";import{OptionalIndicator as t,RequiredIndicator as n}from"./Indicator.js";import{useFieldContext as r}from"./Field.js";import{cva as i}from"class-variance-authority";import{cn as a}from"@oztix/roadie-core/utils";import{Fragment as o,jsx as s,jsxs as c}from"react/jsx-runtime";import{createContext as l,use as u}from"react";import{CaretDownIcon as d,CaretUpIcon as f,CheckIcon as p}from"@phosphor-icons/react";import{Select as m}from"@base-ui/react/select";const h=l({}),g=i(`inline-flex w-full items-center justify-between rounded-lg font-sans select-none cursor-pointer text-left data-[popup-open]:bg-[var(--color-accent-2)] data-[popup-open]:border-[var(--color-accent-9)] data-[popup-open]:outline-[length:var(--focus-ring-width)]`,{variants:{intent:e,emphasis:{normal:`emphasis-raised border border-normal is-interactive-field`,subtle:`bg-subtle text-normal border border-transparent is-interactive-field`},size:{sm:`h-8 px-1.5 text-base`,md:`h-10 px-2 text-base`,lg:`h-12 px-2 text-base`}},defaultVariants:{emphasis:`normal`,size:`md`}});function _({invalid:e,required:t,...n}){let i=r();return s(h,{value:{invalid:e??i.invalid,required:t??i.required},children:s(m.Root,{...n})})}_.displayName=`Select`;function v({className:e,intent:t,emphasis:n,size:i,...o}){let c=r(),{invalid:l}=u(h),d=!!c.fieldId;return s(m.Trigger,{className:a(g({intent:t,emphasis:n,size:i,className:e})),...d&&{"aria-labelledby":c.labelId||void 0,"aria-describedby":l?c.errorTextId||void 0:c.helperTextId||void 0,"aria-invalid":l||void 0,"aria-required":c.required||void 0},...o})}v.displayName=`Select.Trigger`;function y({className:e,...t}){return s(m.Value,{className:a(`truncate data-[placeholder]:text-subtle`,e),...t})}y.displayName=`Select.Value`;function b({className:e,children:t,...n}){return s(m.Icon,{className:a(`duration-moderate ml-2 shrink-0 text-subtle transition-transform data-[popup-open]:rotate-180`,e),...n,children:t??s(d,{weight:`bold`,className:`size-4`})})}b.displayName=`Select.Icon`;function x(e){return s(m.Portal,{...e})}x.displayName=`Select.Portal`;function S({className:e,...t}){return s(m.Positioner,{className:a(`z-50`,e),alignItemWithTrigger:!1,...t})}S.displayName=`Select.Positioner`;function C({className:e,...t}){return s(m.Popup,{className:a(`max-h-[var(--available-height)] max-w-[var(--available-width)] min-w-[var(--anchor-width)] overflow-y-auto rounded-xl border border-[var(--intent-border-subtle)] bg-raised p-1 shadow-lg`,`origin-[var(--transform-origin)] transition-[transform,scale,opacity] data-[ending-style]:scale-95 data-[ending-style]:opacity-0 data-[starting-style]:scale-95 data-[starting-style]:opacity-0`,e),...t})}C.displayName=`Select.Popup`;function w({className:e,children:t,...n}){let r=typeof t==`string`||typeof t==`number`?c(o,{children:[s(T,{children:t}),s(E,{})]}):t;return s(m.Item,{className:a(`flex w-full min-w-0 cursor-pointer items-center justify-between gap-2 rounded-lg px-2 py-1.5 text-sm text-normal outline-none select-none`,`data-[highlighted]:bg-subtle`,e),...n,children:r})}w.displayName=`Select.Item`;function T(e){return s(m.ItemText,{...e})}T.displayName=`Select.ItemText`;function E({className:e,children:t,...n}){return s(m.ItemIndicator,{className:a(`shrink-0 text-subtle`,e),...n,children:t??s(p,{weight:`bold`,className:`size-4`})})}E.displayName=`Select.ItemIndicator`;function D({className:e,...t}){return s(m.Group,{className:a(`[&+&]:mt-1`,e),...t})}D.displayName=`Select.Group`;function O({className:e,...t}){return s(m.GroupLabel,{className:a(`px-2 py-1.5 text-xs font-medium text-subtle select-none`,e),...t})}O.displayName=`Select.GroupLabel`;function k({className:e,showIndicator:r,children:i,...l}){let{required:d}=u(h);return c(m.Label,{className:a(`flex items-center gap-1 text-sm font-medium text-normal`,e),...l,children:[i,r&&(d?c(o,{children:[` `,s(n,{})]}):c(o,{children:[` `,s(t,{})]}))]})}k.displayName=`Select.Label`;function A({className:e,...t}){return s(m.ScrollUpArrow,{className:a(`flex items-center justify-center py-1 text-subtle`,e),...t,children:s(f,{weight:`bold`,className:`size-3`})})}A.displayName=`Select.ScrollUpArrow`;function j({className:e,...t}){return s(m.ScrollDownArrow,{className:a(`flex items-center justify-center py-1 text-subtle`,e),...t,children:s(d,{weight:`bold`,className:`size-3`})})}j.displayName=`Select.ScrollDownArrow`;function M({className:e,...t}){return s(`p`,{className:a(`text-sm text-subtle`,e),...t})}M.displayName=`Select.HelperText`;function N({className:e,...t}){let{invalid:n}=u(h);return n?s(`p`,{role:`alert`,className:a(`text-sm text-subtle intent-danger`,e),...t}):null}N.displayName=`Select.ErrorText`;function P({children:e,...t}){return s(x,{children:s(S,{children:s(C,{...t,children:e})})})}P.displayName=`Select.Content`;const F=Object.assign(_,{Trigger:v,Value:y,Icon:b,Portal:x,Positioner:S,Popup:C,Content:P,Item:w,ItemText:T,ItemIndicator:E,Group:D,GroupLabel:O,Label:k,HelperText:M,ErrorText:N,ScrollUpArrow:A,ScrollDownArrow:j});export{F as Select,P as SelectContent,N as SelectErrorText,D as SelectGroup,O as SelectGroupLabel,M as SelectHelperText,b as SelectIcon,w as SelectItem,E as SelectItemIndicator,T as SelectItemText,k as SelectLabel,C as SelectPopup,x as SelectPortal,S as SelectPositioner,_ as SelectRoot,j as SelectScrollDownArrow,A as SelectScrollUpArrow,v as SelectTrigger,y as SelectValue,g as selectTriggerVariants};
|
|
3
2
|
//# sourceMappingURL=Select.js.map
|