@sps-woodland/column-manager 8.26.1 → 8.26.2
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/lib/index.js +18 -18
- package/lib/index.umd.cjs +2 -2
- package/package.json +11 -11
package/lib/index.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as e from "react";
|
|
2
2
|
import { Metadata as R, I18nContext as I, useChildTestIdAttrBuilder as A } from "@sps-woodland/core";
|
|
3
3
|
import { AddToList as L } from "@sps-woodland/add-to-list";
|
|
4
|
-
import { sprinkles as
|
|
5
|
-
import { SpsModal as
|
|
6
|
-
import { ModalKind as
|
|
4
|
+
import { sprinkles as V } from "@sps-woodland/tokens";
|
|
5
|
+
import { SpsModal as x, SpsModalFooter as F, SpsButton as P } from "@spscommerce/ds-react";
|
|
6
|
+
import { ModalKind as j, ModalSize as q, ButtonKind as O } from "@spscommerce/ds-shared";
|
|
7
7
|
import { code as c } from "@spscommerce/utils";
|
|
8
8
|
function B({
|
|
9
9
|
isOpen: s,
|
|
@@ -25,34 +25,34 @@ function B({
|
|
|
25
25
|
onClose: E,
|
|
26
26
|
"data-testid": T
|
|
27
27
|
}) {
|
|
28
|
-
const [M,
|
|
28
|
+
const [M, H] = e.useState(!!s), { t: u } = e.useContext(I), k = A({ "data-testid": T }), [d, S] = e.useState({
|
|
29
29
|
visibleColumns: a,
|
|
30
30
|
hiddenColumns: i
|
|
31
31
|
}), w = () => {
|
|
32
|
-
|
|
32
|
+
H(!1), E == null || E();
|
|
33
33
|
};
|
|
34
34
|
return e.useEffect(() => {
|
|
35
35
|
M && (S({ visibleColumns: a, hiddenColumns: i }), m == null || m());
|
|
36
36
|
}, [M]), e.useEffect(() => {
|
|
37
|
-
|
|
37
|
+
H(!!s);
|
|
38
38
|
}, [s]), M ? /* @__PURE__ */ e.createElement(
|
|
39
|
-
|
|
39
|
+
x,
|
|
40
40
|
{
|
|
41
|
-
title: p || u("design-system:columnManager.title"),
|
|
42
|
-
kind:
|
|
43
|
-
size:
|
|
41
|
+
title: p || u("design-system:columnManager.title", { defaultValue: "Manage Table Columns" }),
|
|
42
|
+
kind: j.GENERAL,
|
|
43
|
+
size: q.LARGE,
|
|
44
44
|
"data-testid": T,
|
|
45
45
|
onClose: w
|
|
46
46
|
},
|
|
47
47
|
/* @__PURE__ */ e.createElement(
|
|
48
48
|
L,
|
|
49
49
|
{
|
|
50
|
-
onHeader: h || u("design-system:columnManager.onListHeader"),
|
|
51
|
-
offHeader: r || u("design-system:columnManager.offListHeader"),
|
|
50
|
+
onHeader: h || u("design-system:columnManager.onListHeader", { defaultValue: "Visible Columns" }),
|
|
51
|
+
offHeader: r || u("design-system:columnManager.offListHeader", { defaultValue: "Hidden Columns" }),
|
|
52
52
|
onList: d.visibleColumns,
|
|
53
53
|
offList: d.hiddenColumns,
|
|
54
|
-
onChange: (
|
|
55
|
-
S({ visibleColumns:
|
|
54
|
+
onChange: (y) => {
|
|
55
|
+
S({ visibleColumns: y.onList, hiddenColumns: y.offList });
|
|
56
56
|
},
|
|
57
57
|
manualSort: o,
|
|
58
58
|
maxDisplayedItems: t,
|
|
@@ -63,17 +63,17 @@ function B({
|
|
|
63
63
|
...k("add-to-list")
|
|
64
64
|
}
|
|
65
65
|
),
|
|
66
|
-
/* @__PURE__ */ e.createElement(
|
|
66
|
+
/* @__PURE__ */ e.createElement(F, null, /* @__PURE__ */ e.createElement(
|
|
67
67
|
P,
|
|
68
68
|
{
|
|
69
69
|
kind: O.DEFAULT,
|
|
70
70
|
onClick: () => {
|
|
71
71
|
S({ visibleColumns: a, hiddenColumns: i }), w();
|
|
72
72
|
},
|
|
73
|
-
className:
|
|
73
|
+
className: V({ mr: "sm" }),
|
|
74
74
|
...k("cancel-button")
|
|
75
75
|
},
|
|
76
|
-
v || u("design-system:columnManager.cancelButton")
|
|
76
|
+
v || u("design-system:columnManager.cancelButton", { defaultValue: "Cancel" })
|
|
77
77
|
), /* @__PURE__ */ e.createElement(
|
|
78
78
|
P,
|
|
79
79
|
{
|
|
@@ -83,7 +83,7 @@ function B({
|
|
|
83
83
|
},
|
|
84
84
|
...k("save-button")
|
|
85
85
|
},
|
|
86
|
-
n || u("design-system:columnManager.saveButton")
|
|
86
|
+
n || u("design-system:columnManager.saveButton", { defaultValue: "Save" })
|
|
87
87
|
))
|
|
88
88
|
) : null;
|
|
89
89
|
}
|
package/lib/index.umd.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(n,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("react"),require("@sps-woodland/core"),require("@sps-woodland/add-to-list"),require("@sps-woodland/tokens"),require("@spscommerce/ds-react"),require("@spscommerce/ds-shared"),require("@spscommerce/utils")):typeof define=="function"&&define.amd?define(["exports","react","@sps-woodland/core","@sps-woodland/add-to-list","@sps-woodland/tokens","@spscommerce/ds-react","@spscommerce/ds-shared","@spscommerce/utils"],c):(n=typeof globalThis<"u"?globalThis:n||self,c(n.ColumnManager={},n.React,n.core,n.addToList,n.tokens,n.dsReact,n.dsShared,n.utils))})(this,function(n,c,v,L,q,C,b,f){"use strict";function j(t){const
|
|
1
|
+
(function(n,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("react"),require("@sps-woodland/core"),require("@sps-woodland/add-to-list"),require("@sps-woodland/tokens"),require("@spscommerce/ds-react"),require("@spscommerce/ds-shared"),require("@spscommerce/utils")):typeof define=="function"&&define.amd?define(["exports","react","@sps-woodland/core","@sps-woodland/add-to-list","@sps-woodland/tokens","@spscommerce/ds-react","@spscommerce/ds-shared","@spscommerce/utils"],c):(n=typeof globalThis<"u"?globalThis:n||self,c(n.ColumnManager={},n.React,n.core,n.addToList,n.tokens,n.dsReact,n.dsShared,n.utils))})(this,function(n,c,v,L,q,C,b,f){"use strict";function j(t){const u=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const s in t)if(s!=="default"){const a=Object.getOwnPropertyDescriptor(t,s);Object.defineProperty(u,s,a.get?a:{enumerable:!0,get:()=>t[s]})}}return u.default=t,Object.freeze(u)}const e=j(c);function E({isOpen:t,title:u,visibleColumnsHeader:s,hiddenColumnsHeader:a,visibleColumns:d,hiddenColumns:m,maxDisplayedItems:i,manualSort:r=!0,showIcons:M=!0,showCount:k=!0,showFilter:S=!0,showMoveAllLinks:w=!0,cancelButtonText:T,saveButtonText:l,onSave:o,onOpen:p,onClose:y,"data-testid":I}){const[P,A]=e.useState(!!t),{t:h}=e.useContext(v.I18nContext),O=v.useChildTestIdAttrBuilder({"data-testid":I}),[g,H]=e.useState({visibleColumns:d,hiddenColumns:m}),B=()=>{A(!1),y==null||y()};return e.useEffect(()=>{P&&(H({visibleColumns:d,hiddenColumns:m}),p==null||p())},[P]),e.useEffect(()=>{A(!!t)},[t]),P?e.createElement(C.SpsModal,{title:u||h("design-system:columnManager.title",{defaultValue:"Manage Table Columns"}),kind:b.ModalKind.GENERAL,size:b.ModalSize.LARGE,"data-testid":I,onClose:B},e.createElement(L.AddToList,{onHeader:s||h("design-system:columnManager.onListHeader",{defaultValue:"Visible Columns"}),offHeader:a||h("design-system:columnManager.offListHeader",{defaultValue:"Hidden Columns"}),onList:g.visibleColumns,offList:g.hiddenColumns,onChange:R=>{H({visibleColumns:R.onList,hiddenColumns:R.offList})},manualSort:r,maxDisplayedItems:i,showIcons:M,showCount:k,showFilter:S,showMoveAllLinks:w,...O("add-to-list")}),e.createElement(C.SpsModalFooter,null,e.createElement(C.SpsButton,{kind:b.ButtonKind.DEFAULT,onClick:()=>{H({visibleColumns:d,hiddenColumns:m}),B()},className:q.sprinkles({mr:"sm"}),...O("cancel-button")},T||h("design-system:columnManager.cancelButton",{defaultValue:"Cancel"})),e.createElement(C.SpsButton,{kind:b.ButtonKind.KEY,onClick:()=>{o==null||o(g.visibleColumns,g.hiddenColumns),B()},...O("save-button")},l||h("design-system:columnManager.saveButton",{defaultValue:"Save"})))):null}v.Metadata.set(E,{name:"Column Manager",props:{isOpen:{type:"boolean",required:!0},title:{type:"string"},visibleColumnsHeader:{type:"string"},hiddenColumnsHeader:{type:"string"},visibleColumns:{type:"ItemProps[]",required:!0},hiddenColumns:{type:"ItemProps[]",required:!0},manualSort:{type:"boolean"},maxDisplayedItems:{type:"number"},showIcons:{type:"boolean"},showCount:{type:"boolean"},showFilter:{type:"boolean"},showMoveAllLinks:{type:"boolean"},cancelButtonText:{type:"string"},saveButtonText:{type:"string"},onSave:{type:"(visibleColumns: ItemProps[], hiddenColumns: ItemProps[]) => void"},onClose:{type:"() => void"},onOpen:{type:"() => void"}}});const V=({isOpen:t,visibleColumns:u,hiddenColumns:s,onClose:a,onOpen:d,onSave:m})=>{const[i,r]=e.useState({isOpen:!!t,visibleColumns:u,hiddenColumns:s});e.useEffect(()=>{r(l=>({...l,isOpen:!!t}))},[t]);const M=()=>{r(l=>({...l,isOpen:!0})),d==null||d()},k=()=>{r(l=>({...l,isOpen:!1})),a==null||a()},S=(l,o)=>{r({isOpen:!1,visibleColumns:l,hiddenColumns:o}),m==null||m(l,o)},w=e.useCallback((l,o)=>{r(p=>({...p,visibleColumns:l,hiddenColumns:o}))},[]),T=e.useCallback(l=>{r(o=>({...o,isOpen:l}))},[]);return{visibleColumns:i.visibleColumns,hiddenColumns:i.hiddenColumns,isOpen:i.isOpen,columnManagerProps:{visibleColumns:i.visibleColumns,hiddenColumns:i.hiddenColumns,isOpen:i.isOpen,onClose:k,onSave:S},triggerProps:{onClick:M},setColumns:w,setOpen:T}},x={"Column Manager":{components:[E],examples:{basic:{label:"Basic Usage",examples:{basic:{react:f.code`
|
|
2
2
|
import { ColumnManager } from "@sps-woodland/column-manager";
|
|
3
3
|
import { SpsButton } from "@spscommerce/ds-react";
|
|
4
4
|
|
|
@@ -176,4 +176,4 @@
|
|
|
176
176
|
</div>
|
|
177
177
|
)
|
|
178
178
|
}
|
|
179
|
-
`}}}}}};n.ColumnManager=E,n.MANIFEST=
|
|
179
|
+
`}}}}}};n.ColumnManager=E,n.MANIFEST=x,n.useColumnManager=V,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sps-woodland/column-manager",
|
|
3
3
|
"description": "SPS Woodland Design System column manager component",
|
|
4
|
-
"version": "8.26.
|
|
4
|
+
"version": "8.26.2",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/column-manager",
|
|
@@ -26,11 +26,11 @@
|
|
|
26
26
|
"@vanilla-extract/css-utils": "^0.1.3",
|
|
27
27
|
"react": "^16.9.0",
|
|
28
28
|
"react-dom": "^16.9.0",
|
|
29
|
-
"@sps-woodland/add-to-list": "8.26.
|
|
30
|
-
"@sps-woodland/core": "8.26.
|
|
31
|
-
"@sps-woodland/tokens": "8.26.
|
|
32
|
-
"@spscommerce/ds-react": "8.26.
|
|
33
|
-
"@spscommerce/ds-shared": "8.26.
|
|
29
|
+
"@sps-woodland/add-to-list": "8.26.2",
|
|
30
|
+
"@sps-woodland/core": "8.26.2",
|
|
31
|
+
"@sps-woodland/tokens": "8.26.2",
|
|
32
|
+
"@spscommerce/ds-react": "8.26.2",
|
|
33
|
+
"@spscommerce/ds-shared": "8.26.2"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
36
|
"@spscommerce/utils": "^7.0.0",
|
|
@@ -39,11 +39,11 @@
|
|
|
39
39
|
"@vanilla-extract/recipes": "^0.2.5",
|
|
40
40
|
"react": "^16.9.0",
|
|
41
41
|
"react-dom": "^16.9.0",
|
|
42
|
-
"@sps-woodland/add-to-list": "8.26.
|
|
43
|
-
"@sps-woodland/core": "8.26.
|
|
44
|
-
"@sps-woodland/tokens": "8.26.
|
|
45
|
-
"@spscommerce/ds-react": "8.26.
|
|
46
|
-
"@spscommerce/ds-shared": "8.26.
|
|
42
|
+
"@sps-woodland/add-to-list": "8.26.2",
|
|
43
|
+
"@sps-woodland/core": "8.26.2",
|
|
44
|
+
"@sps-woodland/tokens": "8.26.2",
|
|
45
|
+
"@spscommerce/ds-react": "8.26.2",
|
|
46
|
+
"@spscommerce/ds-shared": "8.26.2"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
49
|
"nanoid": "^5.0.9"
|