@uva-glass/component-library 3.55.0 → 3.55.2

package/dist/components/Sortable/Sortable.stories.js

@@ -1,61 +1,81 @@
-import { jsx as e, jsxs as i, Fragment as m } from "react/jsx-runtime";
-import { f as s } from "../../index-B_q_4aBT.js";
-import { Sortable as l } from "./Sortable.js";
-import { InputField as d } from "../InputField/InputField.js";
-import { Icon as c } from "../Icon/Icon.js";
-import { Button as b } from "../Buttons/Button.js";
-import "../Buttons/LinkButton.js";
-import "@react-aria/button";
-const p = `<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlacement} scrollable={scrollable} 
-    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > `, F = {
-  title: "Organisms/Sortable",
-  component: l,
-  argTypes: {
-    children: {
-      table: {
-        disable: !0
-      }
-    },
-    ItemHandlePlacement: {
-      table: {
-        disable: !0
-      }
-    }
-  },
-  parameters: {
-    inspectComponent: l,
-    codeString: p
-  }
-}, r = {
-  ItemHandlePlacement: "left",
-  onSort: s()
-}, a = ["Item-1", "Item-2", "Item-3", "Item-4", "Item-5"], n = (o) => /* @__PURE__ */ e(l, { ...o, children: a }), h = n.bind({});
-h.args = {
-  ...r
+import { r as e } from "../../test-CPFNM-bL.js";
+import { Icon as t } from "../Icon/Icon.js";
+import { Button as n } from "../Buttons/Button.js";
+import { t as r } from "../../InputField-BWAy19w9.js";
+import { Sortable as i } from "./Sortable.js";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+var c = {
+	title: "Organisms/Sortable",
+	component: i,
+	argTypes: {
+		children: { table: { disable: !0 } },
+		ItemHandlePlacement: { table: { disable: !0 } }
+	},
+	parameters: {
+		inspectComponent: i,
+		codeString: "<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlacement} scrollable={scrollable} \n    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > "
+	}
+}, l = {
+	ItemHandlePlacement: "left",
+	onSort: e()
+}, u = [
+	"Item-1",
+	"Item-2",
+	"Item-3",
+	"Item-4",
+	"Item-5"
+], d = (e) => /* @__PURE__ */ o(i, {
+	...e,
+	children: u
+}), f = d.bind({});
+f.args = { ...l };
+var p = d.bind({});
+p.args = {
+	...l,
+	ItemHandlePlacement: "right"
 };
-const I = n.bind({});
-I.args = {
-  ...r,
-  ItemHandlePlacement: "right"
+var m = ((e) => /* @__PURE__ */ o(i, {
+	...e,
+	children: u.map((e) => /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", {
+		style: { width: "100%" },
+		children: /* @__PURE__ */ o(r, {
+			id: e,
+			placeholder: e
+		}, e)
+	}), /* @__PURE__ */ o(n, {
+		variant: "blank-icon",
+		children: /* @__PURE__ */ o(t, {
+			name: "Trash",
+			color: "#a0002aff"
+		})
+	})] }, e))
+})).bind({});
+m.args = {
+	...l,
+	childrenData: [
+		{
+			title: "item-1",
+			value: 1
+		},
+		{
+			title: "item-2",
+			value: 2
+		},
+		{
+			title: "item-3",
+			value: 3
+		},
+		{
+			title: "item-4",
+			value: 4
+		},
+		{
+			title: "item-5",
+			value: 5
+		}
+	]
 };
-const u = (o) => /* @__PURE__ */ e(l, { ...o, children: a.map((t) => /* @__PURE__ */ i(m, { children: [
-  /* @__PURE__ */ e("div", { style: { width: "100%" }, children: /* @__PURE__ */ e(d, { id: t, placeholder: t }, t) }),
-  /* @__PURE__ */ e(b, { variant: "blank-icon", children: /* @__PURE__ */ e(c, { name: "Trash", color: "#a0002aff" }) })
-] }, t)) }), f = u.bind({});
-f.args = {
-  ...r,
-  childrenData: [
-    { title: "item-1", value: 1 },
-    { title: "item-2", value: 2 },
-    { title: "item-3", value: 3 },
-    { title: "item-4", value: 4 },
-    { title: "item-5", value: 5 }
-  ]
-};
-export {
-  h as SortableExample,
-  f as WithComplexChildren,
-  F as default,
-  I as withHandleRight
-};
-//# sourceMappingURL=Sortable.stories.js.map
+//#endregion
+export { f as SortableExample, m as WithComplexChildren, c as default, p as withHandleRight };
+
+//# sourceMappingURL=Sortable.stories.js.map

