@forgedevstack/bear 1.0.8 → 1.0.9
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/components/ActivityItem/ActivityItem.cjs +1 -1
- package/dist/components/ActivityItem/ActivityItem.js +1 -0
- package/dist/components/Alert/Alert.const.cjs +1 -1
- package/dist/components/Alert/Alert.const.js +3 -2
- package/dist/components/AppBar/AppBar.cjs +1 -1
- package/dist/components/AppBar/AppBar.js +3 -2
- package/dist/components/Badge/Badge.cjs +1 -1
- package/dist/components/Badge/Badge.js +15 -14
- package/dist/components/BearLogo/EmberLogo.cjs +1 -1
- package/dist/components/BearLogo/EmberLogo.js +3 -2
- package/dist/components/BottomNavigation/BottomNavigation.cjs +1 -1
- package/dist/components/BottomNavigation/BottomNavigation.js +3 -2
- package/dist/components/Carousel/Carousel.cjs +1 -1
- package/dist/components/Carousel/Carousel.const.cjs +1 -0
- package/dist/components/Carousel/Carousel.const.d.ts +12 -0
- package/dist/components/Carousel/Carousel.const.js +9 -0
- package/dist/components/Carousel/Carousel.d.ts +14 -3
- package/dist/components/Carousel/Carousel.js +222 -75
- package/dist/components/Carousel/Carousel.types.d.ts +32 -2
- package/dist/components/Carousel/index.d.ts +1 -1
- package/dist/components/Chip/Chip.cjs +1 -1
- package/dist/components/Chip/Chip.js +3 -2
- package/dist/components/CodeEditor/CodeEditor.cjs +5 -0
- package/dist/components/CodeEditor/CodeEditor.const.cjs +1 -0
- package/dist/components/CodeEditor/CodeEditor.const.d.ts +21 -0
- package/dist/components/CodeEditor/CodeEditor.const.js +119 -0
- package/dist/components/CodeEditor/CodeEditor.d.ts +22 -0
- package/dist/components/CodeEditor/CodeEditor.js +250 -0
- package/dist/components/CodeEditor/CodeEditor.types.d.ts +80 -0
- package/dist/components/CodeEditor/CodeEditor.utils.cjs +1 -0
- package/dist/components/CodeEditor/CodeEditor.utils.d.ts +6 -0
- package/dist/components/CodeEditor/CodeEditor.utils.js +75 -0
- package/dist/components/CodeEditor/index.d.ts +2 -0
- package/dist/components/Columns/Columns.cjs +1 -1
- package/dist/components/Columns/Columns.js +9 -8
- package/dist/components/CountdownTimer/CountdownTimer.cjs +1 -0
- package/dist/components/CountdownTimer/CountdownTimer.const.cjs +1 -0
- package/dist/components/CountdownTimer/CountdownTimer.const.d.ts +27 -0
- package/dist/components/CountdownTimer/CountdownTimer.const.js +35 -0
- package/dist/components/CountdownTimer/CountdownTimer.d.ts +7 -0
- package/dist/components/CountdownTimer/CountdownTimer.js +115 -0
- package/dist/components/CountdownTimer/CountdownTimer.types.d.ts +56 -0
- package/dist/components/CountdownTimer/index.d.ts +2 -0
- package/dist/components/Cropper/Cropper.cjs +1 -0
- package/dist/components/Cropper/Cropper.const.cjs +1 -0
- package/dist/components/Cropper/Cropper.const.d.ts +31 -0
- package/dist/components/Cropper/Cropper.const.js +33 -0
- package/dist/components/Cropper/Cropper.d.ts +21 -0
- package/dist/components/Cropper/Cropper.js +362 -0
- package/dist/components/Cropper/Cropper.types.d.ts +72 -0
- package/dist/components/Cropper/index.d.ts +2 -0
- package/dist/components/DataTable/DataTable.cjs +1 -1
- package/dist/components/DataTable/DataTable.js +5 -4
- package/dist/components/Divider/Divider.cjs +1 -1
- package/dist/components/Divider/Divider.js +15 -14
- package/dist/components/Dock/Dock.cjs +1 -0
- package/dist/components/Dock/Dock.const.cjs +1 -0
- package/dist/components/Dock/Dock.const.d.ts +25 -0
- package/dist/components/Dock/Dock.const.js +22 -0
- package/dist/components/Dock/Dock.d.ts +7 -0
- package/dist/components/Dock/Dock.js +144 -0
- package/dist/components/Dock/Dock.types.d.ts +42 -0
- package/dist/components/Dock/index.d.ts +2 -0
- package/dist/components/EmptyState/EmptyState.cjs +1 -1
- package/dist/components/EmptyState/EmptyState.js +7 -6
- package/dist/components/GradientText/GradientText.cjs +1 -0
- package/dist/components/GradientText/GradientText.const.cjs +1 -0
- package/dist/components/GradientText/GradientText.const.d.ts +15 -0
- package/dist/components/GradientText/GradientText.const.js +36 -0
- package/dist/components/GradientText/GradientText.d.ts +7 -0
- package/dist/components/GradientText/GradientText.js +52 -0
- package/dist/components/GradientText/GradientText.types.d.ts +27 -0
- package/dist/components/GradientText/index.d.ts +2 -0
- package/dist/components/Highlight/Highlight.cjs +1 -1
- package/dist/components/Highlight/Highlight.const.cjs +1 -0
- package/dist/components/Highlight/Highlight.const.d.ts +8 -0
- package/dist/components/Highlight/Highlight.const.js +15 -0
- package/dist/components/Highlight/Highlight.d.ts +4 -0
- package/dist/components/Highlight/Highlight.js +32 -24
- package/dist/components/Highlight/Highlight.types.d.ts +9 -1
- package/dist/components/Highlight/index.d.ts +1 -1
- package/dist/components/Icon/Icon.cjs +1 -1
- package/dist/components/Icon/Icon.js +17 -16
- package/dist/components/Icon/index.cjs +1 -1
- package/dist/components/Icon/index.js +12 -11
- package/dist/components/Kbd/Kbd.cjs +1 -1
- package/dist/components/Kbd/Kbd.js +17 -16
- package/dist/components/Map/Map.cjs +1 -0
- package/dist/components/Map/Map.const.cjs +1 -0
- package/dist/components/Map/Map.const.d.ts +20 -0
- package/dist/components/Map/Map.const.js +26 -0
- package/dist/components/Map/Map.d.ts +20 -0
- package/dist/components/Map/Map.js +259 -0
- package/dist/components/Map/Map.types.d.ts +81 -0
- package/dist/components/Map/index.d.ts +2 -0
- package/dist/components/Marquee/Marquee.cjs +1 -0
- package/dist/components/Marquee/Marquee.const.cjs +1 -0
- package/dist/components/Marquee/Marquee.const.d.ts +11 -0
- package/dist/components/Marquee/Marquee.const.js +12 -0
- package/dist/components/Marquee/Marquee.d.ts +7 -0
- package/dist/components/Marquee/Marquee.js +106 -0
- package/dist/components/Marquee/Marquee.types.d.ts +32 -0
- package/dist/components/Marquee/index.d.ts +2 -0
- package/dist/components/Masonry/Masonry.cjs +1 -0
- package/dist/components/Masonry/Masonry.const.cjs +1 -0
- package/dist/components/Masonry/Masonry.const.d.ts +9 -0
- package/dist/components/Masonry/Masonry.const.js +9 -0
- package/dist/components/Masonry/Masonry.d.ts +7 -0
- package/dist/components/Masonry/Masonry.js +51 -0
- package/dist/components/Masonry/Masonry.types.d.ts +21 -0
- package/dist/components/Masonry/index.d.ts +2 -0
- package/dist/components/NavigableSelect/NavigableSelect.cjs +1 -0
- package/dist/components/NavigableSelect/NavigableSelect.const.cjs +1 -0
- package/dist/components/NavigableSelect/NavigableSelect.const.d.ts +23 -0
- package/dist/components/NavigableSelect/NavigableSelect.const.js +33 -0
- package/dist/components/NavigableSelect/NavigableSelect.d.ts +7 -0
- package/dist/components/NavigableSelect/NavigableSelect.js +361 -0
- package/dist/components/NavigableSelect/NavigableSelect.types.d.ts +56 -0
- package/dist/components/NavigableSelect/index.d.ts +2 -0
- package/dist/components/Progress/Progress.cjs +1 -1
- package/dist/components/Progress/Progress.js +3 -2
- package/dist/components/RichEditor/components/ToolbarButton/ToolbarButton.cjs +1 -1
- package/dist/components/RichEditor/components/ToolbarButton/ToolbarButton.js +3 -2
- package/dist/components/ScrollArea/ScrollArea.cjs +1 -1
- package/dist/components/ScrollArea/ScrollArea.js +3 -2
- package/dist/components/Sidebar/Sidebar.cjs +1 -1
- package/dist/components/Sidebar/Sidebar.js +13 -12
- package/dist/components/Spinner/Spinner.cjs +1 -1
- package/dist/components/Spinner/Spinner.js +3 -2
- package/dist/components/Spotlight/Spotlight.cjs +1 -0
- package/dist/components/Spotlight/Spotlight.const.cjs +1 -0
- package/dist/components/Spotlight/Spotlight.const.d.ts +18 -0
- package/dist/components/Spotlight/Spotlight.const.js +9 -0
- package/dist/components/Spotlight/Spotlight.d.ts +7 -0
- package/dist/components/Spotlight/Spotlight.js +220 -0
- package/dist/components/Spotlight/Spotlight.types.d.ts +51 -0
- package/dist/components/Spotlight/index.d.ts +2 -0
- package/dist/components/StatCard/StatCard.cjs +1 -1
- package/dist/components/StatCard/StatCard.js +9 -8
- package/dist/components/Statistic/Statistic.cjs +1 -1
- package/dist/components/Statistic/Statistic.js +7 -6
- package/dist/components/Switch/Switch.cjs +1 -1
- package/dist/components/Switch/Switch.js +11 -10
- package/dist/components/TimePicker/components/TimePickerColumnsDropdown/TimePickerColumnsDropdown.cjs +1 -1
- package/dist/components/TimePicker/components/TimePickerColumnsDropdown/TimePickerColumnsDropdown.js +16 -15
- package/dist/components/TimePicker/helpers/ClockFaceSvg.cjs +1 -1
- package/dist/components/TimePicker/helpers/ClockFaceSvg.js +13 -12
- package/dist/components/Transition/Transition.cjs +1 -0
- package/dist/components/Transition/Transition.const.cjs +1 -0
- package/dist/components/Transition/Transition.const.d.ts +15 -0
- package/dist/components/Transition/Transition.const.js +73 -0
- package/dist/components/Transition/Transition.d.ts +37 -0
- package/dist/components/Transition/Transition.js +107 -0
- package/dist/components/Transition/Transition.types.d.ts +69 -0
- package/dist/components/Transition/index.d.ts +2 -0
- package/dist/components/Typewriter/Typewriter.cjs +1 -0
- package/dist/components/Typewriter/Typewriter.const.cjs +1 -0
- package/dist/components/Typewriter/Typewriter.const.d.ts +22 -0
- package/dist/components/Typewriter/Typewriter.const.js +11 -0
- package/dist/components/Typewriter/Typewriter.d.ts +7 -0
- package/dist/components/Typewriter/Typewriter.js +88 -0
- package/dist/components/Typewriter/Typewriter.types.d.ts +32 -0
- package/dist/components/Typewriter/index.d.ts +2 -0
- package/dist/components/Watermark/Watermark.cjs +1 -0
- package/dist/components/Watermark/Watermark.const.cjs +1 -0
- package/dist/components/Watermark/Watermark.const.d.ts +30 -0
- package/dist/components/Watermark/Watermark.const.js +18 -0
- package/dist/components/Watermark/Watermark.d.ts +7 -0
- package/dist/components/Watermark/Watermark.js +96 -0
- package/dist/components/Watermark/Watermark.types.d.ts +35 -0
- package/dist/components/Watermark/index.d.ts +2 -0
- package/dist/components/index.cjs +1 -1
- package/dist/components/index.d.ts +27 -1
- package/dist/components/index.js +231 -204
- package/dist/hooks/index.cjs +1 -1
- package/dist/hooks/index.d.ts +4 -0
- package/dist/hooks/index.js +24 -19
- package/dist/hooks/useAnimate.cjs +1 -0
- package/dist/hooks/useAnimate.d.ts +61 -0
- package/dist/hooks/useAnimate.js +125 -0
- package/dist/hooks/useResponsive.cjs +1 -0
- package/dist/hooks/useResponsive.d.ts +35 -0
- package/dist/hooks/useResponsive.js +74 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +324 -290
- package/dist/styles.css +1 -1
- package/dist/utils/createSlots.cjs +1 -0
- package/dist/utils/createSlots.d.ts +70 -0
- package/dist/utils/createSlots.js +65 -0
- package/dist/utils/index.cjs +1 -1
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.js +4 -2
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../utils/cn.cjs")
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../utils/cn.cjs");require("react");const x={cmd:"⌘",command:"⌘",ctrl:"⌃",control:"⌃",alt:"⌥",option:"⌥",shift:"⇧",enter:"↵",return:"↵",tab:"⇥",backspace:"⌫",delete:"⌦",escape:"⎋",esc:"⎋",up:"↑",down:"↓",left:"←",right:"→",space:"␣"},u=({children:l,keys:r,size:b="md",variant:s="default",className:c})=>{const i={sm:"bear-text-xs bear-px-1.5 bear-py-0.5 bear-min-w-[18px]",md:"bear-text-sm bear-px-2 bear-py-1 bear-min-w-[24px]",lg:"bear-text-base bear-px-2.5 bear-py-1.5 bear-min-w-[30px]"},o={default:"bear-bg-zinc-700 bear-border-zinc-600 bear-shadow-[0_1px_0_1px_rgba(0,0,0,0.3)]",outline:"bear-bg-transparent bear-border-zinc-500",ghost:"bear-bg-zinc-800/50 bear-border-transparent"},d=(a,n,m)=>{const p=x[a.toLowerCase()]||a.toUpperCase();return e.jsxs("span",{className:"bear-inline-flex bear-items-center",children:[e.jsx("kbd",{className:t.cn("bear-inline-flex bear-items-center bear-justify-center bear-rounded bear-border bear-font-mono bear-font-medium bear-text-zinc-300",i[b],o[s]),children:p}),!m&&e.jsx("span",{className:"bear-mx-1 bear-text-zinc-500",children:"+"})]},n)};return r&&r.length>0?e.jsx("span",{className:t.cn("bear-inline-flex bear-items-center",c),children:r.map((a,n)=>d(a,n,n===r.length-1))}):e.jsx("kbd",{className:t.cn("bear-inline-flex bear-items-center bear-justify-center bear-rounded bear-border bear-font-mono bear-font-medium bear-text-zinc-300",i[b],o[s],c),children:l})};exports.Kbd=u;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { cn as
|
|
1
|
+
import { jsx as t, jsxs as x } from "react/jsx-runtime";
|
|
2
|
+
import { cn as n } from "../../utils/cn.js";
|
|
3
|
+
import "react";
|
|
3
4
|
const f = {
|
|
4
5
|
cmd: "⌘",
|
|
5
6
|
command: "⌘",
|
|
@@ -20,39 +21,39 @@ const f = {
|
|
|
20
21
|
left: "←",
|
|
21
22
|
right: "→",
|
|
22
23
|
space: "␣"
|
|
23
|
-
},
|
|
24
|
-
children:
|
|
24
|
+
}, z = ({
|
|
25
|
+
children: m,
|
|
25
26
|
keys: e,
|
|
26
27
|
size: b = "md",
|
|
27
28
|
variant: s = "default",
|
|
28
29
|
className: o
|
|
29
30
|
}) => {
|
|
30
|
-
const
|
|
31
|
+
const i = {
|
|
31
32
|
sm: "bear-text-xs bear-px-1.5 bear-py-0.5 bear-min-w-[18px]",
|
|
32
33
|
md: "bear-text-sm bear-px-2 bear-py-1 bear-min-w-[24px]",
|
|
33
34
|
lg: "bear-text-base bear-px-2.5 bear-py-1.5 bear-min-w-[30px]"
|
|
34
|
-
},
|
|
35
|
+
}, c = {
|
|
35
36
|
default: "bear-bg-zinc-700 bear-border-zinc-600 bear-shadow-[0_1px_0_1px_rgba(0,0,0,0.3)]",
|
|
36
37
|
outline: "bear-bg-transparent bear-border-zinc-500",
|
|
37
38
|
ghost: "bear-bg-zinc-800/50 bear-border-transparent"
|
|
38
|
-
},
|
|
39
|
+
}, l = (r, a, d) => {
|
|
39
40
|
const p = f[r.toLowerCase()] || r.toUpperCase();
|
|
40
41
|
return /* @__PURE__ */ x("span", { className: "bear-inline-flex bear-items-center", children: [
|
|
41
|
-
/* @__PURE__ */
|
|
42
|
+
/* @__PURE__ */ t("kbd", { className: n(
|
|
42
43
|
"bear-inline-flex bear-items-center bear-justify-center bear-rounded bear-border bear-font-mono bear-font-medium bear-text-zinc-300",
|
|
43
|
-
|
|
44
|
-
|
|
44
|
+
i[b],
|
|
45
|
+
c[s]
|
|
45
46
|
), children: p }),
|
|
46
|
-
!d && /* @__PURE__ */
|
|
47
|
+
!d && /* @__PURE__ */ t("span", { className: "bear-mx-1 bear-text-zinc-500", children: "+" })
|
|
47
48
|
] }, a);
|
|
48
49
|
};
|
|
49
|
-
return e && e.length > 0 ? /* @__PURE__ */
|
|
50
|
+
return e && e.length > 0 ? /* @__PURE__ */ t("span", { className: n("bear-inline-flex bear-items-center", o), children: e.map((r, a) => l(r, a, a === e.length - 1)) }) : /* @__PURE__ */ t("kbd", { className: n(
|
|
50
51
|
"bear-inline-flex bear-items-center bear-justify-center bear-rounded bear-border bear-font-mono bear-font-medium bear-text-zinc-300",
|
|
51
|
-
|
|
52
|
-
|
|
52
|
+
i[b],
|
|
53
|
+
c[s],
|
|
53
54
|
o
|
|
54
|
-
), children:
|
|
55
|
+
), children: m });
|
|
55
56
|
};
|
|
56
57
|
export {
|
|
57
|
-
|
|
58
|
+
z as Kbd
|
|
58
59
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),l=require("react"),x=require("../../utils/cn.cjs"),a=require("./Map.const.cjs"),xe=({markers:O=[],viewport:$,controlledViewport:v,onViewportChange:f,onMarkerClick:w,onMapClick:z,onMarkerDrag:Me,tileProvider:I="openstreetmap",customTileUrl:F,width:g="100%",height:p=400,showZoomControls:G=!0,showAttribution:J=!0,scrollWheelZoom:N=!0,doubleClickZoom:D=!0,draggable:X=!0,minZoom:L=a.MIN_ZOOM,maxZoom:j=a.MAX_ZOOM,className:Q,style:V,testId:ee})=>{const E=l.useRef(null),[ae,te]=l.useState($??a.DEFAULT_VIEWPORT),[R,U]=l.useState(!1),[S,Y]=l.useState(null),[M,A]=l.useState(null),[re,C]=l.useState(null),[B,oe]=l.useState(null),t=v??ae,c=l.useCallback(e=>{const r={...e,zoom:Math.max(L,Math.min(j,e.zoom)),lat:Math.max(-85,Math.min(85,e.lat)),lng:((e.lng+180)%360+360)%360-180};v||te(r),f==null||f(r)},[v,f,L,j]),y=(e,r)=>(e+180)/360*Math.pow(2,r),m=(e,r)=>{const n=e*Math.PI/180;return(1-Math.log(Math.tan(n)+1/Math.cos(n))/Math.PI)/2*Math.pow(2,r)},P=(e,r)=>e/Math.pow(2,r)*360-180,W=(e,r)=>{const n=Math.PI-2*Math.PI*e/Math.pow(2,r);return 180/Math.PI*Math.atan(.5*(Math.exp(n)-Math.exp(-n)))},ne=(e,r,n)=>(I==="custom"?F??a.TILE_URLS.openstreetmap:a.TILE_URLS[I]).replace("{x}",String(e)).replace("{y}",String(r)).replace("{z}",String(n)),se=l.useMemo(()=>{const e=E.current,r=(e==null?void 0:e.clientWidth)??(typeof g=="number"?g:800),n=typeof p=="number"?p:400,o=Math.round(t.zoom),i=y(t.lng,o),b=m(t.lat,o),d=Math.ceil(r/a.TILE_SIZE)+2,h=Math.ceil(n/a.TILE_SIZE)+2,u=Math.pow(2,o),T=[];for(let Z=-Math.floor(d/2);Z<=Math.ceil(d/2);Z++)for(let k=-Math.floor(h/2);k<=Math.ceil(h/2);k++){const q=Math.floor(i)+Z,_=Math.floor(b)+k;if(_<0||_>=u)continue;const ge=(q%u+u)%u,pe=r/2+(q-i)*a.TILE_SIZE,he=n/2+(_-b)*a.TILE_SIZE;T.push({x:ge,y:_,z:o,px:pe,py:he})}return T},[t.lat,t.lng,t.zoom,g,p]),le=l.useMemo(()=>{const e=E.current,r=(e==null?void 0:e.clientWidth)??(typeof g=="number"?g:800),n=typeof p=="number"?p:400,o=t.zoom,i=y(t.lng,o),b=m(t.lat,o);return O.map(d=>{const h=y(d.lng,o),u=m(d.lat,o);return{marker:d,px:r/2+(h-i)*a.TILE_SIZE,py:n/2+(u-b)*a.TILE_SIZE}})},[O,t,g,p]),be=l.useCallback(e=>{X&&(U(!0),Y({x:e.clientX,y:e.clientY}),A({...t}))},[X,t]),ce=l.useCallback(e=>{if(!R||!S||!M)return;const r=e.clientX-S.x,n=e.clientY-S.y,o=M.zoom,i=y(M.lng,o)-r/a.TILE_SIZE,b=m(M.lat,o)-n/a.TILE_SIZE;c({lat:W(b,o),lng:P(i,o),zoom:o})},[R,S,M,c]),K=l.useCallback(()=>{U(!1),Y(null),A(null)},[]),ie=l.useCallback(e=>{if(!N)return;e.preventDefault();const r=e.deltaY>0?-.5:.5;c({...t,zoom:t.zoom+r})},[N,t,c]),de=l.useCallback(e=>{D&&(e.preventDefault(),c({...t,zoom:t.zoom+1}))},[D,t,c]),ue=l.useCallback(e=>{if(!z)return;const r=E.current;if(!r)return;const n=r.getBoundingClientRect(),o=e.clientX-n.left,i=e.clientY-n.top,b=t.zoom,d=y(t.lng,b),h=m(t.lat,b),u=d+(o-r.clientWidth/2)/a.TILE_SIZE,T=h+(i-r.clientHeight/2)/a.TILE_SIZE;z(W(T,b),P(u,b))},[z,t]),H=I!=="custom"?a.TILE_ATTRIBUTIONS[I]:"";return s.jsxs("div",{ref:E,className:x.cn("bear-relative bear-overflow-hidden bear-rounded-lg bear-select-none","bear-border bear-border-gray-200 dark:bear-border-gray-700",R?"bear-cursor-grabbing":"bear-cursor-grab",Q),style:{width:g,height:p,...V},onMouseDown:be,onMouseMove:ce,onMouseUp:K,onMouseLeave:K,onWheel:ie,onDoubleClick:de,onClick:ue,"data-testid":ee,role:"application","aria-label":"Interactive map",children:[s.jsx("div",{className:"bear-absolute bear-inset-0 bear-overflow-hidden",children:se.map(e=>s.jsx("img",{src:ne(e.x,e.y,e.z),alt:"",className:"bear-absolute bear-pointer-events-none",style:{left:e.px,top:e.py,width:a.TILE_SIZE,height:a.TILE_SIZE},loading:"lazy",draggable:!1},`${e.z}-${e.x}-${e.y}`))}),le.map(({marker:e,px:r,py:n})=>s.jsxs("div",{className:"bear-absolute bear-z-10 bear-pointer-events-auto",style:{left:r-a.MARKER_SIZE/2,top:n-a.MARKER_SIZE,width:a.MARKER_SIZE,height:a.MARKER_SIZE},onClick:o=>{o.stopPropagation(),oe(B===e.id?null:e.id),w==null||w(e)},onMouseEnter:()=>C(e.id),onMouseLeave:()=>C(null),children:[e.icon?s.jsx("div",{className:"bear-text-2xl bear-flex bear-items-center bear-justify-center bear-w-full bear-h-full",children:e.icon}):s.jsxs("svg",{width:a.MARKER_SIZE,height:a.MARKER_SIZE,viewBox:"0 0 32 42",fill:"none",children:[s.jsx("path",{d:"M16 0C7.16 0 0 7.16 0 16c0 12 16 26 16 26s16-14 16-26C32 7.16 24.84 0 16 0z",fill:e.color??a.DEFAULT_MARKER_COLOR,className:x.cn("bear-transition-all bear-duration-200",re===e.id&&"bear-drop-shadow-lg")}),s.jsx("circle",{cx:"16",cy:"15",r:"6",fill:"white"})]}),e.label&&s.jsx("div",{className:x.cn("bear-absolute bear-left-1/2 bear--translate-x-1/2 bear-top-full bear-mt-1","bear-bg-white dark:bear-bg-gray-800 bear-text-xs bear-font-medium","bear-px-2 bear-py-0.5 bear-rounded bear-shadow-md bear-whitespace-nowrap","bear-text-gray-800 dark:bear-text-gray-200","bear-border bear-border-gray-200 dark:bear-border-gray-600"),children:e.label}),B===e.id&&e.popup&&s.jsx("div",{className:x.cn("bear-absolute bear-left-1/2 bear--translate-x-1/2 bear-bottom-full bear-mb-2","bear-bg-white dark:bear-bg-gray-800 bear-rounded-lg bear-shadow-xl","bear-p-3 bear-min-w-[150px] bear-max-w-[250px]","bear-border bear-border-gray-200 dark:bear-border-gray-600","bear-z-20"),onClick:o=>o.stopPropagation(),children:e.popup})]},e.id)),G&&s.jsxs("div",{className:"bear-absolute bear-top-3 bear-right-3 bear-z-20 bear-flex bear-flex-col bear-gap-1",children:[s.jsx("button",{onClick:e=>{e.stopPropagation(),c({...t,zoom:t.zoom+1})},disabled:t.zoom>=j,className:x.cn("bear-flex bear-items-center bear-justify-center bear-rounded-md","bear-bg-white dark:bear-bg-gray-800 bear-shadow-md","bear-text-gray-700 dark:bear-text-gray-200","hover:bear-bg-gray-50 dark:hover:bear-bg-gray-700","bear-border bear-border-gray-200 dark:bear-border-gray-600","bear-transition-colors bear-duration-150","disabled:bear-opacity-50 disabled:bear-cursor-not-allowed"),style:{width:a.ZOOM_BUTTON_SIZE,height:a.ZOOM_BUTTON_SIZE},"aria-label":"Zoom in",children:s.jsx("svg",{className:"bear-w-4 bear-h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:s.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 4v16m8-8H4"})})}),s.jsx("button",{onClick:e=>{e.stopPropagation(),c({...t,zoom:t.zoom-1})},disabled:t.zoom<=L,className:x.cn("bear-flex bear-items-center bear-justify-center bear-rounded-md","bear-bg-white dark:bear-bg-gray-800 bear-shadow-md","bear-text-gray-700 dark:bear-text-gray-200","hover:bear-bg-gray-50 dark:hover:bear-bg-gray-700","bear-border bear-border-gray-200 dark:bear-border-gray-600","bear-transition-colors bear-duration-150","disabled:bear-opacity-50 disabled:bear-cursor-not-allowed"),style:{width:a.ZOOM_BUTTON_SIZE,height:a.ZOOM_BUTTON_SIZE},"aria-label":"Zoom out",children:s.jsx("svg",{className:"bear-w-4 bear-h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:s.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M20 12H4"})})})]}),J&&H&&s.jsx("div",{className:"bear-absolute bear-bottom-1 bear-right-1 bear-z-20 bear-text-[10px] bear-text-gray-500 bear-bg-white/80 dark:bear-bg-gray-900/80 bear-px-1.5 bear-py-0.5 bear-rounded",children:H})]})};exports.Map=xe;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={lat:40.7128,lng:-74.006,zoom:10},e="var(--bear-primary-500)",a=32,r=1,n=19,o=256,s={openstreetmap:"https://tile.openstreetmap.org/{z}/{x}/{y}.png","cartodb-light":"https://basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png","cartodb-dark":"https://basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png","stamen-terrain":"https://tiles.stadiamaps.com/tiles/stamen_terrain/{z}/{x}/{y}.png"},p={openstreetmap:"© OpenStreetMap contributors","cartodb-light":"© CartoDB © OpenStreetMap","cartodb-dark":"© CartoDB © OpenStreetMap","stamen-terrain":"© Stamen Design © OpenStreetMap"},O=36;exports.DEFAULT_MARKER_COLOR=e;exports.DEFAULT_VIEWPORT=t;exports.MARKER_SIZE=a;exports.MAX_ZOOM=n;exports.MIN_ZOOM=r;exports.TILE_ATTRIBUTIONS=p;exports.TILE_SIZE=o;exports.TILE_URLS=s;exports.ZOOM_BUTTON_SIZE=O;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { MapViewport, MapTileProvider } from './Map.types';
|
|
2
|
+
/** Default viewport - centered on the world */
|
|
3
|
+
export declare const DEFAULT_VIEWPORT: MapViewport;
|
|
4
|
+
/** Default marker color */
|
|
5
|
+
export declare const DEFAULT_MARKER_COLOR = "var(--bear-primary-500)";
|
|
6
|
+
/** Default marker size in px */
|
|
7
|
+
export declare const MARKER_SIZE = 32;
|
|
8
|
+
/** Marker pulse animation size in px */
|
|
9
|
+
export declare const MARKER_PULSE_SIZE = 48;
|
|
10
|
+
/** Min/Max zoom levels */
|
|
11
|
+
export declare const MIN_ZOOM = 1;
|
|
12
|
+
export declare const MAX_ZOOM = 19;
|
|
13
|
+
/** Tile size in px */
|
|
14
|
+
export declare const TILE_SIZE = 256;
|
|
15
|
+
/** Tile URL templates for providers */
|
|
16
|
+
export declare const TILE_URLS: Record<Exclude<MapTileProvider, 'custom'>, string>;
|
|
17
|
+
/** Attribution text for providers */
|
|
18
|
+
export declare const TILE_ATTRIBUTIONS: Record<Exclude<MapTileProvider, 'custom'>, string>;
|
|
19
|
+
/** Zoom button size */
|
|
20
|
+
export declare const ZOOM_BUTTON_SIZE = 36;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
const t = {
|
|
2
|
+
lat: 40.7128,
|
|
3
|
+
lng: -74.006,
|
|
4
|
+
zoom: 10
|
|
5
|
+
}, a = "var(--bear-primary-500)", e = 32, n = 1, r = 19, o = 256, s = {
|
|
6
|
+
openstreetmap: "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
|
|
7
|
+
"cartodb-light": "https://basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png",
|
|
8
|
+
"cartodb-dark": "https://basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png",
|
|
9
|
+
"stamen-terrain": "https://tiles.stadiamaps.com/tiles/stamen_terrain/{z}/{x}/{y}.png"
|
|
10
|
+
}, p = {
|
|
11
|
+
openstreetmap: "© OpenStreetMap contributors",
|
|
12
|
+
"cartodb-light": "© CartoDB © OpenStreetMap",
|
|
13
|
+
"cartodb-dark": "© CartoDB © OpenStreetMap",
|
|
14
|
+
"stamen-terrain": "© Stamen Design © OpenStreetMap"
|
|
15
|
+
}, c = 36;
|
|
16
|
+
export {
|
|
17
|
+
a as DEFAULT_MARKER_COLOR,
|
|
18
|
+
t as DEFAULT_VIEWPORT,
|
|
19
|
+
e as MARKER_SIZE,
|
|
20
|
+
r as MAX_ZOOM,
|
|
21
|
+
n as MIN_ZOOM,
|
|
22
|
+
p as TILE_ATTRIBUTIONS,
|
|
23
|
+
o as TILE_SIZE,
|
|
24
|
+
s as TILE_URLS,
|
|
25
|
+
c as ZOOM_BUTTON_SIZE
|
|
26
|
+
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { MapProps } from './Map.types';
|
|
3
|
+
/**
|
|
4
|
+
* Map - Interactive map component with markers, zoom, and tile providers
|
|
5
|
+
*
|
|
6
|
+
* @description
|
|
7
|
+
* Zero-dependency interactive map built on OpenStreetMap tiles.
|
|
8
|
+
* Supports markers, drag, zoom, and multiple tile providers.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* <Map
|
|
13
|
+
* markers={[{ id: '1', lat: 40.71, lng: -74.00, label: 'NYC' }]}
|
|
14
|
+
* viewport={{ lat: 40.71, lng: -74.00, zoom: 12 }}
|
|
15
|
+
* onMarkerClick={(m) => console.log(m.label)}
|
|
16
|
+
* height={400}
|
|
17
|
+
* />
|
|
18
|
+
* ```
|
|
19
|
+
*/
|
|
20
|
+
export declare const Map: FC<MapProps>;
|
|
@@ -0,0 +1,259 @@
|
|
|
1
|
+
import { jsxs as L, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as we, useState as m, useCallback as p, useMemo as Q } from "react";
|
|
3
|
+
import { cn as y } from "../../utils/cn.js";
|
|
4
|
+
import { DEFAULT_VIEWPORT as ze, MIN_ZOOM as Te, MAX_ZOOM as Ie, TILE_SIZE as l, TILE_ATTRIBUTIONS as Ne, MARKER_SIZE as f, DEFAULT_MARKER_COLOR as ke, ZOOM_BUTTON_SIZE as D, TILE_URLS as V } from "./Map.const.js";
|
|
5
|
+
const Re = ({
|
|
6
|
+
markers: U = [],
|
|
7
|
+
viewport: ee,
|
|
8
|
+
controlledViewport: S,
|
|
9
|
+
onViewportChange: w,
|
|
10
|
+
onMarkerClick: X,
|
|
11
|
+
onMapClick: E,
|
|
12
|
+
onMarkerDrag: Le,
|
|
13
|
+
tileProvider: z = "openstreetmap",
|
|
14
|
+
customTileUrl: re,
|
|
15
|
+
width: u = "100%",
|
|
16
|
+
height: g = 400,
|
|
17
|
+
showZoomControls: ae = !0,
|
|
18
|
+
showAttribution: te = !0,
|
|
19
|
+
scrollWheelZoom: W = !0,
|
|
20
|
+
doubleClickZoom: j = !0,
|
|
21
|
+
draggable: A = !0,
|
|
22
|
+
minZoom: R = Te,
|
|
23
|
+
maxZoom: Y = Ie,
|
|
24
|
+
className: oe,
|
|
25
|
+
style: ne,
|
|
26
|
+
testId: le
|
|
27
|
+
}) => {
|
|
28
|
+
const T = we(null), [se, be] = m(
|
|
29
|
+
ee ?? ze
|
|
30
|
+
), [_, B] = m(!1), [I, C] = m(null), [M, H] = m(null), [ce, $] = m(null), [F, ie] = m(null), r = S ?? se, b = p(
|
|
31
|
+
(e) => {
|
|
32
|
+
const a = {
|
|
33
|
+
...e,
|
|
34
|
+
zoom: Math.max(R, Math.min(Y, e.zoom)),
|
|
35
|
+
lat: Math.max(-85, Math.min(85, e.lat)),
|
|
36
|
+
lng: ((e.lng + 180) % 360 + 360) % 360 - 180
|
|
37
|
+
};
|
|
38
|
+
S || be(a), w == null || w(a);
|
|
39
|
+
},
|
|
40
|
+
[S, w, R, Y]
|
|
41
|
+
), x = (e, a) => (e + 180) / 360 * Math.pow(2, a), v = (e, a) => {
|
|
42
|
+
const o = e * Math.PI / 180;
|
|
43
|
+
return (1 - Math.log(Math.tan(o) + 1 / Math.cos(o)) / Math.PI) / 2 * Math.pow(2, a);
|
|
44
|
+
}, K = (e, a) => e / Math.pow(2, a) * 360 - 180, Z = (e, a) => {
|
|
45
|
+
const o = Math.PI - 2 * Math.PI * e / Math.pow(2, a);
|
|
46
|
+
return 180 / Math.PI * Math.atan(0.5 * (Math.exp(o) - Math.exp(-o)));
|
|
47
|
+
}, de = (e, a, o) => (z === "custom" ? re ?? V.openstreetmap : V[z]).replace("{x}", String(e)).replace("{y}", String(a)).replace("{z}", String(o)), ue = Q(() => {
|
|
48
|
+
const e = T.current, a = (e == null ? void 0 : e.clientWidth) ?? (typeof u == "number" ? u : 800), o = typeof g == "number" ? g : 400, t = Math.round(r.zoom), c = x(r.lng, t), s = v(r.lat, t), i = Math.ceil(a / l) + 2, h = Math.ceil(o / l) + 2, d = Math.pow(2, t), N = [];
|
|
49
|
+
for (let O = -Math.floor(i / 2); O <= Math.ceil(i / 2); O++)
|
|
50
|
+
for (let P = -Math.floor(h / 2); P <= Math.ceil(h / 2); P++) {
|
|
51
|
+
const J = Math.floor(c) + O, k = Math.floor(s) + P;
|
|
52
|
+
if (k < 0 || k >= d) continue;
|
|
53
|
+
const Me = (J % d + d) % d, xe = a / 2 + (J - c) * l, ve = o / 2 + (k - s) * l;
|
|
54
|
+
N.push({ x: Me, y: k, z: t, px: xe, py: ve });
|
|
55
|
+
}
|
|
56
|
+
return N;
|
|
57
|
+
}, [r.lat, r.lng, r.zoom, u, g]), ge = Q(() => {
|
|
58
|
+
const e = T.current, a = (e == null ? void 0 : e.clientWidth) ?? (typeof u == "number" ? u : 800), o = typeof g == "number" ? g : 400, t = r.zoom, c = x(r.lng, t), s = v(r.lat, t);
|
|
59
|
+
return U.map((i) => {
|
|
60
|
+
const h = x(i.lng, t), d = v(i.lat, t);
|
|
61
|
+
return {
|
|
62
|
+
marker: i,
|
|
63
|
+
px: a / 2 + (h - c) * l,
|
|
64
|
+
py: o / 2 + (d - s) * l
|
|
65
|
+
};
|
|
66
|
+
});
|
|
67
|
+
}, [U, r, u, g]), pe = p(
|
|
68
|
+
(e) => {
|
|
69
|
+
A && (B(!0), C({ x: e.clientX, y: e.clientY }), H({ ...r }));
|
|
70
|
+
},
|
|
71
|
+
[A, r]
|
|
72
|
+
), he = p(
|
|
73
|
+
(e) => {
|
|
74
|
+
if (!_ || !I || !M) return;
|
|
75
|
+
const a = e.clientX - I.x, o = e.clientY - I.y, t = M.zoom, c = x(M.lng, t) - a / l, s = v(M.lat, t) - o / l;
|
|
76
|
+
b({
|
|
77
|
+
lat: Z(s, t),
|
|
78
|
+
lng: K(c, t),
|
|
79
|
+
zoom: t
|
|
80
|
+
});
|
|
81
|
+
},
|
|
82
|
+
[_, I, M, b]
|
|
83
|
+
), q = p(() => {
|
|
84
|
+
B(!1), C(null), H(null);
|
|
85
|
+
}, []), me = p(
|
|
86
|
+
(e) => {
|
|
87
|
+
if (!W) return;
|
|
88
|
+
e.preventDefault();
|
|
89
|
+
const a = e.deltaY > 0 ? -0.5 : 0.5;
|
|
90
|
+
b({ ...r, zoom: r.zoom + a });
|
|
91
|
+
},
|
|
92
|
+
[W, r, b]
|
|
93
|
+
), ye = p(
|
|
94
|
+
(e) => {
|
|
95
|
+
j && (e.preventDefault(), b({ ...r, zoom: r.zoom + 1 }));
|
|
96
|
+
},
|
|
97
|
+
[j, r, b]
|
|
98
|
+
), fe = p(
|
|
99
|
+
(e) => {
|
|
100
|
+
if (!E) return;
|
|
101
|
+
const a = T.current;
|
|
102
|
+
if (!a) return;
|
|
103
|
+
const o = a.getBoundingClientRect(), t = e.clientX - o.left, c = e.clientY - o.top, s = r.zoom, i = x(r.lng, s), h = v(r.lat, s), d = i + (t - a.clientWidth / 2) / l, N = h + (c - a.clientHeight / 2) / l;
|
|
104
|
+
E(Z(N, s), K(d, s));
|
|
105
|
+
},
|
|
106
|
+
[E, r]
|
|
107
|
+
), G = z !== "custom" ? Ne[z] : "";
|
|
108
|
+
return /* @__PURE__ */ L(
|
|
109
|
+
"div",
|
|
110
|
+
{
|
|
111
|
+
ref: T,
|
|
112
|
+
className: y(
|
|
113
|
+
"bear-relative bear-overflow-hidden bear-rounded-lg bear-select-none",
|
|
114
|
+
"bear-border bear-border-gray-200 dark:bear-border-gray-700",
|
|
115
|
+
_ ? "bear-cursor-grabbing" : "bear-cursor-grab",
|
|
116
|
+
oe
|
|
117
|
+
),
|
|
118
|
+
style: { width: u, height: g, ...ne },
|
|
119
|
+
onMouseDown: pe,
|
|
120
|
+
onMouseMove: he,
|
|
121
|
+
onMouseUp: q,
|
|
122
|
+
onMouseLeave: q,
|
|
123
|
+
onWheel: me,
|
|
124
|
+
onDoubleClick: ye,
|
|
125
|
+
onClick: fe,
|
|
126
|
+
"data-testid": le,
|
|
127
|
+
role: "application",
|
|
128
|
+
"aria-label": "Interactive map",
|
|
129
|
+
children: [
|
|
130
|
+
/* @__PURE__ */ n("div", { className: "bear-absolute bear-inset-0 bear-overflow-hidden", children: ue.map((e) => /* @__PURE__ */ n(
|
|
131
|
+
"img",
|
|
132
|
+
{
|
|
133
|
+
src: de(e.x, e.y, e.z),
|
|
134
|
+
alt: "",
|
|
135
|
+
className: "bear-absolute bear-pointer-events-none",
|
|
136
|
+
style: {
|
|
137
|
+
left: e.px,
|
|
138
|
+
top: e.py,
|
|
139
|
+
width: l,
|
|
140
|
+
height: l
|
|
141
|
+
},
|
|
142
|
+
loading: "lazy",
|
|
143
|
+
draggable: !1
|
|
144
|
+
},
|
|
145
|
+
`${e.z}-${e.x}-${e.y}`
|
|
146
|
+
)) }),
|
|
147
|
+
ge.map(({ marker: e, px: a, py: o }) => /* @__PURE__ */ L(
|
|
148
|
+
"div",
|
|
149
|
+
{
|
|
150
|
+
className: "bear-absolute bear-z-10 bear-pointer-events-auto",
|
|
151
|
+
style: {
|
|
152
|
+
left: a - f / 2,
|
|
153
|
+
top: o - f,
|
|
154
|
+
width: f,
|
|
155
|
+
height: f
|
|
156
|
+
},
|
|
157
|
+
onClick: (t) => {
|
|
158
|
+
t.stopPropagation(), ie(F === e.id ? null : e.id), X == null || X(e);
|
|
159
|
+
},
|
|
160
|
+
onMouseEnter: () => $(e.id),
|
|
161
|
+
onMouseLeave: () => $(null),
|
|
162
|
+
children: [
|
|
163
|
+
e.icon ? /* @__PURE__ */ n("div", { className: "bear-text-2xl bear-flex bear-items-center bear-justify-center bear-w-full bear-h-full", children: e.icon }) : /* @__PURE__ */ L("svg", { width: f, height: f, viewBox: "0 0 32 42", fill: "none", children: [
|
|
164
|
+
/* @__PURE__ */ n(
|
|
165
|
+
"path",
|
|
166
|
+
{
|
|
167
|
+
d: "M16 0C7.16 0 0 7.16 0 16c0 12 16 26 16 26s16-14 16-26C32 7.16 24.84 0 16 0z",
|
|
168
|
+
fill: e.color ?? ke,
|
|
169
|
+
className: y(
|
|
170
|
+
"bear-transition-all bear-duration-200",
|
|
171
|
+
ce === e.id && "bear-drop-shadow-lg"
|
|
172
|
+
)
|
|
173
|
+
}
|
|
174
|
+
),
|
|
175
|
+
/* @__PURE__ */ n("circle", { cx: "16", cy: "15", r: "6", fill: "white" })
|
|
176
|
+
] }),
|
|
177
|
+
e.label && /* @__PURE__ */ n(
|
|
178
|
+
"div",
|
|
179
|
+
{
|
|
180
|
+
className: y(
|
|
181
|
+
"bear-absolute bear-left-1/2 bear--translate-x-1/2 bear-top-full bear-mt-1",
|
|
182
|
+
"bear-bg-white dark:bear-bg-gray-800 bear-text-xs bear-font-medium",
|
|
183
|
+
"bear-px-2 bear-py-0.5 bear-rounded bear-shadow-md bear-whitespace-nowrap",
|
|
184
|
+
"bear-text-gray-800 dark:bear-text-gray-200",
|
|
185
|
+
"bear-border bear-border-gray-200 dark:bear-border-gray-600"
|
|
186
|
+
),
|
|
187
|
+
children: e.label
|
|
188
|
+
}
|
|
189
|
+
),
|
|
190
|
+
F === e.id && e.popup && /* @__PURE__ */ n(
|
|
191
|
+
"div",
|
|
192
|
+
{
|
|
193
|
+
className: y(
|
|
194
|
+
"bear-absolute bear-left-1/2 bear--translate-x-1/2 bear-bottom-full bear-mb-2",
|
|
195
|
+
"bear-bg-white dark:bear-bg-gray-800 bear-rounded-lg bear-shadow-xl",
|
|
196
|
+
"bear-p-3 bear-min-w-[150px] bear-max-w-[250px]",
|
|
197
|
+
"bear-border bear-border-gray-200 dark:bear-border-gray-600",
|
|
198
|
+
"bear-z-20"
|
|
199
|
+
),
|
|
200
|
+
onClick: (t) => t.stopPropagation(),
|
|
201
|
+
children: e.popup
|
|
202
|
+
}
|
|
203
|
+
)
|
|
204
|
+
]
|
|
205
|
+
},
|
|
206
|
+
e.id
|
|
207
|
+
)),
|
|
208
|
+
ae && /* @__PURE__ */ L("div", { className: "bear-absolute bear-top-3 bear-right-3 bear-z-20 bear-flex bear-flex-col bear-gap-1", children: [
|
|
209
|
+
/* @__PURE__ */ n(
|
|
210
|
+
"button",
|
|
211
|
+
{
|
|
212
|
+
onClick: (e) => {
|
|
213
|
+
e.stopPropagation(), b({ ...r, zoom: r.zoom + 1 });
|
|
214
|
+
},
|
|
215
|
+
disabled: r.zoom >= Y,
|
|
216
|
+
className: y(
|
|
217
|
+
"bear-flex bear-items-center bear-justify-center bear-rounded-md",
|
|
218
|
+
"bear-bg-white dark:bear-bg-gray-800 bear-shadow-md",
|
|
219
|
+
"bear-text-gray-700 dark:bear-text-gray-200",
|
|
220
|
+
"hover:bear-bg-gray-50 dark:hover:bear-bg-gray-700",
|
|
221
|
+
"bear-border bear-border-gray-200 dark:bear-border-gray-600",
|
|
222
|
+
"bear-transition-colors bear-duration-150",
|
|
223
|
+
"disabled:bear-opacity-50 disabled:bear-cursor-not-allowed"
|
|
224
|
+
),
|
|
225
|
+
style: { width: D, height: D },
|
|
226
|
+
"aria-label": "Zoom in",
|
|
227
|
+
children: /* @__PURE__ */ n("svg", { className: "bear-w-4 bear-h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ n("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 4v16m8-8H4" }) })
|
|
228
|
+
}
|
|
229
|
+
),
|
|
230
|
+
/* @__PURE__ */ n(
|
|
231
|
+
"button",
|
|
232
|
+
{
|
|
233
|
+
onClick: (e) => {
|
|
234
|
+
e.stopPropagation(), b({ ...r, zoom: r.zoom - 1 });
|
|
235
|
+
},
|
|
236
|
+
disabled: r.zoom <= R,
|
|
237
|
+
className: y(
|
|
238
|
+
"bear-flex bear-items-center bear-justify-center bear-rounded-md",
|
|
239
|
+
"bear-bg-white dark:bear-bg-gray-800 bear-shadow-md",
|
|
240
|
+
"bear-text-gray-700 dark:bear-text-gray-200",
|
|
241
|
+
"hover:bear-bg-gray-50 dark:hover:bear-bg-gray-700",
|
|
242
|
+
"bear-border bear-border-gray-200 dark:bear-border-gray-600",
|
|
243
|
+
"bear-transition-colors bear-duration-150",
|
|
244
|
+
"disabled:bear-opacity-50 disabled:bear-cursor-not-allowed"
|
|
245
|
+
),
|
|
246
|
+
style: { width: D, height: D },
|
|
247
|
+
"aria-label": "Zoom out",
|
|
248
|
+
children: /* @__PURE__ */ n("svg", { className: "bear-w-4 bear-h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ n("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M20 12H4" }) })
|
|
249
|
+
}
|
|
250
|
+
)
|
|
251
|
+
] }),
|
|
252
|
+
te && G && /* @__PURE__ */ n("div", { className: "bear-absolute bear-bottom-1 bear-right-1 bear-z-20 bear-text-[10px] bear-text-gray-500 bear-bg-white/80 dark:bear-bg-gray-900/80 bear-px-1.5 bear-py-0.5 bear-rounded", children: G })
|
|
253
|
+
]
|
|
254
|
+
}
|
|
255
|
+
);
|
|
256
|
+
};
|
|
257
|
+
export {
|
|
258
|
+
Re as Map
|
|
259
|
+
};
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Marker to display on the map
|
|
4
|
+
*/
|
|
5
|
+
export interface MapMarker {
|
|
6
|
+
/** Unique identifier */
|
|
7
|
+
id: string;
|
|
8
|
+
/** Latitude coordinate */
|
|
9
|
+
lat: number;
|
|
10
|
+
/** Longitude coordinate */
|
|
11
|
+
lng: number;
|
|
12
|
+
/** Marker label */
|
|
13
|
+
label?: string;
|
|
14
|
+
/** Marker color */
|
|
15
|
+
color?: string;
|
|
16
|
+
/** Custom icon (emoji or ReactNode) */
|
|
17
|
+
icon?: ReactNode;
|
|
18
|
+
/** Popup content on click */
|
|
19
|
+
popup?: ReactNode;
|
|
20
|
+
/** Whether this marker is draggable */
|
|
21
|
+
draggable?: boolean;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Map viewport configuration
|
|
25
|
+
*/
|
|
26
|
+
export interface MapViewport {
|
|
27
|
+
/** Center latitude */
|
|
28
|
+
lat: number;
|
|
29
|
+
/** Center longitude */
|
|
30
|
+
lng: number;
|
|
31
|
+
/** Zoom level (1-20) */
|
|
32
|
+
zoom: number;
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* Map tile provider
|
|
36
|
+
*/
|
|
37
|
+
export type MapTileProvider = 'openstreetmap' | 'cartodb-light' | 'cartodb-dark' | 'stamen-terrain' | 'custom';
|
|
38
|
+
export interface MapProps {
|
|
39
|
+
/** Map markers */
|
|
40
|
+
markers?: MapMarker[];
|
|
41
|
+
/** Initial viewport */
|
|
42
|
+
viewport?: MapViewport;
|
|
43
|
+
/** Current viewport (controlled) */
|
|
44
|
+
controlledViewport?: MapViewport;
|
|
45
|
+
/** Called when viewport changes */
|
|
46
|
+
onViewportChange?: (viewport: MapViewport) => void;
|
|
47
|
+
/** Called when a marker is clicked */
|
|
48
|
+
onMarkerClick?: (marker: MapMarker) => void;
|
|
49
|
+
/** Called when the map is clicked */
|
|
50
|
+
onMapClick?: (lat: number, lng: number) => void;
|
|
51
|
+
/** Called when a marker is dragged */
|
|
52
|
+
onMarkerDrag?: (marker: MapMarker, lat: number, lng: number) => void;
|
|
53
|
+
/** Map tile provider */
|
|
54
|
+
tileProvider?: MapTileProvider;
|
|
55
|
+
/** Custom tile URL template (for 'custom' provider) */
|
|
56
|
+
customTileUrl?: string;
|
|
57
|
+
/** Map width */
|
|
58
|
+
width?: string | number;
|
|
59
|
+
/** Map height */
|
|
60
|
+
height?: string | number;
|
|
61
|
+
/** Show zoom controls */
|
|
62
|
+
showZoomControls?: boolean;
|
|
63
|
+
/** Show attribution */
|
|
64
|
+
showAttribution?: boolean;
|
|
65
|
+
/** Enable scroll wheel zoom */
|
|
66
|
+
scrollWheelZoom?: boolean;
|
|
67
|
+
/** Enable double-click zoom */
|
|
68
|
+
doubleClickZoom?: boolean;
|
|
69
|
+
/** Enable dragging */
|
|
70
|
+
draggable?: boolean;
|
|
71
|
+
/** Min zoom level */
|
|
72
|
+
minZoom?: number;
|
|
73
|
+
/** Max zoom level */
|
|
74
|
+
maxZoom?: number;
|
|
75
|
+
/** Custom class name */
|
|
76
|
+
className?: string;
|
|
77
|
+
/** Custom styles */
|
|
78
|
+
style?: CSSProperties;
|
|
79
|
+
/** Test ID */
|
|
80
|
+
testId?: string;
|
|
81
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),e=require("react"),l=require("../../utils/cn.cjs"),o=require("./Marquee.const.cjs"),j=m=>{const{children:b,direction:u="left",speed:q=o.DEFAULT_SPEED,pauseOnHover:r=!1,pauseOnClick:h=!1,play:n=!0,gradient:M=!1,gradientWidth:v=o.DEFAULT_GRADIENT_WIDTH,gap:d=o.DEFAULT_GAP,className:g,style:x,testId:E}=m,t=e.useRef(null),[_,k]=e.useState(0),[C,y]=e.useState(0),[N,s]=e.useState(!n);e.useEffect(()=>{s(!n)},[n]);const f=e.useCallback(()=>{t.current&&(k(t.current.scrollWidth),y(t.current.scrollHeight))},[]);e.useEffect(()=>{f();const c=new ResizeObserver(f);return t.current&&c.observe(t.current),()=>c.disconnect()},[f]);const a=u==="left"||u==="right",p=(a?_:C)/q,A=o.MARQUEE_ANIMATION[u],R=e.useCallback(()=>{r&&s(!0)},[r]),S=e.useCallback(()=>{r&&n&&s(!1)},[r,n]),T=e.useCallback(()=>{h&&s(c=>!c)},[h]);return i.jsx("div",{className:l.cn("Bear-Marquee","bear-overflow-hidden bear-relative",M&&a&&"Bear-Marquee--gradient-h",M&&!a&&"Bear-Marquee--gradient-v",g),style:{"--bear-marquee-gradient-w":`${v}px`,...x},onMouseEnter:R,onMouseLeave:S,onClick:T,"data-testid":E,role:"marquee","aria-live":"off",children:i.jsxs("div",{className:l.cn("Bear-Marquee__track","bear-flex bear-w-max",!a&&"bear-flex-col"),style:{gap:d,animation:`${A} ${p}s linear infinite`,animationPlayState:N?"paused":"running"},children:[i.jsx("div",{ref:t,className:l.cn("Bear-Marquee__content","bear-flex bear-shrink-0",!a&&"bear-flex-col"),style:{gap:d},children:b}),i.jsx("div",{className:l.cn("Bear-Marquee__content","bear-flex bear-shrink-0",!a&&"bear-flex-col"),style:{gap:d},"aria-hidden":"true",children:b})]})})};exports.Marquee=j;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=50,A=40,E=24,r={left:"bear-marquee-left",right:"bear-marquee-right",up:"bear-marquee-up",down:"bear-marquee-down"};exports.DEFAULT_GAP=E;exports.DEFAULT_GRADIENT_WIDTH=A;exports.DEFAULT_SPEED=e;exports.MARQUEE_ANIMATION=r;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { MarqueeDirection } from './Marquee.types';
|
|
2
|
+
/** Default speed in pixels per second */
|
|
3
|
+
export declare const DEFAULT_SPEED = 50;
|
|
4
|
+
/** Default gradient width in pixels */
|
|
5
|
+
export declare const DEFAULT_GRADIENT_WIDTH = 40;
|
|
6
|
+
/** Default gap between items in pixels */
|
|
7
|
+
export declare const DEFAULT_GAP = 24;
|
|
8
|
+
/** Animation name per direction */
|
|
9
|
+
export declare const MARQUEE_ANIMATION: Record<MarqueeDirection, string>;
|
|
10
|
+
/** Full content duplication count for seamless loop */
|
|
11
|
+
export declare const DUPLICATE_COUNT = 1;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
const e = 50, r = 40, t = 24, a = {
|
|
2
|
+
left: "bear-marquee-left",
|
|
3
|
+
right: "bear-marquee-right",
|
|
4
|
+
up: "bear-marquee-up",
|
|
5
|
+
down: "bear-marquee-down"
|
|
6
|
+
};
|
|
7
|
+
export {
|
|
8
|
+
t as DEFAULT_GAP,
|
|
9
|
+
r as DEFAULT_GRADIENT_WIDTH,
|
|
10
|
+
e as DEFAULT_SPEED,
|
|
11
|
+
a as MARQUEE_ANIMATION
|
|
12
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { MarqueeProps } from './Marquee.types';
|
|
3
|
+
/**
|
|
4
|
+
* Marquee - Infinite scrolling content with smooth animation.
|
|
5
|
+
* Supports pause-on-hover, gradient edges, and theming via BearProvider.
|
|
6
|
+
*/
|
|
7
|
+
export declare const Marquee: FC<MarqueeProps>;
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
import { jsx as d, jsxs as T } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as L, useState as f, useEffect as v, useCallback as i } from "react";
|
|
3
|
+
import { cn as o } from "../../utils/cn.js";
|
|
4
|
+
import { DEFAULT_SPEED as P, DEFAULT_GRADIENT_WIDTH as R, DEFAULT_GAP as W, MARQUEE_ANIMATION as w } from "./Marquee.const.js";
|
|
5
|
+
const j = (M) => {
|
|
6
|
+
const {
|
|
7
|
+
children: m,
|
|
8
|
+
direction: c = "left",
|
|
9
|
+
speed: p = P,
|
|
10
|
+
pauseOnHover: a = !1,
|
|
11
|
+
pauseOnClick: h = !1,
|
|
12
|
+
play: r = !0,
|
|
13
|
+
gradient: b = !1,
|
|
14
|
+
gradientWidth: g = R,
|
|
15
|
+
gap: l = W,
|
|
16
|
+
className: x,
|
|
17
|
+
style: E,
|
|
18
|
+
testId: _
|
|
19
|
+
} = M, e = L(null), [q, N] = f(0), [A, k] = f(0), [y, n] = f(!r);
|
|
20
|
+
v(() => {
|
|
21
|
+
n(!r);
|
|
22
|
+
}, [r]);
|
|
23
|
+
const u = i(() => {
|
|
24
|
+
e.current && (N(e.current.scrollWidth), k(e.current.scrollHeight));
|
|
25
|
+
}, []);
|
|
26
|
+
v(() => {
|
|
27
|
+
u();
|
|
28
|
+
const s = new ResizeObserver(u);
|
|
29
|
+
return e.current && s.observe(e.current), () => s.disconnect();
|
|
30
|
+
}, [u]);
|
|
31
|
+
const t = c === "left" || c === "right", C = (t ? q : A) / p, B = w[c], D = i(() => {
|
|
32
|
+
a && n(!0);
|
|
33
|
+
}, [a]), H = i(() => {
|
|
34
|
+
a && r && n(!1);
|
|
35
|
+
}, [a, r]), I = i(() => {
|
|
36
|
+
h && n((s) => !s);
|
|
37
|
+
}, [h]);
|
|
38
|
+
return /* @__PURE__ */ d(
|
|
39
|
+
"div",
|
|
40
|
+
{
|
|
41
|
+
className: o(
|
|
42
|
+
"Bear-Marquee",
|
|
43
|
+
"bear-overflow-hidden bear-relative",
|
|
44
|
+
b && t && "Bear-Marquee--gradient-h",
|
|
45
|
+
b && !t && "Bear-Marquee--gradient-v",
|
|
46
|
+
x
|
|
47
|
+
),
|
|
48
|
+
style: {
|
|
49
|
+
"--bear-marquee-gradient-w": `${g}px`,
|
|
50
|
+
...E
|
|
51
|
+
},
|
|
52
|
+
onMouseEnter: D,
|
|
53
|
+
onMouseLeave: H,
|
|
54
|
+
onClick: I,
|
|
55
|
+
"data-testid": _,
|
|
56
|
+
role: "marquee",
|
|
57
|
+
"aria-live": "off",
|
|
58
|
+
children: /* @__PURE__ */ T(
|
|
59
|
+
"div",
|
|
60
|
+
{
|
|
61
|
+
className: o(
|
|
62
|
+
"Bear-Marquee__track",
|
|
63
|
+
"bear-flex bear-w-max",
|
|
64
|
+
!t && "bear-flex-col"
|
|
65
|
+
),
|
|
66
|
+
style: {
|
|
67
|
+
gap: l,
|
|
68
|
+
animation: `${B} ${C}s linear infinite`,
|
|
69
|
+
animationPlayState: y ? "paused" : "running"
|
|
70
|
+
},
|
|
71
|
+
children: [
|
|
72
|
+
/* @__PURE__ */ d(
|
|
73
|
+
"div",
|
|
74
|
+
{
|
|
75
|
+
ref: e,
|
|
76
|
+
className: o(
|
|
77
|
+
"Bear-Marquee__content",
|
|
78
|
+
"bear-flex bear-shrink-0",
|
|
79
|
+
!t && "bear-flex-col"
|
|
80
|
+
),
|
|
81
|
+
style: { gap: l },
|
|
82
|
+
children: m
|
|
83
|
+
}
|
|
84
|
+
),
|
|
85
|
+
/* @__PURE__ */ d(
|
|
86
|
+
"div",
|
|
87
|
+
{
|
|
88
|
+
className: o(
|
|
89
|
+
"Bear-Marquee__content",
|
|
90
|
+
"bear-flex bear-shrink-0",
|
|
91
|
+
!t && "bear-flex-col"
|
|
92
|
+
),
|
|
93
|
+
style: { gap: l },
|
|
94
|
+
"aria-hidden": "true",
|
|
95
|
+
children: m
|
|
96
|
+
}
|
|
97
|
+
)
|
|
98
|
+
]
|
|
99
|
+
}
|
|
100
|
+
)
|
|
101
|
+
}
|
|
102
|
+
);
|
|
103
|
+
};
|
|
104
|
+
export {
|
|
105
|
+
j as Marquee
|
|
106
|
+
};
|