@tetrascience-npm/tetrascience-react-ui 0.6.0-beta.93.1 → 0.6.0-beta.94.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/components/ui/resizable.cjs +1 -1
- package/dist/components/ui/resizable.cjs.map +1 -1
- package/dist/components/ui/resizable.js +27 -15
- package/dist/components/ui/resizable.js.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.ts +18 -0
- package/dist/index.tailwind.css +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),l=require("react-resizable-panels"),o=require("../../lib/utils.cjs");function s(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const n=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,n.get?n:{enumerable:!0,get:()=>e[a]})}}return t.default=e,Object.freeze(t)}const i=s(l);function
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),l=require("react-resizable-panels"),o=require("../../lib/utils.cjs");function s(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const n=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,n.get?n:{enumerable:!0,get:()=>e[a]})}}return t.default=e,Object.freeze(t)}const i=s(l);function f({className:e,...t}){return r.jsx(i.Group,{"data-slot":"resizable-panel-group",className:o.cn("flex h-full w-full aria-[orientation=vertical]:flex-col",e),...t})}function u({...e}){return r.jsx(i.Panel,{"data-slot":"resizable-panel",...e})}function c({withHandle:e,className:t,...a}){return r.jsx(i.Separator,{"data-slot":"resizable-handle","aria-label":"Resize",className:o.cn("relative flex shrink-0 items-center justify-center bg-transparent transition-colors ring-offset-background focus-visible:outline-hidden","w-px aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full","after:absolute after:w-3 after:inset-y-0 after:left-1/2 after:-translate-x-1/2","aria-[orientation=horizontal]:after:inset-y-auto aria-[orientation=horizontal]:after:inset-x-0 aria-[orientation=horizontal]:after:top-1/2 aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-3 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2","hover:bg-border active:bg-border focus-visible:bg-ring","hover:[&>div]:bg-border active:[&>div]:bg-border focus-visible:[&>div]:bg-ring","[&[aria-orientation=horizontal]>div]:rotate-90",t),...a,children:e&&r.jsx("div",{className:"z-10 flex h-6 w-1 shrink-0 rounded-lg bg-transparent transition-colors"})})}exports.ResizableHandle=c;exports.ResizablePanel=u;exports.ResizablePanelGroup=f;
|
|
2
2
|
//# sourceMappingURL=resizable.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resizable.cjs","sources":["../../../src/components/ui/resizable.tsx"],"sourcesContent":["import * as ResizablePrimitive from \"react-resizable-panels\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction ResizablePanelGroup({\n className,\n ...props\n}: ResizablePrimitive.GroupProps) {\n return (\n <ResizablePrimitive.Group\n data-slot=\"resizable-panel-group\"\n className={cn(\n \"flex h-full w-full aria-[orientation=vertical]:flex-col\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />\n}\n\nfunction ResizableHandle({\n withHandle,\n className,\n ...props\n}: ResizablePrimitive.SeparatorProps & {\n withHandle?: boolean\n}) {\n return (\n <ResizablePrimitive.Separator\n data-slot=\"resizable-handle\"\n className={cn(\n \"relative flex
|
|
1
|
+
{"version":3,"file":"resizable.cjs","sources":["../../../src/components/ui/resizable.tsx"],"sourcesContent":["import * as ResizablePrimitive from \"react-resizable-panels\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction ResizablePanelGroup({\n className,\n ...props\n}: ResizablePrimitive.GroupProps) {\n return (\n <ResizablePrimitive.Group\n data-slot=\"resizable-panel-group\"\n className={cn(\n \"flex h-full w-full aria-[orientation=vertical]:flex-col\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />\n}\n\n/**\n * Resize handle between two panels.\n *\n * The handle's layout footprint is a **1px divider that sits exactly on the\n * panel boundary**, so the divider, the grip, and the seam between the panels\n * all line up — regardless of the panels' backgrounds. A wide, transparent\n * **grab area** is layered on top via `::after` (it overlaps both panels by 6px\n * without taking layout space) so the handle can be grabbed anywhere in the gap,\n * not just on the hairline.\n *\n * The 1px divider — and the optional grip (`withHandle`) — stay hidden at rest\n * and **reveal on hover, keyboard focus, or while dragging** (the handle tracks\n * the pointer, so it stays hovered). Keyboard focus reveals them in the `ring`\n * color for a clear focus indicator. Works in both orientations.\n *\n * Has a default `aria-label` so the separator always has an accessible name;\n * pass `aria-label` to override it with something context-specific.\n */\nfunction ResizableHandle({\n withHandle,\n className,\n ...props\n}: ResizablePrimitive.SeparatorProps & {\n withHandle?: boolean\n}) {\n return (\n <ResizablePrimitive.Separator\n data-slot=\"resizable-handle\"\n aria-label=\"Resize\"\n className={cn(\n // 1px divider on the seam (hidden at rest); centers the grip on it\n \"relative flex shrink-0 items-center justify-center bg-transparent transition-colors ring-offset-background focus-visible:outline-hidden\",\n \"w-px aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full\",\n // wide transparent grab area via ::after — overlays the panels, no layout\n \"after:absolute after:w-3 after:inset-y-0 after:left-1/2 after:-translate-x-1/2\",\n \"aria-[orientation=horizontal]:after:inset-y-auto aria-[orientation=horizontal]:after:inset-x-0 aria-[orientation=horizontal]:after:top-1/2 aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-3 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2\",\n // reveal the divider on hover / active drag (border) and keyboard focus (ring)\n \"hover:bg-border active:bg-border focus-visible:bg-ring\",\n // reveal the grip likewise\n \"hover:[&>div]:bg-border active:[&>div]:bg-border focus-visible:[&>div]:bg-ring\",\n // grip rotates for the horizontal separator\n \"[&[aria-orientation=horizontal]>div]:rotate-90\",\n className\n )}\n {...props}\n >\n {withHandle && (\n <div className=\"z-10 flex h-6 w-1 shrink-0 rounded-lg bg-transparent transition-colors\" />\n )}\n </ResizablePrimitive.Separator>\n )\n}\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup }\n"],"names":["ResizablePanelGroup","className","props","jsx","ResizablePrimitive","cn","ResizablePanel","ResizableHandle","withHandle"],"mappings":"odAIA,SAASA,EAAoB,CAC3B,UAAAC,EACA,GAAGC,CACL,EAAkC,CAChC,OACEC,EAAAA,IAACC,EAAmB,MAAnB,CACC,YAAU,wBACV,UAAWC,EAAAA,GACT,0DACAJ,CAAA,EAED,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASI,EAAe,CAAE,GAAGJ,GAAwC,CACnE,aAAQE,EAAmB,MAAnB,CAAyB,YAAU,kBAAmB,GAAGF,EAAO,CAC1E,CAoBA,SAASK,EAAgB,CACvB,WAAAC,EACA,UAAAP,EACA,GAAGC,CACL,EAEG,CACD,OACEC,EAAAA,IAACC,EAAmB,UAAnB,CACC,YAAU,mBACV,aAAW,SACX,UAAWC,EAAAA,GAET,0IACA,+EAEA,iFACA,kXAEA,yDAEA,iFAEA,iDACAJ,CAAA,EAED,GAAGC,EAEH,SAAAM,GACCL,EAAAA,IAAC,MAAA,CAAI,UAAU,wEAAA,CAAyE,CAAA,CAAA,CAIhG"}
|
|
@@ -1,45 +1,57 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import * as
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import * as e from "react-resizable-panels";
|
|
3
3
|
import { cn as i } from "../../lib/utils.js";
|
|
4
4
|
function s({
|
|
5
5
|
className: a,
|
|
6
|
-
...
|
|
6
|
+
...t
|
|
7
7
|
}) {
|
|
8
|
-
return /* @__PURE__ */
|
|
9
|
-
|
|
8
|
+
return /* @__PURE__ */ r(
|
|
9
|
+
e.Group,
|
|
10
10
|
{
|
|
11
11
|
"data-slot": "resizable-panel-group",
|
|
12
12
|
className: i(
|
|
13
13
|
"flex h-full w-full aria-[orientation=vertical]:flex-col",
|
|
14
14
|
a
|
|
15
15
|
),
|
|
16
|
-
...
|
|
16
|
+
...t
|
|
17
17
|
}
|
|
18
18
|
);
|
|
19
19
|
}
|
|
20
20
|
function f({ ...a }) {
|
|
21
|
-
return /* @__PURE__ */ e
|
|
21
|
+
return /* @__PURE__ */ r(e.Panel, { "data-slot": "resizable-panel", ...a });
|
|
22
22
|
}
|
|
23
|
-
function
|
|
23
|
+
function b({
|
|
24
24
|
withHandle: a,
|
|
25
|
-
className:
|
|
25
|
+
className: t,
|
|
26
26
|
...o
|
|
27
27
|
}) {
|
|
28
|
-
return /* @__PURE__ */
|
|
29
|
-
|
|
28
|
+
return /* @__PURE__ */ r(
|
|
29
|
+
e.Separator,
|
|
30
30
|
{
|
|
31
31
|
"data-slot": "resizable-handle",
|
|
32
|
+
"aria-label": "Resize",
|
|
32
33
|
className: i(
|
|
33
|
-
|
|
34
|
-
|
|
34
|
+
// 1px divider on the seam (hidden at rest); centers the grip on it
|
|
35
|
+
"relative flex shrink-0 items-center justify-center bg-transparent transition-colors ring-offset-background focus-visible:outline-hidden",
|
|
36
|
+
"w-px aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full",
|
|
37
|
+
// wide transparent grab area via ::after — overlays the panels, no layout
|
|
38
|
+
"after:absolute after:w-3 after:inset-y-0 after:left-1/2 after:-translate-x-1/2",
|
|
39
|
+
"aria-[orientation=horizontal]:after:inset-y-auto aria-[orientation=horizontal]:after:inset-x-0 aria-[orientation=horizontal]:after:top-1/2 aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-3 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2",
|
|
40
|
+
// reveal the divider on hover / active drag (border) and keyboard focus (ring)
|
|
41
|
+
"hover:bg-border active:bg-border focus-visible:bg-ring",
|
|
42
|
+
// reveal the grip likewise
|
|
43
|
+
"hover:[&>div]:bg-border active:[&>div]:bg-border focus-visible:[&>div]:bg-ring",
|
|
44
|
+
// grip rotates for the horizontal separator
|
|
45
|
+
"[&[aria-orientation=horizontal]>div]:rotate-90",
|
|
46
|
+
t
|
|
35
47
|
),
|
|
36
48
|
...o,
|
|
37
|
-
children: a && /* @__PURE__ */
|
|
49
|
+
children: a && /* @__PURE__ */ r("div", { className: "z-10 flex h-6 w-1 shrink-0 rounded-lg bg-transparent transition-colors" })
|
|
38
50
|
}
|
|
39
51
|
);
|
|
40
52
|
}
|
|
41
53
|
export {
|
|
42
|
-
|
|
54
|
+
b as ResizableHandle,
|
|
43
55
|
f as ResizablePanel,
|
|
44
56
|
s as ResizablePanelGroup
|
|
45
57
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resizable.js","sources":["../../../src/components/ui/resizable.tsx"],"sourcesContent":["import * as ResizablePrimitive from \"react-resizable-panels\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction ResizablePanelGroup({\n className,\n ...props\n}: ResizablePrimitive.GroupProps) {\n return (\n <ResizablePrimitive.Group\n data-slot=\"resizable-panel-group\"\n className={cn(\n \"flex h-full w-full aria-[orientation=vertical]:flex-col\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />\n}\n\nfunction ResizableHandle({\n withHandle,\n className,\n ...props\n}: ResizablePrimitive.SeparatorProps & {\n withHandle?: boolean\n}) {\n return (\n <ResizablePrimitive.Separator\n data-slot=\"resizable-handle\"\n className={cn(\n \"relative flex
|
|
1
|
+
{"version":3,"file":"resizable.js","sources":["../../../src/components/ui/resizable.tsx"],"sourcesContent":["import * as ResizablePrimitive from \"react-resizable-panels\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction ResizablePanelGroup({\n className,\n ...props\n}: ResizablePrimitive.GroupProps) {\n return (\n <ResizablePrimitive.Group\n data-slot=\"resizable-panel-group\"\n className={cn(\n \"flex h-full w-full aria-[orientation=vertical]:flex-col\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />\n}\n\n/**\n * Resize handle between two panels.\n *\n * The handle's layout footprint is a **1px divider that sits exactly on the\n * panel boundary**, so the divider, the grip, and the seam between the panels\n * all line up — regardless of the panels' backgrounds. A wide, transparent\n * **grab area** is layered on top via `::after` (it overlaps both panels by 6px\n * without taking layout space) so the handle can be grabbed anywhere in the gap,\n * not just on the hairline.\n *\n * The 1px divider — and the optional grip (`withHandle`) — stay hidden at rest\n * and **reveal on hover, keyboard focus, or while dragging** (the handle tracks\n * the pointer, so it stays hovered). Keyboard focus reveals them in the `ring`\n * color for a clear focus indicator. Works in both orientations.\n *\n * Has a default `aria-label` so the separator always has an accessible name;\n * pass `aria-label` to override it with something context-specific.\n */\nfunction ResizableHandle({\n withHandle,\n className,\n ...props\n}: ResizablePrimitive.SeparatorProps & {\n withHandle?: boolean\n}) {\n return (\n <ResizablePrimitive.Separator\n data-slot=\"resizable-handle\"\n aria-label=\"Resize\"\n className={cn(\n // 1px divider on the seam (hidden at rest); centers the grip on it\n \"relative flex shrink-0 items-center justify-center bg-transparent transition-colors ring-offset-background focus-visible:outline-hidden\",\n \"w-px aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full\",\n // wide transparent grab area via ::after — overlays the panels, no layout\n \"after:absolute after:w-3 after:inset-y-0 after:left-1/2 after:-translate-x-1/2\",\n \"aria-[orientation=horizontal]:after:inset-y-auto aria-[orientation=horizontal]:after:inset-x-0 aria-[orientation=horizontal]:after:top-1/2 aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-3 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2\",\n // reveal the divider on hover / active drag (border) and keyboard focus (ring)\n \"hover:bg-border active:bg-border focus-visible:bg-ring\",\n // reveal the grip likewise\n \"hover:[&>div]:bg-border active:[&>div]:bg-border focus-visible:[&>div]:bg-ring\",\n // grip rotates for the horizontal separator\n \"[&[aria-orientation=horizontal]>div]:rotate-90\",\n className\n )}\n {...props}\n >\n {withHandle && (\n <div className=\"z-10 flex h-6 w-1 shrink-0 rounded-lg bg-transparent transition-colors\" />\n )}\n </ResizablePrimitive.Separator>\n )\n}\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup }\n"],"names":["ResizablePanelGroup","className","props","jsx","ResizablePrimitive","cn","ResizablePanel","ResizableHandle","withHandle"],"mappings":";;;AAIA,SAASA,EAAoB;AAAA,EAC3B,WAAAC;AAAA,EACA,GAAGC;AACL,GAAkC;AAChC,SACE,gBAAAC;AAAA,IAACC,EAAmB;AAAA,IAAnB;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASI,EAAe,EAAE,GAAGJ,KAAwC;AACnE,2BAAQE,EAAmB,OAAnB,EAAyB,aAAU,mBAAmB,GAAGF,GAAO;AAC1E;AAoBA,SAASK,EAAgB;AAAA,EACvB,YAAAC;AAAA,EACA,WAAAP;AAAA,EACA,GAAGC;AACL,GAEG;AACD,SACE,gBAAAC;AAAA,IAACC,EAAmB;AAAA,IAAnB;AAAA,MACC,aAAU;AAAA,MACV,cAAW;AAAA,MACX,WAAWC;AAAA;AAAA,QAET;AAAA,QACA;AAAA;AAAA,QAEA;AAAA,QACA;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAEH,UAAAM,KACC,gBAAAL,EAAC,OAAA,EAAI,WAAU,yEAAA,CAAyE;AAAA,IAAA;AAAA,EAAA;AAIhG;"}
|