package/dist/components/Sortable/Sortable.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sortable.stories.js","sources":["../../../src/components/Sortable/Sortable.stories.tsx"],"sourcesContent":["import { fn } from 'storybook/test';\nimport { Fragment } from 'react/jsx-runtime';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { SortableProps } from './Sortable';\n\nimport { Sortable } from './Sortable';\n\nimport { InputField } from 'components/InputField';\nimport { Icon } from 'components/Icon';\nimport { Button } from 'components/Buttons';\n\nconst codeString = `<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlacement} scrollable={scrollable} \n    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > `;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Organisms/Sortable',\n  component: Sortable,\n  argTypes: {\n    children: {\n      table: {\n        disable: true,\n      },\n    },\n    ItemHandlePlacement: {\n      table: {\n        disable: true,\n      },\n    },\n  },\n  parameters: {\n    inspectComponent: Sortable,\n    codeString: codeString,\n  },\n} as Meta<SortableProps>;\n\nconst defaultArgs: Partial<SortableProps> = {\n  ItemHandlePlacement: 'left',\n  onSort: fn(),\n};\n\nconst mockItems = ['Item-1', 'Item-2', 'Item-3', 'Item-4', 'Item-5'];\n\nconst Template: StoryFn<SortableProps> = (args) => <Sortable {...args}>{mockItems}</Sortable>;\n\nexport const SortableExample = Template.bind({});\nSortableExample.args = {\n  ...defaultArgs,\n};\n\nexport const withHandleRight = Template.bind({});\nwithHandleRight.args = {\n  ...defaultArgs,\n  ItemHandlePlacement: 'right',\n};\n\nconst TemplateComplex: StoryFn<SortableProps> = (args) => (\n  <Sortable {...args}>\n    {mockItems.map((item) => (\n      <Fragment key={item}>\n        <div style={{ width: '100%' }}>\n          <InputField key={item} id={item} placeholder={item} />\n        </div>\n        <Button variant=\"blank-icon\">\n          <Icon name=\"Trash\" color=\"#a0002aff\" />\n        </Button>\n      </Fragment>\n    ))}\n  </Sortable>\n);\n\nexport const WithComplexChildren = TemplateComplex.bind({});\nWithComplexChildren.args = {\n  ...defaultArgs,\n  childrenData: [\n    { title: 'item-1', value: 1 },\n    { title: 'item-2', value: 2 },\n    { title: 'item-3', value: 3 },\n    { title: 'item-4', value: 4 },\n    { title: 'item-5', value: 5 },\n  ],\n};\n"],"names":["codeString","Sortable_stories","Sortable","defaultArgs","fn","mockItems","Template","args","SortableExample","withHandleRight","TemplateComplex","jsx","item","jsxs","Fragment","InputField","Button","Icon","WithComplexChildren"],"mappings":";;;;;;;;AAYA,MAAMA,IAAa;AAAA,8HAInBC,IAAe;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,IAEF,qBAAqB;AAAA,MACnB,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EACF;AAAA,EAEF,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAsC;AAAA,EAC1C,qBAAqB;AAAA,EACrB,QAAQC,EAAA;AACV,GAEMC,IAAY,CAAC,UAAU,UAAU,UAAU,UAAU,QAAQ,GAE7DC,IAAmC,CAACC,wBAAUL,GAAA,EAAU,GAAGK,GAAO,UAAAF,GAAU,GAErEG,IAAkBF,EAAS,KAAK,CAAA,CAAE;AAC/CE,EAAgB,OAAO;AAAA,EACrB,GAAGL;AACL;AAEO,MAAMM,IAAkBH,EAAS,KAAK,CAAA,CAAE;AAC/CG,EAAgB,OAAO;AAAA,EACrB,GAAGN;AAAA,EACH,qBAAqB;AACvB;AAEA,MAAMO,IAA0C,CAACH,MAC/C,gBAAAI,EAACT,GAAA,EAAU,GAAGK,GACX,UAAAF,EAAU,IAAI,CAACO,MACd,gBAAAC,EAACC,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAH,EAAC,OAAA,EAAI,OAAO,EAAE,OAAO,OAAA,GACnB,UAAA,gBAAAA,EAACI,GAAA,EAAsB,IAAIH,GAAM,aAAaA,EAAA,GAA7BA,CAAmC,GACtD;AAAA,EACA,gBAAAD,EAACK,GAAA,EAAO,SAAQ,cACd,UAAA,gBAAAL,EAACM,KAAK,MAAK,SAAQ,OAAM,YAAA,CAAY,EAAA,CACvC;AAAA,KANaL,CAOf,CACD,GACH,GAGWM,IAAsBR,EAAgB,KAAK,CAAA,CAAE;AAC1DQ,EAAoB,OAAO;AAAA,EACzB,GAAGf;AAAA,EACH,cAAc;AAAA,IACZ,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,EAAE;AAEhC;"}
+{"version":3,"file":"Sortable.stories.js","names":[],"sources":["../../../src/components/Sortable/Sortable.stories.tsx"],"sourcesContent":["import { fn } from 'storybook/test';\nimport { Fragment } from 'react/jsx-runtime';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { SortableProps } from './Sortable';\n\nimport { Sortable } from './Sortable';\n\nimport { InputField } from 'components/InputField';\nimport { Icon } from 'components/Icon';\nimport { Button } from 'components/Buttons';\n\nconst codeString = `<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlacement} scrollable={scrollable} \n    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > `;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Organisms/Sortable',\n  component: Sortable,\n  argTypes: {\n    children: {\n      table: {\n        disable: true,\n      },\n    },\n    ItemHandlePlacement: {\n      table: {\n        disable: true,\n      },\n    },\n  },\n  parameters: {\n    inspectComponent: Sortable,\n    codeString: codeString,\n  },\n} as Meta<SortableProps>;\n\nconst defaultArgs: Partial<SortableProps> = {\n  ItemHandlePlacement: 'left',\n  onSort: fn(),\n};\n\nconst mockItems = ['Item-1', 'Item-2', 'Item-3', 'Item-4', 'Item-5'];\n\nconst Template: StoryFn<SortableProps> = (args) => <Sortable {...args}>{mockItems}</Sortable>;\n\nexport const SortableExample = Template.bind({});\nSortableExample.args = {\n  ...defaultArgs,\n};\n\nexport const withHandleRight = Template.bind({});\nwithHandleRight.args = {\n  ...defaultArgs,\n  ItemHandlePlacement: 'right',\n};\n\nconst TemplateComplex: StoryFn<SortableProps> = (args) => (\n  <Sortable {...args}>\n    {mockItems.map((item) => (\n      <Fragment key={item}>\n        <div style={{ width: '100%' }}>\n          <InputField key={item} id={item} placeholder={item} />\n        </div>\n        <Button variant=\"blank-icon\">\n          <Icon name=\"Trash\" color=\"#a0002aff\" />\n        </Button>\n      </Fragment>\n    ))}\n  </Sortable>\n);\n\nexport const WithComplexChildren = TemplateComplex.bind({});\nWithComplexChildren.args = {\n  ...defaultArgs,\n  childrenData: [\n    { title: 'item-1', value: 1 },\n    { title: 'item-2', value: 2 },\n    { title: 'item-3', value: 3 },\n    { title: 'item-4', value: 4 },\n    { title: 'item-5', value: 5 },\n  ],\n};\n"],"mappings":";;;;;;AAgBA,IAAA,IAAe;CACb,OAAO;CACP,WAAW;CACX,UAAU;EACR,UAAU,EACR,OAAO,EACL,SAAS,IACV,EACF;EACD,qBAAqB,EACnB,OAAO,EACL,SAAS,IACV,EACF;EACF;CACD,YAAY;EACV,kBAAkB;EACN,YArBG;EAsBhB;CACF,EAEK,IAAsC;CAC1C,qBAAqB;CACrB,QAAQ,GAAI;CACb,EAEK,IAAY;CAAC;CAAU;CAAU;CAAU;CAAU;CAAS,EAE9D,KAAoC,MAAS,kBAAC,GAAD;CAAU,GAAI;WAAO;CAAqB,CAAA,EAEhF,IAAkB,EAAS,KAAK,EAAE,CAAC;AAChD,EAAgB,OAAO,EACrB,GAAG,GACJ;AAED,IAAa,IAAkB,EAAS,KAAK,EAAE,CAAC;AAChD,EAAgB,OAAO;CACrB,GAAG;CACH,qBAAqB;CACtB;AAiBD,IAAa,MAfoC,MAC/C,kBAAC,GAAD;CAAU,GAAI;WACX,EAAU,KAAK,MACd,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;EAAK,OAAO,EAAE,OAAO,QAAQ;YAC3B,kBAAC,GAAD;GAAuB,IAAI;GAAM,aAAa;GAAQ,EAArC,EAAqC;EAClD,CAAA,EACN,kBAAC,GAAD;EAAQ,SAAQ;YACd,kBAAC,GAAD;GAAM,MAAK;GAAQ,OAAM;GAAc,CAAA;EAChC,CAAA,CACA,EAAA,EAPI,EAOJ,CACX;CACO,CAAA,EAGsC,KAAK,EAAE,CAAC;AAC3D,EAAoB,OAAO;CACzB,GAAG;CACH,cAAc;EACZ;GAAE,OAAO;GAAU,OAAO;GAAG;EAC7B;GAAE,OAAO;GAAU,OAAO;GAAG;EAC7B;GAAE,OAAO;GAAU,OAAO;GAAG;EAC7B;GAAE,OAAO;GAAU,OAAO;GAAG;EAC7B;GAAE,OAAO;GAAU,OAAO;GAAG;EAC9B;CACF"}

