@get-set/gs-sortable 0.0.36 → 0.0.37
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/README.md +99 -1
- package/actions/afterAllImagesLoad.ts +36 -0
- package/actions/calculate.ts +155 -0
- package/actions/calculateOnSort.ts +270 -0
- package/actions/checkItemInContainer.ts +22 -0
- package/actions/destroy.ts +30 -0
- package/actions/general.ts +72 -0
- package/actions/getCurrentParams.ts +32 -0
- package/actions/init.ts +31 -0
- package/actions/initDraggable.ts +85 -0
- package/actions/initMouseMove.ts +120 -0
- package/actions/initScroll.ts +21 -0
- package/actions/initSortEnd.ts +87 -0
- package/components/GSSortable.tsx +160 -0
- package/components/styles/GSSortable.css +39 -0
- package/components/styles/GSSortable.scss +38 -0
- package/components/styles/GSSortableCSS.ts +41 -0
- package/constants/constParams.ts +5 -0
- package/constants/defaultParams.ts +20 -0
- package/constants/types.ts +7 -0
- package/dist/GSSortable.d.ts +2 -0
- package/dist/actions/afterAllImagesLoad.d.ts +4 -0
- package/dist/actions/afterAllImagesLoad.d.ts.map +1 -0
- package/dist/actions/afterAllImagesLoad.js +35 -0
- package/dist/actions/afterAllImagesLoad.js.map +1 -0
- package/dist/actions/calculate.d.ts +3 -2
- package/dist/actions/calculate.d.ts.map +1 -0
- package/dist/actions/calculate.js +13 -18
- package/dist/actions/calculate.js.map +1 -1
- package/dist/actions/calculateOnSort.d.ts +3 -2
- package/dist/actions/calculateOnSort.d.ts.map +1 -0
- package/dist/actions/calculateOnSort.js +51 -70
- package/dist/actions/calculateOnSort.js.map +1 -1
- package/dist/actions/checkItemInContainer.d.ts +1 -0
- package/dist/actions/checkItemInContainer.d.ts.map +1 -0
- package/dist/actions/checkItemInContainer.js +8 -17
- package/dist/actions/checkItemInContainer.js.map +1 -1
- package/dist/actions/destroy.d.ts +3 -8
- package/dist/actions/destroy.d.ts.map +1 -0
- package/dist/actions/destroy.js +7 -9
- package/dist/actions/destroy.js.map +1 -1
- package/dist/actions/general.d.ts +1 -0
- package/dist/actions/general.d.ts.map +1 -0
- package/dist/actions/general.js +5 -12
- package/dist/actions/general.js.map +1 -1
- package/dist/actions/getCurrentParams.d.ts +4 -9
- package/dist/actions/getCurrentParams.d.ts.map +1 -0
- package/dist/actions/getCurrentParams.js +15 -18
- package/dist/actions/getCurrentParams.js.map +1 -1
- package/dist/actions/init.d.ts +3 -2
- package/dist/actions/init.d.ts.map +1 -0
- package/dist/actions/init.js +13 -16
- package/dist/actions/init.js.map +1 -1
- package/dist/actions/initDraggable.d.ts +3 -2
- package/dist/actions/initDraggable.d.ts.map +1 -0
- package/dist/actions/initDraggable.js +14 -22
- package/dist/actions/initDraggable.js.map +1 -1
- package/dist/actions/initMouseMove.d.ts +1 -0
- package/dist/actions/initMouseMove.d.ts.map +1 -0
- package/dist/actions/initMouseMove.js +40 -53
- package/dist/actions/initMouseMove.js.map +1 -1
- package/dist/actions/initScroll.d.ts +1 -0
- package/dist/actions/initScroll.d.ts.map +1 -0
- package/dist/actions/initScroll.js +7 -15
- package/dist/actions/initScroll.js.map +1 -1
- package/dist/actions/initSortEnd.d.ts +2 -1
- package/dist/actions/initSortEnd.d.ts.map +1 -0
- package/dist/actions/initSortEnd.js +62 -71
- package/dist/actions/initSortEnd.js.map +1 -1
- package/dist/components/GSSortable.d.ts +4 -19
- package/dist/components/GSSortable.d.ts.map +1 -0
- package/dist/components/GSSortable.js +72 -105
- package/dist/components/GSSortable.js.map +1 -1
- package/dist/components/styles/GSSortableCSS.d.ts +2 -1
- package/dist/components/styles/GSSortableCSS.d.ts.map +1 -0
- package/dist/components/styles/GSSortableCSS.js +3 -4
- package/dist/components/styles/GSSortableCSS.js.map +1 -1
- package/dist/constants/constParams.d.ts +4 -3
- package/dist/constants/constParams.d.ts.map +1 -0
- package/dist/constants/constParams.js +2 -4
- package/dist/constants/constParams.js.map +1 -1
- package/dist/constants/defaultParams.d.ts +3 -2
- package/dist/constants/defaultParams.d.ts.map +1 -0
- package/dist/constants/defaultParams.js +3 -8
- package/dist/constants/defaultParams.js.map +1 -1
- package/dist/constants/types.d.ts +1 -0
- package/dist/constants/types.d.ts.map +1 -0
- package/dist/constants/types.js +1 -3
- package/dist/constants/types.js.map +1 -1
- package/dist/helpers/uihelpers.d.ts +2 -1
- package/dist/helpers/uihelpers.d.ts.map +1 -0
- package/dist/helpers/uihelpers.js +9 -23
- package/dist/helpers/uihelpers.js.map +1 -1
- package/dist/types/params.d.ts +23 -0
- package/dist/types/params.d.ts.map +1 -0
- package/dist/types/params.js +2 -0
- package/dist/types/params.js.map +1 -0
- package/dist/types/ref.d.ts +41 -0
- package/dist/types/ref.d.ts.map +1 -0
- package/dist/types/ref.js +2 -0
- package/dist/types/ref.js.map +1 -0
- package/dist-js/bundle.js +1181 -0
- package/helpers/uihelpers.ts +44 -0
- package/package.json +71 -43
- package/styles/GSSortable.css +39 -0
- package/styles/GSSortable.scss +38 -0
- package/types/global.d.ts +19 -0
- package/types/params.ts +24 -0
- package/types/ref.ts +41 -0
- package/index.js +0 -3
|
@@ -1,52 +1,38 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const
|
|
5
|
-
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
|
|
6
|
-
const r = (Math.random() * 16) | 0, v = c === 'x' ? r : (r & 0x3) | 0x8;
|
|
1
|
+
export const NewGuid = () => {
|
|
2
|
+
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
|
|
3
|
+
const r = (Math.random() * 16) | 0;
|
|
4
|
+
const v = c === 'x' ? r : (r & 0x3) | 0x8;
|
|
7
5
|
return v.toString(16);
|
|
8
6
|
});
|
|
9
7
|
};
|
|
10
|
-
|
|
11
|
-
const removeCssToHead = (key) => {
|
|
8
|
+
export const removeCssFromHead = (key) => {
|
|
12
9
|
const style = document.querySelector(`head style[data-key='${key}']`);
|
|
13
10
|
if (style != null) {
|
|
14
11
|
style.remove();
|
|
15
12
|
}
|
|
16
13
|
};
|
|
17
|
-
|
|
18
|
-
const injectCssToHead = (css, key) => {
|
|
19
|
-
// Create a <style> element
|
|
14
|
+
export const injectCssToHead = (css, key) => {
|
|
20
15
|
const style = document.createElement('style');
|
|
21
16
|
style.dataset.key = key;
|
|
22
|
-
// Set the CSS as the inner content of the <style> element
|
|
23
17
|
style.innerHTML = css;
|
|
24
|
-
// Append the <style> element to the <head>
|
|
25
18
|
document.head.appendChild(style);
|
|
26
19
|
};
|
|
27
|
-
exports.injectCssToHead = injectCssToHead;
|
|
28
20
|
const camelToKebab = (str) => str.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
|
|
29
|
-
const convertScssToCss = (scssObj) => {
|
|
30
|
-
// Helper function to handle nested objects
|
|
21
|
+
export const convertScssToCss = (scssObj) => {
|
|
31
22
|
const convertObjectToCss = (obj, parent = '') => {
|
|
32
23
|
let css = '';
|
|
33
|
-
|
|
34
|
-
for (let key in obj) {
|
|
24
|
+
for (const key in obj) {
|
|
35
25
|
const value = obj[key];
|
|
36
26
|
if (typeof value === 'object') {
|
|
37
|
-
// If the value is an object, it's a nested rule, so we recurse
|
|
38
27
|
const newParent = parent ? `${parent} ${key}` : key;
|
|
39
|
-
css += convertObjectToCss(value, newParent);
|
|
28
|
+
css += convertObjectToCss(value, newParent);
|
|
40
29
|
}
|
|
41
30
|
else {
|
|
42
|
-
// Otherwise, it's a property-value pair (e.g. color: red)
|
|
43
31
|
css += `${parent} { ${camelToKebab(key)}: ${value}; }\n`;
|
|
44
32
|
}
|
|
45
33
|
}
|
|
46
34
|
return css;
|
|
47
35
|
};
|
|
48
|
-
// Start recursion with the top-level object
|
|
49
36
|
return convertObjectToCss(scssObj, '');
|
|
50
37
|
};
|
|
51
|
-
exports.convertScssToCss = convertScssToCss;
|
|
52
38
|
//# sourceMappingURL=uihelpers.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"uihelpers.js","sourceRoot":"","sources":["../../
|
|
1
|
+
{"version":3,"file":"uihelpers.js","sourceRoot":"","sources":["../../helpers/uihelpers.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,OAAO,GAAG,GAAW,EAAE;IAClC,OAAO,sCAAsC,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;QACnE,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC;QACnC,MAAM,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;QAC1C,OAAO,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IACxB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,GAAW,EAAQ,EAAE;IACrD,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,wBAAwB,GAAG,IAAI,CAAC,CAAC;IACtE,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;QAClB,KAAK,CAAC,MAAM,EAAE,CAAC;IACjB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,GAAW,EAAE,GAAW,EAAQ,EAAE;IAChE,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC9C,KAAK,CAAC,OAAO,CAAC,GAAG,GAAG,GAAG,CAAC;IACxB,KAAK,CAAC,SAAS,GAAG,GAAG,CAAC;IACtB,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AACnC,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,GAAW,EAAU,EAAE,CAC3C,GAAG,CAAC,OAAO,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC;AAExD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,OAA4B,EAAU,EAAE;IACvE,MAAM,kBAAkB,GAAG,CACzB,GAAwB,EACxB,SAAiB,EAAE,EACX,EAAE;QACV,IAAI,GAAG,GAAG,EAAE,CAAC;QACb,KAAK,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;YACtB,MAAM,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;YACvB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;gBAC9B,MAAM,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,GAAG,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC;gBACpD,GAAG,IAAI,kBAAkB,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;YAC9C,CAAC;iBAAM,CAAC;gBACN,GAAG,IAAI,GAAG,MAAM,MAAM,YAAY,CAAC,GAAG,CAAC,KAAK,KAAK,OAAO,CAAC;YAC3D,CAAC;QACH,CAAC;QACD,OAAO,GAAG,CAAC;IACb,CAAC,CAAC;IACF,OAAO,kBAAkB,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;AACzC,CAAC,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
export interface ResponsiveOption {
|
|
2
|
+
windowSize: number;
|
|
3
|
+
params: Partial<Params>;
|
|
4
|
+
}
|
|
5
|
+
export interface Params {
|
|
6
|
+
reference?: string;
|
|
7
|
+
handler?: string;
|
|
8
|
+
className?: string;
|
|
9
|
+
width?: string;
|
|
10
|
+
takeClone?: boolean;
|
|
11
|
+
afterSort?: (items: NodeListOf<Element>) => void;
|
|
12
|
+
gsx?: Record<string, any>;
|
|
13
|
+
gap?: string;
|
|
14
|
+
allowOutOfBox?: boolean;
|
|
15
|
+
count?: number;
|
|
16
|
+
type?: 'row' | 'column' | 'grid';
|
|
17
|
+
acceptFrom?: string[];
|
|
18
|
+
responsive?: ResponsiveOption[];
|
|
19
|
+
beforeInit?: () => void;
|
|
20
|
+
afterInit?: () => void;
|
|
21
|
+
[key: string]: any;
|
|
22
|
+
}
|
|
23
|
+
//# sourceMappingURL=params.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"params.d.ts","sourceRoot":"","sources":["../../types/params.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;CACzB;AAED,MAAM,WAAW,MAAM;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IACjD,GAAG,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC1B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;IAEjC,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAChC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"params.js","sourceRoot":"","sources":["../../types/params.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { Params } from './params';
|
|
2
|
+
export interface UiData {
|
|
3
|
+
containerPT: number;
|
|
4
|
+
containerPR: number;
|
|
5
|
+
containerPB: number;
|
|
6
|
+
containerPL: number;
|
|
7
|
+
containerWidth: number;
|
|
8
|
+
currentHeight: number;
|
|
9
|
+
currentWidth: number;
|
|
10
|
+
itemWidth: number;
|
|
11
|
+
gapX: number;
|
|
12
|
+
gapY: number;
|
|
13
|
+
}
|
|
14
|
+
export interface Ref {
|
|
15
|
+
grid: HTMLElement;
|
|
16
|
+
currentParams: Params & {
|
|
17
|
+
reference: string;
|
|
18
|
+
};
|
|
19
|
+
itemWidth?: string;
|
|
20
|
+
uiData?: UiData;
|
|
21
|
+
count?: number;
|
|
22
|
+
isAdjusting: boolean;
|
|
23
|
+
itemResizeObservers?: ResizeObserver[];
|
|
24
|
+
calculate?: () => void;
|
|
25
|
+
destroy: () => void;
|
|
26
|
+
refresh: () => void;
|
|
27
|
+
}
|
|
28
|
+
export interface DraggableInfo {
|
|
29
|
+
moved: boolean;
|
|
30
|
+
ref: Ref;
|
|
31
|
+
$el: HTMLElement;
|
|
32
|
+
clientX: number;
|
|
33
|
+
clientY: number;
|
|
34
|
+
fromTop: number;
|
|
35
|
+
fromLeft: number;
|
|
36
|
+
placeholder?: HTMLElement;
|
|
37
|
+
newTop: number;
|
|
38
|
+
newLeft: number;
|
|
39
|
+
index?: number;
|
|
40
|
+
}
|
|
41
|
+
//# sourceMappingURL=ref.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ref.d.ts","sourceRoot":"","sources":["../../types/ref.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,MAAM,WAAW,MAAM;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,GAAG;IAClB,IAAI,EAAE,WAAW,CAAC;IAClB,aAAa,EAAE,MAAM,GAAG;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,CAAC,EAAE,cAAc,EAAE,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,OAAO,CAAC;IACf,GAAG,EAAE,GAAG,CAAC;IACT,GAAG,EAAE,WAAW,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ref.js","sourceRoot":"","sources":["../../types/ref.ts"],"names":[],"mappings":""}
|