@veeqo/transfigure 0.0.12 → 0.0.13

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.
Files changed (61) hide show
  1. package/dist/index100.cjs +80 -1
  2. package/dist/index100.js +95 -64
  3. package/dist/index101.cjs +7 -1
  4. package/dist/index101.js +10 -30
  5. package/dist/index102.cjs +13 -7
  6. package/dist/index102.js +16 -9
  7. package/dist/index20.cjs +1 -1
  8. package/dist/index20.js +1 -1
  9. package/dist/index28.cjs +1 -1
  10. package/dist/index28.js +1 -1
  11. package/dist/index33.cjs +1 -1
  12. package/dist/index33.js +44 -44
  13. package/dist/index36.cjs +1 -1
  14. package/dist/index36.js +1 -1
  15. package/dist/index37.cjs +1 -1
  16. package/dist/index37.js +1 -1
  17. package/dist/index38.cjs +1 -1
  18. package/dist/index38.js +1 -1
  19. package/dist/index58.cjs +1 -1
  20. package/dist/index58.js +25 -26
  21. package/dist/index59.cjs +1 -1
  22. package/dist/index59.js +10 -10
  23. package/dist/index77.cjs +1 -1
  24. package/dist/index77.js +7 -7
  25. package/dist/index79.cjs +1 -1
  26. package/dist/index79.js +1 -1
  27. package/dist/index80.cjs +1 -1
  28. package/dist/index80.js +13 -29
  29. package/dist/index81.cjs +100 -15
  30. package/dist/index81.js +115 -19
  31. package/dist/index82.cjs +1 -1
  32. package/dist/index82.js +67 -14
  33. package/dist/index83.cjs +1 -1
  34. package/dist/index83.js +27 -20
  35. package/dist/index84.cjs +1 -1
  36. package/dist/index84.js +2 -13
  37. package/dist/index85.cjs +1 -104
  38. package/dist/index85.js +40 -119
  39. package/dist/index86.cjs +1 -1
  40. package/dist/index86.js +7 -67
  41. package/dist/index87.cjs +1 -1
  42. package/dist/index87.js +29 -29
  43. package/dist/index88.cjs +19 -1
  44. package/dist/index88.js +24 -2
  45. package/dist/index89.cjs +1 -1
  46. package/dist/index89.js +21 -40
  47. package/dist/index90.cjs +1 -1
  48. package/dist/index90.js +15 -8
  49. package/dist/index94.cjs +1 -1
  50. package/dist/index94.js +35 -62
  51. package/dist/index95.cjs +1 -1
  52. package/dist/index95.js +62 -35
  53. package/dist/index96.cjs +1 -13
  54. package/dist/index96.js +19 -17
  55. package/dist/index97.cjs +1 -80
  56. package/dist/index97.js +8 -95
  57. package/dist/index98.cjs +1 -1
  58. package/dist/index98.js +62 -17
  59. package/dist/index99.cjs +1 -1
  60. package/dist/index99.js +29 -7
  61. package/package.json +1 -1
package/dist/index90.js CHANGED
@@ -1,10 +1,17 @@
1
- const i = (e, t) => {
2
- if (!t) return e;
3
- const r = t.toLowerCase();
4
- return e.filter(
5
- (o) => o.title.toLowerCase().includes(r) || o.id.toLowerCase().includes(r)
6
- );
7
- };
1
+ import { jsx as o } from "react/jsx-runtime";
2
+ import { StyledSortableViews as i } from "./index102.js";
3
+ const h = (e) => /* @__PURE__ */ o(
4
+ i,
5
+ {
6
+ ...e,
7
+ onChange: (t) => {
8
+ t.filter((n) => {
9
+ var r;
10
+ return (r = n.children) == null ? void 0 : r.length;
11
+ }).length || e.onChange(t);
12
+ }
13
+ }
14
+ );
8
15
  export {
9
- i as filterColumnsBySearch
16
+ h as LegacySortableViews
10
17
  };