package/dist/components/Sortable/SortableProvider.js

@@ -1,10 +1,2 @@
-import "react/jsx-runtime";
-import "react";
-import "./sortableReducer.js";
-import { S as p, u as a } from "../../SortableProvider-BbwlEPIr.js";
-import "./actions.js";
-export {
-  p as SortableProvider,
-  a as useSortable
-};
-//# sourceMappingURL=SortableProvider.js.map
+import { n as e, t } from "../../SortableProvider-Dc7hwkb5.js";
+export { t as SortableProvider, e as useSortable };

package/dist/components/Sortable/actions.js

@@ -1,33 +1,25 @@
-import { SET_DRAGGING_TARGET as o, SET_DRAGGING_SOURCE as e, SET_CLONE as a, RESET as p, MOVE_TO_POSITION as r, DROP as n, DRAG_START as g, DRAG_END as G, CLEAR_DRAGGING_TARGET as s, CLEAR_DRAGGING_SOURCE as y } from "./constants.js";
-const R = (t) => ({
-  type: a,
-  payload: t
-}), T = () => ({ type: y }), c = () => ({ type: s }), _ = () => ({ type: G }), D = (t) => ({
-  type: g,
-  payload: t
-}), A = (t) => ({
-  type: n,
-  payload: t
-}), S = (t) => ({
-  type: r,
-  payload: t
-}), d = () => ({ type: p }), l = (t) => ({
-  type: e,
-  payload: t
-}), O = (t) => ({
-  type: o,
-  payload: t
+import { CLEAR_DRAGGING_SOURCE as e, CLEAR_DRAGGING_TARGET as t, DRAG_END as n, DRAG_START as r, DROP as i, MOVE_TO_POSITION as a, RESET as o, SET_CLONE as s, SET_DRAGGING_SOURCE as c, SET_DRAGGING_TARGET as l } from "./constants.js";
+//#region src/components/Sortable/actions.ts
+var u = (e) => ({
+	type: s,
+	payload: e
+}), d = () => ({ type: e }), f = () => ({ type: t }), p = () => ({ type: n }), m = (e) => ({
+	type: r,
+	payload: e
+}), h = (e) => ({
+	type: i,
+	payload: e
+}), g = (e) => ({
+	type: a,
+	payload: e
+}), _ = () => ({ type: o }), v = (e) => ({
+	type: c,
+	payload: e
+}), y = (e) => ({
+	type: l,
+	payload: e
 });
-export {
-  T as clearDraggingSource,
-  c as clearDraggingTarget,
-  _ as dragEnd,
-  D as dragStart,
-  A as drop,
-  S as moveToPosition,
-  d as reset,
-  R as setClone,
-  l as setDraggingSource,
-  O as setDraggingTarget
-};
-//# sourceMappingURL=actions.js.map
+//#endregion
+export { d as clearDraggingSource, f as clearDraggingTarget, p as dragEnd, m as dragStart, h as drop, g as moveToPosition, _ as reset, u as setClone, v as setDraggingSource, y as setDraggingTarget };
+
+//# sourceMappingURL=actions.js.map

package/dist/components/Sortable/actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"actions.js","sources":["../../../src/components/Sortable/actions.ts"],"sourcesContent":["import {\n  CLEAR_DRAGGING_SOURCE,\n  CLEAR_DRAGGING_TARGET,\n  DRAG_END,\n  DRAG_START,\n  DROP,\n  MOVE_TO_POSITION,\n  RESET,\n  SET_CLONE,\n  SET_DRAGGING_SOURCE,\n  SET_DRAGGING_TARGET,\n} from './constants';\n\ntype ClearDraggingSourceAction = {\n  type: typeof CLEAR_DRAGGING_SOURCE;\n};\n\ntype ClearDraggingTargetAction = {\n  type: typeof CLEAR_DRAGGING_TARGET;\n};\n\ntype DragEndAction = {\n  type: typeof DRAG_END;\n};\n\ntype DragStartAction = {\n  type: typeof DRAG_START;\n  payload: number;\n};\n\ntype DropAction = {\n  type: typeof DROP;\n  payload: number;\n};\n\ntype MoveToPositionAction = {\n  type: typeof MOVE_TO_POSITION;\n  payload: number;\n};\n\ntype ResetAction = {\n  type: typeof RESET;\n};\n\ntype SetCloneAction = {\n  type: typeof SET_CLONE;\n  payload: Element;\n};\n\ntype SetDraggingSourceAction = {\n  type: typeof SET_DRAGGING_SOURCE;\n  payload: number;\n};\n\ntype SetDraggingTargetAction = {\n  type: typeof SET_DRAGGING_TARGET;\n  payload: number;\n};\n\nexport type Actions =\n  | ClearDraggingSourceAction\n  | ClearDraggingTargetAction\n  | DragEndAction\n  | DragStartAction\n  | DropAction\n  | MoveToPositionAction\n  | ResetAction\n  | SetCloneAction\n  | SetDraggingSourceAction\n  | SetDraggingTargetAction;\n\nexport const setClone = (payload: SetCloneAction['payload']): SetCloneAction => ({\n  type: SET_CLONE,\n  payload,\n});\n\nexport const clearDraggingSource = (): ClearDraggingSourceAction => ({ type: CLEAR_DRAGGING_SOURCE });\n\nexport const clearDraggingTarget = (): ClearDraggingTargetAction => ({ type: CLEAR_DRAGGING_TARGET });\n\nexport const dragEnd = (): DragEndAction => ({ type: DRAG_END });\n\nexport const dragStart = (draggingItemIndex: DragStartAction['payload']): DragStartAction => ({\n  type: DRAG_START,\n  payload: draggingItemIndex,\n});\n\nexport const drop = (targetItemIndex: DropAction['payload']): DropAction => ({\n  type: DROP,\n  payload: targetItemIndex,\n});\n\nexport const moveToPosition = (targetItemIndex: MoveToPositionAction['payload']): MoveToPositionAction => ({\n  type: MOVE_TO_POSITION,\n  payload: targetItemIndex,\n});\n\nexport const reset = (): ResetAction => ({ type: RESET });\n\nexport const setDraggingSource = (sourceItemIndex: SetDraggingSourceAction['payload']): SetDraggingSourceAction => ({\n  type: SET_DRAGGING_SOURCE,\n  payload: sourceItemIndex,\n});\n\nexport const setDraggingTarget = (targetItemIndex: SetDraggingTargetAction['payload']): SetDraggingTargetAction => ({\n  type: SET_DRAGGING_TARGET,\n  payload: targetItemIndex,\n});\n"],"names":["setClone","payload","SET_CLONE","clearDraggingSource","CLEAR_DRAGGING_SOURCE","clearDraggingTarget","CLEAR_DRAGGING_TARGET","dragEnd","DRAG_END","dragStart","draggingItemIndex","DRAG_START","drop","targetItemIndex","DROP","moveToPosition","MOVE_TO_POSITION","reset","RESET","setDraggingSource","sourceItemIndex","SET_DRAGGING_SOURCE","setDraggingTarget","SET_DRAGGING_TARGET"],"mappings":";AAuEO,MAAMA,IAAW,CAACC,OAAwD;AAAA,EAC/E,MAAMC;AAAA,EACN,SAAAD;AACF,IAEaE,IAAsB,OAAkC,EAAE,MAAMC,EAAA,IAEhEC,IAAsB,OAAkC,EAAE,MAAMC,EAAA,IAEhEC,IAAU,OAAsB,EAAE,MAAMC,EAAA,IAExCC,IAAY,CAACC,OAAoE;AAAA,EAC5F,MAAMC;AAAA,EACN,SAASD;AACX,IAEaE,IAAO,CAACC,OAAwD;AAAA,EAC3E,MAAMC;AAAA,EACN,SAASD;AACX,IAEaE,IAAiB,CAACF,OAA4E;AAAA,EACzG,MAAMG;AAAA,EACN,SAASH;AACX,IAEaI,IAAQ,OAAoB,EAAE,MAAMC,EAAA,IAEpCC,IAAoB,CAACC,OAAkF;AAAA,EAClH,MAAMC;AAAA,EACN,SAASD;AACX,IAEaE,IAAoB,CAACT,OAAkF;AAAA,EAClH,MAAMU;AAAA,EACN,SAASV;AACX;"}
+{"version":3,"file":"actions.js","names":[],"sources":["../../../src/components/Sortable/actions.ts"],"sourcesContent":["import {\n  CLEAR_DRAGGING_SOURCE,\n  CLEAR_DRAGGING_TARGET,\n  DRAG_END,\n  DRAG_START,\n  DROP,\n  MOVE_TO_POSITION,\n  RESET,\n  SET_CLONE,\n  SET_DRAGGING_SOURCE,\n  SET_DRAGGING_TARGET,\n} from './constants';\n\ntype ClearDraggingSourceAction = {\n  type: typeof CLEAR_DRAGGING_SOURCE;\n};\n\ntype ClearDraggingTargetAction = {\n  type: typeof CLEAR_DRAGGING_TARGET;\n};\n\ntype DragEndAction = {\n  type: typeof DRAG_END;\n};\n\ntype DragStartAction = {\n  type: typeof DRAG_START;\n  payload: number;\n};\n\ntype DropAction = {\n  type: typeof DROP;\n  payload: number;\n};\n\ntype MoveToPositionAction = {\n  type: typeof MOVE_TO_POSITION;\n  payload: number;\n};\n\ntype ResetAction = {\n  type: typeof RESET;\n};\n\ntype SetCloneAction = {\n  type: typeof SET_CLONE;\n  payload: Element;\n};\n\ntype SetDraggingSourceAction = {\n  type: typeof SET_DRAGGING_SOURCE;\n  payload: number;\n};\n\ntype SetDraggingTargetAction = {\n  type: typeof SET_DRAGGING_TARGET;\n  payload: number;\n};\n\nexport type Actions =\n  | ClearDraggingSourceAction\n  | ClearDraggingTargetAction\n  | DragEndAction\n  | DragStartAction\n  | DropAction\n  | MoveToPositionAction\n  | ResetAction\n  | SetCloneAction\n  | SetDraggingSourceAction\n  | SetDraggingTargetAction;\n\nexport const setClone = (payload: SetCloneAction['payload']): SetCloneAction => ({\n  type: SET_CLONE,\n  payload,\n});\n\nexport const clearDraggingSource = (): ClearDraggingSourceAction => ({ type: CLEAR_DRAGGING_SOURCE });\n\nexport const clearDraggingTarget = (): ClearDraggingTargetAction => ({ type: CLEAR_DRAGGING_TARGET });\n\nexport const dragEnd = (): DragEndAction => ({ type: DRAG_END });\n\nexport const dragStart = (draggingItemIndex: DragStartAction['payload']): DragStartAction => ({\n  type: DRAG_START,\n  payload: draggingItemIndex,\n});\n\nexport const drop = (targetItemIndex: DropAction['payload']): DropAction => ({\n  type: DROP,\n  payload: targetItemIndex,\n});\n\nexport const moveToPosition = (targetItemIndex: MoveToPositionAction['payload']): MoveToPositionAction => ({\n  type: MOVE_TO_POSITION,\n  payload: targetItemIndex,\n});\n\nexport const reset = (): ResetAction => ({ type: RESET });\n\nexport const setDraggingSource = (sourceItemIndex: SetDraggingSourceAction['payload']): SetDraggingSourceAction => ({\n  type: SET_DRAGGING_SOURCE,\n  payload: sourceItemIndex,\n});\n\nexport const setDraggingTarget = (targetItemIndex: SetDraggingTargetAction['payload']): SetDraggingTargetAction => ({\n  type: SET_DRAGGING_TARGET,\n  payload: targetItemIndex,\n});\n"],"mappings":";;AAuEA,IAAa,KAAY,OAAwD;CAC/E,MAAM;CACN;CACD,GAEY,WAAwD,EAAE,MAAM,GAAuB,GAEvF,WAAwD,EAAE,MAAM,GAAuB,GAEvF,WAAgC,EAAE,MAAM,GAAU,GAElD,KAAa,OAAoE;CAC5F,MAAM;CACN,SAAS;CACV,GAEY,KAAQ,OAAwD;CAC3E,MAAM;CACN,SAAS;CACV,GAEY,KAAkB,OAA4E;CACzG,MAAM;CACN,SAAS;CACV,GAEY,WAA4B,EAAE,MAAM,GAAO,GAE3C,KAAqB,OAAkF;CAClH,MAAM;CACN,SAAS;CACV,GAEY,KAAqB,OAAkF;CAClH,MAAM;CACN,SAAS;CACV"}

package/dist/components/Sortable/components/SortableContainer.js

@@ -1,9 +1,2 @@
-import "react/jsx-runtime";
-import "react";
-import "../../../clsx-OuTLNxxd.js";
-import "../../../Sortable.module-DCVXxKnw.js";
-import { a } from "../../../SortableProvider-BbwlEPIr.js";
-export {
-  a as SortableContainer
-};
-//# sourceMappingURL=SortableContainer.js.map
+import { r as e } from "../../../SortableProvider-Dc7hwkb5.js";
+export { e as SortableContainer };

package/dist/components/Sortable/components/SortableHandle.js

@@ -1,11 +1,15 @@
-import { jsx as o } from "react/jsx-runtime";
 import { Icon as e } from "../../Icon/Icon.js";
-import { s as t } from "../../../Sortable.module-DCVXxKnw.js";
-const r = "ontouchstart" in globalThis.document.documentElement;
-function m({ placement: n }) {
-  return r ? null : /* @__PURE__ */ o("div", { className: `${t.sortable__handle} ${t[`sortable__handle--${n}`]}`, children: /* @__PURE__ */ o(e, { name: "Dots" }) });
+import { t } from "../../../Sortable.module-BTUOSbOU.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/Sortable/components/SortableHandle.tsx
+var r = "ontouchstart" in globalThis.document.documentElement;
+function i({ placement: i }) {
+	return r ? null : /* @__PURE__ */ n("div", {
+		className: `${t.sortable__handle} ${t[`sortable__handle--${i}`]}`,
+		children: /* @__PURE__ */ n(e, { name: "Dots" })
+	});
 }
-export {
-  m as SortableHandle
-};
-//# sourceMappingURL=SortableHandle.js.map
+//#endregion
+export { i as SortableHandle };
+
+//# sourceMappingURL=SortableHandle.js.map

package/dist/components/Sortable/components/SortableHandle.js.map

@@ -1 +1 @@
-{"version":3,"file":"SortableHandle.js","sources":["../../../../src/components/Sortable/components/SortableHandle.tsx"],"sourcesContent":["import { Icon } from 'components/Icon';\nimport styles from 'components/Sortable/Sortable.module.css';\n\nexport interface SortableHandleProps {\n  placement: 'left' | 'right';\n}\n\nconst noSupportTouch = 'ontouchstart' in globalThis.document.documentElement;\n\nexport function SortableHandle({ placement }: SortableHandleProps) {\n  if (noSupportTouch) return null;\n\n  return (\n    <div className={`${styles['sortable__handle']} ${styles[`sortable__handle--${placement}`]}`}>\n      <Icon name=\"Dots\" />\n    </div>\n  );\n}\n"],"names":["noSupportTouch","SortableHandle","placement","styles","Icon"],"mappings":";;;AAOA,MAAMA,IAAiB,kBAAkB,WAAW,SAAS;AAEtD,SAASC,EAAe,EAAE,WAAAC,KAAkC;AACjE,SAAIF,IAAuB,yBAGxB,OAAA,EAAI,WAAW,GAAGG,EAAO,gBAAmB,IAAIA,EAAO,qBAAqBD,CAAS,EAAE,CAAC,IACvF,4BAACE,GAAA,EAAK,MAAK,QAAO,GACpB;AAEJ;"}
+{"version":3,"file":"SortableHandle.js","names":[],"sources":["../../../../src/components/Sortable/components/SortableHandle.tsx"],"sourcesContent":["import { Icon } from 'components/Icon';\nimport styles from 'components/Sortable/Sortable.module.css';\n\nexport interface SortableHandleProps {\n  placement: 'left' | 'right';\n}\n\nconst noSupportTouch = 'ontouchstart' in globalThis.document.documentElement;\n\nexport function SortableHandle({ placement }: SortableHandleProps) {\n  if (noSupportTouch) return null;\n\n  return (\n    <div className={`${styles['sortable__handle']} ${styles[`sortable__handle--${placement}`]}`}>\n      <Icon name=\"Dots\" />\n    </div>\n  );\n}\n"],"mappings":";;;;AAOA,IAAM,IAAiB,kBAAkB,WAAW,SAAS;AAE7D,SAAgB,EAAe,EAAE,gBAAkC;AAGjE,QAFI,IAAuB,OAGzB,kBAAC,OAAD;EAAK,WAAW,GAAG,EAAO,iBAAoB,GAAG,EAAO,qBAAqB;YAC3E,kBAAC,GAAD,EAAM,MAAK,QAAS,CAAA;EAChB,CAAA"}

package/dist/components/Sortable/components/SortableItem.js

@@ -1,114 +1,104 @@
-import { jsxs as i, jsx as r, Fragment as v } from "react/jsx-runtime";
-import { useState as S, useRef as Q, useEffect as k } from "react";
-import { c as G } from "../../../clsx-OuTLNxxd.js";
-import { Icon as w } from "../../Icon/Icon.js";
-import { SortableHandle as E } from "./SortableHandle.js";
-import { s as e } from "../../../Sortable.module-DCVXxKnw.js";
-import { u as J } from "../../../SortableProvider-BbwlEPIr.js";
-const j = ["Space", "ArrowDown", "ArrowUp"], F = "ontouchstart" in globalThis.document.documentElement, C = new Image(0, 0);
-C.src = // 1px transparent png
-"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==";
-function q({ children: D, handlePlacement: m, disabled: g, sortableItemColor: N, index: t }) {
-  const {
-    clone: h,
-    dragEnd: u,
-    draggingSource: c,
-    draggingTarget: f,
-    dragStart: _,
-    drop: T,
-    maxIndex: p,
-    moveToPosition: I,
-    setClone: U,
-    setDraggingSource: $
-  } = J(), [y, A] = S(!1), [K, d] = S(!1), n = Q(null), s = t !== void 0 && t >= 0;
-  k(() => {
-    n.current && globalThis.document.activeElement !== n.current && (t === f && f === c ? (n.current.focus(), d(!0)) : d(!1));
-  }, [t, f, c, $]);
-  function R(a) {
-    if (a.stopPropagation(), a.dataTransfer.effectAllowed = "move", a.dataTransfer.setDragImage(C, 0, 0), n.current) {
-      const o = n.current.cloneNode(!0);
-      o.classList.add(e["sortable__sort-item--ghost"]), U(o);
-    }
-    s && _(t), A(!0);
-  }
-  function B() {
-    y || (h && document.body.removeChild(h), A(!1), u());
-  }
-  function M(a) {
-    const { code: o } = a;
-    if (o === "Tab" && c !== void 0) {
-      u();
-      return;
-    }
-    if (j.includes(o) === !1 || !s) return;
-    if (o === "Space") {
-      K ? (d(!1), u()) : (d(!0), _(t));
-      return;
-    }
-    if (c === void 0) return;
-    const l = o === "ArrowUp" ? t - 1 : t + 1;
-    l < 0 || l > p || I(l);
-  }
-  function b(a) {
-    if (a.preventDefault(), !s) return;
-    _(t);
-    const { direction: o } = a.currentTarget.dataset, l = o === "up" ? t - 1 : t + 1;
-    T(l);
-  }
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: G(e["sortable__sort-item"], e[`sortable__sort-item--${N}`]),
-      draggable: !g,
-      onDragEnd: B,
-      onDragStart: R,
-      onKeyUpCapture: M,
-      ref: n,
-      role: "presentation",
-      tabIndex: 0,
-      children: [
-        /* @__PURE__ */ i(
-          "div",
-          {
-            className: `${e["sortable__sort-item__contents"]} ${e[`sortable__sort-item__contents--handle-${m}`]}`,
-            children: [
-              m === "left" && /* @__PURE__ */ r(E, { placement: "left" }),
-              D,
-              m === "right" && /* @__PURE__ */ r(E, { placement: "right" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ r("div", { className: e["sortable__sort-item__button-container"], "data-touch": F, children: !g && s && /* @__PURE__ */ r(v, { children: s && /* @__PURE__ */ i(v, { children: [
-          t > 0 && /* @__PURE__ */ i(
-            "button",
-            {
-              className: `${e["sortable__sort-item__handle"]} ${e["sortable__sort-item__handle--up"]}`,
-              "data-direction": "up",
-              onClickCapture: b,
-              children: [
-                /* @__PURE__ */ r("div", { className: e["sortable__sort-item__handle--icon"], children: /* @__PURE__ */ r(w, { name: "CheveronDown" }) }),
-                /* @__PURE__ */ r("span", { className: e["sortable__visually-hidden"], children: "Move up" })
-              ]
-            }
-          ),
-          t < p && /* @__PURE__ */ i(
-            "button",
-            {
-              className: `${e["sortable__sort-item__handle"]} ${e["sortable__sort-item__handle--down"]}`,
-              "data-direction": "down",
-              onClickCapture: b,
-              children: [
-                /* @__PURE__ */ r("div", { className: e["sortable__sort-item__handle--icon"], children: /* @__PURE__ */ r(w, { name: "CheveronDown" }) }),
-                /* @__PURE__ */ r("span", { className: e["sortable__visually-hidden"], children: "Move down" })
-              ]
-            }
-          )
-        ] }) }) })
-      ]
-    }
-  );
+import { t as e } from "../../../clsx-BD2qMUU1.js";
+import { Icon as t } from "../../Icon/Icon.js";
+import { t as n } from "../../../Sortable.module-BTUOSbOU.js";
+import { SortableHandle as r } from "./SortableHandle.js";
+import { n as i } from "../../../SortableProvider-Dc7hwkb5.js";
+import { useEffect as a, useRef as o, useState as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/Sortable/components/SortableItem.tsx
+var d = [
+	"Space",
+	"ArrowDown",
+	"ArrowUp"
+], f = "ontouchstart" in globalThis.document.documentElement, p = new Image(0, 0);
+p.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==";
+function m({ children: m, handlePlacement: h, disabled: g, sortableItemColor: _, index: v }) {
+	let { clone: y, dragEnd: b, draggingSource: x, draggingTarget: S, dragStart: C, drop: w, maxIndex: T, moveToPosition: E, setClone: D, setDraggingSource: O } = i(), [k, A] = s(!1), [j, M] = s(!1), N = o(null), P = v !== void 0 && v >= 0;
+	a(() => {
+		N.current && globalThis.document.activeElement !== N.current && (v === S && S === x ? (N.current.focus(), M(!0)) : M(!1));
+	}, [
+		v,
+		S,
+		x,
+		O
+	]);
+	function F(e) {
+		if (e.stopPropagation(), e.dataTransfer.effectAllowed = "move", e.dataTransfer.setDragImage(p, 0, 0), N.current) {
+			let e = N.current.cloneNode(!0);
+			e.classList.add(n["sortable__sort-item--ghost"]), D(e);
+		}
+		P && C(v), A(!0);
+	}
+	function I() {
+		k || (y && document.body.removeChild(y), A(!1), b());
+	}
+	function L(e) {
+		let { code: t } = e;
+		if (t === "Tab" && x !== void 0) {
+			b();
+			return;
+		}
+		if (d.includes(t) === !1 || !P) return;
+		if (t === "Space") {
+			j ? (M(!1), b()) : (M(!0), C(v));
+			return;
+		}
+		if (x === void 0) return;
+		let n = t === "ArrowUp" ? v - 1 : v + 1;
+		n < 0 || n > T || E(n);
+	}
+	function R(e) {
+		if (e.preventDefault(), !P) return;
+		C(v);
+		let { direction: t } = e.currentTarget.dataset;
+		w(t === "up" ? v - 1 : v + 1);
+	}
+	return /* @__PURE__ */ u("div", {
+		className: e(n["sortable__sort-item"], n[`sortable__sort-item--${_}`]),
+		draggable: !g,
+		onDragEnd: I,
+		onDragStart: F,
+		onKeyUpCapture: L,
+		ref: N,
+		role: "presentation",
+		tabIndex: 0,
+		children: [/* @__PURE__ */ u("div", {
+			className: `${n["sortable__sort-item__contents"]} ${n[`sortable__sort-item__contents--handle-${h}`]}`,
+			children: [
+				h === "left" && /* @__PURE__ */ l(r, { placement: "left" }),
+				m,
+				h === "right" && /* @__PURE__ */ l(r, { placement: "right" })
+			]
+		}), /* @__PURE__ */ l("div", {
+			className: n["sortable__sort-item__button-container"],
+			"data-touch": f,
+			children: !g && P && /* @__PURE__ */ l(c, { children: P && /* @__PURE__ */ u(c, { children: [v > 0 && /* @__PURE__ */ u("button", {
+				className: `${n["sortable__sort-item__handle"]} ${n["sortable__sort-item__handle--up"]}`,
+				"data-direction": "up",
+				onClickCapture: R,
+				children: [/* @__PURE__ */ l("div", {
+					className: n["sortable__sort-item__handle--icon"],
+					children: /* @__PURE__ */ l(t, { name: "CheveronDown" })
+				}), /* @__PURE__ */ l("span", {
+					className: n["sortable__visually-hidden"],
+					children: "Move up"
+				})]
+			}), v < T && /* @__PURE__ */ u("button", {
+				className: `${n["sortable__sort-item__handle"]} ${n["sortable__sort-item__handle--down"]}`,
+				"data-direction": "down",
+				onClickCapture: R,
+				children: [/* @__PURE__ */ l("div", {
+					className: n["sortable__sort-item__handle--icon"],
+					children: /* @__PURE__ */ l(t, { name: "CheveronDown" })
+				}), /* @__PURE__ */ l("span", {
+					className: n["sortable__visually-hidden"],
+					children: "Move down"
+				})]
+			})] }) })
+		})]
+	});
 }
-export {
-  q as SortableItem
-};
-//# sourceMappingURL=SortableItem.js.map
+//#endregion
+export { m as SortableItem };
+
+//# sourceMappingURL=SortableItem.js.map

package/dist/components/Sortable/components/SortableItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SortableItem.js","sources":["../../../../src/components/Sortable/components/SortableItem.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { DragEvent, MouseEvent, KeyboardEvent as ReactKeyboardEvent, ReactNode } from 'react';\nimport type { SortableHandleProps } from './SortableHandle';\nimport type { SortableItemColors } from 'components/Sortable/Sortable';\n\nimport { Icon } from 'components/Icon';\nimport { SortableHandle } from 'components/Sortable/components/SortableHandle';\nimport styles from 'components/Sortable/Sortable.module.css';\nimport { useSortable } from 'components/Sortable/SortableProvider';\n\nexport interface SortableItemProps {\n  children: ReactNode;\n  handlePlacement: SortableHandleProps['placement'];\n  disabled?: boolean;\n  sortableItemColor: SortableItemColors;\n  index: number;\n}\n\nconst ACCESS_KEYS = ['Space', 'ArrowDown', 'ArrowUp'];\nconst noSupportTouch = 'ontouchstart' in globalThis.document.documentElement;\nconst dragImage = new Image(0, 0);\n\ndragImage.src =\n  // 1px transparent png\n  'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==';\n\nexport function SortableItem({ children, handlePlacement, disabled, sortableItemColor, index }: SortableItemProps) {\n  const {\n    clone,\n    dragEnd,\n    draggingSource,\n    draggingTarget,\n    dragStart,\n    drop,\n    maxIndex,\n    moveToPosition,\n    setClone,\n    setDraggingSource,\n  } = useSortable();\n  const [grabbing, setGrabbing] = useState(false);\n  const [moving, setmoving] = useState(false);\n  const itemRef = useRef<HTMLDivElement>(null);\n  const hasIndex = index !== undefined && index >= 0;\n\n  useEffect(() => {\n    if (!itemRef.current) return;\n    if (globalThis.document.activeElement === itemRef.current) return;\n\n    if (index === draggingTarget && draggingTarget === draggingSource) {\n      // Manually setting focus after an item has been moved with the keyboard; focus is lost after rerender\n      itemRef.current.focus();\n      setmoving(true);\n    } else {\n      setmoving(false);\n    }\n  }, [index, draggingTarget, draggingSource, setDraggingSource]);\n\n  function handleDragStart(event: DragEvent<HTMLDivElement>) {\n    event.stopPropagation();\n\n    event.dataTransfer.effectAllowed = 'move';\n    event.dataTransfer.setDragImage(dragImage, 0, 0);\n\n    if (itemRef.current) {\n      const cloned = itemRef.current.cloneNode(true) as Element;\n\n      cloned.classList.add(styles['sortable__sort-item--ghost']);\n\n      setClone(cloned);\n    }\n\n    if (hasIndex) dragStart(index);\n    setGrabbing(true);\n  }\n\n  function handleDragEnd() {\n    if (grabbing) return;\n\n    if (clone) document.body.removeChild(clone);\n\n    setGrabbing(false);\n    dragEnd();\n  }\n\n  function handleKeyUp(event: ReactKeyboardEvent<HTMLDivElement>) {\n    const { code } = event;\n\n    if (code === 'Tab' && draggingSource !== undefined) {\n      dragEnd();\n      return;\n    }\n\n    if (ACCESS_KEYS.includes(code) === false) return;\n\n    if (!hasIndex) return;\n\n    if (code === 'Space') {\n      if (moving) {\n        setmoving(false);\n        dragEnd();\n      } else {\n        setmoving(true);\n        dragStart(index);\n      }\n\n      return;\n    }\n\n    if (draggingSource === undefined) return;\n\n    const newTarget = code === 'ArrowUp' ? index - 1 : index + 1;\n\n    if (newTarget < 0 || newTarget > maxIndex) return;\n\n    moveToPosition(newTarget);\n  }\n\n  function handleMove(event: MouseEvent<HTMLButtonElement>) {\n    event.preventDefault();\n\n    if (!hasIndex) return;\n\n    dragStart(index);\n\n    const { direction } = event.currentTarget.dataset;\n    const newTarget = direction === 'up' ? index - 1 : index + 1;\n\n    drop(newTarget);\n  }\n\n  return (\n    <div\n      className={clsx(styles['sortable__sort-item'], styles[`sortable__sort-item--${sortableItemColor}`])}\n      draggable={!disabled}\n      onDragEnd={handleDragEnd}\n      onDragStart={handleDragStart}\n      onKeyUpCapture={handleKeyUp}\n      ref={itemRef}\n      role=\"presentation\"\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n      tabIndex={0}\n    >\n      <div\n        className={`${styles['sortable__sort-item__contents']} ${styles[`sortable__sort-item__contents--handle-${handlePlacement}`]}`}\n      >\n        {handlePlacement === 'left' && <SortableHandle placement=\"left\" />}\n        {children}\n        {handlePlacement === 'right' && <SortableHandle placement=\"right\" />}\n      </div>\n\n      <div className={styles['sortable__sort-item__button-container']} data-touch={noSupportTouch}>\n        {!disabled && hasIndex && (\n          <>\n            {hasIndex && (\n              <>\n                {index > 0 && (\n                  <button\n                    className={`${styles['sortable__sort-item__handle']} ${styles['sortable__sort-item__handle--up']}`}\n                    data-direction=\"up\"\n                    onClickCapture={handleMove}\n                  >\n                    <div className={styles['sortable__sort-item__handle--icon']}>\n                      <Icon name=\"CheveronDown\" />\n                    </div>\n                    <span className={styles['sortable__visually-hidden']}>Move up</span>\n                  </button>\n                )}\n\n                {index < maxIndex && (\n                  <button\n                    className={`${styles['sortable__sort-item__handle']} ${styles['sortable__sort-item__handle--down']}`}\n                    data-direction=\"down\"\n                    onClickCapture={handleMove}\n                  >\n                    <div className={styles['sortable__sort-item__handle--icon']}>\n                      <Icon name=\"CheveronDown\" />\n                    </div>\n                    <span className={styles['sortable__visually-hidden']}>Move down</span>\n                  </button>\n                )}\n              </>\n            )}\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["ACCESS_KEYS","noSupportTouch","dragImage","SortableItem","children","handlePlacement","disabled","sortableItemColor","index","clone","dragEnd","draggingSource","draggingTarget","dragStart","drop","maxIndex","moveToPosition","setClone","setDraggingSource","useSortable","grabbing","setGrabbing","useState","moving","setmoving","itemRef","useRef","hasIndex","useEffect","handleDragStart","event","cloned","styles","handleDragEnd","handleKeyUp","code","newTarget","handleMove","direction","jsxs","clsx","jsx","SortableHandle","Fragment","Icon"],"mappings":"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"}
+{"version":3,"file":"SortableItem.js","names":[],"sources":["../../../../src/components/Sortable/components/SortableItem.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { DragEvent, MouseEvent, KeyboardEvent as ReactKeyboardEvent, ReactNode } from 'react';\nimport type { SortableHandleProps } from './SortableHandle';\nimport type { SortableItemColors } from 'components/Sortable/Sortable';\n\nimport { Icon } from 'components/Icon';\nimport { SortableHandle } from 'components/Sortable/components/SortableHandle';\nimport styles from 'components/Sortable/Sortable.module.css';\nimport { useSortable } from 'components/Sortable/SortableProvider';\n\nexport interface SortableItemProps {\n  children: ReactNode;\n  handlePlacement: SortableHandleProps['placement'];\n  disabled?: boolean;\n  sortableItemColor: SortableItemColors;\n  index: number;\n}\n\nconst ACCESS_KEYS = ['Space', 'ArrowDown', 'ArrowUp'];\nconst noSupportTouch = 'ontouchstart' in globalThis.document.documentElement;\nconst dragImage = new Image(0, 0);\n\ndragImage.src =\n  // 1px transparent png\n  'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==';\n\nexport function SortableItem({ children, handlePlacement, disabled, sortableItemColor, index }: SortableItemProps) {\n  const {\n    clone,\n    dragEnd,\n    draggingSource,\n    draggingTarget,\n    dragStart,\n    drop,\n    maxIndex,\n    moveToPosition,\n    setClone,\n    setDraggingSource,\n  } = useSortable();\n  const [grabbing, setGrabbing] = useState(false);\n  const [moving, setmoving] = useState(false);\n  const itemRef = useRef<HTMLDivElement>(null);\n  const hasIndex = index !== undefined && index >= 0;\n\n  useEffect(() => {\n    if (!itemRef.current) return;\n    if (globalThis.document.activeElement === itemRef.current) return;\n\n    if (index === draggingTarget && draggingTarget === draggingSource) {\n      // Manually setting focus after an item has been moved with the keyboard; focus is lost after rerender\n      itemRef.current.focus();\n      setmoving(true);\n    } else {\n      setmoving(false);\n    }\n  }, [index, draggingTarget, draggingSource, setDraggingSource]);\n\n  function handleDragStart(event: DragEvent<HTMLDivElement>) {\n    event.stopPropagation();\n\n    event.dataTransfer.effectAllowed = 'move';\n    event.dataTransfer.setDragImage(dragImage, 0, 0);\n\n    if (itemRef.current) {\n      const cloned = itemRef.current.cloneNode(true) as Element;\n\n      cloned.classList.add(styles['sortable__sort-item--ghost']);\n\n      setClone(cloned);\n    }\n\n    if (hasIndex) dragStart(index);\n    setGrabbing(true);\n  }\n\n  function handleDragEnd() {\n    if (grabbing) return;\n\n    if (clone) document.body.removeChild(clone);\n\n    setGrabbing(false);\n    dragEnd();\n  }\n\n  function handleKeyUp(event: ReactKeyboardEvent<HTMLDivElement>) {\n    const { code } = event;\n\n    if (code === 'Tab' && draggingSource !== undefined) {\n      dragEnd();\n      return;\n    }\n\n    if (ACCESS_KEYS.includes(code) === false) return;\n\n    if (!hasIndex) return;\n\n    if (code === 'Space') {\n      if (moving) {\n        setmoving(false);\n        dragEnd();\n      } else {\n        setmoving(true);\n        dragStart(index);\n      }\n\n      return;\n    }\n\n    if (draggingSource === undefined) return;\n\n    const newTarget = code === 'ArrowUp' ? index - 1 : index + 1;\n\n    if (newTarget < 0 || newTarget > maxIndex) return;\n\n    moveToPosition(newTarget);\n  }\n\n  function handleMove(event: MouseEvent<HTMLButtonElement>) {\n    event.preventDefault();\n\n    if (!hasIndex) return;\n\n    dragStart(index);\n\n    const { direction } = event.currentTarget.dataset;\n    const newTarget = direction === 'up' ? index - 1 : index + 1;\n\n    drop(newTarget);\n  }\n\n  return (\n    <div\n      className={clsx(styles['sortable__sort-item'], styles[`sortable__sort-item--${sortableItemColor}`])}\n      draggable={!disabled}\n      onDragEnd={handleDragEnd}\n      onDragStart={handleDragStart}\n      onKeyUpCapture={handleKeyUp}\n      ref={itemRef}\n      role=\"presentation\"\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n      tabIndex={0}\n    >\n      <div\n        className={`${styles['sortable__sort-item__contents']} ${styles[`sortable__sort-item__contents--handle-${handlePlacement}`]}`}\n      >\n        {handlePlacement === 'left' && <SortableHandle placement=\"left\" />}\n        {children}\n        {handlePlacement === 'right' && <SortableHandle placement=\"right\" />}\n      </div>\n\n      <div className={styles['sortable__sort-item__button-container']} data-touch={noSupportTouch}>\n        {!disabled && hasIndex && (\n          <>\n            {hasIndex && (\n              <>\n                {index > 0 && (\n                  <button\n                    className={`${styles['sortable__sort-item__handle']} ${styles['sortable__sort-item__handle--up']}`}\n                    data-direction=\"up\"\n                    onClickCapture={handleMove}\n                  >\n                    <div className={styles['sortable__sort-item__handle--icon']}>\n                      <Icon name=\"CheveronDown\" />\n                    </div>\n                    <span className={styles['sortable__visually-hidden']}>Move up</span>\n                  </button>\n                )}\n\n                {index < maxIndex && (\n                  <button\n                    className={`${styles['sortable__sort-item__handle']} ${styles['sortable__sort-item__handle--down']}`}\n                    data-direction=\"down\"\n                    onClickCapture={handleMove}\n                  >\n                    <div className={styles['sortable__sort-item__handle--icon']}>\n                      <Icon name=\"CheveronDown\" />\n                    </div>\n                    <span className={styles['sortable__visually-hidden']}>Move down</span>\n                  </button>\n                )}\n              </>\n            )}\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/Sortable/constants.js

@@ -1,14 +1,6 @@
-const G = "CLEAR_DRAGGING_SOURCE", R = "CLEAR_DRAGGING_TARGET", E = "DRAG_END", _ = "DRAG_START", T = "DROP", A = "MOVE_TO_POSITION", D = "RESET", O = "SET_CLONE", S = "SET_DRAGGING_SOURCE", N = "SET_DRAGGING_TARGET";
-export {
-  G as CLEAR_DRAGGING_SOURCE,
-  R as CLEAR_DRAGGING_TARGET,
-  E as DRAG_END,
-  _ as DRAG_START,
-  T as DROP,
-  A as MOVE_TO_POSITION,
-  D as RESET,
-  O as SET_CLONE,
-  S as SET_DRAGGING_SOURCE,
-  N as SET_DRAGGING_TARGET
-};
-//# sourceMappingURL=constants.js.map
+//#region src/components/Sortable/constants.ts
+var e = "CLEAR_DRAGGING_SOURCE", t = "CLEAR_DRAGGING_TARGET", n = "DRAG_END", r = "DRAG_START", i = "DROP", a = "MOVE_TO_POSITION", o = "RESET", s = "SET_CLONE", c = "SET_DRAGGING_SOURCE", l = "SET_DRAGGING_TARGET";
+//#endregion
+export { e as CLEAR_DRAGGING_SOURCE, t as CLEAR_DRAGGING_TARGET, n as DRAG_END, r as DRAG_START, i as DROP, a as MOVE_TO_POSITION, o as RESET, s as SET_CLONE, c as SET_DRAGGING_SOURCE, l as SET_DRAGGING_TARGET };
+
+//# sourceMappingURL=constants.js.map