@machinerd/js-module 0.2.0 → 0.2.1
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/hooks/index.mjs +1 -1
- package/dist/ui/client-only/index.cjs +1 -0
- package/dist/ui/client-only/index.d.cts +136 -0
- package/dist/ui/client-only/index.d.mts +136 -0
- package/dist/ui/client-only/index.mjs +1 -0
- package/dist/ui/index.cjs +1 -1
- package/dist/ui/index.d.cts +29 -160
- package/dist/ui/index.d.mts +29 -160
- package/dist/ui/index.mjs +1 -1
- package/dist/util/index.d.cts +1 -1
- package/dist/util/index.d.mts +1 -1
- package/dist/util/index.mjs +1 -1
- package/package.json +5 -1
- /package/dist/{hooks-5I2NBtcY.mjs → hooks-C9M3V-Pb.mjs} +0 -0
- /package/dist/{util-DCPr_-5a.mjs → util-BrmjOcya.mjs} +0 -0
package/dist/hooks/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{n as e,t}from"../hooks-
|
|
1
|
+
import{n as e,t}from"../hooks-C9M3V-Pb.mjs";export{t as useOutsideClick,e as useWindowSize};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const e=require(`../../chunk-Bmb41Sf3.cjs`),t=require(`../../util-CDkao6z3.cjs`),n=require(`../../hooks-DPYIex_y.cjs`);let r=require(`lodash-es`),i=require(`clsx`);i=e.t(i);let a=require(`react`);a=e.t(a);let o=require(`react/jsx-runtime`),s=require(`class-variance-authority`),c=require(`embla-carousel-react`);c=e.t(c);let l=require(`react-dom`);const u=a.default.createContext(null);function d(){let e=a.default.useContext(u);if(!e)throw Error(`useCarousel must be used within a <Carousel />`);return e}function f({orientation:e=`horizontal`,options:n,setApi:r,plugins:i,className:s,children:l,...d}){let[f,p]=(0,c.default)({...n,axis:e===`horizontal`?`x`:`y`},i),[m,h]=(0,a.useState)(!1),[g,_]=(0,a.useState)(!1),v=(0,a.useCallback)(e=>{e&&(h(e.canScrollPrev()),_(e.canScrollNext()))},[]),y=(0,a.useCallback)(()=>{p?.scrollPrev()},[p]),b=(0,a.useCallback)(()=>{p?.scrollNext()},[p]),x=(0,a.useCallback)(e=>{e.key===`ArrowLeft`?(e.preventDefault(),y()):e.key===`ArrowRight`&&(e.preventDefault(),b())},[y,b]);return(0,a.useEffect)(()=>{!p||!r||r(p)},[p,r]),(0,a.useEffect)(()=>{if(p)return v(p),p.on(`reInit`,v),p.on(`select`,v),()=>{p?.off(`select`,v)}},[p,v]),(0,o.jsx)(u.Provider,{value:{carouselRef:f,api:p,options:n,orientation:e||(n?.axis===`y`?`vertical`:`horizontal`),scrollPrev:y,scrollNext:b,canScrollPrev:m,canScrollNext:g},children:(0,o.jsx)(`div`,{"data-komc":!0,onKeyDownCapture:x,className:t.f(`komc:relative`,s),...d,children:l})})}function p({className:e,...n}){let{carouselRef:r,orientation:i}=d();return(0,o.jsx)(`div`,{ref:r,"data-komc":!0,className:`komc:h-full komc:overflow-hidden`,children:(0,o.jsx)(`div`,{className:t.f(`komc:flex komc:h-full`,i===`horizontal`?`komc:-ml-4`:`komc:-mt-4 komc:flex-col`,e),...n})})}function m({className:e,...n}){let{orientation:r}=d();return(0,o.jsx)(`div`,{"data-komc":!0,className:t.f(`komc:min-w-0 komc:shrink-0 komc:grow-0 komc:basis-full`,r===`horizontal`?`komc:pl-4`:`komc:pt-4`,e),...n})}function h({children:e,className:t,...n}){let{scrollPrev:r,canScrollPrev:a}=d();return(0,o.jsx)(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:(0,i.default)(`komc:w-full`,t),onClick:r,...n,children:e})}function g({children:e,className:t,...n}){let{scrollNext:r,canScrollNext:a}=d();return(0,o.jsx)(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:(0,i.default)(`komc:w-full`,t),onClick:r,...n,children:e})}function _({children:e,setOpen:t}){return(0,o.jsx)(`div`,{"data-komc":!0,className:(0,i.default)(`komc:inline-flex komc:shrink-0 komc:justify-center`,`komc:items-center komc:outline-none`),onMouseLeave:()=>t(!1),onMouseOver:()=>t(!0),onFocus:()=>t(!0),onBlur:()=>t(!1),onClick:()=>t(!0),children:e})}const v=(0,s.cva)(t.f(`komc:absolute komc:z-99 komc:w-max komc:max-w-70 komc:p-2 komc:rounded-md`,`komc:break-all komc:transition-opacity komc:duration-300 komc:bg-white`,`komc:drop-shadow-[0px_0.5px_3px_rgba(0,0,0,0.2)] komc:text-xs`),{variants:{portal:{true:``,false:``},placement:{top:``,bottom:``,left:``,right:``,"top-start":``,"top-end":``,"bottom-start":``,"bottom-end":``,"left-start":``,"left-end":``,"right-start":``,"right-end":``}},compoundVariants:[{portal:!0,placement:`top`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom`,className:`komc:translate-y-2`},{portal:!0,placement:`left`,className:`komc:-translate-x-2`},{portal:!0,placement:`right`,className:`komc:translate-x-2`},{portal:!0,placement:`top-start`,className:`komc:-translate-y-2`},{portal:!0,placement:`top-end`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom-start`,className:`komc:translate-y-2`},{portal:!0,placement:`bottom-end`,className:`komc:translate-y-2`},{portal:!0,placement:`left-start`,className:`komc:-translate-x-2`},{portal:!0,placement:`left-end`,className:`komc:-translate-x-2`},{portal:!0,placement:`right-start`,className:`komc:translate-x-2`},{portal:!0,placement:`right-end`,className:`komc:translate-x-2`},{portal:!1,placement:`top`,className:`komc:bottom-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`bottom`,className:`komc:top-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`left`,className:`komc:right-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`right`,className:`komc:left-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`top-start`,className:`komc:bottom-full komc:left-0`},{portal:!1,placement:`top-end`,className:`komc:bottom-full komc:right-0`},{portal:!1,placement:`bottom-start`,className:`komc:top-full komc:left-0`},{portal:!1,placement:`bottom-end`,className:`komc:top-full komc:right-0`},{portal:!1,placement:`left-start`,className:`komc:right-full komc:top-0`},{portal:!1,placement:`left-end`,className:`komc:right-full komc:bottom-0`},{portal:!1,placement:`right-start`,className:`komc:left-full komc:top-0`},{portal:!1,placement:`right-end`,className:`komc:left-full komc:bottom-0`}],defaultVariants:{placement:`top`,portal:!1}}),y=(0,a.forwardRef)(({portal:e,children:t,className:n,placement:r,...i},a)=>(0,o.jsx)(`div`,{ref:a,"data-komc":!0,role:`tooltip`,className:v({portal:e,placement:r,className:n}),...i,children:t}));var b=y;const x=(0,s.cva)(t.f(`komc:absolute komc:w-2 komc:h-2 komc:bg-inherit`,`komc:transition-opacity komc:duration-300`),{variants:{placement:{top:t.f(`komc:top-full komc:-mt-1 komc:left-1/2`),bottom:t.f(`komc:bottom-full komc:-mb-1 komc:left-1/2`),left:t.f(`komc:left-full komc:-ml-1 komc:top-1/2`),right:t.f(`komc:right-full komc:-mr-1 komc:top-1/2`),"top-start":t.f(`komc:top-full komc:-mt-1 komc:left-5`),"top-end":t.f(`komc:top-full komc:-mt-1 komc:right-5`),"bottom-start":t.f(`komc:bottom-full komc:-mb-1 komc:left-5`),"bottom-end":t.f(`komc:bottom-full komc:-mb-1 komc:right-5`),"left-start":t.f(`komc:left-full komc:-ml-1 komc:top-3`),"left-end":t.f(`komc:left-full komc:-ml-1 komc:bottom-3`),"right-start":t.f(`komc:right-full komc:-mr-1 komc:top-3`),"right-end":t.f(`komc:right-full komc:-mr-1 komc:bottom-3`)}},defaultVariants:{placement:`top`}}),S=({placement:e,className:t,offset:n,style:r,...i})=>{let s=(0,a.useMemo)(()=>{switch(e){case`top`:return`rotate(45deg)`;case`bottom`:return`rotate(225deg)`;case`left`:return`rotate(-45deg)`;case`right`:return`rotate(135deg)`;case`top-start`:return`rotate(45deg)`;case`top-end`:return`rotate(45deg)`;case`bottom-start`:return`rotate(225deg)`;case`bottom-end`:return`rotate(225deg)`;case`left-start`:return`rotate(-45deg)`;case`left-end`:return`rotate(-45deg)`;case`right-start`:return`rotate(135deg)`;case`right-end`:return`rotate(135deg)`;default:return`rotate(45deg)`}},[e]);return(0,o.jsx)(`div`,{className:x({placement:e,className:t}),style:{transform:`translate(${n?.x}px, ${n?.y}px) ${s}`},...i})};var C=S;const w=24,T=(e,t)=>{let[,n]=e.split(`-`);return n?`${t}-${n}`:t};function E({placement:e,className:t,content:n,open:s,hiddenRef:c,containerRef:u}){let[d,f]=(0,a.useState)(!1),p=(0,a.useRef)(null),[m,h]=(0,a.useState)(e),[g,_]=(0,a.useState)({top:0,left:0}),[v,y]=(0,a.useState)({x:0,y:0}),x=(0,a.useCallback)((0,r.debounce)(()=>{let e=u?.current,t=c.current;if(!e||!t)return;let n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),i=window.scrollY||document.documentElement.scrollTop,a=window.scrollX||document.documentElement.scrollLeft,[o,s]=m.split(`-`),l=i+n.top,d=a+n.left+n.width/2-r.width/2;switch(o){case`top`:l-=r.height;break;case`bottom`:l+=n.height;break;case`left`:l+=n.height/2-r.height/2,d-=r.width/2+n.width/2;break;case`right`:l+=n.height/2-r.height/2,d+=r.width/2+n.width/2;break}if([`top`,`bottom`].includes(o))switch(s){case`start`:d+=r.width/2-24;break;case`end`:d-=r.width/2-24;break}if([`left`,`right`].includes(o))switch(s){case`start`:l+=r.height/2+n.height/2-24;break;case`end`:l-=r.height/2+n.height/2-24;break}let f=d,p=window.innerWidth;f+r.width>p-4&&(f=p-r.width-4),f<4&&(f=4),_({top:l,left:f}),y({x:d-f,y:0})},50),[m]),S=(0,a.useCallback)((0,r.debounce)(()=>{if(!c.current)return;let{top:t,height:n}=c.current.getBoundingClientRect();h(r=>{let i=e;return t+n>=window.innerHeight?i=T(r,`top`):t<0&&(i=T(r,`bottom`)),i})},50),[e]);return(0,a.useEffect)(()=>(f(!0),S(),window.addEventListener(`scroll`,x,{passive:!0}),window.addEventListener(`resize`,x),window.addEventListener(`scroll`,S,{passive:!0}),window.addEventListener(`resize`,S),()=>{window.removeEventListener(`scroll`,x),window.removeEventListener(`resize`,x),window.removeEventListener(`scroll`,S),window.removeEventListener(`resize`,S)}),[x,S]),(0,a.useEffect)(()=>{d&&x()},[d,x]),d?(0,l.createPortal)((0,o.jsxs)(b,{ref:p,portal:!0,"data-komc":!0,placement:m,className:(0,i.default)(t,s?`komc:visible komc:opacity-100`:`komc:opacity-0 komc:invisible`),style:{...g},children:[(0,o.jsx)(`span`,{children:n}),(0,o.jsx)(C,{placement:m,offset:v})]}),document.body):null}const D=(0,a.forwardRef)(({children:e,content:t,defaultOpen:r=!1,className:s,placement:c=`top`},l)=>{let[u,d]=(0,a.useState)(r),f=(0,a.useRef)(null),p=(0,a.useRef)(null);return n.t({ref:f,setOpen:d}),(0,o.jsxs)(`div`,{ref:f,"data-komc":!0,className:`komc:flex komc:shrink-0 komc:relative komc:overflow-hidden komc:w-fit komc:h-fit`,children:[(0,o.jsx)(_,{setOpen:d,children:e}),(0,o.jsx)(E,{placement:c,className:s,open:u,content:t,hiddenRef:p,containerRef:f}),(0,o.jsx)(b,{ref:p,role:`presentation`,placement:c,className:(0,i.default)(`komc:opacity-0 komc:invisible`,s),children:(0,o.jsx)(`span`,{children:t})})]})});var O=D;exports.Carousel=f,exports.CarouselItem=m,exports.CarouselNext=g,exports.CarouselPrevious=h,exports.CarouselWrapper=p,exports.Tooltip=O;
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import * as react4 from "react";
|
|
2
|
+
import React$1, { ComponentProps, HTMLAttributes } from "react";
|
|
3
|
+
import useEmblaCarousel, { UseEmblaCarouselType } from "embla-carousel-react";
|
|
4
|
+
import * as react_jsx_runtime4 from "react/jsx-runtime";
|
|
5
|
+
|
|
6
|
+
//#region src/ui/client-only/carousel/carousel-context.d.ts
|
|
7
|
+
type CarouselApi = UseEmblaCarouselType[1];
|
|
8
|
+
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
9
|
+
type CarouselOptions = UseCarouselParameters[0];
|
|
10
|
+
type CarouselPlugin = UseCarouselParameters[1];
|
|
11
|
+
interface CarouselProps {
|
|
12
|
+
options?: CarouselOptions;
|
|
13
|
+
plugins?: CarouselPlugin;
|
|
14
|
+
orientation?: 'horizontal' | 'vertical';
|
|
15
|
+
setApi?: (api: CarouselApi) => void;
|
|
16
|
+
}
|
|
17
|
+
type CarouselContextProps = {
|
|
18
|
+
carouselRef: ReturnType<typeof useEmblaCarousel>[0];
|
|
19
|
+
api: ReturnType<typeof useEmblaCarousel>[1];
|
|
20
|
+
scrollPrev: () => void;
|
|
21
|
+
scrollNext: () => void;
|
|
22
|
+
canScrollPrev: boolean;
|
|
23
|
+
canScrollNext: boolean;
|
|
24
|
+
} & CarouselProps;
|
|
25
|
+
//#endregion
|
|
26
|
+
//#region src/ui/client-only/carousel/carousel.d.ts
|
|
27
|
+
interface CarouselProps$1 extends ComponentProps<'div'>, CarouselProps {
|
|
28
|
+
/**
|
|
29
|
+
* @param orientation - Orientation of the carousel
|
|
30
|
+
* @default horizontal
|
|
31
|
+
* @property
|
|
32
|
+
* - horizontal
|
|
33
|
+
* - vertical
|
|
34
|
+
*/
|
|
35
|
+
orientation?: 'horizontal' | 'vertical';
|
|
36
|
+
/**
|
|
37
|
+
* @param options - Options of the carousel
|
|
38
|
+
* @default {}
|
|
39
|
+
*/
|
|
40
|
+
options?: CarouselProps['options'];
|
|
41
|
+
/**
|
|
42
|
+
* @param setApi - Set the API of the carousel
|
|
43
|
+
* @default undefined
|
|
44
|
+
*/
|
|
45
|
+
setApi?: CarouselProps['setApi'];
|
|
46
|
+
/**
|
|
47
|
+
* @param plugins - Plugins of the carousel
|
|
48
|
+
* @default []
|
|
49
|
+
*/
|
|
50
|
+
plugins?: CarouselProps['plugins'];
|
|
51
|
+
}
|
|
52
|
+
declare function Carousel({
|
|
53
|
+
orientation,
|
|
54
|
+
options,
|
|
55
|
+
setApi,
|
|
56
|
+
plugins,
|
|
57
|
+
className,
|
|
58
|
+
children,
|
|
59
|
+
...props
|
|
60
|
+
}: CarouselProps$1): react_jsx_runtime4.JSX.Element;
|
|
61
|
+
//#endregion
|
|
62
|
+
//#region src/ui/client-only/carousel/carousel-wrapper.d.ts
|
|
63
|
+
declare function CarouselWrapper({
|
|
64
|
+
className,
|
|
65
|
+
...props
|
|
66
|
+
}: React$1.ComponentProps<'div'>): react_jsx_runtime4.JSX.Element;
|
|
67
|
+
//#endregion
|
|
68
|
+
//#region src/ui/client-only/carousel/carousel-item.d.ts
|
|
69
|
+
declare function CarouselItem({
|
|
70
|
+
className,
|
|
71
|
+
...props
|
|
72
|
+
}: React$1.ComponentProps<'div'>): react_jsx_runtime4.JSX.Element;
|
|
73
|
+
//#endregion
|
|
74
|
+
//#region src/ui/client-only/carousel/carousel-previous.d.ts
|
|
75
|
+
declare function CarouselPrevious({
|
|
76
|
+
children,
|
|
77
|
+
className,
|
|
78
|
+
...props
|
|
79
|
+
}: React$1.ComponentProps<'button'>): react_jsx_runtime4.JSX.Element;
|
|
80
|
+
//#endregion
|
|
81
|
+
//#region src/ui/client-only/carousel/carousel-next.d.ts
|
|
82
|
+
declare function CarouselNext({
|
|
83
|
+
children,
|
|
84
|
+
className,
|
|
85
|
+
...props
|
|
86
|
+
}: React$1.ComponentProps<'button'>): react_jsx_runtime4.JSX.Element;
|
|
87
|
+
//#endregion
|
|
88
|
+
//#region src/ui/client-only/tooltip/tooltip-container.d.ts
|
|
89
|
+
type SubPlacement = 'start' | 'end';
|
|
90
|
+
type MainPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
91
|
+
type TooltipPlacement = MainPlacement | `${MainPlacement}-${SubPlacement}`;
|
|
92
|
+
interface TooltipContainerProps extends HTMLAttributes<HTMLDivElement> {
|
|
93
|
+
/**
|
|
94
|
+
* @param children - Trigger element
|
|
95
|
+
*/
|
|
96
|
+
children: React.ReactNode;
|
|
97
|
+
/**
|
|
98
|
+
* @param content - Tooltip content
|
|
99
|
+
*/
|
|
100
|
+
content: string;
|
|
101
|
+
/**
|
|
102
|
+
* @param placement - Placement of the tooltip
|
|
103
|
+
* @default top
|
|
104
|
+
* @property
|
|
105
|
+
* - top
|
|
106
|
+
* - bottom
|
|
107
|
+
* - left
|
|
108
|
+
* - right
|
|
109
|
+
* - top-start
|
|
110
|
+
* - top-end
|
|
111
|
+
* - bottom-start
|
|
112
|
+
* - bottom-end
|
|
113
|
+
* - left-start
|
|
114
|
+
* - left-end
|
|
115
|
+
* - right-start
|
|
116
|
+
* - right-end
|
|
117
|
+
*/
|
|
118
|
+
placement?: TooltipPlacement;
|
|
119
|
+
/**
|
|
120
|
+
* @param defaultOpen - Default open state of the tooltip
|
|
121
|
+
* @default false
|
|
122
|
+
* @property
|
|
123
|
+
* - true: Open the tooltip
|
|
124
|
+
* - false: Close the tooltip
|
|
125
|
+
*/
|
|
126
|
+
defaultOpen?: boolean;
|
|
127
|
+
}
|
|
128
|
+
/**
|
|
129
|
+
* @param children - Trigger element
|
|
130
|
+
* @param content - Tooltip content
|
|
131
|
+
* @param defaultOpen - Default open state of the tooltip
|
|
132
|
+
* @param placement - Placement of the tooltip
|
|
133
|
+
*/
|
|
134
|
+
declare const TooltipContainer: react4.ForwardRefExoticComponent<TooltipContainerProps & react4.RefAttributes<HTMLDivElement>>;
|
|
135
|
+
//#endregion
|
|
136
|
+
export { Carousel, type CarouselApi, type CarouselContextProps, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, CarouselWrapper, TooltipContainer as Tooltip, type TooltipContainerProps as TooltipProps };
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import * as react0 from "react";
|
|
2
|
+
import React$1, { ComponentProps, HTMLAttributes } from "react";
|
|
3
|
+
import * as react_jsx_runtime3 from "react/jsx-runtime";
|
|
4
|
+
import useEmblaCarousel, { UseEmblaCarouselType } from "embla-carousel-react";
|
|
5
|
+
|
|
6
|
+
//#region src/ui/client-only/carousel/carousel-context.d.ts
|
|
7
|
+
type CarouselApi = UseEmblaCarouselType[1];
|
|
8
|
+
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
9
|
+
type CarouselOptions = UseCarouselParameters[0];
|
|
10
|
+
type CarouselPlugin = UseCarouselParameters[1];
|
|
11
|
+
interface CarouselProps {
|
|
12
|
+
options?: CarouselOptions;
|
|
13
|
+
plugins?: CarouselPlugin;
|
|
14
|
+
orientation?: 'horizontal' | 'vertical';
|
|
15
|
+
setApi?: (api: CarouselApi) => void;
|
|
16
|
+
}
|
|
17
|
+
type CarouselContextProps = {
|
|
18
|
+
carouselRef: ReturnType<typeof useEmblaCarousel>[0];
|
|
19
|
+
api: ReturnType<typeof useEmblaCarousel>[1];
|
|
20
|
+
scrollPrev: () => void;
|
|
21
|
+
scrollNext: () => void;
|
|
22
|
+
canScrollPrev: boolean;
|
|
23
|
+
canScrollNext: boolean;
|
|
24
|
+
} & CarouselProps;
|
|
25
|
+
//#endregion
|
|
26
|
+
//#region src/ui/client-only/carousel/carousel.d.ts
|
|
27
|
+
interface CarouselProps$1 extends ComponentProps<'div'>, CarouselProps {
|
|
28
|
+
/**
|
|
29
|
+
* @param orientation - Orientation of the carousel
|
|
30
|
+
* @default horizontal
|
|
31
|
+
* @property
|
|
32
|
+
* - horizontal
|
|
33
|
+
* - vertical
|
|
34
|
+
*/
|
|
35
|
+
orientation?: 'horizontal' | 'vertical';
|
|
36
|
+
/**
|
|
37
|
+
* @param options - Options of the carousel
|
|
38
|
+
* @default {}
|
|
39
|
+
*/
|
|
40
|
+
options?: CarouselProps['options'];
|
|
41
|
+
/**
|
|
42
|
+
* @param setApi - Set the API of the carousel
|
|
43
|
+
* @default undefined
|
|
44
|
+
*/
|
|
45
|
+
setApi?: CarouselProps['setApi'];
|
|
46
|
+
/**
|
|
47
|
+
* @param plugins - Plugins of the carousel
|
|
48
|
+
* @default []
|
|
49
|
+
*/
|
|
50
|
+
plugins?: CarouselProps['plugins'];
|
|
51
|
+
}
|
|
52
|
+
declare function Carousel({
|
|
53
|
+
orientation,
|
|
54
|
+
options,
|
|
55
|
+
setApi,
|
|
56
|
+
plugins,
|
|
57
|
+
className,
|
|
58
|
+
children,
|
|
59
|
+
...props
|
|
60
|
+
}: CarouselProps$1): react_jsx_runtime3.JSX.Element;
|
|
61
|
+
//#endregion
|
|
62
|
+
//#region src/ui/client-only/carousel/carousel-wrapper.d.ts
|
|
63
|
+
declare function CarouselWrapper({
|
|
64
|
+
className,
|
|
65
|
+
...props
|
|
66
|
+
}: React$1.ComponentProps<'div'>): react_jsx_runtime3.JSX.Element;
|
|
67
|
+
//#endregion
|
|
68
|
+
//#region src/ui/client-only/carousel/carousel-item.d.ts
|
|
69
|
+
declare function CarouselItem({
|
|
70
|
+
className,
|
|
71
|
+
...props
|
|
72
|
+
}: React$1.ComponentProps<'div'>): react_jsx_runtime3.JSX.Element;
|
|
73
|
+
//#endregion
|
|
74
|
+
//#region src/ui/client-only/carousel/carousel-previous.d.ts
|
|
75
|
+
declare function CarouselPrevious({
|
|
76
|
+
children,
|
|
77
|
+
className,
|
|
78
|
+
...props
|
|
79
|
+
}: React$1.ComponentProps<'button'>): react_jsx_runtime3.JSX.Element;
|
|
80
|
+
//#endregion
|
|
81
|
+
//#region src/ui/client-only/carousel/carousel-next.d.ts
|
|
82
|
+
declare function CarouselNext({
|
|
83
|
+
children,
|
|
84
|
+
className,
|
|
85
|
+
...props
|
|
86
|
+
}: React$1.ComponentProps<'button'>): react_jsx_runtime3.JSX.Element;
|
|
87
|
+
//#endregion
|
|
88
|
+
//#region src/ui/client-only/tooltip/tooltip-container.d.ts
|
|
89
|
+
type SubPlacement = 'start' | 'end';
|
|
90
|
+
type MainPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
91
|
+
type TooltipPlacement = MainPlacement | `${MainPlacement}-${SubPlacement}`;
|
|
92
|
+
interface TooltipContainerProps extends HTMLAttributes<HTMLDivElement> {
|
|
93
|
+
/**
|
|
94
|
+
* @param children - Trigger element
|
|
95
|
+
*/
|
|
96
|
+
children: React.ReactNode;
|
|
97
|
+
/**
|
|
98
|
+
* @param content - Tooltip content
|
|
99
|
+
*/
|
|
100
|
+
content: string;
|
|
101
|
+
/**
|
|
102
|
+
* @param placement - Placement of the tooltip
|
|
103
|
+
* @default top
|
|
104
|
+
* @property
|
|
105
|
+
* - top
|
|
106
|
+
* - bottom
|
|
107
|
+
* - left
|
|
108
|
+
* - right
|
|
109
|
+
* - top-start
|
|
110
|
+
* - top-end
|
|
111
|
+
* - bottom-start
|
|
112
|
+
* - bottom-end
|
|
113
|
+
* - left-start
|
|
114
|
+
* - left-end
|
|
115
|
+
* - right-start
|
|
116
|
+
* - right-end
|
|
117
|
+
*/
|
|
118
|
+
placement?: TooltipPlacement;
|
|
119
|
+
/**
|
|
120
|
+
* @param defaultOpen - Default open state of the tooltip
|
|
121
|
+
* @default false
|
|
122
|
+
* @property
|
|
123
|
+
* - true: Open the tooltip
|
|
124
|
+
* - false: Close the tooltip
|
|
125
|
+
*/
|
|
126
|
+
defaultOpen?: boolean;
|
|
127
|
+
}
|
|
128
|
+
/**
|
|
129
|
+
* @param children - Trigger element
|
|
130
|
+
* @param content - Tooltip content
|
|
131
|
+
* @param defaultOpen - Default open state of the tooltip
|
|
132
|
+
* @param placement - Placement of the tooltip
|
|
133
|
+
*/
|
|
134
|
+
declare const TooltipContainer: react0.ForwardRefExoticComponent<TooltipContainerProps & react0.RefAttributes<HTMLDivElement>>;
|
|
135
|
+
//#endregion
|
|
136
|
+
export { Carousel, type CarouselApi, type CarouselContextProps, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, CarouselWrapper, TooltipContainer as Tooltip, type TooltipContainerProps as TooltipProps };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{f as e}from"../../util-BrmjOcya.mjs";import{t}from"../../hooks-C9M3V-Pb.mjs";import{debounce as n}from"lodash-es";import r from"clsx";import i,{forwardRef as a,useCallback as o,useEffect as s,useMemo as c,useRef as l,useState as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{cva as p}from"class-variance-authority";import m from"embla-carousel-react";import{createPortal as h}from"react-dom";const g=i.createContext(null);function _(){let e=i.useContext(g);if(!e)throw Error(`useCarousel must be used within a <Carousel />`);return e}function v({orientation:t=`horizontal`,options:n,setApi:r,plugins:i,className:a,children:c,...l}){let[f,p]=m({...n,axis:t===`horizontal`?`x`:`y`},i),[h,_]=u(!1),[v,y]=u(!1),b=o(e=>{e&&(_(e.canScrollPrev()),y(e.canScrollNext()))},[]),x=o(()=>{p?.scrollPrev()},[p]),S=o(()=>{p?.scrollNext()},[p]),C=o(e=>{e.key===`ArrowLeft`?(e.preventDefault(),x()):e.key===`ArrowRight`&&(e.preventDefault(),S())},[x,S]);return s(()=>{!p||!r||r(p)},[p,r]),s(()=>{if(p)return b(p),p.on(`reInit`,b),p.on(`select`,b),()=>{p?.off(`select`,b)}},[p,b]),d(g.Provider,{value:{carouselRef:f,api:p,options:n,orientation:t||(n?.axis===`y`?`vertical`:`horizontal`),scrollPrev:x,scrollNext:S,canScrollPrev:h,canScrollNext:v},children:d(`div`,{"data-komc":!0,onKeyDownCapture:C,className:e(`komc:relative`,a),...l,children:c})})}function y({className:t,...n}){let{carouselRef:r,orientation:i}=_();return d(`div`,{ref:r,"data-komc":!0,className:`komc:h-full komc:overflow-hidden`,children:d(`div`,{className:e(`komc:flex komc:h-full`,i===`horizontal`?`komc:-ml-4`:`komc:-mt-4 komc:flex-col`,t),...n})})}function b({className:t,...n}){let{orientation:r}=_();return d(`div`,{"data-komc":!0,className:e(`komc:min-w-0 komc:shrink-0 komc:grow-0 komc:basis-full`,r===`horizontal`?`komc:pl-4`:`komc:pt-4`,t),...n})}function x({children:e,className:t,...n}){let{scrollPrev:i,canScrollPrev:a}=_();return d(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:r(`komc:w-full`,t),onClick:i,...n,children:e})}function S({children:e,className:t,...n}){let{scrollNext:i,canScrollNext:a}=_();return d(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:r(`komc:w-full`,t),onClick:i,...n,children:e})}function C({children:e,setOpen:t}){return d(`div`,{"data-komc":!0,className:r(`komc:inline-flex komc:shrink-0 komc:justify-center`,`komc:items-center komc:outline-none`),onMouseLeave:()=>t(!1),onMouseOver:()=>t(!0),onFocus:()=>t(!0),onBlur:()=>t(!1),onClick:()=>t(!0),children:e})}const w=p(e(`komc:absolute komc:z-99 komc:w-max komc:max-w-70 komc:p-2 komc:rounded-md`,`komc:break-all komc:transition-opacity komc:duration-300 komc:bg-white`,`komc:drop-shadow-[0px_0.5px_3px_rgba(0,0,0,0.2)] komc:text-xs`),{variants:{portal:{true:``,false:``},placement:{top:``,bottom:``,left:``,right:``,"top-start":``,"top-end":``,"bottom-start":``,"bottom-end":``,"left-start":``,"left-end":``,"right-start":``,"right-end":``}},compoundVariants:[{portal:!0,placement:`top`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom`,className:`komc:translate-y-2`},{portal:!0,placement:`left`,className:`komc:-translate-x-2`},{portal:!0,placement:`right`,className:`komc:translate-x-2`},{portal:!0,placement:`top-start`,className:`komc:-translate-y-2`},{portal:!0,placement:`top-end`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom-start`,className:`komc:translate-y-2`},{portal:!0,placement:`bottom-end`,className:`komc:translate-y-2`},{portal:!0,placement:`left-start`,className:`komc:-translate-x-2`},{portal:!0,placement:`left-end`,className:`komc:-translate-x-2`},{portal:!0,placement:`right-start`,className:`komc:translate-x-2`},{portal:!0,placement:`right-end`,className:`komc:translate-x-2`},{portal:!1,placement:`top`,className:`komc:bottom-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`bottom`,className:`komc:top-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`left`,className:`komc:right-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`right`,className:`komc:left-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`top-start`,className:`komc:bottom-full komc:left-0`},{portal:!1,placement:`top-end`,className:`komc:bottom-full komc:right-0`},{portal:!1,placement:`bottom-start`,className:`komc:top-full komc:left-0`},{portal:!1,placement:`bottom-end`,className:`komc:top-full komc:right-0`},{portal:!1,placement:`left-start`,className:`komc:right-full komc:top-0`},{portal:!1,placement:`left-end`,className:`komc:right-full komc:bottom-0`},{portal:!1,placement:`right-start`,className:`komc:left-full komc:top-0`},{portal:!1,placement:`right-end`,className:`komc:left-full komc:bottom-0`}],defaultVariants:{placement:`top`,portal:!1}});var T=a(({portal:e,children:t,className:n,placement:r,...i},a)=>d(`div`,{ref:a,"data-komc":!0,role:`tooltip`,className:w({portal:e,placement:r,className:n}),...i,children:t}));const E=p(e(`komc:absolute komc:w-2 komc:h-2 komc:bg-inherit`,`komc:transition-opacity komc:duration-300`),{variants:{placement:{top:e(`komc:top-full komc:-mt-1 komc:left-1/2`),bottom:e(`komc:bottom-full komc:-mb-1 komc:left-1/2`),left:e(`komc:left-full komc:-ml-1 komc:top-1/2`),right:e(`komc:right-full komc:-mr-1 komc:top-1/2`),"top-start":e(`komc:top-full komc:-mt-1 komc:left-5`),"top-end":e(`komc:top-full komc:-mt-1 komc:right-5`),"bottom-start":e(`komc:bottom-full komc:-mb-1 komc:left-5`),"bottom-end":e(`komc:bottom-full komc:-mb-1 komc:right-5`),"left-start":e(`komc:left-full komc:-ml-1 komc:top-3`),"left-end":e(`komc:left-full komc:-ml-1 komc:bottom-3`),"right-start":e(`komc:right-full komc:-mr-1 komc:top-3`),"right-end":e(`komc:right-full komc:-mr-1 komc:bottom-3`)}},defaultVariants:{placement:`top`}});var D=({placement:e,className:t,offset:n,style:r,...i})=>{let a=c(()=>{switch(e){case`top`:return`rotate(45deg)`;case`bottom`:return`rotate(225deg)`;case`left`:return`rotate(-45deg)`;case`right`:return`rotate(135deg)`;case`top-start`:return`rotate(45deg)`;case`top-end`:return`rotate(45deg)`;case`bottom-start`:return`rotate(225deg)`;case`bottom-end`:return`rotate(225deg)`;case`left-start`:return`rotate(-45deg)`;case`left-end`:return`rotate(-45deg)`;case`right-start`:return`rotate(135deg)`;case`right-end`:return`rotate(135deg)`;default:return`rotate(45deg)`}},[e]);return d(`div`,{className:E({placement:e,className:t}),style:{transform:`translate(${n?.x}px, ${n?.y}px) ${a}`},...i})};const O=(e,t)=>{let[,n]=e.split(`-`);return n?`${t}-${n}`:t};function k({placement:e,className:t,content:i,open:a,hiddenRef:c,containerRef:p}){let[m,g]=u(!1),_=l(null),[v,y]=u(e),[b,x]=u({top:0,left:0}),[S,C]=u({x:0,y:0}),w=o(n(()=>{let e=p?.current,t=c.current;if(!e||!t)return;let n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),i=window.scrollY||document.documentElement.scrollTop,a=window.scrollX||document.documentElement.scrollLeft,[o,s]=v.split(`-`),l=i+n.top,u=a+n.left+n.width/2-r.width/2;switch(o){case`top`:l-=r.height;break;case`bottom`:l+=n.height;break;case`left`:l+=n.height/2-r.height/2,u-=r.width/2+n.width/2;break;case`right`:l+=n.height/2-r.height/2,u+=r.width/2+n.width/2;break}if([`top`,`bottom`].includes(o))switch(s){case`start`:u+=r.width/2-24;break;case`end`:u-=r.width/2-24;break}if([`left`,`right`].includes(o))switch(s){case`start`:l+=r.height/2+n.height/2-24;break;case`end`:l-=r.height/2+n.height/2-24;break}let d=u,f=window.innerWidth;d+r.width>f-4&&(d=f-r.width-4),d<4&&(d=4),x({top:l,left:d}),C({x:u-d,y:0})},50),[v]),E=o(n(()=>{if(!c.current)return;let{top:t,height:n}=c.current.getBoundingClientRect();y(r=>{let i=e;return t+n>=window.innerHeight?i=O(r,`top`):t<0&&(i=O(r,`bottom`)),i})},50),[e]);return s(()=>(g(!0),E(),window.addEventListener(`scroll`,w,{passive:!0}),window.addEventListener(`resize`,w),window.addEventListener(`scroll`,E,{passive:!0}),window.addEventListener(`resize`,E),()=>{window.removeEventListener(`scroll`,w),window.removeEventListener(`resize`,w),window.removeEventListener(`scroll`,E),window.removeEventListener(`resize`,E)}),[w,E]),s(()=>{m&&w()},[m,w]),m?h(f(T,{ref:_,portal:!0,"data-komc":!0,placement:v,className:r(t,a?`komc:visible komc:opacity-100`:`komc:opacity-0 komc:invisible`),style:{...b},children:[d(`span`,{children:i}),d(D,{placement:v,offset:S})]}),document.body):null}var A=a(({children:e,content:n,defaultOpen:i=!1,className:a,placement:o=`top`},s)=>{let[c,p]=u(i),m=l(null),h=l(null);return t({ref:m,setOpen:p}),f(`div`,{ref:m,"data-komc":!0,className:`komc:flex komc:shrink-0 komc:relative komc:overflow-hidden komc:w-fit komc:h-fit`,children:[d(C,{setOpen:p,children:e}),d(k,{placement:o,className:a,open:c,content:n,hiddenRef:h,containerRef:m}),d(T,{ref:h,role:`presentation`,placement:o,className:r(`komc:opacity-0 komc:invisible`,a),children:d(`span`,{children:n})})]})});export{v as Carousel,b as CarouselItem,S as CarouselNext,x as CarouselPrevious,y as CarouselWrapper,A as Tooltip};
|
package/dist/ui/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../util-CDkao6z3.cjs`),n=require(`../hooks-DPYIex_y.cjs`);let r=require(`lodash-es`),i=require(`clsx`);i=e.t(i);let a=require(`react`);a=e.t(a);let o=require(`react/jsx-runtime`),s=require(`class-variance-authority`),c=require(`embla-carousel-react`);c=e.t(c);let l=require(`react-dom`);function u({className:e,items:t,render:n,...r}){return(0,o.jsx)(`nav`,{"data-komc":!0,className:(0,i.default)(`komc:fixed komc:bottom-0 komc:left-0 komc:right-0`,`komc:border-t komc:border-neutral-200 komc:bg-white komc:z-10`,e),...r,children:(0,o.jsx)(`div`,{className:`komc:grid komc:min-h-15`,style:{gridTemplateColumns:`repeat(${t.length}, 1fr)`},children:t.map((e,t)=>(0,o.jsx)(a.default.Fragment,{children:n(e)},t))})})}const d=(0,s.cva)(t.f(`komc:inline-flex komc:justify-center komc:items-center komc:w-full`,`komc:transition-colors komc:duration-200 komc:relative`,`komc:*:transition-colors komc:*:duration-200`,`komc:disabled:cursor-default komc:disabled:opacity-50 komc:disabled:pointer-events-none`,`komc:whitespace-nowrap komc:shrink-0 komc:outline-none`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"2.5xl":`komc:rounded-[20px]`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`},variant:{default:``,ghost:`komc:bg-transparent komc:text-neutral-900`,white:`komc:bg-white komc:text-neutral-900 komc:hover:bg-neutral-100`,blue:`komc:bg-blue-500 komc:text-white komc:hover:bg-blue-600`,night:`komc:bg-[#2c5cb7] komc:text-white komc:hover:bg-[#26539F]`,charcoal:`komc:bg-[#36454F] komc:text-white komc:hover:bg-[#2E3A43]`,slate:`komc:bg-[#4A5565] komc:text-white komc:hover:bg-[#424A57]`,red:`komc:bg-[#C8313A] komc:text-white komc:hover:bg-[#B02B33]`,yellow:`komc:bg-[#E7FF14] komc:text-black komc:hover:bg-[#D4E600]`,black:`komc:bg-[rgb(95,95,96)] komc:text-white komc:hover:bg-[rgb(76,76,77)] komc:active:bg-[rgb(76,76,77)]`}},defaultVariants:{size:void 0,outline:void 0,rounded:void 0,variant:void 0}}),f=(0,a.forwardRef)(({children:e=`button`,type:t=`button`,size:n=`md`,gap:r=`sm`,outline:i=`line`,rounded:a=`sm`,variant:s=`blue`,className:c,...l},u)=>(0,o.jsx)(`button`,{ref:u,type:t,"data-komc":!0,className:d({size:n,outline:i,gap:r,rounded:a,variant:s,className:c}),...l,children:e}));var p=f;const m=a.default.createContext(null);function h(){let e=a.default.useContext(m);if(!e)throw Error(`useCarousel must be used within a <Carousel />`);return e}function g({orientation:e=`horizontal`,options:n,setApi:r,plugins:i,className:s,children:l,...u}){let[d,f]=(0,c.default)({...n,axis:e===`horizontal`?`x`:`y`},i),[p,h]=(0,a.useState)(!1),[g,_]=(0,a.useState)(!1),v=(0,a.useCallback)(e=>{e&&(h(e.canScrollPrev()),_(e.canScrollNext()))},[]),y=(0,a.useCallback)(()=>{f?.scrollPrev()},[f]),b=(0,a.useCallback)(()=>{f?.scrollNext()},[f]),x=(0,a.useCallback)(e=>{e.key===`ArrowLeft`?(e.preventDefault(),y()):e.key===`ArrowRight`&&(e.preventDefault(),b())},[y,b]);return(0,a.useEffect)(()=>{!f||!r||r(f)},[f,r]),(0,a.useEffect)(()=>{if(f)return v(f),f.on(`reInit`,v),f.on(`select`,v),()=>{f?.off(`select`,v)}},[f,v]),(0,o.jsx)(m.Provider,{value:{carouselRef:d,api:f,options:n,orientation:e||(n?.axis===`y`?`vertical`:`horizontal`),scrollPrev:y,scrollNext:b,canScrollPrev:p,canScrollNext:g},children:(0,o.jsx)(`div`,{"data-komc":!0,onKeyDownCapture:x,className:t.f(`komc:relative`,s),...u,children:l})})}function _({className:e,...n}){let{carouselRef:r,orientation:i}=h();return(0,o.jsx)(`div`,{ref:r,"data-komc":!0,className:`komc:h-full komc:overflow-hidden`,children:(0,o.jsx)(`div`,{className:t.f(`komc:flex komc:h-full`,i===`horizontal`?`komc:-ml-4`:`komc:-mt-4 komc:flex-col`,e),...n})})}function v({className:e,...n}){let{orientation:r}=h();return(0,o.jsx)(`div`,{"data-komc":!0,className:t.f(`komc:min-w-0 komc:shrink-0 komc:grow-0 komc:basis-full`,r===`horizontal`?`komc:pl-4`:`komc:pt-4`,e),...n})}function y({children:e,className:t,...n}){let{scrollPrev:r,canScrollPrev:a}=h();return(0,o.jsx)(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:(0,i.default)(`komc:w-full`,t),onClick:r,...n,children:e})}function b({children:e,className:t,...n}){let{scrollNext:r,canScrollNext:a}=h();return(0,o.jsx)(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:(0,i.default)(`komc:w-full`,t),onClick:r,...n,children:e})}function x({condition:e,wrapper:t,children:n}){return e?t(n):n}const S=(0,s.cva)(`komc:flex komc:flex-col komc:w-full komc:max-w-7xl komc:mx-auto`,{variants:{maxWidth:{none:``,xs:`komc:max-w-xs`,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,full:`komc:max-w-full`}},defaultVariants:{maxWidth:`full`}});function C({className:e,children:t,maxWidth:n,...r}){return(0,o.jsx)(`footer`,{"data-komc":!0,className:(0,i.default)(`komc:block komc:w-full komc:h-full`,`komc:bg-white komc:border-t komc:border-neutral-200`,e),...r,children:(0,o.jsx)(`div`,{className:S({maxWidth:n}),children:t})})}const w=(0,s.cva)(t.f(`komc:flex komc:items-center`,`komc:mx-auto komc:min-h-10`),{variants:{maxWidth:{none:``,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,"8xl":`komc:max-w-330`,full:`komc:max-w-full`},size:{sm:`komc:h-10`,md:`komc:h-12`,lg:`komc:h-14`,xl:`komc:h-16`,"2xl":`komc:h-18`,"3xl":`komc:h-20`,"4xl":`komc:h-22`,"4.25xl":`komc:h-22.5`,"5xl":`komc:h-24`,"6xl":`komc:h-26`,"7xl":`komc:h-28`,"8xl":`komc:h-30`,full:`komc:h-full`}},defaultVariants:{maxWidth:`full`,size:`xl`}});function T({children:e,maxWidth:t,size:n,className:r,...a}){return(0,o.jsx)(`header`,{"data-komc":!0,className:(0,i.default)(`komc:w-full komc:sticky komc:top-0 komc:z-1000 komc:bg-white`,`komc:transition-all komc:duration-200`,r),...a,children:(0,o.jsx)(`div`,{className:w({maxWidth:t,size:n}),children:e})})}const E=(0,s.cva)(t.f(`komc:flex komc:items-center komc:w-full komc:px-2`,`komc:[&>input]:outline-none komc:[&>input]:w-full`,`komc:[&>input]:focus:ring-0 komc:[&>input]:focus:ring-offset-0`,`komc:[&>input]:h-full`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`}}}),D=(0,a.forwardRef)(({prefix:e=null,surffix:t=null,size:n=`lg`,gap:r=`xl`,outline:i=`line`,rounded:a=`lg`,className:s,...c},l)=>(0,o.jsxs)(`div`,{"data-komc":!0,className:E({size:n,gap:r,outline:i,rounded:a,className:s}),children:[e,(0,o.jsx)(`input`,{ref:l,type:`text`,...c}),t]}));var O=D;const k=(0,s.cva)(`komc:w-full komc:mx-auto komc:relative`,{variants:{type:{main:`komc:flex komc:flex-col`,content:`komc:grow komc:my-0`},maxWidth:{none:``,xs:`komc:max-w-xs komc:xl:max-w-full`,sm:`komc:max-w-sm komc:xl:max-w-full`,md:`komc:max-w-md komc:xl:max-w-full`,lg:`komc:max-w-lg komc:xl:max-w-full`,xl:`komc:max-w-xl komc:xl:max-w-full`,"2xl":`komc:max-w-2xl komc:xl:max-w-full`,"3xl":`komc:max-w-3xl komc:xl:max-w-full`,full:`komc:max-w-full`}},defaultVariants:{type:`main`,maxWidth:`full`}});function A({children:e,className:t,type:n,maxWidth:r,...i}){return(0,o.jsx)(`div`,{"data-komc":!0,className:k({type:n,maxWidth:r,className:t}),...i,children:e})}const j=(0,s.cva)(t.f(`komc:w-full komc:animate-pulse komc:bg-gray-200`),{variants:{size:{xs:`komc:h-4`,sm:`komc:h-8`,md:`komc:h-12`,lg:`komc:h-16`,xl:`komc:h-20`,"2xl":`komc:h-24`,"3xl":`komc:h-28`,square:`komc:h-auto komc:aspect-square`,full:`komc:h-full`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`}},defaultVariants:{size:`sm`,rounded:`sm`}});function M({size:e,rounded:t,width:n,height:r,className:i,...a}){let s=n?typeof n==`string`?n:`${n}px`:void 0,c=r?typeof r==`string`?r:`${r}px`:void 0;return(0,o.jsx)(`div`,{"data-komc":!0,className:j({size:e,rounded:t,className:i}),style:{width:s,height:c},...a})}function N({children:e,setOpen:t}){return(0,o.jsx)(`div`,{"data-komc":!0,className:(0,i.default)(`komc:inline-flex komc:shrink-0 komc:justify-center`,`komc:items-center komc:outline-none`),onMouseLeave:()=>t(!1),onMouseOver:()=>t(!0),onFocus:()=>t(!0),onBlur:()=>t(!1),onClick:()=>t(!0),children:e})}const P=(0,s.cva)(t.f(`komc:absolute komc:z-99 komc:w-max komc:max-w-70 komc:p-2 komc:rounded-md`,`komc:break-all komc:transition-opacity komc:duration-300 komc:bg-white`,`komc:drop-shadow-[0px_0.5px_3px_rgba(0,0,0,0.2)] komc:text-xs`),{variants:{portal:{true:``,false:``},placement:{top:``,bottom:``,left:``,right:``,"top-start":``,"top-end":``,"bottom-start":``,"bottom-end":``,"left-start":``,"left-end":``,"right-start":``,"right-end":``}},compoundVariants:[{portal:!0,placement:`top`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom`,className:`komc:translate-y-2`},{portal:!0,placement:`left`,className:`komc:-translate-x-2`},{portal:!0,placement:`right`,className:`komc:translate-x-2`},{portal:!0,placement:`top-start`,className:`komc:-translate-y-2`},{portal:!0,placement:`top-end`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom-start`,className:`komc:translate-y-2`},{portal:!0,placement:`bottom-end`,className:`komc:translate-y-2`},{portal:!0,placement:`left-start`,className:`komc:-translate-x-2`},{portal:!0,placement:`left-end`,className:`komc:-translate-x-2`},{portal:!0,placement:`right-start`,className:`komc:translate-x-2`},{portal:!0,placement:`right-end`,className:`komc:translate-x-2`},{portal:!1,placement:`top`,className:`komc:bottom-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`bottom`,className:`komc:top-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`left`,className:`komc:right-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`right`,className:`komc:left-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`top-start`,className:`komc:bottom-full komc:left-0`},{portal:!1,placement:`top-end`,className:`komc:bottom-full komc:right-0`},{portal:!1,placement:`bottom-start`,className:`komc:top-full komc:left-0`},{portal:!1,placement:`bottom-end`,className:`komc:top-full komc:right-0`},{portal:!1,placement:`left-start`,className:`komc:right-full komc:top-0`},{portal:!1,placement:`left-end`,className:`komc:right-full komc:bottom-0`},{portal:!1,placement:`right-start`,className:`komc:left-full komc:top-0`},{portal:!1,placement:`right-end`,className:`komc:left-full komc:bottom-0`}],defaultVariants:{placement:`top`,portal:!1}}),F=(0,a.forwardRef)(({portal:e,children:t,className:n,placement:r,...i},a)=>(0,o.jsx)(`div`,{ref:a,"data-komc":!0,role:`tooltip`,className:P({portal:e,placement:r,className:n}),...i,children:t}));var I=F;const L=(0,s.cva)(t.f(`komc:absolute komc:w-2 komc:h-2 komc:bg-inherit`,`komc:transition-opacity komc:duration-300`),{variants:{placement:{top:t.f(`komc:top-full komc:-mt-1 komc:left-1/2`),bottom:t.f(`komc:bottom-full komc:-mb-1 komc:left-1/2`),left:t.f(`komc:left-full komc:-ml-1 komc:top-1/2`),right:t.f(`komc:right-full komc:-mr-1 komc:top-1/2`),"top-start":t.f(`komc:top-full komc:-mt-1 komc:left-5`),"top-end":t.f(`komc:top-full komc:-mt-1 komc:right-5`),"bottom-start":t.f(`komc:bottom-full komc:-mb-1 komc:left-5`),"bottom-end":t.f(`komc:bottom-full komc:-mb-1 komc:right-5`),"left-start":t.f(`komc:left-full komc:-ml-1 komc:top-3`),"left-end":t.f(`komc:left-full komc:-ml-1 komc:bottom-3`),"right-start":t.f(`komc:right-full komc:-mr-1 komc:top-3`),"right-end":t.f(`komc:right-full komc:-mr-1 komc:bottom-3`)}},defaultVariants:{placement:`top`}}),R=({placement:e,className:t,offset:n,style:r,...i})=>{let s=(0,a.useMemo)(()=>{switch(e){case`top`:return`rotate(45deg)`;case`bottom`:return`rotate(225deg)`;case`left`:return`rotate(-45deg)`;case`right`:return`rotate(135deg)`;case`top-start`:return`rotate(45deg)`;case`top-end`:return`rotate(45deg)`;case`bottom-start`:return`rotate(225deg)`;case`bottom-end`:return`rotate(225deg)`;case`left-start`:return`rotate(-45deg)`;case`left-end`:return`rotate(-45deg)`;case`right-start`:return`rotate(135deg)`;case`right-end`:return`rotate(135deg)`;default:return`rotate(45deg)`}},[e]);return(0,o.jsx)(`div`,{className:L({placement:e,className:t}),style:{transform:`translate(${n?.x}px, ${n?.y}px) ${s}`},...i})};var z=R;const B=24,V=(e,t)=>{let[,n]=e.split(`-`);return n?`${t}-${n}`:t};function H({placement:e,className:t,content:n,open:s,hiddenRef:c,containerRef:u}){let[d,f]=(0,a.useState)(!1),p=(0,a.useRef)(null),[m,h]=(0,a.useState)(e),[g,_]=(0,a.useState)({top:0,left:0}),[v,y]=(0,a.useState)({x:0,y:0}),b=(0,a.useCallback)((0,r.debounce)(()=>{let e=u?.current,t=c.current;if(!e||!t)return;let n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),i=window.scrollY||document.documentElement.scrollTop,a=window.scrollX||document.documentElement.scrollLeft,[o,s]=m.split(`-`),l=i+n.top,d=a+n.left+n.width/2-r.width/2;switch(o){case`top`:l-=r.height;break;case`bottom`:l+=n.height;break;case`left`:l+=n.height/2-r.height/2,d-=r.width/2+n.width/2;break;case`right`:l+=n.height/2-r.height/2,d+=r.width/2+n.width/2;break}if([`top`,`bottom`].includes(o))switch(s){case`start`:d+=r.width/2-24;break;case`end`:d-=r.width/2-24;break}if([`left`,`right`].includes(o))switch(s){case`start`:l+=r.height/2+n.height/2-24;break;case`end`:l-=r.height/2+n.height/2-24;break}let f=d,p=window.innerWidth;f+r.width>p-4&&(f=p-r.width-4),f<4&&(f=4),_({top:l,left:f}),y({x:d-f,y:0})},50),[m]),x=(0,a.useCallback)((0,r.debounce)(()=>{if(!c.current)return;let{top:t,height:n}=c.current.getBoundingClientRect();h(r=>{let i=e;return t+n>=window.innerHeight?i=V(r,`top`):t<0&&(i=V(r,`bottom`)),i})},50),[e]);return(0,a.useEffect)(()=>(f(!0),x(),window.addEventListener(`scroll`,b,{passive:!0}),window.addEventListener(`resize`,b),window.addEventListener(`scroll`,x,{passive:!0}),window.addEventListener(`resize`,x),()=>{window.removeEventListener(`scroll`,b),window.removeEventListener(`resize`,b),window.removeEventListener(`scroll`,x),window.removeEventListener(`resize`,x)}),[b,x]),(0,a.useEffect)(()=>{d&&b()},[d,b]),d?(0,l.createPortal)((0,o.jsxs)(I,{ref:p,portal:!0,"data-komc":!0,placement:m,className:(0,i.default)(t,s?`komc:visible komc:opacity-100`:`komc:opacity-0 komc:invisible`),style:{...g},children:[(0,o.jsx)(`span`,{children:n}),(0,o.jsx)(z,{placement:m,offset:v})]}),document.body):null}const U=(0,a.forwardRef)(({children:e,content:t,defaultOpen:r=!1,className:s,placement:c=`top`},l)=>{let[u,d]=(0,a.useState)(r),f=(0,a.useRef)(null),p=(0,a.useRef)(null);return n.t({ref:f,setOpen:d}),(0,o.jsxs)(`div`,{ref:f,"data-komc":!0,className:`komc:flex komc:shrink-0 komc:relative komc:overflow-hidden komc:w-fit komc:h-fit`,children:[(0,o.jsx)(N,{setOpen:d,children:e}),(0,o.jsx)(H,{placement:c,className:s,open:u,content:t,hiddenRef:p,containerRef:f}),(0,o.jsx)(I,{ref:p,role:`presentation`,placement:c,className:(0,i.default)(`komc:opacity-0 komc:invisible`,s),children:(0,o.jsx)(`span`,{children:t})})]})});var W=U;exports.BottomAppBar=u,exports.Button=p,exports.Carousel=g,exports.CarouselItem=v,exports.CarouselNext=b,exports.CarouselPrevious=y,exports.CarouselWrapper=_,exports.ConditionalWrapper=x,exports.Footer=C,exports.Header=T,exports.Input=O,exports.Layout=A,exports.Skeleton=M,exports.Tooltip=W;
|
|
1
|
+
const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../util-CDkao6z3.cjs`);let n=require(`clsx`);n=e.t(n);let r=require(`react`);r=e.t(r);let i=require(`react/jsx-runtime`),a=require(`class-variance-authority`);function o({className:e,items:t,render:a,...o}){return(0,i.jsx)(`nav`,{"data-komc":!0,className:(0,n.default)(`komc:fixed komc:bottom-0 komc:left-0 komc:right-0`,`komc:border-t komc:border-neutral-200 komc:bg-white komc:z-10`,e),...o,children:(0,i.jsx)(`div`,{className:`komc:grid komc:min-h-15`,style:{gridTemplateColumns:`repeat(${t.length}, 1fr)`},children:t.map((e,t)=>(0,i.jsx)(r.default.Fragment,{children:a(e)},t))})})}const s=(0,a.cva)(t.f(`komc:inline-flex komc:justify-center komc:items-center komc:w-full`,`komc:transition-colors komc:duration-200 komc:relative`,`komc:*:transition-colors komc:*:duration-200`,`komc:disabled:cursor-default komc:disabled:opacity-50 komc:disabled:pointer-events-none`,`komc:whitespace-nowrap komc:shrink-0 komc:outline-none`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"2.5xl":`komc:rounded-[20px]`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`},variant:{default:``,ghost:`komc:bg-transparent komc:text-neutral-900`,white:`komc:bg-white komc:text-neutral-900 komc:hover:bg-neutral-100`,blue:`komc:bg-blue-500 komc:text-white komc:hover:bg-blue-600`,night:`komc:bg-[#2c5cb7] komc:text-white komc:hover:bg-[#26539F]`,charcoal:`komc:bg-[#36454F] komc:text-white komc:hover:bg-[#2E3A43]`,slate:`komc:bg-[#4A5565] komc:text-white komc:hover:bg-[#424A57]`,red:`komc:bg-[#C8313A] komc:text-white komc:hover:bg-[#B02B33]`,yellow:`komc:bg-[#E7FF14] komc:text-black komc:hover:bg-[#D4E600]`,black:`komc:bg-[rgb(95,95,96)] komc:text-white komc:hover:bg-[rgb(76,76,77)] komc:active:bg-[rgb(76,76,77)]`}},defaultVariants:{size:void 0,outline:void 0,rounded:void 0,variant:void 0}}),c=(0,r.forwardRef)(({children:e=`button`,type:t=`button`,size:n=`md`,gap:r=`sm`,outline:a=`line`,rounded:o=`sm`,variant:c=`blue`,className:l,...u},d)=>(0,i.jsx)(`button`,{ref:d,type:t,"data-komc":!0,className:s({size:n,outline:a,gap:r,rounded:o,variant:c,className:l}),...u,children:e}));var l=c;function u({condition:e,wrapper:t,children:n}){return e?t(n):n}const d=(0,a.cva)(`komc:flex komc:flex-col komc:w-full komc:mx-auto`,{variants:{maxWidth:{none:``,xs:`komc:max-w-xs`,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,full:`komc:max-w-full`}},defaultVariants:{maxWidth:`full`}});function f({className:e,children:t,maxWidth:r,...a}){return(0,i.jsx)(`footer`,{"data-komc":!0,className:(0,n.default)(`komc:block komc:w-full komc:h-full`,`komc:bg-white komc:border-t komc:border-neutral-200`,e),...a,children:(0,i.jsx)(`div`,{className:d({maxWidth:r}),children:t})})}const p=(0,a.cva)(t.f(`komc:flex komc:items-center`,`komc:mx-auto komc:min-h-10`),{variants:{maxWidth:{none:``,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,"8xl":`komc:max-w-330`,full:`komc:max-w-full`},size:{sm:`komc:h-10`,md:`komc:h-12`,lg:`komc:h-14`,xl:`komc:h-16`,"2xl":`komc:h-18`,"3xl":`komc:h-20`,"4xl":`komc:h-22`,"4.25xl":`komc:h-22.5`,"5xl":`komc:h-24`,"6xl":`komc:h-26`,"7xl":`komc:h-28`,"8xl":`komc:h-30`,full:`komc:h-full`}},defaultVariants:{maxWidth:`full`,size:`xl`}});function m({children:e,maxWidth:t,size:r,className:a,...o}){return(0,i.jsx)(`header`,{"data-komc":!0,className:(0,n.default)(`komc:w-full komc:sticky komc:top-0 komc:z-1000 komc:bg-white`,`komc:transition-all komc:duration-200`,a),...o,children:(0,i.jsx)(`div`,{className:p({maxWidth:t,size:r}),children:e})})}const h=(0,a.cva)(t.f(`komc:flex komc:items-center komc:w-full komc:px-2`,`komc:[&>input]:outline-none komc:[&>input]:w-full`,`komc:[&>input]:focus:ring-0 komc:[&>input]:focus:ring-offset-0`,`komc:[&>input]:h-full`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`}}}),g=(0,r.forwardRef)(({prefix:e=null,surffix:t=null,size:n=`lg`,gap:r=`xl`,outline:a=`line`,rounded:o=`lg`,className:s,...c},l)=>(0,i.jsxs)(`div`,{"data-komc":!0,className:h({size:n,gap:r,outline:a,rounded:o,className:s}),children:[e,(0,i.jsx)(`input`,{ref:l,type:`text`,...c}),t]}));var _=g;const v=(0,a.cva)(`komc:w-full komc:mx-auto komc:relative`,{variants:{type:{main:`komc:flex komc:flex-col`,content:`komc:grow komc:my-0`},maxWidth:{none:``,xs:`komc:max-w-xs komc:xl:max-w-full`,sm:`komc:max-w-sm komc:xl:max-w-full`,md:`komc:max-w-md komc:xl:max-w-full`,lg:`komc:max-w-lg komc:xl:max-w-full`,xl:`komc:max-w-xl komc:xl:max-w-full`,"2xl":`komc:max-w-2xl komc:xl:max-w-full`,"3xl":`komc:max-w-3xl komc:xl:max-w-full`,full:`komc:max-w-full`}},defaultVariants:{type:`main`,maxWidth:`full`}});function y({children:e,className:t,type:n,maxWidth:r,...a}){return(0,i.jsx)(`div`,{"data-komc":!0,className:v({type:n,maxWidth:r,className:t}),...a,children:e})}const b=(0,a.cva)(t.f(`komc:w-full komc:animate-pulse komc:bg-gray-200`),{variants:{size:{xs:`komc:h-4`,sm:`komc:h-8`,md:`komc:h-12`,lg:`komc:h-16`,xl:`komc:h-20`,"2xl":`komc:h-24`,"3xl":`komc:h-28`,square:`komc:h-auto komc:aspect-square`,full:`komc:h-full`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`}},defaultVariants:{size:`sm`,rounded:`sm`}});function x({size:e,rounded:t,width:n,height:r,className:a,...o}){let s=n?typeof n==`string`?n:`${n}px`:void 0,c=r?typeof r==`string`?r:`${r}px`:void 0;return(0,i.jsx)(`div`,{"data-komc":!0,className:b({size:e,rounded:t,className:a}),style:{width:s,height:c},...o})}exports.BottomAppBar=o,exports.Button=l,exports.ConditionalWrapper=u,exports.Footer=f,exports.Header=m,exports.Input=_,exports.Layout=y,exports.Skeleton=x;
|
package/dist/ui/index.d.cts
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import React$1, {
|
|
3
|
-
import * as
|
|
1
|
+
import * as react0 from "react";
|
|
2
|
+
import React$1, { HTMLAttributes } from "react";
|
|
3
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
+
import * as class_variance_authority_types1 from "class-variance-authority/types";
|
|
4
5
|
import { VariantProps } from "class-variance-authority";
|
|
5
|
-
import useEmblaCarousel, { UseEmblaCarouselType } from "embla-carousel-react";
|
|
6
|
-
import * as react_jsx_runtime1 from "react/jsx-runtime";
|
|
7
6
|
|
|
8
7
|
//#region src/ui/bottom-app-bar/bottom-app-bar.d.ts
|
|
9
8
|
interface BottomAppBarProps<T> extends React$1.HTMLAttributes<HTMLElement> {
|
|
@@ -23,12 +22,12 @@ declare function BottomAppBar<T>({
|
|
|
23
22
|
//#endregion
|
|
24
23
|
//#region src/ui/button/button.d.ts
|
|
25
24
|
declare const classes$5: (props?: ({
|
|
26
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" |
|
|
27
|
-
gap?: "
|
|
25
|
+
size?: "xs" | "sm" | "base" | "md" | "lg" | "xl" | "2xl" | "3xl" | null | undefined;
|
|
26
|
+
gap?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
|
|
28
27
|
outline?: "line" | "solid" | "clear" | "dashed" | "dotted" | null | undefined;
|
|
29
|
-
rounded?: "
|
|
28
|
+
rounded?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "2.5xl" | "full" | null | undefined;
|
|
30
29
|
variant?: "default" | "ghost" | "white" | "blue" | "night" | "charcoal" | "slate" | "red" | "yellow" | "black" | null | undefined;
|
|
31
|
-
} &
|
|
30
|
+
} & class_variance_authority_types1.ClassProp) | undefined) => string;
|
|
32
31
|
interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'suffix' | 'prefix'>, VariantProps<typeof classes$5> {
|
|
33
32
|
/**
|
|
34
33
|
* @param size - Height of the button
|
|
@@ -97,89 +96,7 @@ interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>
|
|
|
97
96
|
* @param rounded - Border radius of the button
|
|
98
97
|
* @param variant - Variant of the button
|
|
99
98
|
*/
|
|
100
|
-
declare const Button:
|
|
101
|
-
//#endregion
|
|
102
|
-
//#region src/ui/carousel/carousel-context.d.ts
|
|
103
|
-
type CarouselApi = UseEmblaCarouselType[1];
|
|
104
|
-
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
105
|
-
type CarouselOptions = UseCarouselParameters[0];
|
|
106
|
-
type CarouselPlugin = UseCarouselParameters[1];
|
|
107
|
-
interface CarouselProps {
|
|
108
|
-
options?: CarouselOptions;
|
|
109
|
-
plugins?: CarouselPlugin;
|
|
110
|
-
orientation?: 'horizontal' | 'vertical';
|
|
111
|
-
setApi?: (api: CarouselApi) => void;
|
|
112
|
-
}
|
|
113
|
-
type CarouselContextProps = {
|
|
114
|
-
carouselRef: ReturnType<typeof useEmblaCarousel>[0];
|
|
115
|
-
api: ReturnType<typeof useEmblaCarousel>[1];
|
|
116
|
-
scrollPrev: () => void;
|
|
117
|
-
scrollNext: () => void;
|
|
118
|
-
canScrollPrev: boolean;
|
|
119
|
-
canScrollNext: boolean;
|
|
120
|
-
} & CarouselProps;
|
|
121
|
-
//#endregion
|
|
122
|
-
//#region src/ui/carousel/carousel.d.ts
|
|
123
|
-
interface CarouselProps$1 extends ComponentProps<'div'>, CarouselProps {
|
|
124
|
-
/**
|
|
125
|
-
* @param orientation - Orientation of the carousel
|
|
126
|
-
* @default horizontal
|
|
127
|
-
* @property
|
|
128
|
-
* - horizontal
|
|
129
|
-
* - vertical
|
|
130
|
-
*/
|
|
131
|
-
orientation?: 'horizontal' | 'vertical';
|
|
132
|
-
/**
|
|
133
|
-
* @param options - Options of the carousel
|
|
134
|
-
* @default {}
|
|
135
|
-
*/
|
|
136
|
-
options?: CarouselProps['options'];
|
|
137
|
-
/**
|
|
138
|
-
* @param setApi - Set the API of the carousel
|
|
139
|
-
* @default undefined
|
|
140
|
-
*/
|
|
141
|
-
setApi?: CarouselProps['setApi'];
|
|
142
|
-
/**
|
|
143
|
-
* @param plugins - Plugins of the carousel
|
|
144
|
-
* @default []
|
|
145
|
-
*/
|
|
146
|
-
plugins?: CarouselProps['plugins'];
|
|
147
|
-
}
|
|
148
|
-
declare function Carousel({
|
|
149
|
-
orientation,
|
|
150
|
-
options,
|
|
151
|
-
setApi,
|
|
152
|
-
plugins,
|
|
153
|
-
className,
|
|
154
|
-
children,
|
|
155
|
-
...props
|
|
156
|
-
}: CarouselProps$1): react_jsx_runtime1.JSX.Element;
|
|
157
|
-
//#endregion
|
|
158
|
-
//#region src/ui/carousel/carousel-wrapper.d.ts
|
|
159
|
-
declare function CarouselWrapper({
|
|
160
|
-
className,
|
|
161
|
-
...props
|
|
162
|
-
}: React$1.ComponentProps<'div'>): react_jsx_runtime1.JSX.Element;
|
|
163
|
-
//#endregion
|
|
164
|
-
//#region src/ui/carousel/carousel-item.d.ts
|
|
165
|
-
declare function CarouselItem({
|
|
166
|
-
className,
|
|
167
|
-
...props
|
|
168
|
-
}: React$1.ComponentProps<'div'>): react_jsx_runtime1.JSX.Element;
|
|
169
|
-
//#endregion
|
|
170
|
-
//#region src/ui/carousel/carousel-previous.d.ts
|
|
171
|
-
declare function CarouselPrevious({
|
|
172
|
-
children,
|
|
173
|
-
className,
|
|
174
|
-
...props
|
|
175
|
-
}: React$1.ComponentProps<'button'>): react_jsx_runtime1.JSX.Element;
|
|
176
|
-
//#endregion
|
|
177
|
-
//#region src/ui/carousel/carousel-next.d.ts
|
|
178
|
-
declare function CarouselNext({
|
|
179
|
-
children,
|
|
180
|
-
className,
|
|
181
|
-
...props
|
|
182
|
-
}: React$1.ComponentProps<'button'>): react_jsx_runtime1.JSX.Element;
|
|
99
|
+
declare const Button: react0.ForwardRefExoticComponent<ButtonProps & react0.RefAttributes<HTMLButtonElement>>;
|
|
183
100
|
//#endregion
|
|
184
101
|
//#region src/ui/conditional-wrapper/conditional-wrapper.d.ts
|
|
185
102
|
interface ConditionalWrapperProps {
|
|
@@ -196,12 +113,12 @@ declare function ConditionalWrapper({
|
|
|
196
113
|
condition,
|
|
197
114
|
wrapper,
|
|
198
115
|
children
|
|
199
|
-
}: ConditionalWrapperProps):
|
|
116
|
+
}: ConditionalWrapperProps): react0.ReactNode;
|
|
200
117
|
//#endregion
|
|
201
118
|
//#region src/ui/footer/footer.d.ts
|
|
202
119
|
declare const classes$4: (props?: ({
|
|
203
|
-
maxWidth?: "
|
|
204
|
-
} &
|
|
120
|
+
maxWidth?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | "4xl" | "5xl" | "6xl" | "7xl" | null | undefined;
|
|
121
|
+
} & class_variance_authority_types1.ClassProp) | undefined) => string;
|
|
205
122
|
interface FooterProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes$4> {
|
|
206
123
|
/**
|
|
207
124
|
* @param maxWidth - Maximum width of the footer
|
|
@@ -228,13 +145,13 @@ declare function Footer({
|
|
|
228
145
|
children,
|
|
229
146
|
maxWidth,
|
|
230
147
|
...props
|
|
231
|
-
}: FooterProps):
|
|
148
|
+
}: FooterProps): react_jsx_runtime0.JSX.Element;
|
|
232
149
|
//#endregion
|
|
233
150
|
//#region src/ui/header/header.d.ts
|
|
234
151
|
declare const classes$3: (props?: ({
|
|
235
|
-
maxWidth?: "
|
|
236
|
-
size?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "
|
|
237
|
-
} &
|
|
152
|
+
maxWidth?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | null | undefined;
|
|
153
|
+
size?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "4.25xl" | null | undefined;
|
|
154
|
+
} & class_variance_authority_types1.ClassProp) | undefined) => string;
|
|
238
155
|
interface HeaderProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes$3> {
|
|
239
156
|
children?: React.ReactNode;
|
|
240
157
|
/**
|
|
@@ -283,15 +200,15 @@ declare function Header({
|
|
|
283
200
|
size,
|
|
284
201
|
className,
|
|
285
202
|
...props
|
|
286
|
-
}: HeaderProps):
|
|
203
|
+
}: HeaderProps): react_jsx_runtime0.JSX.Element;
|
|
287
204
|
//#endregion
|
|
288
205
|
//#region src/ui/input/input.d.ts
|
|
289
206
|
declare const classes$2: (props?: ({
|
|
290
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" |
|
|
291
|
-
gap?: "
|
|
207
|
+
size?: "xs" | "sm" | "base" | "md" | "lg" | "xl" | "2xl" | "3xl" | null | undefined;
|
|
208
|
+
gap?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
|
|
292
209
|
outline?: "line" | "solid" | "clear" | "dashed" | "dotted" | null | undefined;
|
|
293
|
-
rounded?: "
|
|
294
|
-
} &
|
|
210
|
+
rounded?: "sm" | "md" | "lg" | "xl" | "2xl" | "none" | null | undefined;
|
|
211
|
+
} & class_variance_authority_types1.ClassProp) | undefined) => string;
|
|
295
212
|
interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'prefix' | 'surffix' | 'size'>, VariantProps<typeof classes$2> {
|
|
296
213
|
/**
|
|
297
214
|
* @param size - Height of the input
|
|
@@ -343,13 +260,13 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
|
|
|
343
260
|
* @param outline - Outline of the input
|
|
344
261
|
* @param rounded - Border radius of the input
|
|
345
262
|
*/
|
|
346
|
-
declare const Input:
|
|
263
|
+
declare const Input: react0.ForwardRefExoticComponent<InputProps & react0.RefAttributes<HTMLInputElement>>;
|
|
347
264
|
//#endregion
|
|
348
265
|
//#region src/ui/layout/layout.d.ts
|
|
349
266
|
declare const classes$1: (props?: ({
|
|
350
267
|
type?: "content" | "main" | null | undefined;
|
|
351
|
-
maxWidth?: "
|
|
352
|
-
} &
|
|
268
|
+
maxWidth?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | null | undefined;
|
|
269
|
+
} & class_variance_authority_types1.ClassProp) | undefined) => string;
|
|
353
270
|
interface LayoutProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes$1> {
|
|
354
271
|
/**
|
|
355
272
|
* @param type - Type of the layout
|
|
@@ -381,13 +298,13 @@ declare function Layout({
|
|
|
381
298
|
type,
|
|
382
299
|
maxWidth,
|
|
383
300
|
...props
|
|
384
|
-
}: LayoutProps):
|
|
301
|
+
}: LayoutProps): react_jsx_runtime0.JSX.Element;
|
|
385
302
|
//#endregion
|
|
386
303
|
//#region src/ui/skeleton/skeleton.d.ts
|
|
387
304
|
declare const classes: (props?: ({
|
|
388
305
|
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full" | "square" | null | undefined;
|
|
389
|
-
rounded?: "
|
|
390
|
-
} &
|
|
306
|
+
rounded?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | null | undefined;
|
|
307
|
+
} & class_variance_authority_types1.ClassProp) | undefined) => string;
|
|
391
308
|
interface SkeletonProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes> {
|
|
392
309
|
/**
|
|
393
310
|
* @param width - Width of the skeleton
|
|
@@ -444,54 +361,6 @@ declare function Skeleton({
|
|
|
444
361
|
height,
|
|
445
362
|
className,
|
|
446
363
|
...props
|
|
447
|
-
}: SkeletonProps):
|
|
448
|
-
//#endregion
|
|
449
|
-
//#region src/ui/tooltip/tooltip-container.d.ts
|
|
450
|
-
type SubPlacement = 'start' | 'end';
|
|
451
|
-
type MainPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
452
|
-
type TooltipPlacement = MainPlacement | `${MainPlacement}-${SubPlacement}`;
|
|
453
|
-
interface TooltipContainerProps extends HTMLAttributes<HTMLDivElement> {
|
|
454
|
-
/**
|
|
455
|
-
* @param children - Trigger element
|
|
456
|
-
*/
|
|
457
|
-
children: React.ReactNode;
|
|
458
|
-
/**
|
|
459
|
-
* @param content - Tooltip content
|
|
460
|
-
*/
|
|
461
|
-
content: string;
|
|
462
|
-
/**
|
|
463
|
-
* @param placement - Placement of the tooltip
|
|
464
|
-
* @default top
|
|
465
|
-
* @property
|
|
466
|
-
* - top
|
|
467
|
-
* - bottom
|
|
468
|
-
* - left
|
|
469
|
-
* - right
|
|
470
|
-
* - top-start
|
|
471
|
-
* - top-end
|
|
472
|
-
* - bottom-start
|
|
473
|
-
* - bottom-end
|
|
474
|
-
* - left-start
|
|
475
|
-
* - left-end
|
|
476
|
-
* - right-start
|
|
477
|
-
* - right-end
|
|
478
|
-
*/
|
|
479
|
-
placement?: TooltipPlacement;
|
|
480
|
-
/**
|
|
481
|
-
* @param defaultOpen - Default open state of the tooltip
|
|
482
|
-
* @default false
|
|
483
|
-
* @property
|
|
484
|
-
* - true: Open the tooltip
|
|
485
|
-
* - false: Close the tooltip
|
|
486
|
-
*/
|
|
487
|
-
defaultOpen?: boolean;
|
|
488
|
-
}
|
|
489
|
-
/**
|
|
490
|
-
* @param children - Trigger element
|
|
491
|
-
* @param content - Tooltip content
|
|
492
|
-
* @param defaultOpen - Default open state of the tooltip
|
|
493
|
-
* @param placement - Placement of the tooltip
|
|
494
|
-
*/
|
|
495
|
-
declare const TooltipContainer: react2.ForwardRefExoticComponent<TooltipContainerProps & react2.RefAttributes<HTMLDivElement>>;
|
|
364
|
+
}: SkeletonProps): react_jsx_runtime0.JSX.Element;
|
|
496
365
|
//#endregion
|
|
497
|
-
export { BottomAppBar, type BottomAppBarProps, Button, type ButtonProps,
|
|
366
|
+
export { BottomAppBar, type BottomAppBarProps, Button, type ButtonProps, ConditionalWrapper, type ConditionalWrapperProps, Footer, type FooterProps, Header, type HeaderProps, Input, type InputProps, Layout, type LayoutProps, Skeleton, type SkeletonProps };
|
package/dist/ui/index.d.mts
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import React$1, {
|
|
3
|
-
import * as
|
|
1
|
+
import * as react1 from "react";
|
|
2
|
+
import React$1, { HTMLAttributes } from "react";
|
|
3
|
+
import * as react_jsx_runtime4 from "react/jsx-runtime";
|
|
4
4
|
import { VariantProps } from "class-variance-authority";
|
|
5
|
-
import
|
|
6
|
-
import * as class_variance_authority_types3 from "class-variance-authority/types";
|
|
5
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
7
6
|
|
|
8
7
|
//#region src/ui/bottom-app-bar/bottom-app-bar.d.ts
|
|
9
8
|
interface BottomAppBarProps<T> extends React$1.HTMLAttributes<HTMLElement> {
|
|
@@ -23,12 +22,12 @@ declare function BottomAppBar<T>({
|
|
|
23
22
|
//#endregion
|
|
24
23
|
//#region src/ui/button/button.d.ts
|
|
25
24
|
declare const classes$5: (props?: ({
|
|
26
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" |
|
|
27
|
-
gap?: "
|
|
25
|
+
size?: "xs" | "sm" | "base" | "md" | "lg" | "xl" | "2xl" | "3xl" | null | undefined;
|
|
26
|
+
gap?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
|
|
28
27
|
outline?: "line" | "solid" | "clear" | "dashed" | "dotted" | null | undefined;
|
|
29
|
-
rounded?: "
|
|
28
|
+
rounded?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "2.5xl" | "full" | null | undefined;
|
|
30
29
|
variant?: "default" | "ghost" | "white" | "blue" | "night" | "charcoal" | "slate" | "red" | "yellow" | "black" | null | undefined;
|
|
31
|
-
} &
|
|
30
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
32
31
|
interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'suffix' | 'prefix'>, VariantProps<typeof classes$5> {
|
|
33
32
|
/**
|
|
34
33
|
* @param size - Height of the button
|
|
@@ -97,89 +96,7 @@ interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>
|
|
|
97
96
|
* @param rounded - Border radius of the button
|
|
98
97
|
* @param variant - Variant of the button
|
|
99
98
|
*/
|
|
100
|
-
declare const Button:
|
|
101
|
-
//#endregion
|
|
102
|
-
//#region src/ui/carousel/carousel-context.d.ts
|
|
103
|
-
type CarouselApi = UseEmblaCarouselType[1];
|
|
104
|
-
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
105
|
-
type CarouselOptions = UseCarouselParameters[0];
|
|
106
|
-
type CarouselPlugin = UseCarouselParameters[1];
|
|
107
|
-
interface CarouselProps {
|
|
108
|
-
options?: CarouselOptions;
|
|
109
|
-
plugins?: CarouselPlugin;
|
|
110
|
-
orientation?: 'horizontal' | 'vertical';
|
|
111
|
-
setApi?: (api: CarouselApi) => void;
|
|
112
|
-
}
|
|
113
|
-
type CarouselContextProps = {
|
|
114
|
-
carouselRef: ReturnType<typeof useEmblaCarousel>[0];
|
|
115
|
-
api: ReturnType<typeof useEmblaCarousel>[1];
|
|
116
|
-
scrollPrev: () => void;
|
|
117
|
-
scrollNext: () => void;
|
|
118
|
-
canScrollPrev: boolean;
|
|
119
|
-
canScrollNext: boolean;
|
|
120
|
-
} & CarouselProps;
|
|
121
|
-
//#endregion
|
|
122
|
-
//#region src/ui/carousel/carousel.d.ts
|
|
123
|
-
interface CarouselProps$1 extends ComponentProps<'div'>, CarouselProps {
|
|
124
|
-
/**
|
|
125
|
-
* @param orientation - Orientation of the carousel
|
|
126
|
-
* @default horizontal
|
|
127
|
-
* @property
|
|
128
|
-
* - horizontal
|
|
129
|
-
* - vertical
|
|
130
|
-
*/
|
|
131
|
-
orientation?: 'horizontal' | 'vertical';
|
|
132
|
-
/**
|
|
133
|
-
* @param options - Options of the carousel
|
|
134
|
-
* @default {}
|
|
135
|
-
*/
|
|
136
|
-
options?: CarouselProps['options'];
|
|
137
|
-
/**
|
|
138
|
-
* @param setApi - Set the API of the carousel
|
|
139
|
-
* @default undefined
|
|
140
|
-
*/
|
|
141
|
-
setApi?: CarouselProps['setApi'];
|
|
142
|
-
/**
|
|
143
|
-
* @param plugins - Plugins of the carousel
|
|
144
|
-
* @default []
|
|
145
|
-
*/
|
|
146
|
-
plugins?: CarouselProps['plugins'];
|
|
147
|
-
}
|
|
148
|
-
declare function Carousel({
|
|
149
|
-
orientation,
|
|
150
|
-
options,
|
|
151
|
-
setApi,
|
|
152
|
-
plugins,
|
|
153
|
-
className,
|
|
154
|
-
children,
|
|
155
|
-
...props
|
|
156
|
-
}: CarouselProps$1): react_jsx_runtime6.JSX.Element;
|
|
157
|
-
//#endregion
|
|
158
|
-
//#region src/ui/carousel/carousel-wrapper.d.ts
|
|
159
|
-
declare function CarouselWrapper({
|
|
160
|
-
className,
|
|
161
|
-
...props
|
|
162
|
-
}: React$1.ComponentProps<'div'>): react_jsx_runtime6.JSX.Element;
|
|
163
|
-
//#endregion
|
|
164
|
-
//#region src/ui/carousel/carousel-item.d.ts
|
|
165
|
-
declare function CarouselItem({
|
|
166
|
-
className,
|
|
167
|
-
...props
|
|
168
|
-
}: React$1.ComponentProps<'div'>): react_jsx_runtime6.JSX.Element;
|
|
169
|
-
//#endregion
|
|
170
|
-
//#region src/ui/carousel/carousel-previous.d.ts
|
|
171
|
-
declare function CarouselPrevious({
|
|
172
|
-
children,
|
|
173
|
-
className,
|
|
174
|
-
...props
|
|
175
|
-
}: React$1.ComponentProps<'button'>): react_jsx_runtime6.JSX.Element;
|
|
176
|
-
//#endregion
|
|
177
|
-
//#region src/ui/carousel/carousel-next.d.ts
|
|
178
|
-
declare function CarouselNext({
|
|
179
|
-
children,
|
|
180
|
-
className,
|
|
181
|
-
...props
|
|
182
|
-
}: React$1.ComponentProps<'button'>): react_jsx_runtime6.JSX.Element;
|
|
99
|
+
declare const Button: react1.ForwardRefExoticComponent<ButtonProps & react1.RefAttributes<HTMLButtonElement>>;
|
|
183
100
|
//#endregion
|
|
184
101
|
//#region src/ui/conditional-wrapper/conditional-wrapper.d.ts
|
|
185
102
|
interface ConditionalWrapperProps {
|
|
@@ -196,12 +113,12 @@ declare function ConditionalWrapper({
|
|
|
196
113
|
condition,
|
|
197
114
|
wrapper,
|
|
198
115
|
children
|
|
199
|
-
}: ConditionalWrapperProps):
|
|
116
|
+
}: ConditionalWrapperProps): react1.ReactNode;
|
|
200
117
|
//#endregion
|
|
201
118
|
//#region src/ui/footer/footer.d.ts
|
|
202
119
|
declare const classes$4: (props?: ({
|
|
203
|
-
maxWidth?: "
|
|
204
|
-
} &
|
|
120
|
+
maxWidth?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | "4xl" | "5xl" | "6xl" | "7xl" | null | undefined;
|
|
121
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
205
122
|
interface FooterProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes$4> {
|
|
206
123
|
/**
|
|
207
124
|
* @param maxWidth - Maximum width of the footer
|
|
@@ -228,13 +145,13 @@ declare function Footer({
|
|
|
228
145
|
children,
|
|
229
146
|
maxWidth,
|
|
230
147
|
...props
|
|
231
|
-
}: FooterProps):
|
|
148
|
+
}: FooterProps): react_jsx_runtime4.JSX.Element;
|
|
232
149
|
//#endregion
|
|
233
150
|
//#region src/ui/header/header.d.ts
|
|
234
151
|
declare const classes$3: (props?: ({
|
|
235
|
-
maxWidth?: "
|
|
236
|
-
size?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "
|
|
237
|
-
} &
|
|
152
|
+
maxWidth?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | null | undefined;
|
|
153
|
+
size?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "4.25xl" | null | undefined;
|
|
154
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
238
155
|
interface HeaderProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes$3> {
|
|
239
156
|
children?: React.ReactNode;
|
|
240
157
|
/**
|
|
@@ -283,15 +200,15 @@ declare function Header({
|
|
|
283
200
|
size,
|
|
284
201
|
className,
|
|
285
202
|
...props
|
|
286
|
-
}: HeaderProps):
|
|
203
|
+
}: HeaderProps): react_jsx_runtime4.JSX.Element;
|
|
287
204
|
//#endregion
|
|
288
205
|
//#region src/ui/input/input.d.ts
|
|
289
206
|
declare const classes$2: (props?: ({
|
|
290
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" |
|
|
291
|
-
gap?: "
|
|
207
|
+
size?: "xs" | "sm" | "base" | "md" | "lg" | "xl" | "2xl" | "3xl" | null | undefined;
|
|
208
|
+
gap?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
|
|
292
209
|
outline?: "line" | "solid" | "clear" | "dashed" | "dotted" | null | undefined;
|
|
293
|
-
rounded?: "
|
|
294
|
-
} &
|
|
210
|
+
rounded?: "sm" | "md" | "lg" | "xl" | "2xl" | "none" | null | undefined;
|
|
211
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
295
212
|
interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'prefix' | 'surffix' | 'size'>, VariantProps<typeof classes$2> {
|
|
296
213
|
/**
|
|
297
214
|
* @param size - Height of the input
|
|
@@ -343,13 +260,13 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, '
|
|
|
343
260
|
* @param outline - Outline of the input
|
|
344
261
|
* @param rounded - Border radius of the input
|
|
345
262
|
*/
|
|
346
|
-
declare const Input:
|
|
263
|
+
declare const Input: react1.ForwardRefExoticComponent<InputProps & react1.RefAttributes<HTMLInputElement>>;
|
|
347
264
|
//#endregion
|
|
348
265
|
//#region src/ui/layout/layout.d.ts
|
|
349
266
|
declare const classes$1: (props?: ({
|
|
350
267
|
type?: "content" | "main" | null | undefined;
|
|
351
|
-
maxWidth?: "
|
|
352
|
-
} &
|
|
268
|
+
maxWidth?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | null | undefined;
|
|
269
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
353
270
|
interface LayoutProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes$1> {
|
|
354
271
|
/**
|
|
355
272
|
* @param type - Type of the layout
|
|
@@ -381,13 +298,13 @@ declare function Layout({
|
|
|
381
298
|
type,
|
|
382
299
|
maxWidth,
|
|
383
300
|
...props
|
|
384
|
-
}: LayoutProps):
|
|
301
|
+
}: LayoutProps): react_jsx_runtime4.JSX.Element;
|
|
385
302
|
//#endregion
|
|
386
303
|
//#region src/ui/skeleton/skeleton.d.ts
|
|
387
304
|
declare const classes: (props?: ({
|
|
388
305
|
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full" | "square" | null | undefined;
|
|
389
|
-
rounded?: "
|
|
390
|
-
} &
|
|
306
|
+
rounded?: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "none" | "full" | null | undefined;
|
|
307
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
391
308
|
interface SkeletonProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof classes> {
|
|
392
309
|
/**
|
|
393
310
|
* @param width - Width of the skeleton
|
|
@@ -444,54 +361,6 @@ declare function Skeleton({
|
|
|
444
361
|
height,
|
|
445
362
|
className,
|
|
446
363
|
...props
|
|
447
|
-
}: SkeletonProps):
|
|
448
|
-
//#endregion
|
|
449
|
-
//#region src/ui/tooltip/tooltip-container.d.ts
|
|
450
|
-
type SubPlacement = 'start' | 'end';
|
|
451
|
-
type MainPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
452
|
-
type TooltipPlacement = MainPlacement | `${MainPlacement}-${SubPlacement}`;
|
|
453
|
-
interface TooltipContainerProps extends HTMLAttributes<HTMLDivElement> {
|
|
454
|
-
/**
|
|
455
|
-
* @param children - Trigger element
|
|
456
|
-
*/
|
|
457
|
-
children: React.ReactNode;
|
|
458
|
-
/**
|
|
459
|
-
* @param content - Tooltip content
|
|
460
|
-
*/
|
|
461
|
-
content: string;
|
|
462
|
-
/**
|
|
463
|
-
* @param placement - Placement of the tooltip
|
|
464
|
-
* @default top
|
|
465
|
-
* @property
|
|
466
|
-
* - top
|
|
467
|
-
* - bottom
|
|
468
|
-
* - left
|
|
469
|
-
* - right
|
|
470
|
-
* - top-start
|
|
471
|
-
* - top-end
|
|
472
|
-
* - bottom-start
|
|
473
|
-
* - bottom-end
|
|
474
|
-
* - left-start
|
|
475
|
-
* - left-end
|
|
476
|
-
* - right-start
|
|
477
|
-
* - right-end
|
|
478
|
-
*/
|
|
479
|
-
placement?: TooltipPlacement;
|
|
480
|
-
/**
|
|
481
|
-
* @param defaultOpen - Default open state of the tooltip
|
|
482
|
-
* @default false
|
|
483
|
-
* @property
|
|
484
|
-
* - true: Open the tooltip
|
|
485
|
-
* - false: Close the tooltip
|
|
486
|
-
*/
|
|
487
|
-
defaultOpen?: boolean;
|
|
488
|
-
}
|
|
489
|
-
/**
|
|
490
|
-
* @param children - Trigger element
|
|
491
|
-
* @param content - Tooltip content
|
|
492
|
-
* @param defaultOpen - Default open state of the tooltip
|
|
493
|
-
* @param placement - Placement of the tooltip
|
|
494
|
-
*/
|
|
495
|
-
declare const TooltipContainer: react3.ForwardRefExoticComponent<TooltipContainerProps & react3.RefAttributes<HTMLDivElement>>;
|
|
364
|
+
}: SkeletonProps): react_jsx_runtime4.JSX.Element;
|
|
496
365
|
//#endregion
|
|
497
|
-
export { BottomAppBar, type BottomAppBarProps, Button, type ButtonProps,
|
|
366
|
+
export { BottomAppBar, type BottomAppBarProps, Button, type ButtonProps, ConditionalWrapper, type ConditionalWrapperProps, Footer, type FooterProps, Header, type HeaderProps, Input, type InputProps, Layout, type LayoutProps, Skeleton, type SkeletonProps };
|
package/dist/ui/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{f as e}from"../util-DCPr_-5a.mjs";import{t}from"../hooks-5I2NBtcY.mjs";import{debounce as n}from"lodash-es";import r from"clsx";import i,{forwardRef as a,useCallback as o,useEffect as s,useMemo as c,useRef as l,useState as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{cva as p}from"class-variance-authority";import m from"embla-carousel-react";import{createPortal as h}from"react-dom";function g({className:e,items:t,render:n,...a}){return d(`nav`,{"data-komc":!0,className:r(`komc:fixed komc:bottom-0 komc:left-0 komc:right-0`,`komc:border-t komc:border-neutral-200 komc:bg-white komc:z-10`,e),...a,children:d(`div`,{className:`komc:grid komc:min-h-15`,style:{gridTemplateColumns:`repeat(${t.length}, 1fr)`},children:t.map((e,t)=>d(i.Fragment,{children:n(e)},t))})})}const _=p(e(`komc:inline-flex komc:justify-center komc:items-center komc:w-full`,`komc:transition-colors komc:duration-200 komc:relative`,`komc:*:transition-colors komc:*:duration-200`,`komc:disabled:cursor-default komc:disabled:opacity-50 komc:disabled:pointer-events-none`,`komc:whitespace-nowrap komc:shrink-0 komc:outline-none`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"2.5xl":`komc:rounded-[20px]`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`},variant:{default:``,ghost:`komc:bg-transparent komc:text-neutral-900`,white:`komc:bg-white komc:text-neutral-900 komc:hover:bg-neutral-100`,blue:`komc:bg-blue-500 komc:text-white komc:hover:bg-blue-600`,night:`komc:bg-[#2c5cb7] komc:text-white komc:hover:bg-[#26539F]`,charcoal:`komc:bg-[#36454F] komc:text-white komc:hover:bg-[#2E3A43]`,slate:`komc:bg-[#4A5565] komc:text-white komc:hover:bg-[#424A57]`,red:`komc:bg-[#C8313A] komc:text-white komc:hover:bg-[#B02B33]`,yellow:`komc:bg-[#E7FF14] komc:text-black komc:hover:bg-[#D4E600]`,black:`komc:bg-[rgb(95,95,96)] komc:text-white komc:hover:bg-[rgb(76,76,77)] komc:active:bg-[rgb(76,76,77)]`}},defaultVariants:{size:void 0,outline:void 0,rounded:void 0,variant:void 0}});var v=a(({children:e=`button`,type:t=`button`,size:n=`md`,gap:r=`sm`,outline:i=`line`,rounded:a=`sm`,variant:o=`blue`,className:s,...c},l)=>d(`button`,{ref:l,type:t,"data-komc":!0,className:_({size:n,outline:i,gap:r,rounded:a,variant:o,className:s}),...c,children:e}));const y=i.createContext(null);function b(){let e=i.useContext(y);if(!e)throw Error(`useCarousel must be used within a <Carousel />`);return e}function x({orientation:t=`horizontal`,options:n,setApi:r,plugins:i,className:a,children:c,...l}){let[f,p]=m({...n,axis:t===`horizontal`?`x`:`y`},i),[h,g]=u(!1),[_,v]=u(!1),b=o(e=>{e&&(g(e.canScrollPrev()),v(e.canScrollNext()))},[]),x=o(()=>{p?.scrollPrev()},[p]),S=o(()=>{p?.scrollNext()},[p]),C=o(e=>{e.key===`ArrowLeft`?(e.preventDefault(),x()):e.key===`ArrowRight`&&(e.preventDefault(),S())},[x,S]);return s(()=>{!p||!r||r(p)},[p,r]),s(()=>{if(p)return b(p),p.on(`reInit`,b),p.on(`select`,b),()=>{p?.off(`select`,b)}},[p,b]),d(y.Provider,{value:{carouselRef:f,api:p,options:n,orientation:t||(n?.axis===`y`?`vertical`:`horizontal`),scrollPrev:x,scrollNext:S,canScrollPrev:h,canScrollNext:_},children:d(`div`,{"data-komc":!0,onKeyDownCapture:C,className:e(`komc:relative`,a),...l,children:c})})}function S({className:t,...n}){let{carouselRef:r,orientation:i}=b();return d(`div`,{ref:r,"data-komc":!0,className:`komc:h-full komc:overflow-hidden`,children:d(`div`,{className:e(`komc:flex komc:h-full`,i===`horizontal`?`komc:-ml-4`:`komc:-mt-4 komc:flex-col`,t),...n})})}function C({className:t,...n}){let{orientation:r}=b();return d(`div`,{"data-komc":!0,className:e(`komc:min-w-0 komc:shrink-0 komc:grow-0 komc:basis-full`,r===`horizontal`?`komc:pl-4`:`komc:pt-4`,t),...n})}function w({children:e,className:t,...n}){let{scrollPrev:i,canScrollPrev:a}=b();return d(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:r(`komc:w-full`,t),onClick:i,...n,children:e})}function T({children:e,className:t,...n}){let{scrollNext:i,canScrollNext:a}=b();return d(`button`,{type:`button`,"data-komc":!0,disabled:!a,className:r(`komc:w-full`,t),onClick:i,...n,children:e})}function E({condition:e,wrapper:t,children:n}){return e?t(n):n}const D=p(`komc:flex komc:flex-col komc:w-full komc:max-w-7xl komc:mx-auto`,{variants:{maxWidth:{none:``,xs:`komc:max-w-xs`,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,full:`komc:max-w-full`}},defaultVariants:{maxWidth:`full`}});function O({className:e,children:t,maxWidth:n,...i}){return d(`footer`,{"data-komc":!0,className:r(`komc:block komc:w-full komc:h-full`,`komc:bg-white komc:border-t komc:border-neutral-200`,e),...i,children:d(`div`,{className:D({maxWidth:n}),children:t})})}const k=p(e(`komc:flex komc:items-center`,`komc:mx-auto komc:min-h-10`),{variants:{maxWidth:{none:``,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,"8xl":`komc:max-w-330`,full:`komc:max-w-full`},size:{sm:`komc:h-10`,md:`komc:h-12`,lg:`komc:h-14`,xl:`komc:h-16`,"2xl":`komc:h-18`,"3xl":`komc:h-20`,"4xl":`komc:h-22`,"4.25xl":`komc:h-22.5`,"5xl":`komc:h-24`,"6xl":`komc:h-26`,"7xl":`komc:h-28`,"8xl":`komc:h-30`,full:`komc:h-full`}},defaultVariants:{maxWidth:`full`,size:`xl`}});function A({children:e,maxWidth:t,size:n,className:i,...a}){return d(`header`,{"data-komc":!0,className:r(`komc:w-full komc:sticky komc:top-0 komc:z-1000 komc:bg-white`,`komc:transition-all komc:duration-200`,i),...a,children:d(`div`,{className:k({maxWidth:t,size:n}),children:e})})}const j=p(e(`komc:flex komc:items-center komc:w-full komc:px-2`,`komc:[&>input]:outline-none komc:[&>input]:w-full`,`komc:[&>input]:focus:ring-0 komc:[&>input]:focus:ring-offset-0`,`komc:[&>input]:h-full`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`}}});var M=a(({prefix:e=null,surffix:t=null,size:n=`lg`,gap:r=`xl`,outline:i=`line`,rounded:a=`lg`,className:o,...s},c)=>f(`div`,{"data-komc":!0,className:j({size:n,gap:r,outline:i,rounded:a,className:o}),children:[e,d(`input`,{ref:c,type:`text`,...s}),t]}));const N=p(`komc:w-full komc:mx-auto komc:relative`,{variants:{type:{main:`komc:flex komc:flex-col`,content:`komc:grow komc:my-0`},maxWidth:{none:``,xs:`komc:max-w-xs komc:xl:max-w-full`,sm:`komc:max-w-sm komc:xl:max-w-full`,md:`komc:max-w-md komc:xl:max-w-full`,lg:`komc:max-w-lg komc:xl:max-w-full`,xl:`komc:max-w-xl komc:xl:max-w-full`,"2xl":`komc:max-w-2xl komc:xl:max-w-full`,"3xl":`komc:max-w-3xl komc:xl:max-w-full`,full:`komc:max-w-full`}},defaultVariants:{type:`main`,maxWidth:`full`}});function P({children:e,className:t,type:n,maxWidth:r,...i}){return d(`div`,{"data-komc":!0,className:N({type:n,maxWidth:r,className:t}),...i,children:e})}const F=p(e(`komc:w-full komc:animate-pulse komc:bg-gray-200`),{variants:{size:{xs:`komc:h-4`,sm:`komc:h-8`,md:`komc:h-12`,lg:`komc:h-16`,xl:`komc:h-20`,"2xl":`komc:h-24`,"3xl":`komc:h-28`,square:`komc:h-auto komc:aspect-square`,full:`komc:h-full`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`}},defaultVariants:{size:`sm`,rounded:`sm`}});function I({size:e,rounded:t,width:n,height:r,className:i,...a}){let o=n?typeof n==`string`?n:`${n}px`:void 0,s=r?typeof r==`string`?r:`${r}px`:void 0;return d(`div`,{"data-komc":!0,className:F({size:e,rounded:t,className:i}),style:{width:o,height:s},...a})}function L({children:e,setOpen:t}){return d(`div`,{"data-komc":!0,className:r(`komc:inline-flex komc:shrink-0 komc:justify-center`,`komc:items-center komc:outline-none`),onMouseLeave:()=>t(!1),onMouseOver:()=>t(!0),onFocus:()=>t(!0),onBlur:()=>t(!1),onClick:()=>t(!0),children:e})}const R=p(e(`komc:absolute komc:z-99 komc:w-max komc:max-w-70 komc:p-2 komc:rounded-md`,`komc:break-all komc:transition-opacity komc:duration-300 komc:bg-white`,`komc:drop-shadow-[0px_0.5px_3px_rgba(0,0,0,0.2)] komc:text-xs`),{variants:{portal:{true:``,false:``},placement:{top:``,bottom:``,left:``,right:``,"top-start":``,"top-end":``,"bottom-start":``,"bottom-end":``,"left-start":``,"left-end":``,"right-start":``,"right-end":``}},compoundVariants:[{portal:!0,placement:`top`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom`,className:`komc:translate-y-2`},{portal:!0,placement:`left`,className:`komc:-translate-x-2`},{portal:!0,placement:`right`,className:`komc:translate-x-2`},{portal:!0,placement:`top-start`,className:`komc:-translate-y-2`},{portal:!0,placement:`top-end`,className:`komc:-translate-y-2`},{portal:!0,placement:`bottom-start`,className:`komc:translate-y-2`},{portal:!0,placement:`bottom-end`,className:`komc:translate-y-2`},{portal:!0,placement:`left-start`,className:`komc:-translate-x-2`},{portal:!0,placement:`left-end`,className:`komc:-translate-x-2`},{portal:!0,placement:`right-start`,className:`komc:translate-x-2`},{portal:!0,placement:`right-end`,className:`komc:translate-x-2`},{portal:!1,placement:`top`,className:`komc:bottom-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`bottom`,className:`komc:top-full komc:left-1/2 komc:-translate-x-1/2`},{portal:!1,placement:`left`,className:`komc:right-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`right`,className:`komc:left-full komc:top-1/2 komc:-translate-y-1/2`},{portal:!1,placement:`top-start`,className:`komc:bottom-full komc:left-0`},{portal:!1,placement:`top-end`,className:`komc:bottom-full komc:right-0`},{portal:!1,placement:`bottom-start`,className:`komc:top-full komc:left-0`},{portal:!1,placement:`bottom-end`,className:`komc:top-full komc:right-0`},{portal:!1,placement:`left-start`,className:`komc:right-full komc:top-0`},{portal:!1,placement:`left-end`,className:`komc:right-full komc:bottom-0`},{portal:!1,placement:`right-start`,className:`komc:left-full komc:top-0`},{portal:!1,placement:`right-end`,className:`komc:left-full komc:bottom-0`}],defaultVariants:{placement:`top`,portal:!1}});var z=a(({portal:e,children:t,className:n,placement:r,...i},a)=>d(`div`,{ref:a,"data-komc":!0,role:`tooltip`,className:R({portal:e,placement:r,className:n}),...i,children:t}));const B=p(e(`komc:absolute komc:w-2 komc:h-2 komc:bg-inherit`,`komc:transition-opacity komc:duration-300`),{variants:{placement:{top:e(`komc:top-full komc:-mt-1 komc:left-1/2`),bottom:e(`komc:bottom-full komc:-mb-1 komc:left-1/2`),left:e(`komc:left-full komc:-ml-1 komc:top-1/2`),right:e(`komc:right-full komc:-mr-1 komc:top-1/2`),"top-start":e(`komc:top-full komc:-mt-1 komc:left-5`),"top-end":e(`komc:top-full komc:-mt-1 komc:right-5`),"bottom-start":e(`komc:bottom-full komc:-mb-1 komc:left-5`),"bottom-end":e(`komc:bottom-full komc:-mb-1 komc:right-5`),"left-start":e(`komc:left-full komc:-ml-1 komc:top-3`),"left-end":e(`komc:left-full komc:-ml-1 komc:bottom-3`),"right-start":e(`komc:right-full komc:-mr-1 komc:top-3`),"right-end":e(`komc:right-full komc:-mr-1 komc:bottom-3`)}},defaultVariants:{placement:`top`}});var V=({placement:e,className:t,offset:n,style:r,...i})=>{let a=c(()=>{switch(e){case`top`:return`rotate(45deg)`;case`bottom`:return`rotate(225deg)`;case`left`:return`rotate(-45deg)`;case`right`:return`rotate(135deg)`;case`top-start`:return`rotate(45deg)`;case`top-end`:return`rotate(45deg)`;case`bottom-start`:return`rotate(225deg)`;case`bottom-end`:return`rotate(225deg)`;case`left-start`:return`rotate(-45deg)`;case`left-end`:return`rotate(-45deg)`;case`right-start`:return`rotate(135deg)`;case`right-end`:return`rotate(135deg)`;default:return`rotate(45deg)`}},[e]);return d(`div`,{className:B({placement:e,className:t}),style:{transform:`translate(${n?.x}px, ${n?.y}px) ${a}`},...i})};const H=(e,t)=>{let[,n]=e.split(`-`);return n?`${t}-${n}`:t};function U({placement:e,className:t,content:i,open:a,hiddenRef:c,containerRef:p}){let[m,g]=u(!1),_=l(null),[v,y]=u(e),[b,x]=u({top:0,left:0}),[S,C]=u({x:0,y:0}),w=o(n(()=>{let e=p?.current,t=c.current;if(!e||!t)return;let n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),i=window.scrollY||document.documentElement.scrollTop,a=window.scrollX||document.documentElement.scrollLeft,[o,s]=v.split(`-`),l=i+n.top,u=a+n.left+n.width/2-r.width/2;switch(o){case`top`:l-=r.height;break;case`bottom`:l+=n.height;break;case`left`:l+=n.height/2-r.height/2,u-=r.width/2+n.width/2;break;case`right`:l+=n.height/2-r.height/2,u+=r.width/2+n.width/2;break}if([`top`,`bottom`].includes(o))switch(s){case`start`:u+=r.width/2-24;break;case`end`:u-=r.width/2-24;break}if([`left`,`right`].includes(o))switch(s){case`start`:l+=r.height/2+n.height/2-24;break;case`end`:l-=r.height/2+n.height/2-24;break}let d=u,f=window.innerWidth;d+r.width>f-4&&(d=f-r.width-4),d<4&&(d=4),x({top:l,left:d}),C({x:u-d,y:0})},50),[v]),T=o(n(()=>{if(!c.current)return;let{top:t,height:n}=c.current.getBoundingClientRect();y(r=>{let i=e;return t+n>=window.innerHeight?i=H(r,`top`):t<0&&(i=H(r,`bottom`)),i})},50),[e]);return s(()=>(g(!0),T(),window.addEventListener(`scroll`,w,{passive:!0}),window.addEventListener(`resize`,w),window.addEventListener(`scroll`,T,{passive:!0}),window.addEventListener(`resize`,T),()=>{window.removeEventListener(`scroll`,w),window.removeEventListener(`resize`,w),window.removeEventListener(`scroll`,T),window.removeEventListener(`resize`,T)}),[w,T]),s(()=>{m&&w()},[m,w]),m?h(f(z,{ref:_,portal:!0,"data-komc":!0,placement:v,className:r(t,a?`komc:visible komc:opacity-100`:`komc:opacity-0 komc:invisible`),style:{...b},children:[d(`span`,{children:i}),d(V,{placement:v,offset:S})]}),document.body):null}var W=a(({children:e,content:n,defaultOpen:i=!1,className:a,placement:o=`top`},s)=>{let[c,p]=u(i),m=l(null),h=l(null);return t({ref:m,setOpen:p}),f(`div`,{ref:m,"data-komc":!0,className:`komc:flex komc:shrink-0 komc:relative komc:overflow-hidden komc:w-fit komc:h-fit`,children:[d(L,{setOpen:p,children:e}),d(U,{placement:o,className:a,open:c,content:n,hiddenRef:h,containerRef:m}),d(z,{ref:h,role:`presentation`,placement:o,className:r(`komc:opacity-0 komc:invisible`,a),children:d(`span`,{children:n})})]})});export{g as BottomAppBar,v as Button,x as Carousel,C as CarouselItem,T as CarouselNext,w as CarouselPrevious,S as CarouselWrapper,E as ConditionalWrapper,O as Footer,A as Header,M as Input,P as Layout,I as Skeleton,W as Tooltip};
|
|
1
|
+
import{f as e}from"../util-BrmjOcya.mjs";import t from"clsx";import n,{forwardRef as r}from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{cva as o}from"class-variance-authority";function s({className:e,items:r,render:a,...o}){return i(`nav`,{"data-komc":!0,className:t(`komc:fixed komc:bottom-0 komc:left-0 komc:right-0`,`komc:border-t komc:border-neutral-200 komc:bg-white komc:z-10`,e),...o,children:i(`div`,{className:`komc:grid komc:min-h-15`,style:{gridTemplateColumns:`repeat(${r.length}, 1fr)`},children:r.map((e,t)=>i(n.Fragment,{children:a(e)},t))})})}const c=o(e(`komc:inline-flex komc:justify-center komc:items-center komc:w-full`,`komc:transition-colors komc:duration-200 komc:relative`,`komc:*:transition-colors komc:*:duration-200`,`komc:disabled:cursor-default komc:disabled:opacity-50 komc:disabled:pointer-events-none`,`komc:whitespace-nowrap komc:shrink-0 komc:outline-none`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"2.5xl":`komc:rounded-[20px]`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`},variant:{default:``,ghost:`komc:bg-transparent komc:text-neutral-900`,white:`komc:bg-white komc:text-neutral-900 komc:hover:bg-neutral-100`,blue:`komc:bg-blue-500 komc:text-white komc:hover:bg-blue-600`,night:`komc:bg-[#2c5cb7] komc:text-white komc:hover:bg-[#26539F]`,charcoal:`komc:bg-[#36454F] komc:text-white komc:hover:bg-[#2E3A43]`,slate:`komc:bg-[#4A5565] komc:text-white komc:hover:bg-[#424A57]`,red:`komc:bg-[#C8313A] komc:text-white komc:hover:bg-[#B02B33]`,yellow:`komc:bg-[#E7FF14] komc:text-black komc:hover:bg-[#D4E600]`,black:`komc:bg-[rgb(95,95,96)] komc:text-white komc:hover:bg-[rgb(76,76,77)] komc:active:bg-[rgb(76,76,77)]`}},defaultVariants:{size:void 0,outline:void 0,rounded:void 0,variant:void 0}});var l=r(({children:e=`button`,type:t=`button`,size:n=`md`,gap:r=`sm`,outline:a=`line`,rounded:o=`sm`,variant:s=`blue`,className:l,...u},d)=>i(`button`,{ref:d,type:t,"data-komc":!0,className:c({size:n,outline:a,gap:r,rounded:o,variant:s,className:l}),...u,children:e}));function u({condition:e,wrapper:t,children:n}){return e?t(n):n}const d=o(`komc:flex komc:flex-col komc:w-full komc:mx-auto`,{variants:{maxWidth:{none:``,xs:`komc:max-w-xs`,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,full:`komc:max-w-full`}},defaultVariants:{maxWidth:`full`}});function f({className:e,children:n,maxWidth:r,...a}){return i(`footer`,{"data-komc":!0,className:t(`komc:block komc:w-full komc:h-full`,`komc:bg-white komc:border-t komc:border-neutral-200`,e),...a,children:i(`div`,{className:d({maxWidth:r}),children:n})})}const p=o(e(`komc:flex komc:items-center`,`komc:mx-auto komc:min-h-10`),{variants:{maxWidth:{none:``,sm:`komc:max-w-sm`,md:`komc:max-w-md`,lg:`komc:max-w-lg`,xl:`komc:max-w-xl`,"2xl":`komc:max-w-2xl`,"3xl":`komc:max-w-3xl`,"4xl":`komc:max-w-4xl`,"5xl":`komc:max-w-5xl`,"6xl":`komc:max-w-6xl`,"7xl":`komc:max-w-7xl`,"8xl":`komc:max-w-330`,full:`komc:max-w-full`},size:{sm:`komc:h-10`,md:`komc:h-12`,lg:`komc:h-14`,xl:`komc:h-16`,"2xl":`komc:h-18`,"3xl":`komc:h-20`,"4xl":`komc:h-22`,"4.25xl":`komc:h-22.5`,"5xl":`komc:h-24`,"6xl":`komc:h-26`,"7xl":`komc:h-28`,"8xl":`komc:h-30`,full:`komc:h-full`}},defaultVariants:{maxWidth:`full`,size:`xl`}});function m({children:e,maxWidth:n,size:r,className:a,...o}){return i(`header`,{"data-komc":!0,className:t(`komc:w-full komc:sticky komc:top-0 komc:z-1000 komc:bg-white`,`komc:transition-all komc:duration-200`,a),...o,children:i(`div`,{className:p({maxWidth:n,size:r}),children:e})})}const h=o(e(`komc:flex komc:items-center komc:w-full komc:px-2`,`komc:[&>input]:outline-none komc:[&>input]:w-full`,`komc:[&>input]:focus:ring-0 komc:[&>input]:focus:ring-offset-0`,`komc:[&>input]:h-full`),{variants:{size:{xs:`komc:h-7.5`,sm:`komc:h-8`,base:`komc:h-9`,md:`komc:h-10`,lg:`komc:h-11`,xl:`komc:h-12`,"2xl":`komc:h-13`,"3xl":`komc:h-14`},gap:{none:`komc:gap-0`,xs:`komc:gap-1`,sm:`komc:gap-2`,md:`komc:gap-3`,lg:`komc:gap-4`,xl:`komc:gap-5`},outline:{line:`komc:border`,solid:`komc:border-transparent`,clear:`komc:border-none`,dashed:`komc:border-dashed`,dotted:`komc:border-dotted`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`}}});var g=r(({prefix:e=null,surffix:t=null,size:n=`lg`,gap:r=`xl`,outline:o=`line`,rounded:s=`lg`,className:c,...l},u)=>a(`div`,{"data-komc":!0,className:h({size:n,gap:r,outline:o,rounded:s,className:c}),children:[e,i(`input`,{ref:u,type:`text`,...l}),t]}));const _=o(`komc:w-full komc:mx-auto komc:relative`,{variants:{type:{main:`komc:flex komc:flex-col`,content:`komc:grow komc:my-0`},maxWidth:{none:``,xs:`komc:max-w-xs komc:xl:max-w-full`,sm:`komc:max-w-sm komc:xl:max-w-full`,md:`komc:max-w-md komc:xl:max-w-full`,lg:`komc:max-w-lg komc:xl:max-w-full`,xl:`komc:max-w-xl komc:xl:max-w-full`,"2xl":`komc:max-w-2xl komc:xl:max-w-full`,"3xl":`komc:max-w-3xl komc:xl:max-w-full`,full:`komc:max-w-full`}},defaultVariants:{type:`main`,maxWidth:`full`}});function v({children:e,className:t,type:n,maxWidth:r,...a}){return i(`div`,{"data-komc":!0,className:_({type:n,maxWidth:r,className:t}),...a,children:e})}const y=o(e(`komc:w-full komc:animate-pulse komc:bg-gray-200`),{variants:{size:{xs:`komc:h-4`,sm:`komc:h-8`,md:`komc:h-12`,lg:`komc:h-16`,xl:`komc:h-20`,"2xl":`komc:h-24`,"3xl":`komc:h-28`,square:`komc:h-auto komc:aspect-square`,full:`komc:h-full`},rounded:{none:`komc:rounded-none`,sm:`komc:rounded-sm`,md:`komc:rounded-md`,lg:`komc:rounded-lg`,xl:`komc:rounded-xl`,"2xl":`komc:rounded-2xl`,"3xl":`komc:rounded-3xl`,full:`komc:rounded-full`}},defaultVariants:{size:`sm`,rounded:`sm`}});function b({size:e,rounded:t,width:n,height:r,className:a,...o}){let s=n?typeof n==`string`?n:`${n}px`:void 0,c=r?typeof r==`string`?r:`${r}px`:void 0;return i(`div`,{"data-komc":!0,className:y({size:e,rounded:t,className:a}),style:{width:s,height:c},...o})}export{s as BottomAppBar,l as Button,u as ConditionalWrapper,f as Footer,m as Header,g as Input,v as Layout,b as Skeleton};
|
package/dist/util/index.d.cts
CHANGED
|
@@ -62,7 +62,7 @@ declare const getI18nValue: <T extends {
|
|
|
62
62
|
}>(locale?: string, values?: T[], key?: keyof T) => string;
|
|
63
63
|
declare const comparePriorityAsc: <T extends {
|
|
64
64
|
priority: number;
|
|
65
|
-
}>(a: T, b: T) =>
|
|
65
|
+
}>(a: T, b: T) => 1 | 0 | -1;
|
|
66
66
|
declare const parseQuery: <T, F = T>(q: string | string[] | undefined | null, conv: (v: string) => T, fallback: F) => T | F;
|
|
67
67
|
declare const withoutProperty: <T>(obj: T, property: keyof T) => Omit<T, keyof T>;
|
|
68
68
|
declare const withoutProperties: <T extends Record<string, unknown>>(obj: T, properties: Array<keyof T>) => T;
|
package/dist/util/index.d.mts
CHANGED
|
@@ -64,7 +64,7 @@ declare const getI18nValue: <T extends {
|
|
|
64
64
|
}>(locale?: string, values?: T[], key?: keyof T) => string;
|
|
65
65
|
declare const comparePriorityAsc: <T extends {
|
|
66
66
|
priority: number;
|
|
67
|
-
}>(a: T, b: T) =>
|
|
67
|
+
}>(a: T, b: T) => 1 | 0 | -1;
|
|
68
68
|
declare const parseQuery: <T, F = T>(q: string | string[] | undefined | null, conv: (v: string) => T, fallback: F) => T | F;
|
|
69
69
|
declare const withoutProperty: <T>(obj: T, property: keyof T) => Omit<T, keyof T>;
|
|
70
70
|
declare const withoutProperties: <T extends Record<string, unknown>>(obj: T, properties: Array<keyof T>) => T;
|
package/dist/util/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{A as e,B as t,C as n,D as r,E as i,F as a,H as o,I as s,L as c,M as l,N as u,O as d,P as f,R as p,S as m,T as h,U as g,V as _,_ as v,a as y,b,c as x,d as S,f as C,g as w,h as T,i as E,j as D,k as O,l as k,m as A,n as j,o as M,p as N,r as P,s as F,t as I,u as L,v as R,w as z,x as B,y as V,z as H}from"../util-
|
|
1
|
+
import{A as e,B as t,C as n,D as r,E as i,F as a,H as o,I as s,L as c,M as l,N as u,O as d,P as f,R as p,S as m,T as h,U as g,V as _,_ as v,a as y,b,c as x,d as S,f as C,g as w,h as T,i as E,j as D,k as O,l as k,m as A,n as j,o as M,p as N,r as P,s as F,t as I,u as L,v as R,w as z,x as B,y as V,z as H}from"../util-BrmjOcya.mjs";export{f as appendSearchPath,S as calcPageCount,a as clearQueryByKey,s as clearSearchPath,C as cn,N as comparePriorityAsc,A as composeKey,c as deleteAllSearchHistory,p as deleteSearchHistory,M as displayDatetime,T as existLeastOne,F as formatBytes,w as formatI18nNumber,I as genNanoID,j as generatePage,P as generatePageGroup,H as getCookie,x as getFileExtension,k as getFilename,v as getFirstLocationAddress,R as getFullAddress,V as getI18nKey,b as getI18nValue,B as getI18nValues,m as getModelName,t as getSearchHistory,_ as insertSearchHistory,o as isSearchPage,n as link,z as loadExLib,L as parsePath,h as parseQuery,E as printNanoID,i as productSlugify,y as randomNum,r as recomposeI18nNumber,d as selectItemByWeight,g as setCookies,O as shuffle,e as sleep,D as slugify,l as withoutProperties,u as withoutProperty};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@machinerd/js-module",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "",
|
|
6
6
|
"main": "dist/index.mjs",
|
|
@@ -20,6 +20,10 @@
|
|
|
20
20
|
"import": "./dist/ui/index.mjs",
|
|
21
21
|
"require": "./dist/ui/index.cjs"
|
|
22
22
|
},
|
|
23
|
+
"./ui/client": {
|
|
24
|
+
"import": "./dist/ui/client-only/index.mjs",
|
|
25
|
+
"require": "./dist/ui/client-only/index.cjs"
|
|
26
|
+
},
|
|
23
27
|
"./hooks": {
|
|
24
28
|
"import": "./dist/hooks/index.mjs",
|
|
25
29
|
"require": "./dist/hooks/index.cjs"
|
|
File without changes
|
|
File without changes
|