package/dist/index94.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),p=require("mobx-react"),l=require("@veeqo/ui"),v=require("./index95.cjs"),y=p.observer(({data:m,editedValue:t,setEditedValue:c})=>{var b;if(!((b=m.options)!=null&&b.length))return null;const[u,x]=m.options,i=Number(u.value),a=Number(x.value),h=(s,n)=>{if(!Array.isArray(n)||n.length!==2||!t)return;const[e,j]=n,g=t==null?void 0:t.clone();g.setGte(e),g.setLte(j),c(g)},o={gte:(t==null?void 0:t.gte)||0,lte:(t==null?void 0:t.lte)||100},M=s=>{if(!t)return;const n=t.clone(),e=Number(s);e>n.lteMax||(e>=n.gteMin&&e<=n.lteMax&&n.setGte(e),(!n.lte||e>=n.lte)&&n.setLte(n.lteMax),c(n))},f=s=>{if(!t)return;const n=t.clone(),e=Number(s);e<n.gteMin||(e>=n.gteMin&&e<=n.lteMax&&n.setLte(e),(!n.gte||e<=n.gte)&&n.setGte(n.gteMin),c(n))},S=[o.gte,o.lte];return r.jsxs(l.Stack,{spacing:"xs",alignX:"stretch",children:[r.jsxs(l.Stack,{direction:"horizontal",children:[r.jsx(l.TextField,{label:u.label,type:"number",min:i,max:a,value:o.gte.toString(),onChange:M}),r.jsx(l.TextField,{label:x.label,type:"number",min:i,max:a,value:o.lte.toString(),onChange:f})]}),r.jsx(v.MUISlider,{value:S,onChange:h,min:i,max:a,valueLabelDisplay:"auto"})]})});exports.FilterNumberRangeFilter=y;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@veeqo/ui"),o=require("@material-ui/core/styles"),t=require("@material-ui/core/Slider"),l=e=>e&&e.__esModule?e:{default:e},i=l(t),a=o.withStyles({root:{color:r.theme.colors.secondary.blue.base,height:4},thumb:{height:20,width:20,backgroundColor:"#fff",border:"3px solid currentColor",marginTop:-8,marginLeft:-10,"&:focus, &:hover, &$active":{boxShadow:"inherit"}},valueLabel:{left:"calc(-50% - 1px)"},track:{height:4,borderRadius:4,backgroundColor:r.theme.colors.secondary.blue.light,opacity:1},rail:{height:4,borderRadius:4,backgroundColor:r.theme.colors.neutral.grey.dark,opacity:1}})(i.default);exports.MUISlider=a;
package/dist/index94.js CHANGED
@@ -1,65 +1,38 @@
1
- import { jsxs as b, jsx as a } from "react/jsx-runtime";
2
- import { observer as N } from "mobx-react";
3
- import { Stack as h, TextField as u } from "@veeqo/ui";
4
- import { MUISlider as L } from "./index95.js";
5
- const j = N(
6
- ({ data: g, editedValue: t, setEditedValue: l }) => {
7
- var f;
8
- if (!((f = g.options) != null && f.length)) return null;
9
- const [i, x] = g.options, s = Number(i.value), c = Number(x.value), p = (e, n) => {
10
- if (!Array.isArray(n) || n.length !== 2 || !t) return;
11
- const [r, y] = n, m = t == null ? void 0 : t.clone();
12
- m.setGte(r), m.setLte(y), l(m);
13
- }, o = {
14
- gte: (t == null ? void 0 : t.gte) || 0,
15
- lte: (t == null ? void 0 : t.lte) || 100
16
- }, M = (e) => {
17
- if (!t) return;
18
- const n = t.clone(), r = Number(e);
19
- r > n.lteMax || (r >= n.gteMin && r <= n.lteMax && n.setGte(r), (!n.lte || r >= n.lte) && n.setLte(n.lteMax), l(n));
20
- }, v = (e) => {
21
- if (!t) return;
22
- const n = t.clone(), r = Number(e);
23
- r < n.gteMin || (r >= n.gteMin && r <= n.lteMax && n.setLte(r), (!n.gte || r <= n.gte) && n.setGte(n.gteMin), l(n));
24
- }, C = [o.gte, o.lte];
25
- return /* @__PURE__ */ b(h, { spacing: "xs", alignX: "stretch", children: [
26
- /* @__PURE__ */ b(h, { direction: "horizontal", children: [
27
- /* @__PURE__ */ a(
28
- u,
29
- {
30
- label: i.label,
31
- type: "number",
32
- min: s,
33
- max: c,
34
- value: o.gte.toString(),
35
- onChange: M
36
- }
37
- ),
38
- /* @__PURE__ */ a(
39
- u,
40
- {
41
- label: x.label,
42
- type: "number",
43
- min: s,
44
- max: c,
45
- value: o.lte.toString(),
46
- onChange: v
47
- }
48
- )
49
- ] }),
50
- /* @__PURE__ */ a(
51
- L,
52
- {
53
- value: C,
54
- onChange: p,
55
- min: s,
56
- max: c,
57
- valueLabelDisplay: "auto"
58
- }
59
- )
60
- ] });
1
+ import { theme as o } from "@veeqo/ui";
2
+ import { withStyles as r } from "@material-ui/core/styles";
3
+ import e from "@material-ui/core/Slider";
4
+ const l = r({
5
+ root: {
6
+ color: o.colors.secondary.blue.base,
7
+ height: 4
8
+ },
9
+ thumb: {
10
+ height: 20,
11
+ width: 20,
12
+ backgroundColor: "#fff",
13
+ border: "3px solid currentColor",
14
+ marginTop: -8,
15
+ marginLeft: -10,
16
+ "&:focus, &:hover, &$active": {
17
+ boxShadow: "inherit"
18
+ }
19
+ },
20
+ valueLabel: {
21
+ left: "calc(-50% - 1px)"
22
+ },
23
+ track: {
24
+ height: 4,
25
+ borderRadius: 4,
26
+ backgroundColor: o.colors.secondary.blue.light,
27
+ opacity: 1
28
+ },
29
+ rail: {
30
+ height: 4,
31
+ borderRadius: 4,
32
+ backgroundColor: o.colors.neutral.grey.dark,
33
+ opacity: 1
61
34
  }
62
- );
35
+ })(e);
63
36
  export {
64
- j as FilterNumberRangeFilter
37
+ l as MUISlider
65
38
  };
package/dist/index95.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@veeqo/ui"),o=require("@material-ui/core/styles"),t=require("@material-ui/core/Slider"),l=e=>e&&e.__esModule?e:{default:e},i=l(t),a=o.withStyles({root:{color:r.theme.colors.secondary.blue.base,height:4},thumb:{height:20,width:20,backgroundColor:"#fff",border:"3px solid currentColor",marginTop:-8,marginLeft:-10,"&:focus, &:hover, &$active":{boxShadow:"inherit"}},valueLabel:{left:"calc(-50% - 1px)"},track:{height:4,borderRadius:4,backgroundColor:r.theme.colors.secondary.blue.light,opacity:1},rail:{height:4,borderRadius:4,backgroundColor:r.theme.colors.neutral.grey.dark,opacity:1}})(i.default);exports.MUISlider=a;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),p=require("mobx-react"),l=require("@veeqo/ui"),v=require("./index94.cjs"),y=p.observer(({data:m,editedValue:t,setEditedValue:c})=>{var b;if(!((b=m.options)!=null&&b.length))return null;const[u,x]=m.options,i=Number(u.value),a=Number(x.value),h=(s,n)=>{if(!Array.isArray(n)||n.length!==2||!t)return;const[e,j]=n,g=t==null?void 0:t.clone();g.setGte(e),g.setLte(j),c(g)},o={gte:(t==null?void 0:t.gte)||0,lte:(t==null?void 0:t.lte)||100},M=s=>{if(!t)return;const n=t.clone(),e=Number(s);e>n.lteMax||(e>=n.gteMin&&e<=n.lteMax&&n.setGte(e),(!n.lte||e>=n.lte)&&n.setLte(n.lteMax),c(n))},f=s=>{if(!t)return;const n=t.clone(),e=Number(s);e<n.gteMin||(e>=n.gteMin&&e<=n.lteMax&&n.setLte(e),(!n.gte||e<=n.gte)&&n.setGte(n.gteMin),c(n))},S=[o.gte,o.lte];return r.jsxs(l.Stack,{spacing:"xs",alignX:"stretch",children:[r.jsxs(l.Stack,{direction:"horizontal",children:[r.jsx(l.TextField,{label:u.label,type:"number",min:i,max:a,value:o.gte.toString(),onChange:M}),r.jsx(l.TextField,{label:x.label,type:"number",min:i,max:a,value:o.lte.toString(),onChange:f})]}),r.jsx(v.MUISlider,{value:S,onChange:h,min:i,max:a,valueLabelDisplay:"auto"})]})});exports.FilterNumberRangeFilter=y;
package/dist/index95.js CHANGED
@@ -1,38 +1,65 @@
1
- import { theme as o } from "@veeqo/ui";
2
- import { withStyles as r } from "@material-ui/core/styles";
3
- import e from "@material-ui/core/Slider";
4
- const l = r({
5
- root: {
6
- color: o.colors.secondary.blue.base,
7
- height: 4
8
- },
9
- thumb: {
10
- height: 20,
11
- width: 20,
12
- backgroundColor: "#fff",
13
- border: "3px solid currentColor",
14
- marginTop: -8,
15
- marginLeft: -10,
16
- "&:focus, &:hover, &$active": {
17
- boxShadow: "inherit"
18
- }
19
- },
20
- valueLabel: {
21
- left: "calc(-50% - 1px)"
22
- },
23
- track: {
24
- height: 4,
25
- borderRadius: 4,
26
- backgroundColor: o.colors.secondary.blue.light,
27
- opacity: 1
28
- },
29
- rail: {
30
- height: 4,
31
- borderRadius: 4,
32
- backgroundColor: o.colors.neutral.grey.dark,
33
- opacity: 1
1
+ import { jsxs as b, jsx as a } from "react/jsx-runtime";
2
+ import { observer as N } from "mobx-react";
3
+ import { Stack as h, TextField as u } from "@veeqo/ui";
4
+ import { MUISlider as L } from "./index94.js";
5
+ const j = N(
6
+ ({ data: g, editedValue: t, setEditedValue: l }) => {
7
+ var f;
8
+ if (!((f = g.options) != null && f.length)) return null;
9
+ const [i, x] = g.options, s = Number(i.value), c = Number(x.value), p = (e, n) => {
10
+ if (!Array.isArray(n) || n.length !== 2 || !t) return;
11
+ const [r, y] = n, m = t == null ? void 0 : t.clone();
12
+ m.setGte(r), m.setLte(y), l(m);
13
+ }, o = {
14
+ gte: (t == null ? void 0 : t.gte) || 0,
15
+ lte: (t == null ? void 0 : t.lte) || 100
16
+ }, M = (e) => {
17
+ if (!t) return;
18
+ const n = t.clone(), r = Number(e);
19
+ r > n.lteMax || (r >= n.gteMin && r <= n.lteMax && n.setGte(r), (!n.lte || r >= n.lte) && n.setLte(n.lteMax), l(n));
20
+ }, v = (e) => {
21
+ if (!t) return;
22
+ const n = t.clone(), r = Number(e);
23
+ r < n.gteMin || (r >= n.gteMin && r <= n.lteMax && n.setLte(r), (!n.gte || r <= n.gte) && n.setGte(n.gteMin), l(n));
24
+ }, C = [o.gte, o.lte];
25
+ return /* @__PURE__ */ b(h, { spacing: "xs", alignX: "stretch", children: [
26
+ /* @__PURE__ */ b(h, { direction: "horizontal", children: [
27
+ /* @__PURE__ */ a(
28
+ u,
29
+ {
30
+ label: i.label,
31
+ type: "number",
32
+ min: s,
33
+ max: c,
34
+ value: o.gte.toString(),
35
+ onChange: M
36
+ }
37
+ ),
38
+ /* @__PURE__ */ a(
39
+ u,
40
+ {
41
+ label: x.label,
42
+ type: "number",
43
+ min: s,
44
+ max: c,
45
+ value: o.lte.toString(),
46
+ onChange: v
47
+ }
48
+ )
49
+ ] }),
50
+ /* @__PURE__ */ a(
51
+ L,
52
+ {
53
+ value: C,
54
+ onChange: p,
55
+ min: s,
56
+ max: c,
57
+ valueLabelDisplay: "auto"
58
+ }
59
+ )
60
+ ] });
34
61
  }
35
- })(e);
62
+ );
36
63
  export {
37
- l as MUISlider
64
+ j as FilterNumberRangeFilter
38
65
  };
package/dist/index96.cjs CHANGED
@@ -1,13 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@veeqo/components"),o=require("@veeqo/ui"),s=require("styled-components"),l=e=>e&&e.__esModule?e:{default:e},r=l(s),{SortableViews:i}=t.VeeqoUI,n=r.default(i)`
2
- .rst__rowTitle {
3
- span {
4
- white-space: nowrap;
5
- overflow: hidden;
6
- text-overflow: ellipsis;
7
- }
8
- }
9
-
10
- .rst__rowTitle > div:first-child {
11
- gap: ${o.theme.sizes.sm};
12
- }
13
- `;exports.StyledSortableViews=n;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("@dnd-kit/sortable"),g=require("./index103.cjs"),b=require("./index81.cjs"),f=({id:t,children:r})=>{const{attributes:s,listeners:o,setNodeRef:i,transform:n,transition:a,isDragging:l}=c.useSortable({id:t}),u={transform:g.CSS.Transform.toString(n),transition:a,cursor:"grab",outlineOffset:"-1px"};return e.jsxs("div",{ref:i,style:u,...s,...o,children:[r,l&&e.jsx(b.DraggingOverlay,{})]})};exports.SortableItem=f;
package/dist/index96.js CHANGED
@@ -1,19 +1,21 @@
1
- import { VeeqoUI as e } from "@veeqo/components";
2
- import { theme as o } from "@veeqo/ui";
3
- import t from "styled-components";
4
- const { SortableViews: r } = e, p = t(r)`
5
- .rst__rowTitle {
6
- span {
7
- white-space: nowrap;
8
- overflow: hidden;
9
- text-overflow: ellipsis;
10
- }
11
- }
12
-
13
- .rst__rowTitle > div:first-child {
14
- gap: ${o.sizes.sm};
15
- }
16
- `;
1
+ import { jsxs as f, jsx as g } from "react/jsx-runtime";
2
+ import { useSortable as l } from "@dnd-kit/sortable";
3
+ import { CSS as p } from "./index103.js";
4
+ import { DraggingOverlay as c } from "./index81.js";
5
+ const d = ({ id: r, children: t }) => {
6
+ const { attributes: o, listeners: s, setNodeRef: e, transform: i, transition: n, isDragging: m } = l({
7
+ id: r
8
+ }), a = {
9
+ transform: p.Transform.toString(i),
10
+ transition: n,
11
+ cursor: "grab",
12
+ outlineOffset: "-1px"
13
+ };
14
+ return /* @__PURE__ */ f("div", { ref: e, style: a, ...o, ...s, children: [
15
+ t,
16
+ m && /* @__PURE__ */ g(c, {})
17
+ ] });
18
+ };
17
19
  export {
18
- p as StyledSortableViews
20
+ d as SortableItem
19
21
  };
package/dist/index97.cjs CHANGED
@@ -1,80 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),t=require("@veeqo/ui"),a=require("@veeqo/components"),r=e=>e&&e.__esModule?e:{default:e},o=r(i),{Glyph:l}=a.VeeqoCommon,s=o.default(t.BaseContainer)`
2
- display: flex;
3
- position: fixed;
4
- width: 100vw;
5
- left: 0;
6
- bottom: 24px;
7
- z-index: 18;
8
-
9
- &.notification-enter {
10
- opacity: 0;
11
- transform: translateY(-16px);
12
- }
13
-
14
- &.notification-enter-active {
15
- opacity: 1;
16
- transform: translateY(0);
17
- transition: 350ms ease;
18
- }
19
-
20
- &.notification-exit {
21
- opacity: 0;
22
- transform: translateY(16px);
23
- transition: 350ms ease;
24
- }
25
- pointer-events: none;
26
- `;o.default(t.BaseContainer)`
27
- display: inline-flex;
28
- flex-direction: row;
29
- align-items: center;
30
- padding: 20px 24px 24px 24px;
31
- border-radius: 4px;
32
- margin: 0 auto;
33
- background-color: #fff;
34
- box-shadow: ${t.theme.shadows.lg};
35
- pointer-events: all;
36
- `;const d=o.default(t.Banner)`
37
- display: inline-flex;
38
- flex-direction: row;
39
- align-items: center;
40
- margin: 0 auto;
41
- background-color: #fff;
42
- box-shadow: ${t.theme.shadows.lg};
43
- pointer-events: all;
44
- `,c=o.default(t.Button)`
45
- margin-right: 16px;
46
- `,f=o.default(t.Text)`
47
- line-height: 20px;
48
- `,n=o.default(t.Text)`
49
- margin: ${e=>e.margin?e.margin:""};
50
- color: ${e=>e.color};
51
- `,p=o.default(t.Text)`
52
- margin-right: 8px;
53
- color: ${e=>e.color};
54
- `,u=o.default(l)``,x=o.default(t.BaseContainer)`
55
- display: flex;
56
- flex-direction: row;
57
- align-items: flex-end;
58
- flex-grow: 2;
59
- margin-left: 24px;
60
- margin-right: 24px;
61
- `;o.default(t.AnimatedDropdown)``;o.default.button`
62
- display: flex;
63
- flex-direction: row;
64
- width: 100%;
65
- padding: 12px 16px;
66
- cursor: pointer;
67
-
68
- & > ${n} {
69
- white-space: nowrap;
70
- user-select: none;
71
- }
72
-
73
- &:hover {
74
- background-color: ${t.theme.colors.neutral.grey.lightest};
75
- }
76
-
77
- &:hover > ${n} {
78
- color: ${t.theme.colors.secondary.blue.base};
79
- }
80
- `;exports.Bold=p;exports.Button=c;exports.Glyph=u;exports.Hint=f;exports.Notification=s;exports.Pill=d;exports.Text=n;exports.Wrap=x;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),c=require("@dnd-kit/core"),s=require("./index81.cjs"),l=({id:e,children:r,...t})=>{const{setNodeRef:o}=c.useDroppable({id:e});return a.createElement(s.DroppableAreaStack,{...t,key:e,ref:o},r)};exports.DroppableArea=l;
package/dist/index97.js CHANGED
@@ -1,97 +1,10 @@
1
- import o from "styled-components";
2
- import { BaseContainer as e, theme as n, Banner as a, Text as i, Button as l, AnimatedDropdown as s } from "@veeqo/ui";
3
- import { VeeqoCommon as c } from "@veeqo/components";
4
- const { Glyph: p } = c, m = o(e)`
5
- display: flex;
6
- position: fixed;
7
- width: 100vw;
8
- left: 0;
9
- bottom: 24px;
10
- z-index: 18;
11
-
12
- &.notification-enter {
13
- opacity: 0;
14
- transform: translateY(-16px);
15
- }
16
-
17
- &.notification-enter-active {
18
- opacity: 1;
19
- transform: translateY(0);
20
- transition: 350ms ease;
21
- }
22
-
23
- &.notification-exit {
24
- opacity: 0;
25
- transform: translateY(16px);
26
- transition: 350ms ease;
27
- }
28
- pointer-events: none;
29
- `;
30
- o(e)`
31
- display: inline-flex;
32
- flex-direction: row;
33
- align-items: center;
34
- padding: 20px 24px 24px 24px;
35
- border-radius: 4px;
36
- margin: 0 auto;
37
- background-color: #fff;
38
- box-shadow: ${n.shadows.lg};
39
- pointer-events: all;
40
- `;
41
- const g = o(a)`
42
- display: inline-flex;
43
- flex-direction: row;
44
- align-items: center;
45
- margin: 0 auto;
46
- background-color: #fff;
47
- box-shadow: ${n.shadows.lg};
48
- pointer-events: all;
49
- `, h = o(l)`
50
- margin-right: 16px;
51
- `, w = o(i)`
52
- line-height: 20px;
53
- `, r = o(i)`
54
- margin: ${(t) => t.margin ? t.margin : ""};
55
- color: ${(t) => t.color};
56
- `, u = o(i)`
57
- margin-right: 8px;
58
- color: ${(t) => t.color};
59
- `, y = o(p)``, $ = o(e)`
60
- display: flex;
61
- flex-direction: row;
62
- align-items: flex-end;
63
- flex-grow: 2;
64
- margin-left: 24px;
65
- margin-right: 24px;
66
- `;
67
- o(s)``;
68
- o.button`
69
- display: flex;
70
- flex-direction: row;
71
- width: 100%;
72
- padding: 12px 16px;
73
- cursor: pointer;
74
-
75
- & > ${r} {
76
- white-space: nowrap;
77
- user-select: none;
78
- }
79
-
80
- &:hover {
81
- background-color: ${n.colors.neutral.grey.lightest};
82
- }
83
-
84
- &:hover > ${r} {
85
- color: ${n.colors.secondary.blue.base};
86
- }
87
- `;
1
+ import { createElement as p } from "react";
2
+ import { useDroppable as a } from "@dnd-kit/core";
3
+ import { DroppableAreaStack as m } from "./index81.js";
4
+ const n = ({ id: e, children: r, ...o }) => {
5
+ const { setNodeRef: t } = a({ id: e });
6
+ return /* @__PURE__ */ p(m, { ...o, key: e, ref: t }, r);
7
+ };
88
8
  export {
89
- u as Bold,
90
- h as Button,
91
- y as Glyph,
92
- w as Hint,
93
- m as Notification,
94
- g as Pill,
95
- r as Text,
96
- $ as Wrap
9
+ n as DroppableArea
97
10
  };
package/dist/index98.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("@dnd-kit/sortable"),g=require("./index103.cjs"),b=require("./index85.cjs"),f=({id:t,children:r})=>{const{attributes:s,listeners:o,setNodeRef:i,transform:n,transition:a,isDragging:l}=c.useSortable({id:t}),u={transform:g.CSS.Transform.toString(n),transition:a,cursor:"grab",outlineOffset:"-1px"};return e.jsxs("div",{ref:i,style:u,...s,...o,children:[r,l&&e.jsx(b.DraggingOverlay,{})]})};exports.SortableItem=f;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),b=require("@dnd-kit/sortable"),w=({items:d,setItems:g})=>{const[C,i]=O.useState(null),[h,v]=O.useState(null),s=n=>{var e;return n&&(n.id in d?n.id:(e=n==null?void 0:n.data.current)==null?void 0:e.sortable.containerId)};return{activeId:C,handleDragStart:n=>{const{active:e}=n;i(e.id),v(d)},handleDragOver:n=>{const{active:e,over:t}=n,o=t==null?void 0:t.id;if(o==null)return;const c=s(t),a=s(e);!c||!a||a!==c&&g(r=>{const u=r[a],l=r[c],D=l.indexOf(o),S=u.indexOf(e.id);let f;if(o in r)f=l.length+1;else{const I=t&&e.rect.current.translated&&e.rect.current.translated.top>t.rect.top+t.rect.height?1:0;f=D>=0?D+I:l.length+1}return{...r,[a]:r[a].filter(x=>x!==e.id),[c]:[...r[c].slice(0,f),r[a][S],...r[c].slice(f,r[c].length)]}})},handleDragEnd:n=>{const{active:e,over:t}=n,o=s(e);if(!o){i(null);return}const c=t==null?void 0:t.id;if(c==null){i(null);return}const a=s(t);if(a){const r=d[o].indexOf(e.id),u=d[a].indexOf(c);r!==u&&g(l=>({...l,[a]:b.arrayMove(l[a],r,u)}))}i(null)},handleDragCancel:()=>{h&&g(h),i(null),v(null)}}};exports.useDragHandlers=w;
package/dist/index98.js CHANGED
@@ -1,21 +1,66 @@
1
- import { jsxs as f, jsx as g } from "react/jsx-runtime";
2
- import { useSortable as l } from "@dnd-kit/sortable";
3
- import { CSS as p } from "./index103.js";
4
- import { DraggingOverlay as c } from "./index85.js";
5
- const d = ({ id: r, children: t }) => {
6
- const { attributes: o, listeners: s, setNodeRef: e, transform: i, transition: n, isDragging: m } = l({
7
- id: r
8
- }), a = {
9
- transform: p.Transform.toString(i),
10
- transition: n,
11
- cursor: "grab",
12
- outlineOffset: "-1px"
1
+ import { useState as C } from "react";
2
+ import { arrayMove as S } from "@dnd-kit/sortable";
3
+ const M = ({ items: d, setItems: g }) => {
4
+ const [O, i] = C(null), [h, v] = C(null), s = (n) => {
5
+ var t;
6
+ return n && (n.id in d ? n.id : (t = n == null ? void 0 : n.data.current) == null ? void 0 : t.sortable.containerId);
7
+ };
8
+ return {
9
+ activeId: O,
10
+ handleDragStart: (n) => {
11
+ const { active: t } = n;
12
+ i(t.id), v(d);
13
+ },
14
+ handleDragOver: (n) => {
15
+ const { active: t, over: e } = n, a = e == null ? void 0 : e.id;
16
+ if (a == null) return;
17
+ const c = s(e), o = s(t);
18
+ !c || !o || o !== c && g((r) => {
19
+ const u = r[o], l = r[c], x = l.indexOf(a), I = u.indexOf(t.id);
20
+ let f;
21
+ if (a in r)
22
+ f = l.length + 1;
23
+ else {
24
+ const w = e && t.rect.current.translated && t.rect.current.translated.top > e.rect.top + e.rect.height ? 1 : 0;
25
+ f = x >= 0 ? x + w : l.length + 1;
26
+ }
27
+ return {
28
+ ...r,
29
+ [o]: r[o].filter((D) => D !== t.id),
30
+ [c]: [
31
+ ...r[c].slice(0, f),
32
+ r[o][I],
33
+ ...r[c].slice(f, r[c].length)
34
+ ]
35
+ };
36
+ });
37
+ },
38
+ handleDragEnd: (n) => {
39
+ const { active: t, over: e } = n, a = s(t);
40
+ if (!a) {
41
+ i(null);
42
+ return;
43
+ }
44
+ const c = e == null ? void 0 : e.id;
45
+ if (c == null) {
46
+ i(null);
47
+ return;
48
+ }
49
+ const o = s(e);
50
+ if (o) {
51
+ const r = d[a].indexOf(t.id), u = d[o].indexOf(c);
52
+ r !== u && g((l) => ({
53
+ ...l,
54
+ [o]: S(l[o], r, u)
55
+ }));
56
+ }
57
+ i(null);
58
+ },
59
+ handleDragCancel: () => {
60
+ h && g(h), i(null), v(null);
61
+ }
13
62
  };
14
- return /* @__PURE__ */ f("div", { ref: e, style: a, ...o, ...s, children: [
15
- t,
16
- m && /* @__PURE__ */ g(c, {})
17
- ] });
18
63
  };
19
64
  export {
20
- d as SortableItem
65
+ M as useDragHandlers
21
66
  };
package/dist/index99.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),c=require("@dnd-kit/core"),s=require("./index85.cjs"),l=({id:e,children:r,...t})=>{const{setNodeRef:o}=c.useDroppable({id:e});return a.createElement(s.DroppableAreaStack,{...t,key:e,ref:o},r)};exports.DroppableArea=l;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),n=require("@dnd-kit/core"),a=({items:i})=>{const o=u.useRef(null);return{collisionDetectionStrategy:u.useCallback(t=>{var c;const r=n.pointerWithin(t),d=r.length>0?r:n.rectIntersection(t);let e=n.getFirstCollision(d,"id");if(e!=null){if(e in i){const l=i[e];l.length>0&&(e=((c=n.closestCenter({...t,droppableContainers:t.droppableContainers.filter(s=>s.id!==e&&l.includes(s.id))})[0])==null?void 0:c.id)??e)}return o.current=e,[{id:e}]}return o.current?[{id:o.current}]:[]},[i])}};exports.useCollisionDetectionStrategy=a;
package/dist/index99.js CHANGED
@@ -1,10 +1,32 @@
1
- import { createElement as p } from "react";
2
- import { useDroppable as a } from "@dnd-kit/core";
3
- import { DroppableAreaStack as m } from "./index85.js";
4
- const n = ({ id: e, children: r, ...o }) => {
5
- const { setNodeRef: t } = a({ id: e });
6
- return /* @__PURE__ */ p(m, { ...o, key: e, ref: t }, r);
1
+ import { useRef as u, useCallback as d } from "react";
2
+ import { pointerWithin as p, rectIntersection as a, getFirstCollision as f, closestCenter as C } from "@dnd-kit/core";
3
+ const h = ({ items: n }) => {
4
+ const i = u(null);
5
+ return { collisionDetectionStrategy: d(
6
+ (e) => {
7
+ var r;
8
+ const o = p(e), s = o.length > 0 ? (
9
+ // If there are droppables intersecting with the pointer, return those
10
+ o
11
+ ) : a(e);
12
+ let t = f(s, "id");
13
+ if (t != null) {
14
+ if (t in n) {
15
+ const l = n[t];
16
+ l.length > 0 && (t = ((r = C({
17
+ ...e,
18
+ droppableContainers: e.droppableContainers.filter(
19
+ (c) => c.id !== t && l.includes(c.id)
20
+ )
21
+ })[0]) == null ? void 0 : r.id) ?? t);
22
+ }
23
+ return i.current = t, [{ id: t }];
24
+ }
25
+ return i.current ? [{ id: i.current }] : [];
26
+ },
27
+ [n]
28
+ ) };
7
29
  };
8
30
  export {
9
- n as DroppableArea
31
+ h as useCollisionDetectionStrategy
10
32
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veeqo/transfigure",
3
- "version": "0.0.12",
3
+ "version": "0.0.13",
4
4
  "type": "module",
5
5
  "sideEffects": false,
6
6
  "main": "dist/index.cjs",