@join-x5/react-data-grid-settings 1.0.0-rc → 1.0.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/dist/AreaItem/Content.es.js +14 -13
- package/dist/AreaItem/Content.es.js.map +1 -1
- package/dist/AreaItem/Handle.es.js +9 -9
- package/dist/AreaItem/Handle.es.js.map +1 -1
- package/dist/AreaItem/Visibility.es.js +2 -1
- package/dist/AreaItem/Visibility.es.js.map +1 -1
- package/dist/AreaItem/index.es.js +1 -0
- package/dist/AreaItem/index.es.js.map +1 -1
- package/dist/Columns/hook.es.js +1 -0
- package/dist/Columns/hook.es.js.map +1 -1
- package/dist/Columns/index.es.js +3 -2
- package/dist/Columns/index.es.js.map +1 -1
- package/dist/DataGridSettings.es.js +1 -0
- package/dist/DataGridSettings.es.js.map +1 -1
- package/dist/DataGridSettingsContext.es.js +1 -0
- package/dist/DataGridSettingsContext.es.js.map +1 -1
- package/dist/Footer/LeftButtons.es.js +37 -36
- package/dist/Footer/LeftButtons.es.js.map +1 -1
- package/dist/Footer/index.es.js +19 -18
- package/dist/Footer/index.es.js.map +1 -1
- package/dist/Search/index.es.js +21 -20
- package/dist/Search/index.es.js.map +1 -1
- package/dist/index.cjs +5 -5
- package/dist/index.cjs.map +1 -1
- package/package.json +19 -20
|
@@ -1,26 +1,27 @@
|
|
|
1
|
+
"use client";
|
|
1
2
|
import { jsx as b } from "@emotion/react/jsx-runtime";
|
|
2
|
-
import
|
|
3
|
-
import { useState as
|
|
4
|
-
import { Placement as
|
|
3
|
+
import d from "@emotion/styled/base";
|
|
4
|
+
import { useState as I, useRef as G, useEffect as X } from "react";
|
|
5
|
+
import { Placement as n } from "@join-x5/react-theme";
|
|
5
6
|
import { Tooltip as o } from "@join-x5/react";
|
|
6
|
-
const
|
|
7
|
+
const m = /* @__PURE__ */ d("div", process.env.NODE_ENV === "production" ? {
|
|
7
8
|
target: "ebxzgij0"
|
|
8
9
|
} : {
|
|
9
10
|
target: "ebxzgij0",
|
|
10
11
|
label: "Container"
|
|
11
|
-
})("flex-grow:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;user-select:none;color:", (
|
|
12
|
+
})("flex-grow:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;user-select:none;color:", (c) => c.theme.colors.grey[c.isVisible ? 100 : 40], ";", (c) => c.theme.typography.p1, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvQXJlYUl0ZW0vQ29udGVudC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVTJEIiwiZmlsZSI6Ii9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvQXJlYUl0ZW0vQ29udGVudC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIndXNlIGNsaWVudCc7XG5cbmltcG9ydCB7dXNlRWZmZWN0LCB1c2VSZWYsIHVzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB7UGxhY2VtZW50fSBmcm9tICdAam9pbi14NS9yZWFjdC10aGVtZSc7XG5pbXBvcnQge1Rvb2x0aXB9IGZyb20gJ0Bqb2luLXg1L3JlYWN0JztcblxuaW1wb3J0IHR5cGUge0NvbHVtbkl0ZW19IGZyb20gJy4uL3R5cGVzJztcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdjxQaWNrPENvbHVtbkl0ZW0sICdpc1Zpc2libGUnPj5gXG4gIGZsZXgtZ3JvdzogMTtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7XG4gIHVzZXItc2VsZWN0OiBub25lO1xuICBjb2xvcjogJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVtwcm9wcy5pc1Zpc2libGUgPyAxMDAgOiA0MF19O1xuXG4gICR7cHJvcHMgPT4gcHJvcHMudGhlbWUudHlwb2dyYXBoeS5wMX1cbmA7XG50eXBlIENvbnRlbnRQcm9wcyA9IHtpdGVtOiBDb2x1bW5JdGVtfTtcblxuZXhwb3J0IGNvbnN0IENvbnRlbnQ6IFJlYWN0LkZDPENvbnRlbnRQcm9wcz4gPSAoe2l0ZW06IHtuYW1lLCB0aXRsZSwgaXNWaXNpYmxlfX0pID0+IHtcbiAgY29uc3QgW2lzT3ZlcmZsb3duLCBzZXRJc092ZXJmbG93bl0gPSB1c2VTdGF0ZTxib29sZWFuPihmYWxzZSk7XG4gIGNvbnN0IHJlZiA9IHVzZVJlZjxIVE1MSW5wdXRFbGVtZW50PihudWxsKTtcblxuICBjb25zdCBub1Rvb2x0aXAgPSAhaXNPdmVyZmxvd24gPyBmYWxzZSA6IHVuZGVmaW5lZDtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmICghcmVmLmN1cnJlbnQpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBzZXRJc092ZXJmbG93bihyZWYuY3VycmVudC5zY3JvbGxXaWR0aCA+IHJlZi5jdXJyZW50LmNsaWVudFdpZHRoKTtcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPFRvb2x0aXAgaXNQb3J0YWwgcGxhY2VtZW50PXtQbGFjZW1lbnQuVG9wfSBpc09wZW49e25vVG9vbHRpcH0gY29udGVudD17bmFtZX0+XG4gICAgICA8Q29udGFpbmVyIHJlZj17cmVmfSBpc1Zpc2libGU9e2lzVmlzaWJsZX0+XG4gICAgICAgIHt0aXRsZX1cbiAgICAgIDwvQ29udGFpbmVyPlxuICAgIDwvVG9vbHRpcD5cbiAgKTtcbn07XG4iXX0= */")), a = ({
|
|
12
13
|
item: {
|
|
13
|
-
name:
|
|
14
|
-
title:
|
|
15
|
-
isVisible:
|
|
14
|
+
name: c,
|
|
15
|
+
title: l,
|
|
16
|
+
isVisible: Z
|
|
16
17
|
}
|
|
17
18
|
}) => {
|
|
18
|
-
const [
|
|
19
|
-
return
|
|
20
|
-
|
|
21
|
-
}, []), /* @__PURE__ */ b(o, { isPortal: !0, placement:
|
|
19
|
+
const [e, g] = I(!1), t = G(null), i = e ? void 0 : !1;
|
|
20
|
+
return X(() => {
|
|
21
|
+
t.current && g(t.current.scrollWidth > t.current.clientWidth);
|
|
22
|
+
}, []), /* @__PURE__ */ b(o, { isPortal: !0, placement: n.Top, isOpen: i, content: c, children: /* @__PURE__ */ b(m, { ref: t, isVisible: Z, children: l }) });
|
|
22
23
|
};
|
|
23
24
|
export {
|
|
24
|
-
|
|
25
|
+
a as Content
|
|
25
26
|
};
|
|
26
27
|
//# sourceMappingURL=Content.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Content.es.js","sources":["../../src/AreaItem/Content.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"Content.es.js","sources":["../../src/AreaItem/Content.tsx"],"sourcesContent":["'use client';\n\nimport {useEffect, useRef, useState} from 'react';\nimport styled from '@emotion/styled';\n\nimport {Placement} from '@join-x5/react-theme';\nimport {Tooltip} from '@join-x5/react';\n\nimport type {ColumnItem} from '../types';\n\nconst Container = styled.div<Pick<ColumnItem, 'isVisible'>>`\n flex-grow: 1;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n user-select: none;\n color: ${props => props.theme.colors.grey[props.isVisible ? 100 : 40]};\n\n ${props => props.theme.typography.p1}\n`;\ntype ContentProps = {item: ColumnItem};\n\nexport const Content: React.FC<ContentProps> = ({item: {name, title, isVisible}}) => {\n const [isOverflown, setIsOverflown] = useState<boolean>(false);\n const ref = useRef<HTMLInputElement>(null);\n\n const noTooltip = !isOverflown ? false : undefined;\n\n useEffect(() => {\n if (!ref.current) {\n return;\n }\n\n setIsOverflown(ref.current.scrollWidth > ref.current.clientWidth);\n }, []);\n\n return (\n <Tooltip isPortal placement={Placement.Top} isOpen={noTooltip} content={name}>\n <Container ref={ref} isVisible={isVisible}>\n {title}\n </Container>\n </Tooltip>\n );\n};\n"],"names":["name","title","isVisible","useEffect"],"mappings":";;;;;;AAUA;AAAe;AAAA;AAAA;AAAA;AAAA;AAYiC;AAAO;AAACA;AAAMC;AAAOC;AAAU;AAC7E;AAKAC;AACM;AAI4D;AAUpE;;;;"}
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { jsx as c } from "@emotion/react/jsx-runtime";
|
|
2
|
-
import
|
|
3
|
-
import { SizeTokenValue as
|
|
4
|
-
import {
|
|
5
|
-
import { Tooltip as
|
|
6
|
-
const
|
|
2
|
+
import t from "@emotion/styled/base";
|
|
3
|
+
import { SizeTokenValue as I, Placement as e } from "@join-x5/react-theme";
|
|
4
|
+
import { DragIndicatorVerticalIcon as G } from "@join-x5/react-icons";
|
|
5
|
+
import { Tooltip as m } from "@join-x5/react";
|
|
6
|
+
const d = /* @__PURE__ */ t("div", process.env.NODE_ENV === "production" ? {
|
|
7
7
|
target: "e16nfd0b0"
|
|
8
8
|
} : {
|
|
9
9
|
target: "e16nfd0b0",
|
|
10
10
|
label: "HandleContainer"
|
|
11
|
-
})("flex-grow:0;flex-shrink:0;width:16px;height:16px;color:", (l) => l.theme.colors.grey[l.isLocked ? 40 : 60], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
11
|
+
})("flex-grow:0;flex-shrink:0;width:16px;height:16px;color:", (l) => l.theme.colors.grey[l.isLocked ? 40 : 60], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvQXJlYUl0ZW0vSGFuZGxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVK0MiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkLXNldHRpbmdzL3NyYy9BcmVhSXRlbS9IYW5kbGUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQge1BsYWNlbWVudCwgU2l6ZVRva2VuVmFsdWV9IGZyb20gJ0Bqb2luLXg1L3JlYWN0LXRoZW1lJztcbmltcG9ydCB7RHJhZ0luZGljYXRvclZlcnRpY2FsSWNvbn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtaWNvbnMnO1xuaW1wb3J0IHtUb29sdGlwfSBmcm9tICdAam9pbi14NS9yZWFjdCc7XG5cbmltcG9ydCB0eXBlIHtDb2x1bW5JdGVtfSBmcm9tICcuLi90eXBlcyc7XG5cbnR5cGUgSGFuZGxlUHJvcHMgPSBQaWNrPENvbHVtbkl0ZW0sICdpc0xvY2tlZCc+O1xuXG5jb25zdCBIYW5kbGVDb250YWluZXIgPSBzdHlsZWQuZGl2PEhhbmRsZVByb3BzPmBcbiAgZmxleC1ncm93OiAwO1xuICBmbGV4LXNocmluazogMDtcbiAgd2lkdGg6IDE2cHg7XG4gIGhlaWdodDogMTZweDtcblxuICBjb2xvcjogJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVtwcm9wcy5pc0xvY2tlZCA/IDQwIDogNjBdfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIYW5kbGU6IFJlYWN0LkZDPEhhbmRsZVByb3BzPiA9ICh7aXNMb2NrZWR9KSA9PiB7XG4gIGNvbnN0IGNoaWxkID0gKFxuICAgIDxIYW5kbGVDb250YWluZXIgaXNMb2NrZWQ9e2lzTG9ja2VkfT5cbiAgICAgIDxEcmFnSW5kaWNhdG9yVmVydGljYWxJY29uIHNpemU9e1NpemVUb2tlblZhbHVlLlNtYWxsfSAvPlxuICAgIDwvSGFuZGxlQ29udGFpbmVyPlxuICApO1xuXG4gIGlmICghaXNMb2NrZWQpIHtcbiAgICByZXR1cm4gY2hpbGQ7XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxUb29sdGlwIHBsYWNlbWVudD17UGxhY2VtZW50LlRvcH0gY29udGVudD1cItCd0LXQu9GM0LfRjyDQvtGC0LrRgNC10L/QuNGC0Ywg0YHRgtC+0LvQsdC10YZcIj5cbiAgICAgIHtjaGlsZH1cbiAgICA8L1Rvb2x0aXA+XG4gICk7XG59O1xuIl19 */")), W = ({
|
|
12
12
|
isLocked: l
|
|
13
13
|
}) => {
|
|
14
|
-
const b = /* @__PURE__ */ c(
|
|
15
|
-
return l ? /* @__PURE__ */ c(
|
|
14
|
+
const b = /* @__PURE__ */ c(d, { isLocked: l, children: /* @__PURE__ */ c(G, { size: I.Small }) });
|
|
15
|
+
return l ? /* @__PURE__ */ c(m, { placement: e.Top, content: "Нельзя открепить столбец", children: b }) : b;
|
|
16
16
|
};
|
|
17
17
|
export {
|
|
18
|
-
|
|
18
|
+
W as Handle
|
|
19
19
|
};
|
|
20
20
|
//# sourceMappingURL=Handle.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Handle.es.js","sources":["../../src/AreaItem/Handle.tsx"],"sourcesContent":["import styled from '@emotion/styled';\n\nimport {Placement, SizeTokenValue} from '@join-x5/react-theme';\nimport {
|
|
1
|
+
{"version":3,"file":"Handle.es.js","sources":["../../src/AreaItem/Handle.tsx"],"sourcesContent":["import styled from '@emotion/styled';\n\nimport {Placement, SizeTokenValue} from '@join-x5/react-theme';\nimport {DragIndicatorVerticalIcon} from '@join-x5/react-icons';\nimport {Tooltip} from '@join-x5/react';\n\nimport type {ColumnItem} from '../types';\n\ntype HandleProps = Pick<ColumnItem, 'isLocked'>;\n\nconst HandleContainer = styled.div<HandleProps>`\n flex-grow: 0;\n flex-shrink: 0;\n width: 16px;\n height: 16px;\n\n color: ${props => props.theme.colors.grey[props.isLocked ? 40 : 60]};\n`;\n\nexport const Handle: React.FC<HandleProps> = ({isLocked}) => {\n const child = (\n <HandleContainer isLocked={isLocked}>\n <DragIndicatorVerticalIcon size={SizeTokenValue.Small} />\n </HandleContainer>\n );\n\n if (!isLocked) {\n return child;\n }\n\n return (\n <Tooltip placement={Placement.Top} content=\"Нельзя открепить столбец\">\n {child}\n </Tooltip>\n );\n};\n"],"names":["HandleContainer","_styled","process","env","NODE_ENV","target","label","props","theme","colors","grey","isLocked","Handle","child","DragIndicatorVerticalIcon","SizeTokenValue","Small","Tooltip","Placement","Top"],"mappings":";;;;;AAUA,MAAMA,IAAe,gBAAAC,EAAA,OAAAC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAMVC,EAAAA,2DAAAA,CAAAA,MAASA,EAAMC,MAAMC,OAAOC,KAAKH,EAAMI,WAAW,KAAK,EAAE,GAAC,OAAAT,QAAAC,IAAAC,aACpE,eAAA,KAAA,kmDAAA,GAEYQ,IAAgCA,CAAC;AAAA,EAACD,UAAAA;AAAQ,MAAM;AACrDE,QAAAA,sBACHb,GAAgB,EAAA,UAAAW,GACf,4BAACG,GAA0B,EAAA,MAAMC,EAAeC,MAAAA,CAAM,EACxD,CAAA;AAGF,SAAKL,sBAKFM,GAAQ,EAAA,WAAWC,EAAUC,KAAK,SAAQ,4BACxCN,UACHA,GAAA,IANOA;AAQX;"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
"use client";
|
|
1
2
|
import { jsx as n } from "@emotion/react/jsx-runtime";
|
|
2
3
|
import { useContext as f } from "react";
|
|
3
4
|
import { Placement as V, SizeTokenValue as e } from "@join-x5/react-theme";
|
|
4
|
-
import {
|
|
5
|
+
import { VisibilityOnIcon as b, VisibilityOffIcon as u } from "@join-x5/react-icons";
|
|
5
6
|
import { IconButton as I, ButtonVariant as d } from "@join-x5/react";
|
|
6
7
|
import { DataGridSettingsContext as x } from "../DataGridSettingsContext.es.js";
|
|
7
8
|
const B = (s) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Visibility.es.js","sources":["../../src/AreaItem/Visibility.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"Visibility.es.js","sources":["../../src/AreaItem/Visibility.tsx"],"sourcesContent":["'use client';\n\nimport {useContext} from 'react';\n\nimport {Placement, SizeTokenValue} from '@join-x5/react-theme';\nimport {VisibilityOnIcon, VisibilityOffIcon} from '@join-x5/react-icons';\nimport {ButtonVariant, IconButton} from '@join-x5/react';\n\nimport {DataGridSettingsContext} from '../DataGridSettingsContext';\n\nimport type {MouseEventHandler} from 'react';\nimport type {ColumnItem} from '../types';\n\nexport const Visibility: React.FC<{item: ColumnItem}> = props => {\n const {id, isVisible, isAlwaysVisible} = props.item;\n\n const {items, setItems} = useContext(DataGridSettingsContext);\n\n const toggleVisible: MouseEventHandler = () => {\n if (isAlwaysVisible) {\n return;\n }\n\n setItems(items.map(item => (item.id === id ? {...item, isVisible: !isVisible} : item)));\n };\n\n const Icon = isVisible ? VisibilityOnIcon : VisibilityOffIcon;\n\n const tooltip = {\n placement: Placement.Top,\n content: isAlwaysVisible ? 'Нельзя скрыть' : isVisible ? 'Скрыть столбец' : 'Показать столбец',\n };\n\n return (\n <IconButton\n tooltip={tooltip}\n size={SizeTokenValue.XSmall}\n variant={ButtonVariant.InnerInput}\n disabled={isAlwaysVisible}\n onClick={toggleVisible}\n >\n <Icon size={SizeTokenValue.Small} />\n </IconButton>\n );\n};\n"],"names":["id","isVisible","isAlwaysVisible","items","setItems","item","Top"],"mappings":";;;;;;;AAaO;AACC;AAAA;AAACA;AAAIC;AAAWC;AAEhB;AAACC;AAAOC;AAGZ;AAI6C;AAAIC;AAAkBJ;AAAmB;AAKxE;AACOK;AACuD;AAG9E;AAWF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../../src/AreaItem/index.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../../src/AreaItem/index.tsx"],"sourcesContent":["'use client';\n\nimport {useContext} from 'react';\nimport {SortableContext} from '@dnd-kit/sortable';\n\nimport {DataGridSettingsContext} from '../DataGridSettingsContext';\n\nimport {AreaItem} from './AreaItem';\n\nimport type {ReactNode} from 'react';\nimport type {ColumnItem, ColumnItemId, DataGridSettingsActiveItem} from '../types';\n\ntype GetItem = {\n id: ColumnItemId;\n item: ColumnItem;\n activeItem: DataGridSettingsActiveItem | undefined;\n isSearch: boolean;\n};\n\nconst getItem = ({id, item, isSearch, activeItem}: GetItem) => {\n const props = {\n id,\n item,\n isSearch,\n isActive: false,\n isAbove: false,\n isBelow: false,\n };\n\n if (activeItem) {\n props.isActive = item.id === activeItem.id;\n\n if (item.id === activeItem.overId) {\n props.isAbove = !!activeItem.isAbove;\n props.isBelow = !activeItem.isAbove;\n }\n }\n\n return <AreaItem key={item.id} {...props} />;\n};\n\ntype ItemsProps = {\n itemIds: ColumnItemId[];\n activeItem?: DataGridSettingsActiveItem;\n};\n\nexport const Items: React.FC<ItemsProps> = ({itemIds, activeItem}) => {\n const {itemsById, searchItems} = useContext(DataGridSettingsContext);\n\n const child: ReactNode[] = [];\n const newItemIds: ColumnItemId[] = [];\n\n for (const itemId of itemIds) {\n const item = itemsById.get(itemId);\n if (!item) {\n continue;\n }\n\n const newId = itemId === activeItem?.id ? `${itemId}Placeholder` : itemId;\n const isSearch = searchItems.includes(itemId);\n\n newItemIds.push(newId);\n child.push(getItem({item, activeItem, isSearch, id: newId}));\n }\n\n return <SortableContext items={newItemIds}>{child}</SortableContext>;\n};\n\nexport {ActiveItemOverlay} from './AreaItem';\n"],"names":["id","item","isSearch","itemIds","itemsById","searchItems","newItemIds","activeItem","newId"],"mappings":";;;;;;;AAmBA;AAAiB;AAACA;AAAIC;AAAMC;AAA6B;AACvD;AAAc;AACZF;AACAC;AACAC;AACU;AACD;AACA;AAGX;AAUF;AAO4C;AAACC;AAAmB;AACxD;AAAA;AAACC;AAAWC;AAKlB;AACQJ;AACN;AACE;AAGF;AAGAK;AACmB;AAACL;AAAMM;AAAYL;AAAcM;AAAO;AAG7D;AACF;;;;;"}
|
package/dist/Columns/hook.es.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hook.es.js","sources":["../../src/Columns/hook.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"hook.es.js","sources":["../../src/Columns/hook.ts"],"sourcesContent":["'use client';\n\nimport {MouseSensor, TouchSensor, useSensor, useSensors} from '@dnd-kit/core';\n\nimport {useContext, useState} from 'react';\n\nimport {useUpdateEffect} from '@join-x5/react-theme';\n\nimport {DataGridSettingsContext} from '../DataGridSettingsContext';\n\nimport {moveItem, moveOver, collisionDetection} from './utils';\n\nimport type {DndContextProps} from '@dnd-kit/core';\nimport type {DataGridSettingsActiveItem} from '../types';\n\nexport const useColumns = () => {\n const {columns, items, setItems, itemsById, searchItems} = useContext(DataGridSettingsContext);\n const [activeItem, setActiveItem] = useState<DataGridSettingsActiveItem>();\n const sensors = useSensors(useSensor(MouseSensor), useSensor(TouchSensor));\n\n const onDragCancel = () => {\n setActiveItem(undefined);\n };\n\n const onDragStart: DndContextProps['onDragStart'] = args => {\n const newActiveItem = itemsById.get(args.active.id);\n setActiveItem(newActiveItem);\n };\n\n const onDragMove: DndContextProps['onDragMove'] = ({over, active}) => {\n if (!activeItem || !over) {\n if (activeItem && activeItem.overId !== undefined) {\n setActiveItem({...activeItem, overId: undefined, isAbove: undefined});\n }\n\n return;\n }\n\n const {overId, isAbove} = moveOver(itemsById, active, over);\n\n if (activeItem.overId === overId && activeItem.isAbove === isAbove) {\n return;\n }\n\n setActiveItem({...activeItem, overId, isAbove});\n };\n\n const onDragEnd: DndContextProps['onDragEnd'] = ({over}) => {\n if (!activeItem || !over) {\n if (activeItem) {\n setActiveItem(undefined);\n }\n\n return;\n }\n\n setActiveItem(undefined);\n setItems(moveItem(items, activeItem, over));\n };\n\n useUpdateEffect(() => {\n setActiveItem(undefined);\n }, [items]);\n\n return {\n columns,\n itemsById,\n searchItems,\n activeItem,\n sensors,\n onDragStart,\n onDragMove,\n onDragEnd,\n onDragCancel,\n collisionDetection,\n };\n};\n"],"names":["columns","items","setItems","itemsById","searchItems","setActiveItem","over","active","activeItem","undefined","overId","isAbove","useUpdateEffect","sensors","onDragStart","onDragMove","onDragEnd","onDragCancel","collisionDetection"],"mappings":";;;;;;AAeO;AACC;AAAA;AAACA;AAASC;AAAOC;AAAUC;AAAWC;AAK1CC;AAAuB;AAIvB;AACAA;AAA2B;AAGsB;AAACC;AAAMC;AACpD;AACEC;AACY;AAAIA;AAAoBC;AAAoBA;AAG5D;AAAA;AAGI;AAAA;AAACC;AAAQC;AAEf;AAIc;AAAIH;AAAYE;AAAQC;AAAQ;AAGC;AAACL;AAC5C;AACF;AAIA;AAAA;AAGFD;AAC0C;AAG5CO;AACEP;AAAuB;AAGlB;AACLL;AACAG;AACAC;AACAI;AACAK;AACAC;AACAC;AACAC;AACAC;AACAC;AAEJ;;;;"}
|
package/dist/Columns/index.es.js
CHANGED
|
@@ -29,10 +29,11 @@ const s = /* @__PURE__ */ C(X, process.env.NODE_ENV === "production" ? {
|
|
|
29
29
|
} : {
|
|
30
30
|
target: "e1epmz4z0",
|
|
31
31
|
label: "Container"
|
|
32
|
-
})("display:flex;margin-left:-32px;>div{display:flex;position:relative;flex-direction:column;gap:4px;box-sizing:border-box;padding-left:32px;::after{content:'';position:absolute;width:0;height:100%;top:0;left:16px;border-left:1px solid ", (g) => g.theme.colors.grey[10], ";}:first-of-type::after{display:none;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvQ29sdW1ucy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUI0QiIsImZpbGUiOiIvaG9tZS9zYWR5a292c2Qvam9pbi14NS9wYWNrYWdlcy9kYXRhLWdyaWQtc2V0dGluZ3Mvc3JjL0NvbHVtbnMvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtEbmRDb250ZXh0fSBmcm9tICdAZG5kLWtpdC9jb3JlJztcblxuaW1wb3J0IHtNb2RhbENvbnRlbnQgYXMgQmFzZU1vZGFsQ29udGVudH0gZnJvbSAnQGpvaW4teDUvcmVhY3QnO1xuXG5pbXBvcnQge2dldEFyZWF9IGZyb20gJy4uL0FyZWEnO1xuaW1wb3J0IHtBY3RpdmVJdGVtT3ZlcmxheX0gZnJvbSAnLi4vQXJlYUl0ZW0nO1xuaW1wb3J0IHtTZWFyY2h9IGZyb20gJy4uL1NlYXJjaCc7XG5cbmltcG9ydCB7dXNlQ29sdW1uc30gZnJvbSAnLi9ob29rJztcblxuaW1wb3J0IHR5cGUge1JlYWN0Tm9kZX0gZnJvbSAncmVhY3QnO1xuXG5jb25zdCBNb2RhbENvbnRlbnQgPSBzdHlsZWQoQmFzZU1vZGFsQ29udGVudClgXG4gIHBhZGRpbmc6IDAgMjRweCAxNnB4O1xuYDtcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgbWFyZ2luLWxlZnQ6IC0zMnB4O1xuXG4gID4gZGl2IHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgIGdhcDogNHB4O1xuICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgcGFkZGluZy1sZWZ0OiAzMnB4O1xuXG4gICAgOjphZnRlciB7XG4gICAgICBjb250ZW50OiAnJztcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIHdpZHRoOiAwO1xuICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgdG9wOiAwO1xuICAgICAgbGVmdDogMTZweDtcbiAgICAgIGJvcmRlci1sZWZ0OiAxcHggc29saWQgJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19O1xuICAgIH1cblxuICAgIDpmaXJzdC1vZi10eXBlOjphZnRlciB7XG4gICAgICBkaXNwbGF5OiBub25lO1xuICAgIH1cbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IENvbHVtbnM6IFJlYWN0LkZDID0gKCkgPT4ge1xuICBjb25zdCB7Y29sdW1ucywgaXRlbXNCeUlkLCBzZWFyY2hJdGVtcywgYWN0aXZlSXRlbSwgLi4ucmVzdH0gPSB1c2VDb2x1bW5zKCk7XG5cbiAgY29uc3QgY2hpbGQgPSBjb2x1bW5zLm1hcCgoY29sdW1uLCBjb2x1bW5JbmRleCkgPT4ge1xuICAgIGNvbnN0IGFyZWFzOiBSZWFjdE5vZGVbXSA9IEFycmF5LmZyb20oY29sdW1uKS5tYXAoKFthcmVhLCBpdGVtSWRzXSkgPT5cbiAgICAgIGdldEFyZWEoe2NvbHVtbkluZGV4LCBhcmVhLCBpdGVtSWRzLCBpdGVtc0J5SWQsIHNlYXJjaEl0ZW1zLCBhY3RpdmVJdGVtfSlcbiAgICApO1xuXG4gICAgY29uc3Qgd2lkdGggPSBgY2FsYygkezEwMCAvIGNvbHVtbnMubGVuZ3RofSUpYDtcblxuICAgIHJldHVybiAoXG4gICAgICA8ZGl2IGtleT17Y29sdW1uSW5kZXh9IHN0eWxlPXt7d2lkdGh9fT5cbiAgICAgICAge2FyZWFzfVxuICAgICAgPC9kaXY+XG4gICAgKTtcbiAgfSk7XG5cbiAgcmV0dXJuIChcbiAgICA8TW9kYWxDb250ZW50IG5vQm9yZGVyU2Nyb2xsPlxuICAgICAgPFNlYXJjaCAvPlxuICAgICAgPERuZENvbnRleHQgaWQ9XCJEYXRhR3JpZFNldHRpbmdzXCIgey4uLnJlc3R9PlxuICAgICAgICA8Q29udGFpbmVyPntjaGlsZH08L0NvbnRhaW5lcj5cbiAgICAgICAgPEFjdGl2ZUl0ZW1PdmVybGF5IGl0ZW09e2FjdGl2ZUl0ZW19IC8+XG4gICAgICA8L0RuZENvbnRleHQ+XG4gICAgPC9Nb2RhbENvbnRlbnQ+XG4gICk7XG59O1xuIl19 */")),
|
|
32
|
+
})("display:flex;margin-left:-32px;>div{display:flex;position:relative;flex-direction:column;gap:4px;box-sizing:border-box;padding-left:32px;::after{content:'';position:absolute;width:0;height:100%;top:0;left:16px;border-left:1px solid ", (g) => g.theme.colors.grey[10], ";}:first-of-type::after{display:none;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvQ29sdW1ucy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUI0QiIsImZpbGUiOiIvaG9tZS9zYWR5a292c2Qvam9pbi14NS9wYWNrYWdlcy9kYXRhLWdyaWQtc2V0dGluZ3Mvc3JjL0NvbHVtbnMvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtEbmRDb250ZXh0fSBmcm9tICdAZG5kLWtpdC9jb3JlJztcblxuaW1wb3J0IHtNb2RhbENvbnRlbnQgYXMgQmFzZU1vZGFsQ29udGVudH0gZnJvbSAnQGpvaW4teDUvcmVhY3QnO1xuXG5pbXBvcnQge2dldEFyZWF9IGZyb20gJy4uL0FyZWEnO1xuaW1wb3J0IHtBY3RpdmVJdGVtT3ZlcmxheX0gZnJvbSAnLi4vQXJlYUl0ZW0nO1xuaW1wb3J0IHtTZWFyY2h9IGZyb20gJy4uL1NlYXJjaCc7XG5cbmltcG9ydCB7dXNlQ29sdW1uc30gZnJvbSAnLi9ob29rJztcblxuaW1wb3J0IHR5cGUge1JlYWN0Tm9kZX0gZnJvbSAncmVhY3QnO1xuXG5jb25zdCBNb2RhbENvbnRlbnQgPSBzdHlsZWQoQmFzZU1vZGFsQ29udGVudClgXG4gIHBhZGRpbmc6IDAgMjRweCAxNnB4O1xuYDtcblxuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgbWFyZ2luLWxlZnQ6IC0zMnB4O1xuXG4gID4gZGl2IHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgIGdhcDogNHB4O1xuICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgcGFkZGluZy1sZWZ0OiAzMnB4O1xuXG4gICAgOjphZnRlciB7XG4gICAgICBjb250ZW50OiAnJztcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIHdpZHRoOiAwO1xuICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgdG9wOiAwO1xuICAgICAgbGVmdDogMTZweDtcbiAgICAgIGJvcmRlci1sZWZ0OiAxcHggc29saWQgJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19O1xuICAgIH1cblxuICAgIDpmaXJzdC1vZi10eXBlOjphZnRlciB7XG4gICAgICBkaXNwbGF5OiBub25lO1xuICAgIH1cbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IENvbHVtbnM6IFJlYWN0LkZDID0gKCkgPT4ge1xuICBjb25zdCB7Y29sdW1ucywgaXRlbXNCeUlkLCBzZWFyY2hJdGVtcywgYWN0aXZlSXRlbSwgLi4ucmVzdH0gPSB1c2VDb2x1bW5zKCk7XG5cbiAgY29uc3QgY2hpbGQgPSBjb2x1bW5zLm1hcCgoY29sdW1uLCBjb2x1bW5JbmRleCkgPT4ge1xuICAgIGNvbnN0IGFyZWFzOiBSZWFjdE5vZGVbXSA9IEFycmF5LmZyb20oY29sdW1uKS5tYXAoKFthcmVhLCBpdGVtSWRzXSkgPT5cbiAgICAgIGdldEFyZWEoe2NvbHVtbkluZGV4LCBhcmVhLCBpdGVtSWRzLCBpdGVtc0J5SWQsIHNlYXJjaEl0ZW1zLCBhY3RpdmVJdGVtfSlcbiAgICApO1xuXG4gICAgY29uc3Qgd2lkdGggPSBgY2FsYygkezEwMCAvIGNvbHVtbnMubGVuZ3RofSUpYDtcblxuICAgIHJldHVybiAoXG4gICAgICA8ZGl2IGtleT17Y29sdW1uSW5kZXh9IHN0eWxlPXt7d2lkdGh9fT5cbiAgICAgICAge2FyZWFzfVxuICAgICAgPC9kaXY+XG4gICAgKTtcbiAgfSk7XG5cbiAgcmV0dXJuIChcbiAgICA8TW9kYWxDb250ZW50IG5vQm9yZGVyU2Nyb2xsPlxuICAgICAgPFNlYXJjaCAvPlxuICAgICAgPERuZENvbnRleHQgaWQ9XCJEYXRhR3JpZFNldHRpbmdzXCIgey4uLnJlc3R9PlxuICAgICAgICA8Q29udGFpbmVyPntjaGlsZH08L0NvbnRhaW5lcj5cbiAgICAgICAgPEFjdGl2ZUl0ZW1PdmVybGF5IGl0ZW09e2FjdGl2ZUl0ZW19IC8+XG4gICAgICA8L0RuZENvbnRleHQ+XG4gICAgPC9Nb2RhbENvbnRlbnQ+XG4gICk7XG59O1xuIl19 */")), L = () => {
|
|
33
33
|
const {
|
|
34
34
|
columns: g,
|
|
35
35
|
itemsById: t,
|
|
36
|
+
searchItems: B,
|
|
36
37
|
activeItem: I,
|
|
37
38
|
...G
|
|
38
39
|
} = o(), Z = g.map((d, c) => {
|
|
@@ -56,6 +57,6 @@ const s = /* @__PURE__ */ C(X, process.env.NODE_ENV === "production" ? {
|
|
|
56
57
|
] });
|
|
57
58
|
};
|
|
58
59
|
export {
|
|
59
|
-
|
|
60
|
+
L as Columns
|
|
60
61
|
};
|
|
61
62
|
//# sourceMappingURL=index.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../../src/Columns/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport {DndContext} from '@dnd-kit/core';\n\nimport {ModalContent as BaseModalContent} from '@join-x5/react';\n\nimport {getArea} from '../Area';\nimport {ActiveItemOverlay} from '../AreaItem';\nimport {Search} from '../Search';\n\nimport {useColumns} from './hook';\n\nimport type {ReactNode} from 'react';\n\nconst ModalContent = styled(BaseModalContent)`\n padding: 0 24px 16px;\n`;\n\nconst Container = styled.div`\n display: flex;\n margin-left: -32px;\n\n > div {\n display: flex;\n position: relative;\n flex-direction: column;\n gap: 4px;\n box-sizing: border-box;\n padding-left: 32px;\n\n ::after {\n content: '';\n position: absolute;\n width: 0;\n height: 100%;\n top: 0;\n left: 16px;\n border-left: 1px solid ${props => props.theme.colors.grey[10]};\n }\n\n :first-of-type::after {\n display: none;\n }\n }\n`;\n\nexport const Columns: React.FC = () => {\n const {columns, itemsById, searchItems, activeItem, ...rest} = useColumns();\n\n const child = columns.map((column, columnIndex) => {\n const areas: ReactNode[] = Array.from(column).map(([area, itemIds]) =>\n getArea({columnIndex, area, itemIds, itemsById, searchItems, activeItem})\n );\n\n const width = `calc(${100 / columns.length}%)`;\n\n return (\n <div key={columnIndex} style={{width}}>\n {areas}\n </div>\n );\n });\n\n return (\n <ModalContent noBorderScroll>\n <Search />\n <DndContext id=\"DataGridSettings\" {...rest}>\n <Container>{child}</Container>\n <ActiveItemOverlay item={activeItem} />\n </DndContext>\n </ModalContent>\n );\n};\n"],"names":["ModalContent","BaseModalContent","process","env","NODE_ENV","target","label","name","styles","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","_styled","props","theme","colors","grey","Columns","columns","itemsById","activeItem","rest","useColumns","child","map","column","columnIndex","areas","Array","from","area","itemIds","getArea","width","length","jsx","jsxs","Search","DndContext","ActiveItemOverlay"],"mappings":";;;;;;;;;;;;;;AAaA,MAAMA,IAAsBC,gBAAAA,EAAAA,GAAgBC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,UAAAC;AAAA,CAE5C,GAEKC,IAAS,gBAAAC,EAAA,OAAAV,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAA,4OAmBgBO,CAASA,MAAAA,EAAMC,MAAMC,OAAOC,KAAK,EAAE,GAACd,6CAAAA,QAAAC,IAAAC,aAOlE,eAAA,KAAA,8mFAAA,GAEYa,IAAoBA,MAAM;AAC/B,QAAA;AAAA,IAACC,SAAAA;AAAAA,IAASC,WAAAA;AAAAA,
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../../src/Columns/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport {DndContext} from '@dnd-kit/core';\n\nimport {ModalContent as BaseModalContent} from '@join-x5/react';\n\nimport {getArea} from '../Area';\nimport {ActiveItemOverlay} from '../AreaItem';\nimport {Search} from '../Search';\n\nimport {useColumns} from './hook';\n\nimport type {ReactNode} from 'react';\n\nconst ModalContent = styled(BaseModalContent)`\n padding: 0 24px 16px;\n`;\n\nconst Container = styled.div`\n display: flex;\n margin-left: -32px;\n\n > div {\n display: flex;\n position: relative;\n flex-direction: column;\n gap: 4px;\n box-sizing: border-box;\n padding-left: 32px;\n\n ::after {\n content: '';\n position: absolute;\n width: 0;\n height: 100%;\n top: 0;\n left: 16px;\n border-left: 1px solid ${props => props.theme.colors.grey[10]};\n }\n\n :first-of-type::after {\n display: none;\n }\n }\n`;\n\nexport const Columns: React.FC = () => {\n const {columns, itemsById, searchItems, activeItem, ...rest} = useColumns();\n\n const child = columns.map((column, columnIndex) => {\n const areas: ReactNode[] = Array.from(column).map(([area, itemIds]) =>\n getArea({columnIndex, area, itemIds, itemsById, searchItems, activeItem})\n );\n\n const width = `calc(${100 / columns.length}%)`;\n\n return (\n <div key={columnIndex} style={{width}}>\n {areas}\n </div>\n );\n });\n\n return (\n <ModalContent noBorderScroll>\n <Search />\n <DndContext id=\"DataGridSettings\" {...rest}>\n <Container>{child}</Container>\n <ActiveItemOverlay item={activeItem} />\n </DndContext>\n </ModalContent>\n );\n};\n"],"names":["ModalContent","BaseModalContent","process","env","NODE_ENV","target","label","name","styles","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","_styled","props","theme","colors","grey","Columns","columns","itemsById","searchItems","activeItem","rest","useColumns","child","map","column","columnIndex","areas","Array","from","area","itemIds","getArea","width","length","jsx","jsxs","Search","DndContext","ActiveItemOverlay"],"mappings":";;;;;;;;;;;;;;AAaA,MAAMA,IAAsBC,gBAAAA,EAAAA,GAAgBC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,UAAAC;AAAA,CAE5C,GAEKC,IAAS,gBAAAC,EAAA,OAAAV,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAA,4OAmBgBO,CAASA,MAAAA,EAAMC,MAAMC,OAAOC,KAAK,EAAE,GAACd,6CAAAA,QAAAC,IAAAC,aAOlE,eAAA,KAAA,8mFAAA,GAEYa,IAAoBA,MAAM;AAC/B,QAAA;AAAA,IAACC,SAAAA;AAAAA,IAASC,WAAAA;AAAAA,IAAWC,aAAAA;AAAAA,IAAaC,YAAAA;AAAAA,IAAY,GAAGC;AAAAA,MAAQC,EAAW,GAEpEC,IAAQN,EAAQO,IAAI,CAACC,GAAQC,MAAgB;AAC3CC,UAAAA,IAAqBC,MAAMC,KAAKJ,CAAM,EAAED,IAAI,CAAC,CAACM,GAAMC,CAAO,MAC/DC,EAAQ;AAAA,MAACN,aAAAA;AAAAA,MAAaI,MAAAA;AAAAA,MAAMC,SAAAA;AAAAA,MAASb,WAAAA;AAAAA,MAAwBE,YAAAA;AAAAA,IAAAA,CAAW,CAC1E,GAEMa,IAAQ,QAAQ,MAAMhB,EAAQiB,MAAM;AAGxC,WAAA,gBAAAC,EAAC,SAAsB,OAAO;AAAA,MAACF,OAAAA;AAAAA,IAAAA,GAC5BN,eADOD,CAEV;AAAA,EAAA,CAEH;AAGC,SAAA,gBAAAU,EAACrC,GAAa,EAAA,gBAAc,IAC1B,UAAA;AAAA,IAAA,gBAAAoC,EAACE,GAAM,EAAA;AAAA,IACN,gBAAAD,EAAAE,GAAA,EAAW,IAAG,oBAAuBjB,GAAAA,GACpC,UAAA;AAAA,MAAA,gBAAAc,EAACzB,KAAWa,UAAMA,EAAA,CAAA;AAAA,MAClB,gBAAAY,EAACI,GAAkB,EAAA,MAAMnB,EAAW,CAAA;AAAA,IAAA,EACtC,CAAA;AAAA,EAAA,GACF;AAEJ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataGridSettings.es.js","sources":["../src/DataGridSettings.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"DataGridSettings.es.js","sources":["../src/DataGridSettings.tsx"],"sourcesContent":["'use client';\n\nimport {useMemo, useState} from 'react';\n\nimport {useUpdateEffect} from '@join-x5/react-theme';\nimport {Modal, ModalHeader} from '@join-x5/react';\n\nimport {Columns} from './Columns';\nimport {Footer} from './Footer';\nimport {DataGridSettingsContext} from './DataGridSettingsContext';\nimport {getColumnsData} from './utils';\nimport {ColumnArea} from './types';\n\nimport type {ColumnItem, ColumnItemId, DataGridSettingsProps} from './types';\n\nexport const DataGridSettings: React.FC<DataGridSettingsProps> = props => {\n const {\n isOpen,\n\n qa = 'datagridsettings',\n areas = [ColumnArea.FixedLeft, ColumnArea.Default],\n\n ...rest\n } = props;\n\n const [items, setItems] = useState<ColumnItem[]>(props.items);\n const [searchItems, setSearchItems] = useState<ColumnItemId[]>([]);\n\n const {columns, itemsById, size} = useMemo(() => getColumnsData(items, areas), [items, areas]);\n\n const context = {...rest, columns, itemsById, areas, items, setItems, searchItems, setSearchItems, qa};\n\n const onClose = () => props.setIsOpen(false);\n\n useUpdateEffect(() => {\n setItems(props.items);\n }, [props.items]);\n\n useUpdateEffect(() => {\n if (!isOpen) {\n setTimeout(() => setSearchItems([]));\n }\n }, [isOpen]);\n\n const modalProps = {isOpen, onClose, qa, size};\n\n return (\n <Modal {...modalProps}>\n <ModalHeader onClose={onClose}>Настройка таблицы</ModalHeader>\n <DataGridSettingsContext.Provider value={context}>\n <Columns />\n <Footer />\n </DataGridSettingsContext.Provider>\n </Modal>\n );\n};\n"],"names":["isOpen","rest","columns","itemsById","size","areas","items","setItems","searchItems","setSearchItems","qa","useUpdateEffect","onClose"],"mappings":";;;;;;;;;;AAeO;AACC;AAAA;AACJA;AAEK;AAC4C;AAE9CC;AAMC;AAACC;AAASC;AAAWC;AAEX;AAAIH;AAAMC;AAASC;AAAWE;AAAOC;AAAOC;AAAUC;AAAaC;AAAgBC;AAInGC;AACEJ;AAAoB;AAIpB;AACqC;AAIpB;AAACP;AAAQY;AAASF;AAAIN;AAIrC;AAAgD;AAE9C;AAAQ;AACD;AACT;AAGN;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataGridSettingsContext.es.js","sources":["../src/DataGridSettingsContext.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"DataGridSettingsContext.es.js","sources":["../src/DataGridSettingsContext.ts"],"sourcesContent":["'use client';\n\nimport {createContext} from 'react';\n\nimport type {ColumnArea, ColumnItem, ColumnData, DataGridSettingsProps, ItemsById, ColumnItemId} from './types';\nimport type {RequiredQA} from '@join-x5/react-theme';\n\ntype DataGridSettingsContextProps = {\n columns: ColumnData[];\n itemsById: ItemsById;\n areas: ColumnArea[];\n\n setItems: (newItems: ColumnItem[]) => void;\n\n searchItems: ColumnItemId[];\n setSearchItems: (newSearchItems: ColumnItemId[]) => void;\n} & Pick<DataGridSettingsProps, 'setIsOpen' | 'items' | 'defaultItems' | 'onSave'> &\n RequiredQA;\n\nexport const DataGridSettingsContext = createContext<DataGridSettingsContextProps>({\n items: [],\n defaultItems: [],\n areas: [],\n columns: [],\n itemsById: new Map(),\n searchItems: [],\n setSearchItems: () => {},\n\n setIsOpen: () => {},\n setItems: () => {},\n onSave: () => {},\n qa: '',\n});\n"],"names":[],"mappings":";;AAmBO;AAA4E;AACxE;AACO;AACP;AACE;AACQ;AACJ;AACO;AAAC;AAEN;AAAC;AACF;AAAC;AACH;AAAC;AAEjB;;;;"}
|
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as c, jsxs as X } from "@emotion/react/jsx-runtime";
|
|
3
|
+
import i from "@emotion/styled/base";
|
|
4
|
+
import { useContext as W, useState as m, useRef as V } from "react";
|
|
5
|
+
import { SizeTokenValue as d, Placement as o } from "@join-x5/react-theme";
|
|
6
|
+
import { DropdownContent as s, ModalFooterContent as B, Button as R, ButtonVariant as A, IconButton as v, Dropdown as p } from "@join-x5/react";
|
|
7
|
+
import { MoreHorizontalIcon as x } from "@join-x5/react-icons";
|
|
8
|
+
import { DataGridSettingsContext as a } from "../DataGridSettingsContext.es.js";
|
|
8
9
|
function N() {
|
|
9
10
|
return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
|
|
10
11
|
}
|
|
11
|
-
const
|
|
12
|
+
const z = /* @__PURE__ */ i(s, process.env.NODE_ENV === "production" ? {
|
|
12
13
|
target: "e143cb4b1"
|
|
13
14
|
} : {
|
|
14
15
|
target: "e143cb4b1",
|
|
@@ -18,50 +19,50 @@ const B = /* @__PURE__ */ V(a, process.env.NODE_ENV === "production" ? {
|
|
|
18
19
|
styles: "overflow:hidden"
|
|
19
20
|
} : {
|
|
20
21
|
name: "d3v9zr",
|
|
21
|
-
styles: "overflow:hidden/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
22
|
+
styles: "overflow:hidden/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvRm9vdGVyL0xlZnRCdXR0b25zLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQm1EIiwiZmlsZSI6Ii9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvRm9vdGVyL0xlZnRCdXR0b25zLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIid1c2UgY2xpZW50JztcblxuaW1wb3J0IHt1c2VDb250ZXh0LCB1c2VSZWYsIHVzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB7UGxhY2VtZW50LCBTaXplVG9rZW5WYWx1ZX0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuaW1wb3J0IHtcbiAgQnV0dG9uLFxuICBCdXR0b25WYXJpYW50LFxuICBJY29uQnV0dG9uLFxuICBNb2RhbEZvb3RlckNvbnRlbnQsXG4gIERyb3Bkb3duLFxuICBEcm9wZG93bkNvbnRlbnQgYXMgQmFzZURyb3Bkb3duQ29udGVudCxcbn0gZnJvbSAnQGpvaW4teDUvcmVhY3QnO1xuXG5pbXBvcnQge01vcmVIb3Jpem9udGFsSWNvbn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtaWNvbnMnO1xuXG5pbXBvcnQge0RhdGFHcmlkU2V0dGluZ3NDb250ZXh0fSBmcm9tICcuLi9EYXRhR3JpZFNldHRpbmdzQ29udGV4dCc7XG5cbmltcG9ydCB0eXBlIHtSZXF1aXJlZFFBfSBmcm9tICdAam9pbi14NS9yZWFjdC10aGVtZSc7XG5cbmNvbnN0IERyb3Bkb3duQ29udGVudCA9IHN0eWxlZChCYXNlRHJvcGRvd25Db250ZW50KWBcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbmA7XG5cbmNvbnN0IERyb3Bkb3duQnV0dG9uID0gc3R5bGVkLmJ1dHRvbmBcbiAgd2lkdGg6IDEwMCU7XG4gIHBhZGRpbmc6IDZweCAxMnB4O1xuICBib3JkZXI6IDA7XG4gIG91dGxpbmU6IG5vbmU7XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG4gIGN1cnNvcjogcG9pbnRlcjtcblxuICAke3Byb3BzID0+IHByb3BzLnRoZW1lLnR5cG9ncmFwaHkucDFjb21wYWN0fVxuXG4gIDpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19O1xuICB9XG5gO1xuXG50eXBlIERyb3Bkb3duQnV0dG9uc1Byb3BzID0ge1xuICBpc0FsbFZpc2libGU6IGJvb2xlYW47XG4gIG9uUmVzZXQ6ICgpID0+IHZvaWQ7XG4gIG9uVG9nZ2xlVmlzaWJsZTogKCkgPT4gdm9pZDtcbn0gJiBSZXF1aXJlZFFBO1xuXG5jb25zdCBEcm9wZG93bkJ1dHRvbnM6IFJlYWN0LkZDPERyb3Bkb3duQnV0dG9uc1Byb3BzPiA9ICh7aXNBbGxWaXNpYmxlLCBxYSwgLi4ucHJvcHN9KSA9PiB7XG4gIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gIGNvbnN0IHJlZiA9IHVzZVJlZjxIVE1MQnV0dG9uRWxlbWVudD4obnVsbCk7XG5cbiAgY29uc3Qgb25Ub2dnbGUgPSAoKSA9PiBzZXRJc09wZW4oIWlzT3Blbik7XG5cbiAgY29uc3Qgb25SZXNldCA9ICgpID0+IHtcbiAgICBzZXRJc09wZW4oZmFsc2UpO1xuICAgIHByb3BzLm9uUmVzZXQoKTtcbiAgfTtcblxuICBjb25zdCBvblRvZ2dsZVZpc2libGUgPSAoKSA9PiB7XG4gICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICBwcm9wcy5vblRvZ2dsZVZpc2libGUoKTtcbiAgfTtcblxuICByZXR1cm4gKFxuICAgIDxNb2RhbEZvb3RlckNvbnRlbnQ+XG4gICAgICA8SWNvbkJ1dHRvblxuICAgICAgICByZWY9e3JlZn1cbiAgICAgICAgc2l6ZT17U2l6ZVRva2VuVmFsdWUuU21hbGx9XG4gICAgICAgIHZhcmlhbnQ9e0J1dHRvblZhcmlhbnQuSW5uZXJJbnB1dH1cbiAgICAgICAgb25DbGljaz17b25Ub2dnbGV9XG4gICAgICAgIHFhPXtgJHtxYX0tZm9vdGVyLWRyb3Bkb3duYH1cbiAgICAgID5cbiAgICAgICAgPE1vcmVIb3Jpem9udGFsSWNvbiBzaXplPXtTaXplVG9rZW5WYWx1ZS5TbWFsbH0gLz5cbiAgICAgIDwvSWNvbkJ1dHRvbj5cbiAgICAgIDxEcm9wZG93biB3aWR0aD1cIjE1MnB4XCIgcGxhY2VtZW50PXtQbGFjZW1lbnQuVG9wU3RhcnR9IGlzT3Blbj17aXNPcGVufSBzZXRJc09wZW49e3NldElzT3Blbn0gdGFyZ2V0UmVmPXtyZWZ9PlxuICAgICAgICA8RHJvcGRvd25Db250ZW50PlxuICAgICAgICAgIDxEcm9wZG93bkJ1dHRvbiB0eXBlPVwiYnV0dG9uXCIgb25DbGljaz17b25SZXNldH0gZGF0YS1xYT17YCR7cWF9LXJlc2V0YH0+XG4gICAgICAgICAgICDQn9C+INGD0LzQvtC70YfQsNC90LjRjlxuICAgICAgICAgIDwvRHJvcGRvd25CdXR0b24+XG4gICAgICAgICAgPERyb3Bkb3duQnV0dG9uIHR5cGU9XCJidXR0b25cIiBvbkNsaWNrPXtvblRvZ2dsZVZpc2libGV9IGRhdGEtcWE9e2Ake3FhfS10b2dnbGUtdmlzaWJsZWB9PlxuICAgICAgICAgICAge2lzQWxsVmlzaWJsZSA/ICfQodC60YDRi9GC0Ywg0LLRgdC1JyA6ICfQn9C+0LrQsNC30LDRgtGMINCy0YHQtSd9XG4gICAgICAgICAgPC9Ecm9wZG93bkJ1dHRvbj5cbiAgICAgICAgPC9Ecm9wZG93bkNvbnRlbnQ+XG4gICAgICA8L0Ryb3Bkb3duPlxuICAgIDwvTW9kYWxGb290ZXJDb250ZW50PlxuICApO1xufTtcblxuZXhwb3J0IGNvbnN0IExlZnRCdXR0b25zOiBSZWFjdC5GQyA9ICgpID0+IHtcbiAgY29uc3Qge2l0ZW1zLCBkZWZhdWx0SXRlbXMsIHNldEl0ZW1zLCBjb2x1bW5zLCBxYX0gPSB1c2VDb250ZXh0KERhdGFHcmlkU2V0dGluZ3NDb250ZXh0KTtcblxuICBjb25zdCBpc0FsbFZpc2libGUgPSBpdGVtcy5maW5kSW5kZXgoaXRlbSA9PiAhaXRlbS5pc1Zpc2libGUpID09PSAtMTtcblxuICBjb25zdCBvblJlc2V0ID0gKCkgPT4gc2V0SXRlbXMoZGVmYXVsdEl0ZW1zKTtcblxuICBjb25zdCBvblRvZ2dsZVZpc2libGUgPSAoKSA9PiB7XG4gICAgY29uc3QgbmV3SXRlbXMgPSBpdGVtcy5tYXAoaXRlbSA9PiAoey4uLml0ZW0sIGlzVmlzaWJsZTogaXRlbS5pc0Fsd2F5c1Zpc2libGUgfHwgIWlzQWxsVmlzaWJsZX0pKTtcblxuICAgIHNldEl0ZW1zKG5ld0l0ZW1zKTtcbiAgfTtcblxuICBpZiAoY29sdW1ucy5sZW5ndGggPT09IDEpIHtcbiAgICByZXR1cm4gPERyb3Bkb3duQnV0dG9ucyBpc0FsbFZpc2libGU9e2lzQWxsVmlzaWJsZX0gb25SZXNldD17b25SZXNldH0gb25Ub2dnbGVWaXNpYmxlPXtvblRvZ2dsZVZpc2libGV9IHFhPXtxYX0gLz47XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxNb2RhbEZvb3RlckNvbnRlbnQ+XG4gICAgICA8QnV0dG9uIHNpemU9e1NpemVUb2tlblZhbHVlLlNtYWxsfSB2YXJpYW50PXtCdXR0b25WYXJpYW50Lkdob3N0fSBvbkNsaWNrPXtvblJlc2V0fSBxYT17YCR7cWF9LXJlc2V0YH0+XG4gICAgICAgINCf0L4g0YPQvNC+0LvRh9Cw0L3QuNGOXG4gICAgICA8L0J1dHRvbj5cbiAgICAgIDxCdXR0b25cbiAgICAgICAgc2l6ZT17U2l6ZVRva2VuVmFsdWUuU21hbGx9XG4gICAgICAgIHZhcmlhbnQ9e0J1dHRvblZhcmlhbnQuR2hvc3R9XG4gICAgICAgIG9uQ2xpY2s9e29uVG9nZ2xlVmlzaWJsZX1cbiAgICAgICAgcWE9e2Ake3FhfS10b2dnbGUtdmlzaWJsZWB9XG4gICAgICA+XG4gICAgICAgIHtpc0FsbFZpc2libGUgPyAn0KHQutGA0YvRgtGMINCy0YHQtScgOiAn0J/QvtC60LDQt9Cw0YLRjCDQstGB0LUnfVxuICAgICAgPC9CdXR0b24+XG4gICAgPC9Nb2RhbEZvb3RlckNvbnRlbnQ+XG4gICk7XG59O1xuIl19 */",
|
|
22
23
|
toString: N
|
|
23
|
-
}),
|
|
24
|
+
}), e = /* @__PURE__ */ i("button", process.env.NODE_ENV === "production" ? {
|
|
24
25
|
target: "e143cb4b0"
|
|
25
26
|
} : {
|
|
26
27
|
target: "e143cb4b0",
|
|
27
28
|
label: "DropdownButton"
|
|
28
|
-
})("width:100%;padding:6px 12px;border:0;outline:none;background:none;text-align:left;cursor:pointer;", (b) => b.theme.typography.p1compact, " :hover{background-color:", (b) => b.theme.colors.grey[10], ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
29
|
+
})("width:100%;padding:6px 12px;border:0;outline:none;background:none;text-align:left;cursor:pointer;", (b) => b.theme.typography.p1compact, " :hover{background-color:", (b) => b.theme.colors.grey[10], ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvRm9vdGVyL0xlZnRCdXR0b25zLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5Qm9DIiwiZmlsZSI6Ii9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvRm9vdGVyL0xlZnRCdXR0b25zLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIid1c2UgY2xpZW50JztcblxuaW1wb3J0IHt1c2VDb250ZXh0LCB1c2VSZWYsIHVzZVN0YXRlfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB7UGxhY2VtZW50LCBTaXplVG9rZW5WYWx1ZX0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuaW1wb3J0IHtcbiAgQnV0dG9uLFxuICBCdXR0b25WYXJpYW50LFxuICBJY29uQnV0dG9uLFxuICBNb2RhbEZvb3RlckNvbnRlbnQsXG4gIERyb3Bkb3duLFxuICBEcm9wZG93bkNvbnRlbnQgYXMgQmFzZURyb3Bkb3duQ29udGVudCxcbn0gZnJvbSAnQGpvaW4teDUvcmVhY3QnO1xuXG5pbXBvcnQge01vcmVIb3Jpem9udGFsSWNvbn0gZnJvbSAnQGpvaW4teDUvcmVhY3QtaWNvbnMnO1xuXG5pbXBvcnQge0RhdGFHcmlkU2V0dGluZ3NDb250ZXh0fSBmcm9tICcuLi9EYXRhR3JpZFNldHRpbmdzQ29udGV4dCc7XG5cbmltcG9ydCB0eXBlIHtSZXF1aXJlZFFBfSBmcm9tICdAam9pbi14NS9yZWFjdC10aGVtZSc7XG5cbmNvbnN0IERyb3Bkb3duQ29udGVudCA9IHN0eWxlZChCYXNlRHJvcGRvd25Db250ZW50KWBcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbmA7XG5cbmNvbnN0IERyb3Bkb3duQnV0dG9uID0gc3R5bGVkLmJ1dHRvbmBcbiAgd2lkdGg6IDEwMCU7XG4gIHBhZGRpbmc6IDZweCAxMnB4O1xuICBib3JkZXI6IDA7XG4gIG91dGxpbmU6IG5vbmU7XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG4gIGN1cnNvcjogcG9pbnRlcjtcblxuICAke3Byb3BzID0+IHByb3BzLnRoZW1lLnR5cG9ncmFwaHkucDFjb21wYWN0fVxuXG4gIDpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtwcm9wcyA9PiBwcm9wcy50aGVtZS5jb2xvcnMuZ3JleVsxMF19O1xuICB9XG5gO1xuXG50eXBlIERyb3Bkb3duQnV0dG9uc1Byb3BzID0ge1xuICBpc0FsbFZpc2libGU6IGJvb2xlYW47XG4gIG9uUmVzZXQ6ICgpID0+IHZvaWQ7XG4gIG9uVG9nZ2xlVmlzaWJsZTogKCkgPT4gdm9pZDtcbn0gJiBSZXF1aXJlZFFBO1xuXG5jb25zdCBEcm9wZG93bkJ1dHRvbnM6IFJlYWN0LkZDPERyb3Bkb3duQnV0dG9uc1Byb3BzPiA9ICh7aXNBbGxWaXNpYmxlLCBxYSwgLi4ucHJvcHN9KSA9PiB7XG4gIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gIGNvbnN0IHJlZiA9IHVzZVJlZjxIVE1MQnV0dG9uRWxlbWVudD4obnVsbCk7XG5cbiAgY29uc3Qgb25Ub2dnbGUgPSAoKSA9PiBzZXRJc09wZW4oIWlzT3Blbik7XG5cbiAgY29uc3Qgb25SZXNldCA9ICgpID0+IHtcbiAgICBzZXRJc09wZW4oZmFsc2UpO1xuICAgIHByb3BzLm9uUmVzZXQoKTtcbiAgfTtcblxuICBjb25zdCBvblRvZ2dsZVZpc2libGUgPSAoKSA9PiB7XG4gICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICBwcm9wcy5vblRvZ2dsZVZpc2libGUoKTtcbiAgfTtcblxuICByZXR1cm4gKFxuICAgIDxNb2RhbEZvb3RlckNvbnRlbnQ+XG4gICAgICA8SWNvbkJ1dHRvblxuICAgICAgICByZWY9e3JlZn1cbiAgICAgICAgc2l6ZT17U2l6ZVRva2VuVmFsdWUuU21hbGx9XG4gICAgICAgIHZhcmlhbnQ9e0J1dHRvblZhcmlhbnQuSW5uZXJJbnB1dH1cbiAgICAgICAgb25DbGljaz17b25Ub2dnbGV9XG4gICAgICAgIHFhPXtgJHtxYX0tZm9vdGVyLWRyb3Bkb3duYH1cbiAgICAgID5cbiAgICAgICAgPE1vcmVIb3Jpem9udGFsSWNvbiBzaXplPXtTaXplVG9rZW5WYWx1ZS5TbWFsbH0gLz5cbiAgICAgIDwvSWNvbkJ1dHRvbj5cbiAgICAgIDxEcm9wZG93biB3aWR0aD1cIjE1MnB4XCIgcGxhY2VtZW50PXtQbGFjZW1lbnQuVG9wU3RhcnR9IGlzT3Blbj17aXNPcGVufSBzZXRJc09wZW49e3NldElzT3Blbn0gdGFyZ2V0UmVmPXtyZWZ9PlxuICAgICAgICA8RHJvcGRvd25Db250ZW50PlxuICAgICAgICAgIDxEcm9wZG93bkJ1dHRvbiB0eXBlPVwiYnV0dG9uXCIgb25DbGljaz17b25SZXNldH0gZGF0YS1xYT17YCR7cWF9LXJlc2V0YH0+XG4gICAgICAgICAgICDQn9C+INGD0LzQvtC70YfQsNC90LjRjlxuICAgICAgICAgIDwvRHJvcGRvd25CdXR0b24+XG4gICAgICAgICAgPERyb3Bkb3duQnV0dG9uIHR5cGU9XCJidXR0b25cIiBvbkNsaWNrPXtvblRvZ2dsZVZpc2libGV9IGRhdGEtcWE9e2Ake3FhfS10b2dnbGUtdmlzaWJsZWB9PlxuICAgICAgICAgICAge2lzQWxsVmlzaWJsZSA/ICfQodC60YDRi9GC0Ywg0LLRgdC1JyA6ICfQn9C+0LrQsNC30LDRgtGMINCy0YHQtSd9XG4gICAgICAgICAgPC9Ecm9wZG93bkJ1dHRvbj5cbiAgICAgICAgPC9Ecm9wZG93bkNvbnRlbnQ+XG4gICAgICA8L0Ryb3Bkb3duPlxuICAgIDwvTW9kYWxGb290ZXJDb250ZW50PlxuICApO1xufTtcblxuZXhwb3J0IGNvbnN0IExlZnRCdXR0b25zOiBSZWFjdC5GQyA9ICgpID0+IHtcbiAgY29uc3Qge2l0ZW1zLCBkZWZhdWx0SXRlbXMsIHNldEl0ZW1zLCBjb2x1bW5zLCBxYX0gPSB1c2VDb250ZXh0KERhdGFHcmlkU2V0dGluZ3NDb250ZXh0KTtcblxuICBjb25zdCBpc0FsbFZpc2libGUgPSBpdGVtcy5maW5kSW5kZXgoaXRlbSA9PiAhaXRlbS5pc1Zpc2libGUpID09PSAtMTtcblxuICBjb25zdCBvblJlc2V0ID0gKCkgPT4gc2V0SXRlbXMoZGVmYXVsdEl0ZW1zKTtcblxuICBjb25zdCBvblRvZ2dsZVZpc2libGUgPSAoKSA9PiB7XG4gICAgY29uc3QgbmV3SXRlbXMgPSBpdGVtcy5tYXAoaXRlbSA9PiAoey4uLml0ZW0sIGlzVmlzaWJsZTogaXRlbS5pc0Fsd2F5c1Zpc2libGUgfHwgIWlzQWxsVmlzaWJsZX0pKTtcblxuICAgIHNldEl0ZW1zKG5ld0l0ZW1zKTtcbiAgfTtcblxuICBpZiAoY29sdW1ucy5sZW5ndGggPT09IDEpIHtcbiAgICByZXR1cm4gPERyb3Bkb3duQnV0dG9ucyBpc0FsbFZpc2libGU9e2lzQWxsVmlzaWJsZX0gb25SZXNldD17b25SZXNldH0gb25Ub2dnbGVWaXNpYmxlPXtvblRvZ2dsZVZpc2libGV9IHFhPXtxYX0gLz47XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxNb2RhbEZvb3RlckNvbnRlbnQ+XG4gICAgICA8QnV0dG9uIHNpemU9e1NpemVUb2tlblZhbHVlLlNtYWxsfSB2YXJpYW50PXtCdXR0b25WYXJpYW50Lkdob3N0fSBvbkNsaWNrPXtvblJlc2V0fSBxYT17YCR7cWF9LXJlc2V0YH0+XG4gICAgICAgINCf0L4g0YPQvNC+0LvRh9Cw0L3QuNGOXG4gICAgICA8L0J1dHRvbj5cbiAgICAgIDxCdXR0b25cbiAgICAgICAgc2l6ZT17U2l6ZVRva2VuVmFsdWUuU21hbGx9XG4gICAgICAgIHZhcmlhbnQ9e0J1dHRvblZhcmlhbnQuR2hvc3R9XG4gICAgICAgIG9uQ2xpY2s9e29uVG9nZ2xlVmlzaWJsZX1cbiAgICAgICAgcWE9e2Ake3FhfS10b2dnbGUtdmlzaWJsZWB9XG4gICAgICA+XG4gICAgICAgIHtpc0FsbFZpc2libGUgPyAn0KHQutGA0YvRgtGMINCy0YHQtScgOiAn0J/QvtC60LDQt9Cw0YLRjCDQstGB0LUnfVxuICAgICAgPC9CdXR0b24+XG4gICAgPC9Nb2RhbEZvb3RlckNvbnRlbnQ+XG4gICk7XG59O1xuIl19 */")), J = ({
|
|
29
30
|
isAllVisible: b,
|
|
30
|
-
qa:
|
|
31
|
-
...
|
|
31
|
+
qa: l,
|
|
32
|
+
...C
|
|
32
33
|
}) => {
|
|
33
|
-
const [
|
|
34
|
-
|
|
35
|
-
},
|
|
36
|
-
|
|
34
|
+
const [G, I] = m(!1), g = V(null), n = () => I(!G), t = () => {
|
|
35
|
+
I(!1), C.onReset();
|
|
36
|
+
}, Z = () => {
|
|
37
|
+
I(!1), C.onToggleVisible();
|
|
37
38
|
};
|
|
38
|
-
return /* @__PURE__ */
|
|
39
|
-
/* @__PURE__ */
|
|
40
|
-
/* @__PURE__ */
|
|
41
|
-
/* @__PURE__ */
|
|
42
|
-
/* @__PURE__ */
|
|
39
|
+
return /* @__PURE__ */ X(B, { children: [
|
|
40
|
+
/* @__PURE__ */ c(v, { ref: g, size: d.Small, variant: A.InnerInput, onClick: n, qa: `${l}-footer-dropdown`, children: /* @__PURE__ */ c(x, { size: d.Small }) }),
|
|
41
|
+
/* @__PURE__ */ c(p, { width: "152px", placement: o.TopStart, isOpen: G, setIsOpen: I, targetRef: g, children: /* @__PURE__ */ X(z, { children: [
|
|
42
|
+
/* @__PURE__ */ c(e, { type: "button", onClick: t, "data-qa": `${l}-reset`, children: "По умолчанию" }),
|
|
43
|
+
/* @__PURE__ */ c(e, { type: "button", onClick: Z, "data-qa": `${l}-toggle-visible`, children: b ? "Скрыть все" : "Показать все" })
|
|
43
44
|
] }) })
|
|
44
45
|
] });
|
|
45
|
-
},
|
|
46
|
+
}, D = () => {
|
|
46
47
|
const {
|
|
47
48
|
items: b,
|
|
48
|
-
defaultItems:
|
|
49
|
-
setItems:
|
|
50
|
-
columns:
|
|
51
|
-
qa:
|
|
52
|
-
} =
|
|
53
|
-
const
|
|
54
|
-
...
|
|
55
|
-
isVisible:
|
|
49
|
+
defaultItems: l,
|
|
50
|
+
setItems: C,
|
|
51
|
+
columns: G,
|
|
52
|
+
qa: I
|
|
53
|
+
} = W(a), g = b.findIndex((Z) => !Z.isVisible) === -1, n = () => C(l), t = () => {
|
|
54
|
+
const Z = b.map((u) => ({
|
|
55
|
+
...u,
|
|
56
|
+
isVisible: u.isAlwaysVisible || !g
|
|
56
57
|
}));
|
|
57
|
-
|
|
58
|
+
C(Z);
|
|
58
59
|
};
|
|
59
|
-
return
|
|
60
|
-
/* @__PURE__ */
|
|
61
|
-
/* @__PURE__ */
|
|
60
|
+
return G.length === 1 ? /* @__PURE__ */ c(J, { isAllVisible: g, onReset: n, onToggleVisible: t, qa: I }) : /* @__PURE__ */ X(B, { children: [
|
|
61
|
+
/* @__PURE__ */ c(R, { size: d.Small, variant: A.Ghost, onClick: n, qa: `${I}-reset`, children: "По умолчанию" }),
|
|
62
|
+
/* @__PURE__ */ c(R, { size: d.Small, variant: A.Ghost, onClick: t, qa: `${I}-toggle-visible`, children: g ? "Скрыть все" : "Показать все" })
|
|
62
63
|
] });
|
|
63
64
|
};
|
|
64
65
|
export {
|
|
65
|
-
|
|
66
|
+
D as LeftButtons
|
|
66
67
|
};
|
|
67
68
|
//# sourceMappingURL=LeftButtons.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LeftButtons.es.js","sources":["../../src/Footer/LeftButtons.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"LeftButtons.es.js","sources":["../../src/Footer/LeftButtons.tsx"],"sourcesContent":["'use client';\n\nimport {useContext, useRef, useState} from 'react';\nimport styled from '@emotion/styled';\n\nimport {Placement, SizeTokenValue} from '@join-x5/react-theme';\nimport {\n Button,\n ButtonVariant,\n IconButton,\n ModalFooterContent,\n Dropdown,\n DropdownContent as BaseDropdownContent,\n} from '@join-x5/react';\n\nimport {MoreHorizontalIcon} from '@join-x5/react-icons';\n\nimport {DataGridSettingsContext} from '../DataGridSettingsContext';\n\nimport type {RequiredQA} from '@join-x5/react-theme';\n\nconst DropdownContent = styled(BaseDropdownContent)`\n overflow: hidden;\n`;\n\nconst DropdownButton = styled.button`\n width: 100%;\n padding: 6px 12px;\n border: 0;\n outline: none;\n background: none;\n text-align: left;\n cursor: pointer;\n\n ${props => props.theme.typography.p1compact}\n\n :hover {\n background-color: ${props => props.theme.colors.grey[10]};\n }\n`;\n\ntype DropdownButtonsProps = {\n isAllVisible: boolean;\n onReset: () => void;\n onToggleVisible: () => void;\n} & RequiredQA;\n\nconst DropdownButtons: React.FC<DropdownButtonsProps> = ({isAllVisible, qa, ...props}) => {\n const [isOpen, setIsOpen] = useState(false);\n const ref = useRef<HTMLButtonElement>(null);\n\n const onToggle = () => setIsOpen(!isOpen);\n\n const onReset = () => {\n setIsOpen(false);\n props.onReset();\n };\n\n const onToggleVisible = () => {\n setIsOpen(false);\n props.onToggleVisible();\n };\n\n return (\n <ModalFooterContent>\n <IconButton\n ref={ref}\n size={SizeTokenValue.Small}\n variant={ButtonVariant.InnerInput}\n onClick={onToggle}\n qa={`${qa}-footer-dropdown`}\n >\n <MoreHorizontalIcon size={SizeTokenValue.Small} />\n </IconButton>\n <Dropdown width=\"152px\" placement={Placement.TopStart} isOpen={isOpen} setIsOpen={setIsOpen} targetRef={ref}>\n <DropdownContent>\n <DropdownButton type=\"button\" onClick={onReset} data-qa={`${qa}-reset`}>\n По умолчанию\n </DropdownButton>\n <DropdownButton type=\"button\" onClick={onToggleVisible} data-qa={`${qa}-toggle-visible`}>\n {isAllVisible ? 'Скрыть все' : 'Показать все'}\n </DropdownButton>\n </DropdownContent>\n </Dropdown>\n </ModalFooterContent>\n );\n};\n\nexport const LeftButtons: React.FC = () => {\n const {items, defaultItems, setItems, columns, qa} = useContext(DataGridSettingsContext);\n\n const isAllVisible = items.findIndex(item => !item.isVisible) === -1;\n\n const onReset = () => setItems(defaultItems);\n\n const onToggleVisible = () => {\n const newItems = items.map(item => ({...item, isVisible: item.isAlwaysVisible || !isAllVisible}));\n\n setItems(newItems);\n };\n\n if (columns.length === 1) {\n return <DropdownButtons isAllVisible={isAllVisible} onReset={onReset} onToggleVisible={onToggleVisible} qa={qa} />;\n }\n\n return (\n <ModalFooterContent>\n <Button size={SizeTokenValue.Small} variant={ButtonVariant.Ghost} onClick={onReset} qa={`${qa}-reset`}>\n По умолчанию\n </Button>\n <Button\n size={SizeTokenValue.Small}\n variant={ButtonVariant.Ghost}\n onClick={onToggleVisible}\n qa={`${qa}-toggle-visible`}\n >\n {isAllVisible ? 'Скрыть все' : 'Показать все'}\n </Button>\n </ModalFooterContent>\n );\n};\n"],"names":["isAllVisible","qa","setIsOpen","items","defaultItems","setItems","columns","newItems","item"],"mappings":";;;;;;;;AAAa;AAAA;AAAA;AAqBb;AAAkD;AAAA;AAAA;AAAA;AAAA;AAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAI/B;AAAA;AAAA;AAAA;AAAA;AAsBqC;AAACA;AAAcC;AAAY;AAClF;AAMEC;AACc;AAIdA;AACsB;AAGxB;AAEI;AAQA;AAGI;AAEA;AAGA;AAEJ;AAGN;AAGQ;AAAA;AAACC;AAAOC;AAAcC;AAAUC;AAASL;AAOvCM;AAA8B;AAAIC;AAA0CR;AAElFK;AAAiB;AAGfC;AAMA;AAEA;AAQA;AAGN;;;;"}
|
package/dist/Footer/index.es.js
CHANGED
|
@@ -1,30 +1,31 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsxs as t, jsx as l } from "@emotion/react/jsx-runtime";
|
|
3
|
+
import G from "@emotion/styled/base";
|
|
3
4
|
import { useContext as Z } from "react";
|
|
4
5
|
import { SizeTokenValue as n } from "@join-x5/react-theme";
|
|
5
|
-
import { ModalFooter as
|
|
6
|
-
import { DataGridSettingsContext as
|
|
7
|
-
import { LeftButtons as
|
|
8
|
-
const
|
|
6
|
+
import { ModalFooter as a, ModalFooterContent as i, Button as o, ButtonVariant as d } from "@join-x5/react";
|
|
7
|
+
import { DataGridSettingsContext as m } from "../DataGridSettingsContext.es.js";
|
|
8
|
+
import { LeftButtons as v } from "./LeftButtons.es.js";
|
|
9
|
+
const R = /* @__PURE__ */ G(a, process.env.NODE_ENV === "production" ? {
|
|
9
10
|
target: "enotiur0"
|
|
10
11
|
} : {
|
|
11
12
|
target: "enotiur0",
|
|
12
13
|
label: "ModalFooter"
|
|
13
|
-
})("padding:20px 24px 20px 16px;border-top:1px solid ", (b) => b.theme.colors.grey[20], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
14
|
-
const b = Z(
|
|
15
|
-
items:
|
|
16
|
-
setIsOpen:
|
|
17
|
-
qa:
|
|
18
|
-
} = b,
|
|
19
|
-
return /* @__PURE__ */
|
|
20
|
-
/* @__PURE__ */
|
|
21
|
-
/* @__PURE__ */
|
|
22
|
-
/* @__PURE__ */
|
|
23
|
-
/* @__PURE__ */
|
|
14
|
+
})("padding:20px 24px 20px 16px;border-top:1px solid ", (b) => b.theme.colors.grey[20], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3NhZHlrb3ZzZC9qb2luLXg1L3BhY2thZ2VzL2RhdGEtZ3JpZC1zZXR0aW5ncy9zcmMvRm9vdGVyL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZMkMiLCJmaWxlIjoiL2hvbWUvc2FkeWtvdnNkL2pvaW4teDUvcGFja2FnZXMvZGF0YS1ncmlkLXNldHRpbmdzL3NyYy9Gb290ZXIvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnO1xuXG5pbXBvcnQge3VzZUNvbnRleHR9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHtTaXplVG9rZW5WYWx1ZX0gZnJvbSAnQGpvaW4teDUvcmVhY3QtdGhlbWUnO1xuaW1wb3J0IHtCdXR0b24sIEJ1dHRvblZhcmlhbnQsIE1vZGFsRm9vdGVyIGFzIEJhc2VNb2RhbEZvb3RlciwgTW9kYWxGb290ZXJDb250ZW50fSBmcm9tICdAam9pbi14NS9yZWFjdCc7XG5cbmltcG9ydCB7RGF0YUdyaWRTZXR0aW5nc0NvbnRleHR9IGZyb20gJy4uL0RhdGFHcmlkU2V0dGluZ3NDb250ZXh0JztcblxuaW1wb3J0IHtMZWZ0QnV0dG9uc30gZnJvbSAnLi9MZWZ0QnV0dG9ucyc7XG5cbmNvbnN0IE1vZGFsRm9vdGVyID0gc3R5bGVkKEJhc2VNb2RhbEZvb3RlcilgXG4gIHBhZGRpbmc6IDIwcHggMjRweCAyMHB4IDE2cHg7XG4gIGJvcmRlci10b3A6IDFweCBzb2xpZCAke3Byb3BzID0+IHByb3BzLnRoZW1lLmNvbG9ycy5ncmV5WzIwXX07XG5gO1xuXG5leHBvcnQgY29uc3QgRm9vdGVyOiBSZWFjdC5GQyA9ICgpID0+IHtcbiAgY29uc3QgY29udGV4dCA9IHVzZUNvbnRleHQoRGF0YUdyaWRTZXR0aW5nc0NvbnRleHQpO1xuICBjb25zdCB7aXRlbXMsIHNldElzT3BlbiwgcWF9ID0gY29udGV4dDtcblxuICBjb25zdCBvbkNsb3NlID0gKCkgPT4gc2V0SXNPcGVuKGZhbHNlKTtcbiAgY29uc3Qgb25TYXZlID0gKCkgPT4gY29udGV4dC5vblNhdmUoaXRlbXMpO1xuXG4gIHJldHVybiAoXG4gICAgPE1vZGFsRm9vdGVyPlxuICAgICAgPExlZnRCdXR0b25zIC8+XG4gICAgICA8TW9kYWxGb290ZXJDb250ZW50PlxuICAgICAgICA8QnV0dG9uIHNpemU9e1NpemVUb2tlblZhbHVlLlNtYWxsfSB2YXJpYW50PXtCdXR0b25WYXJpYW50Lk91dGxpbmVkfSBvbkNsaWNrPXtvbkNsb3NlfSBxYT17YCR7cWF9LWNhbmNlbGB9PlxuICAgICAgICAgINCe0YLQvNC10L3QuNGC0YxcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICAgIDxCdXR0b24gc2l6ZT17U2l6ZVRva2VuVmFsdWUuU21hbGx9IHZhcmlhbnQ9e0J1dHRvblZhcmlhbnQuUHJpbWFyeX0gb25DbGljaz17b25TYXZlfSBxYT17YCR7cWF9LXNhdmVgfT5cbiAgICAgICAgICDQn9GA0LjQvNC10L3QuNGC0YxcbiAgICAgICAgPC9CdXR0b24+XG4gICAgICA8L01vZGFsRm9vdGVyQ29udGVudD5cbiAgICA8L01vZGFsRm9vdGVyPlxuICApO1xufTtcbiJdfQ== */")), V = () => {
|
|
15
|
+
const b = Z(m), {
|
|
16
|
+
items: e,
|
|
17
|
+
setIsOpen: I,
|
|
18
|
+
qa: c
|
|
19
|
+
} = b, C = () => I(!1), g = () => b.onSave(e);
|
|
20
|
+
return /* @__PURE__ */ t(R, { children: [
|
|
21
|
+
/* @__PURE__ */ l(v, {}),
|
|
22
|
+
/* @__PURE__ */ t(i, { children: [
|
|
23
|
+
/* @__PURE__ */ l(o, { size: n.Small, variant: d.Outlined, onClick: C, qa: `${c}-cancel`, children: "Отменить" }),
|
|
24
|
+
/* @__PURE__ */ l(o, { size: n.Small, variant: d.Primary, onClick: g, qa: `${c}-save`, children: "Применить" })
|
|
24
25
|
] })
|
|
25
26
|
] });
|
|
26
27
|
};
|
|
27
28
|
export {
|
|
28
|
-
|
|
29
|
+
V as Footer
|
|
29
30
|
};
|
|
30
31
|
//# sourceMappingURL=index.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../../src/Footer/index.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../../src/Footer/index.tsx"],"sourcesContent":["'use client';\n\nimport {useContext} from 'react';\nimport styled from '@emotion/styled';\n\nimport {SizeTokenValue} from '@join-x5/react-theme';\nimport {Button, ButtonVariant, ModalFooter as BaseModalFooter, ModalFooterContent} from '@join-x5/react';\n\nimport {DataGridSettingsContext} from '../DataGridSettingsContext';\n\nimport {LeftButtons} from './LeftButtons';\n\nconst ModalFooter = styled(BaseModalFooter)`\n padding: 20px 24px 20px 16px;\n border-top: 1px solid ${props => props.theme.colors.grey[20]};\n`;\n\nexport const Footer: React.FC = () => {\n const context = useContext(DataGridSettingsContext);\n const {items, setIsOpen, qa} = context;\n\n const onClose = () => setIsOpen(false);\n const onSave = () => context.onSave(items);\n\n return (\n <ModalFooter>\n <LeftButtons />\n <ModalFooterContent>\n <Button size={SizeTokenValue.Small} variant={ButtonVariant.Outlined} onClick={onClose} qa={`${qa}-cancel`}>\n Отменить\n </Button>\n <Button size={SizeTokenValue.Small} variant={ButtonVariant.Primary} onClick={onSave} qa={`${qa}-save`}>\n Применить\n </Button>\n </ModalFooterContent>\n </ModalFooter>\n );\n};\n"],"names":["context","items","setIsOpen","qa"],"mappings":";;;;;;;;AAYA;AAA0C;AAAA;AAAA;AAAA;AAAA;AAMlCA;AACA;AAACC;AAAOC;AAAWC;AAKzB;AAEI;AAAY;AAEV;AAEA;AAGA;AACF;AAGN;;;;"}
|