@qoretechnologies/reqore 0.24.0 → 0.25.3
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/.gitpod.yml +4 -1
- package/__tests__/collection.test.tsx +72 -0
- package/__tests__/panel.test.tsx +35 -2
- package/__tests__/tag.test.tsx +21 -7
- package/dist/components/Collection/index.d.ts +17 -0
- package/dist/components/Collection/index.d.ts.map +1 -0
- package/dist/components/Collection/index.js +165 -0
- package/dist/components/Collection/index.js.map +1 -0
- package/dist/components/Collection/item.d.ts +18 -0
- package/dist/components/Collection/item.d.ts.map +1 -0
- package/dist/components/Collection/item.js +168 -0
- package/dist/components/Collection/item.js.map +1 -0
- package/dist/components/Columns/index.d.ts.map +1 -1
- package/dist/components/Columns/index.js +1 -1
- package/dist/components/Columns/index.js.map +1 -1
- package/dist/components/ControlGroup/index.d.ts.map +1 -1
- package/dist/components/ControlGroup/index.js +5 -3
- package/dist/components/ControlGroup/index.js.map +1 -1
- package/dist/components/Drawer/index.d.ts +1 -1
- package/dist/components/Drawer/index.d.ts.map +1 -1
- package/dist/components/Dropdown/index.d.ts.map +1 -1
- package/dist/components/Dropdown/index.js +1 -1
- package/dist/components/Dropdown/index.js.map +1 -1
- package/dist/components/InternalPopover/index.js +1 -1
- package/dist/components/Panel/index.d.ts +12 -12
- package/dist/components/Panel/index.d.ts.map +1 -1
- package/dist/components/Panel/index.js +66 -36
- package/dist/components/Panel/index.js.map +1 -1
- package/dist/components/Table/index.d.ts +4 -4
- package/dist/components/Table/index.d.ts.map +1 -1
- package/dist/components/Table/index.js.map +1 -1
- package/dist/components/Table/row.d.ts +2 -2
- package/dist/components/Table/row.d.ts.map +1 -1
- package/dist/components/Tag/index.d.ts +2 -1
- package/dist/components/Tag/index.d.ts.map +1 -1
- package/dist/components/Tag/index.js +11 -10
- package/dist/components/Tag/index.js.map +1 -1
- package/dist/constants/theme.d.ts +3 -0
- package/dist/constants/theme.d.ts.map +1 -1
- package/dist/constants/theme.js +9 -1
- package/dist/constants/theme.js.map +1 -1
- package/dist/hooks/usePopover.d.ts +1 -0
- package/dist/hooks/usePopover.d.ts.map +1 -1
- package/dist/hooks/usePopover.js +5 -4
- package/dist/hooks/usePopover.js.map +1 -1
- package/dist/hooks/useTooltip.d.ts +2 -2
- package/dist/hooks/useTooltip.d.ts.map +1 -1
- package/dist/hooks/useTooltip.js +11 -2
- package/dist/hooks/useTooltip.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +4 -2
- package/dist/index.js.map +1 -1
- package/dist/types/global.d.ts +29 -0
- package/dist/types/global.d.ts.map +1 -1
- package/package.json +12 -10
- package/src/components/Collection/index.tsx +189 -0
- package/src/components/Collection/item.tsx +239 -0
- package/src/components/Columns/index.tsx +1 -0
- package/src/components/ControlGroup/index.tsx +5 -2
- package/src/components/Drawer/index.tsx +1 -1
- package/src/components/Dropdown/index.tsx +1 -0
- package/src/components/InternalPopover/index.tsx +1 -1
- package/src/components/Panel/index.tsx +188 -118
- package/src/components/Table/index.tsx +7 -7
- package/src/components/Table/row.tsx +2 -2
- package/src/components/Tag/index.tsx +27 -5
- package/src/constants/theme.ts +9 -0
- package/src/hooks/usePopover.tsx +6 -4
- package/src/hooks/useTooltip.ts +15 -4
- package/src/index.tsx +1 -0
- package/src/mock/collectionData.tsx +228 -0
- package/src/stories/Collection/Collection.stories.tsx +98 -0
- package/src/stories/Columns/Columns.stories.tsx +1 -1
- package/src/stories/Panel/Panel.stories.tsx +22 -0
- package/src/stories/Tag/Tag.stories.tsx +2 -0
- package/src/types/global.ts +31 -0
- package/tests.json +1 -1
package/.gitpod.yml
CHANGED
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import { fireEvent, render } from '@testing-library/react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { ReqoreCollection, ReqoreLayoutContent, ReqoreUIProvider } from '../src';
|
|
4
|
+
import items from '../src/mock/collectionData';
|
|
5
|
+
|
|
6
|
+
test('Renders basic <Collection /> properly', () => {
|
|
7
|
+
render(
|
|
8
|
+
<ReqoreUIProvider>
|
|
9
|
+
<ReqoreLayoutContent>
|
|
10
|
+
<ReqoreCollection items={items} />
|
|
11
|
+
</ReqoreLayoutContent>
|
|
12
|
+
</ReqoreUIProvider>
|
|
13
|
+
);
|
|
14
|
+
|
|
15
|
+
expect(document.querySelectorAll('.reqore-collection').length).toBe(1);
|
|
16
|
+
expect(document.querySelectorAll('.reqore-collection-item').length).toBe(8);
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
test('<Collection /> items can be filtered', () => {
|
|
20
|
+
render(
|
|
21
|
+
<ReqoreUIProvider>
|
|
22
|
+
<ReqoreLayoutContent>
|
|
23
|
+
<ReqoreCollection items={items} filterable />
|
|
24
|
+
</ReqoreLayoutContent>
|
|
25
|
+
</ReqoreUIProvider>
|
|
26
|
+
);
|
|
27
|
+
|
|
28
|
+
fireEvent.change(document.querySelector('.reqore-input')!, {
|
|
29
|
+
target: { value: 'actions' },
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
expect(document.querySelectorAll('.reqore-collection-item').length).toBe(2);
|
|
33
|
+
|
|
34
|
+
fireEvent.change(document.querySelector('.reqore-input')!, {
|
|
35
|
+
target: { value: 'asg' },
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
expect(document.querySelectorAll('.reqore-collection-item').length).toBe(0);
|
|
39
|
+
expect(document.querySelectorAll('.reqore-message').length).toBe(1);
|
|
40
|
+
});
|
|
41
|
+
|
|
42
|
+
test('<Collection /> shows no data message when empty', () => {
|
|
43
|
+
render(
|
|
44
|
+
<ReqoreUIProvider>
|
|
45
|
+
<ReqoreLayoutContent>
|
|
46
|
+
<ReqoreCollection items={[]} filterable />
|
|
47
|
+
</ReqoreLayoutContent>
|
|
48
|
+
</ReqoreUIProvider>
|
|
49
|
+
);
|
|
50
|
+
|
|
51
|
+
expect(document.querySelectorAll('.reqore-message').length).toBe(1);
|
|
52
|
+
});
|
|
53
|
+
|
|
54
|
+
test('<Collection /> can be sorted', () => {
|
|
55
|
+
render(
|
|
56
|
+
<ReqoreUIProvider>
|
|
57
|
+
<ReqoreLayoutContent>
|
|
58
|
+
<ReqoreCollection items={items} sortable />
|
|
59
|
+
</ReqoreLayoutContent>
|
|
60
|
+
</ReqoreUIProvider>
|
|
61
|
+
);
|
|
62
|
+
|
|
63
|
+
const firstItem = document.querySelector('.reqore-collection-item');
|
|
64
|
+
// Expect the title of the first item to be "Expandable item"
|
|
65
|
+
expect(firstItem?.querySelector('h3')?.textContent).toBe('Expandable item');
|
|
66
|
+
|
|
67
|
+
fireEvent.click(document.querySelectorAll('.reqore-button')[1]);
|
|
68
|
+
|
|
69
|
+
const firstNewItem = document.querySelector('.reqore-collection-item');
|
|
70
|
+
|
|
71
|
+
expect(firstNewItem?.querySelector('h3')?.textContent).toBe('This item is not flat');
|
|
72
|
+
});
|
package/__tests__/panel.test.tsx
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { fireEvent, render } from '@testing-library/react';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
import { ReqoreLayoutContent, ReqorePanel, ReqoreUIProvider } from '../src';
|
|
3
|
+
import { ReqoreInput, ReqoreLayoutContent, ReqorePanel, ReqoreUIProvider } from '../src';
|
|
4
4
|
|
|
5
5
|
test('Renders basic <Panel /> properly', () => {
|
|
6
6
|
render(
|
|
@@ -34,7 +34,7 @@ test('Renders basic <Panel /> with title properly', () => {
|
|
|
34
34
|
|
|
35
35
|
expect(document.querySelectorAll('.reqore-panel').length).toBe(1);
|
|
36
36
|
expect(document.querySelectorAll('.reqore-panel-title').length).toBe(1);
|
|
37
|
-
expect(document.querySelectorAll('span').length).toBe(
|
|
37
|
+
expect(document.querySelectorAll('span').length).toBe(1);
|
|
38
38
|
expect(document.querySelectorAll('.reqore-panel-content').length).toBe(1);
|
|
39
39
|
});
|
|
40
40
|
|
|
@@ -95,3 +95,36 @@ test('Renders closable <Panel /> properly', () => {
|
|
|
95
95
|
|
|
96
96
|
expect(fn).toHaveBeenCalled();
|
|
97
97
|
});
|
|
98
|
+
|
|
99
|
+
test('Renders <Panel /> with actions', () => {
|
|
100
|
+
const fn = jest.fn();
|
|
101
|
+
|
|
102
|
+
render(
|
|
103
|
+
<div style={{ width: '1000px' }}>
|
|
104
|
+
<ReqoreUIProvider>
|
|
105
|
+
<ReqoreLayoutContent>
|
|
106
|
+
<ReqorePanel
|
|
107
|
+
label='Test'
|
|
108
|
+
onClose={fn}
|
|
109
|
+
actions={[
|
|
110
|
+
{ label: 'Test' },
|
|
111
|
+
{ actions: [{ label: 'Deep' }] },
|
|
112
|
+
{ customContent: () => <ReqoreInput /> },
|
|
113
|
+
]}
|
|
114
|
+
bottomActions={[
|
|
115
|
+
{ label: 'Test', position: 'left' },
|
|
116
|
+
{ actions: [{ label: 'Deep' }], position: 'right' },
|
|
117
|
+
]}
|
|
118
|
+
>
|
|
119
|
+
{' '}
|
|
120
|
+
Panel{' '}
|
|
121
|
+
</ReqorePanel>
|
|
122
|
+
</ReqoreLayoutContent>
|
|
123
|
+
</ReqoreUIProvider>
|
|
124
|
+
</div>
|
|
125
|
+
);
|
|
126
|
+
|
|
127
|
+
expect(document.querySelectorAll('.reqore-button').length).toBe(5);
|
|
128
|
+
expect(document.querySelectorAll('.reqore-dropdown-control').length).toBe(2);
|
|
129
|
+
expect(document.querySelectorAll('.reqore-input').length).toBe(1);
|
|
130
|
+
});
|
package/__tests__/tag.test.tsx
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { fireEvent, render } from '@testing-library/react';
|
|
1
|
+
import { fireEvent, render, screen } from '@testing-library/react';
|
|
2
2
|
import { noop } from 'lodash';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import {
|
|
@@ -16,12 +16,7 @@ test('Renders <Tag /> properly', () => {
|
|
|
16
16
|
<ReqoreLayoutContent>
|
|
17
17
|
<ReqoreContent>
|
|
18
18
|
<ReqoreControlGroup minimal>
|
|
19
|
-
<ReqoreTag
|
|
20
|
-
icon='24HoursLine'
|
|
21
|
-
rightIcon='4KLine'
|
|
22
|
-
onClick={noop}
|
|
23
|
-
onRemoveClick={noop}
|
|
24
|
-
/>
|
|
19
|
+
<ReqoreTag icon='24HoursLine' rightIcon='4KLine' onClick={noop} onRemoveClick={noop} />
|
|
25
20
|
<ReqoreTag
|
|
26
21
|
icon='24HoursLine'
|
|
27
22
|
rightIcon='4KLine'
|
|
@@ -144,3 +139,22 @@ test('Fires onClick and onRemoveClick <Tag /> events', () => {
|
|
|
144
139
|
expect(clickFn).toHaveBeenCalledTimes(1);
|
|
145
140
|
expect(removeClickFn).toHaveBeenCalledTimes(1);
|
|
146
141
|
});
|
|
142
|
+
|
|
143
|
+
test('Renders <Tag /> with the label key', () => {
|
|
144
|
+
render(
|
|
145
|
+
<ReqoreUIProvider>
|
|
146
|
+
<ReqoreLayoutContent>
|
|
147
|
+
<ReqoreContent>
|
|
148
|
+
<ReqoreControlGroup minimal>
|
|
149
|
+
<ReqoreTagGroup>
|
|
150
|
+
<ReqoreTag icon='24HoursLine' rightIcon='4KLine' label='Label' labelKey='label key' />
|
|
151
|
+
</ReqoreTagGroup>
|
|
152
|
+
</ReqoreControlGroup>
|
|
153
|
+
</ReqoreContent>
|
|
154
|
+
</ReqoreLayoutContent>
|
|
155
|
+
</ReqoreUIProvider>
|
|
156
|
+
);
|
|
157
|
+
|
|
158
|
+
// Get the label key by text from screen
|
|
159
|
+
expect(screen.getByText('label key')).toBeTruthy();
|
|
160
|
+
});
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { IReqoreColumnsProps } from '../Columns';
|
|
3
|
+
import { IReqorePanelProps } from '../Panel';
|
|
4
|
+
import { IReqoreCollectionItemProps } from './item';
|
|
5
|
+
export interface IReqoreCollectionProps extends Pick<IReqorePanelProps, 'size' | 'intent' | 'customTheme' | 'actions' | 'bottomActions' | 'label'>, IReqoreColumnsProps {
|
|
6
|
+
items?: IReqoreCollectionItemProps[];
|
|
7
|
+
stacked?: boolean;
|
|
8
|
+
rounded?: boolean;
|
|
9
|
+
height?: string;
|
|
10
|
+
fill?: boolean;
|
|
11
|
+
maxItemHeight?: number;
|
|
12
|
+
filterable?: boolean;
|
|
13
|
+
sortable?: boolean;
|
|
14
|
+
}
|
|
15
|
+
export declare const StyledCollectionWrapper: any;
|
|
16
|
+
export declare const ReqoreCollection: ({ items, columnsGap, stacked, rounded, fill, height, maxItemHeight, filterable, sortable, ...rest }: IReqoreCollectionProps) => JSX.Element;
|
|
17
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Collection/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,mBAAmB,EAAiB,MAAM,YAAY,CAAC;AAGhE,OAAO,EAAsB,iBAAiB,EAAe,MAAM,UAAU,CAAC;AAE9E,OAAO,EAAE,0BAA0B,EAAwB,MAAM,QAAQ,CAAC;AAE1E,MAAM,WAAW,sBACf,SAAQ,IAAI,CACR,iBAAiB,EACjB,MAAM,GAAG,QAAQ,GAAG,aAAa,GAAG,SAAS,GAAG,eAAe,GAAG,OAAO,CAC1E,EACD,mBAAmB;IACrB,KAAK,CAAC,EAAE,0BAA0B,EAAE,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,uBAAuB,KAWnC,CAAC;AAEF,eAAO,MAAM,gBAAgB,wGAW1B,sBAAsB,gBAyIxB,CAAC"}
|
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
+
return cooked;
|
|
5
|
+
};
|
|
6
|
+
var __assign = (this && this.__assign) || function () {
|
|
7
|
+
__assign = Object.assign || function(t) {
|
|
8
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
+
s = arguments[i];
|
|
10
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
+
t[p] = s[p];
|
|
12
|
+
}
|
|
13
|
+
return t;
|
|
14
|
+
};
|
|
15
|
+
return __assign.apply(this, arguments);
|
|
16
|
+
};
|
|
17
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
18
|
+
if (k2 === undefined) k2 = k;
|
|
19
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
20
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
21
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
22
|
+
}
|
|
23
|
+
Object.defineProperty(o, k2, desc);
|
|
24
|
+
}) : (function(o, m, k, k2) {
|
|
25
|
+
if (k2 === undefined) k2 = k;
|
|
26
|
+
o[k2] = m[k];
|
|
27
|
+
}));
|
|
28
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
29
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
30
|
+
}) : function(o, v) {
|
|
31
|
+
o["default"] = v;
|
|
32
|
+
});
|
|
33
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
34
|
+
if (mod && mod.__esModule) return mod;
|
|
35
|
+
var result = {};
|
|
36
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
37
|
+
__setModuleDefault(result, mod);
|
|
38
|
+
return result;
|
|
39
|
+
};
|
|
40
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
41
|
+
var t = {};
|
|
42
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
43
|
+
t[p] = s[p];
|
|
44
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
45
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
46
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
47
|
+
t[p[i]] = s[p[i]];
|
|
48
|
+
}
|
|
49
|
+
return t;
|
|
50
|
+
};
|
|
51
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
52
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
53
|
+
if (ar || !(i in from)) {
|
|
54
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
55
|
+
ar[i] = from[i];
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
59
|
+
};
|
|
60
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
61
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
62
|
+
};
|
|
63
|
+
exports.__esModule = true;
|
|
64
|
+
exports.ReqoreCollection = exports.StyledCollectionWrapper = void 0;
|
|
65
|
+
var react_1 = require("react");
|
|
66
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
67
|
+
var lodash_1 = require("lodash");
|
|
68
|
+
var react_2 = require("react");
|
|
69
|
+
var styled_components_1 = __importStar(require("styled-components"));
|
|
70
|
+
var theme_1 = require("../../constants/theme");
|
|
71
|
+
var Columns_1 = require("../Columns");
|
|
72
|
+
var Input_1 = __importDefault(require("../Input"));
|
|
73
|
+
var Message_1 = __importDefault(require("../Message"));
|
|
74
|
+
var Panel_1 = require("../Panel");
|
|
75
|
+
var helpers_1 = require("../Table/helpers");
|
|
76
|
+
var item_1 = require("./item");
|
|
77
|
+
exports.StyledCollectionWrapper = (0, styled_components_1["default"])(Columns_1.StyledColumns)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: ", ";\n\n ", "\n\n overflow: hidden;\n position: relative;\n"], ["\n height: ", ";\n\n ", "\n\n overflow: hidden;\n position: relative;\n"])), function (_a) {
|
|
78
|
+
var height = _a.height;
|
|
79
|
+
return (height ? "".concat(height, "px") : 'auto');
|
|
80
|
+
}, function (_a) {
|
|
81
|
+
var rounded = _a.rounded, stacked = _a.stacked;
|
|
82
|
+
return (!rounded || stacked) && (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: ", ";\n "], ["\n border-radius: ", ";\n "])), stacked && rounded ? '10px' : undefined);
|
|
83
|
+
});
|
|
84
|
+
var ReqoreCollection = function (_a) {
|
|
85
|
+
var items = _a.items, _b = _a.columnsGap, columnsGap = _b === void 0 ? '10px' : _b, stacked = _a.stacked, _c = _a.rounded, rounded = _c === void 0 ? true : _c, fill = _a.fill, height = _a.height, maxItemHeight = _a.maxItemHeight, filterable = _a.filterable, sortable = _a.sortable, rest = __rest(_a, ["items", "columnsGap", "stacked", "rounded", "fill", "height", "maxItemHeight", "filterable", "sortable"]);
|
|
86
|
+
var _d = (0, react_2.useState)('grid'), showAs = _d[0], setShowAs = _d[1];
|
|
87
|
+
var _e = (0, react_2.useState)('asc'), sort = _e[0], setSort = _e[1];
|
|
88
|
+
var _f = (0, react_2.useState)(''), query = _f[0], setQuery = _f[1];
|
|
89
|
+
var sortedItems = (0, react_2.useMemo)(function () { return (sortable ? (0, helpers_1.sortTableData)(items, { by: 'label', direction: sort }) : items); }, [items, sort]);
|
|
90
|
+
var filteredItems = (0, react_2.useMemo)(function () {
|
|
91
|
+
if (!filterable || query === '') {
|
|
92
|
+
return sortedItems;
|
|
93
|
+
}
|
|
94
|
+
return sortedItems.filter(function (item) {
|
|
95
|
+
var _a, _b;
|
|
96
|
+
var text = "".concat(item.label).concat((_a = item.content) === null || _a === void 0 ? void 0 : _a.toString()).concat((_b = item.expandedContent) === null || _b === void 0 ? void 0 : _b.toString());
|
|
97
|
+
if (!text) {
|
|
98
|
+
return false;
|
|
99
|
+
}
|
|
100
|
+
return text.toString().toLowerCase().indexOf(query.toLowerCase()) !== -1;
|
|
101
|
+
});
|
|
102
|
+
}, [items, query, sortedItems]);
|
|
103
|
+
var handleQueryChange = function (event) {
|
|
104
|
+
setQuery(event.target.value);
|
|
105
|
+
};
|
|
106
|
+
var finalItems = filteredItems;
|
|
107
|
+
var finalActions = (0, react_2.useMemo)(function () {
|
|
108
|
+
var actions = [];
|
|
109
|
+
if (filterable) {
|
|
110
|
+
actions = __spreadArray(__spreadArray([], actions, true), [
|
|
111
|
+
{
|
|
112
|
+
customContent: function () { return ((0, jsx_runtime_1.jsx)(Input_1["default"], { placeholder: "Filter ".concat((0, lodash_1.size)(items), " items"), onClearClick: function () { return setQuery(''); }, onChange: handleQueryChange, value: query, icon: 'Search2Line', minimal: false })); }
|
|
113
|
+
},
|
|
114
|
+
], false);
|
|
115
|
+
}
|
|
116
|
+
if (sortable) {
|
|
117
|
+
actions = __spreadArray(__spreadArray([], actions, true), [
|
|
118
|
+
[
|
|
119
|
+
{
|
|
120
|
+
icon: 'SortAsc',
|
|
121
|
+
intent: sort === 'asc' ? theme_1.ReqoreIntents.INFO : undefined,
|
|
122
|
+
onClick: function () { return setSort('asc'); },
|
|
123
|
+
active: sort === 'asc',
|
|
124
|
+
tooltip: 'Sort ascending',
|
|
125
|
+
disabled: !(0, lodash_1.size)(finalItems)
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
icon: 'SortDesc',
|
|
129
|
+
intent: sort === 'desc' ? theme_1.ReqoreIntents.INFO : undefined,
|
|
130
|
+
onClick: function () { return setSort('desc'); },
|
|
131
|
+
active: sort === 'desc',
|
|
132
|
+
tooltip: 'Sort descending',
|
|
133
|
+
disabled: !(0, lodash_1.size)(finalItems)
|
|
134
|
+
},
|
|
135
|
+
],
|
|
136
|
+
], false);
|
|
137
|
+
}
|
|
138
|
+
return __spreadArray(__spreadArray(__spreadArray([], actions, true), [
|
|
139
|
+
[
|
|
140
|
+
{
|
|
141
|
+
icon: 'GridLine',
|
|
142
|
+
onClick: function () { return setShowAs('grid'); },
|
|
143
|
+
intent: showAs === 'grid' ? theme_1.ReqoreIntents.INFO : undefined,
|
|
144
|
+
active: showAs === 'grid',
|
|
145
|
+
tooltip: 'Show as grid',
|
|
146
|
+
disabled: !(0, lodash_1.size)(finalItems)
|
|
147
|
+
},
|
|
148
|
+
{
|
|
149
|
+
icon: 'ListOrdered',
|
|
150
|
+
onClick: function () { return setShowAs('list'); },
|
|
151
|
+
intent: showAs === 'list' ? theme_1.ReqoreIntents.INFO : undefined,
|
|
152
|
+
active: showAs === 'list',
|
|
153
|
+
tooltip: 'Show as list',
|
|
154
|
+
disabled: !(0, lodash_1.size)(finalItems)
|
|
155
|
+
},
|
|
156
|
+
]
|
|
157
|
+
], false), (rest.actions || []), true);
|
|
158
|
+
}, [filterable, handleQueryChange, query, rest.actions, showAs, sort, sortable, finalItems]);
|
|
159
|
+
return ((0, jsx_runtime_1.jsx)(Panel_1.ReqorePanel, __assign({}, rest, { style: {
|
|
160
|
+
height: height !== null && height !== void 0 ? height : undefined
|
|
161
|
+
}, fill: fill, headerSize: 2, padded: true, opacity: 0, actions: finalActions, className: "reqore-collection ".concat(rest.className || '') }, { children: !(0, lodash_1.size)(finalItems) ? ((0, jsx_runtime_1.jsx)(Message_1["default"], __assign({ intent: 'muted', flat: true, title: 'No items found' }, { children: "No data in this collection, try changing your search query or filters" }))) : ((0, jsx_runtime_1.jsx)(exports.StyledCollectionWrapper, __assign({ columns: showAs === 'grid' ? 'auto-fit' : 1, columnsGap: stacked ? '0px' : columnsGap, rounded: rounded, stacked: stacked }, rest, { children: finalItems === null || finalItems === void 0 ? void 0 : finalItems.map(function (item) { return ((0, react_1.createElement)(item_1.ReqoreCollectionItem, __assign({}, item, { key: item.id || item.label.toString(), rounded: !stacked, maxContentHeight: maxItemHeight }))); }) }))) })));
|
|
162
|
+
};
|
|
163
|
+
exports.ReqoreCollection = ReqoreCollection;
|
|
164
|
+
var templateObject_1, templateObject_2;
|
|
165
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Collection/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { IReqoreDropdownItemProps } from '../Dropdown/item';
|
|
3
|
+
import { IReqorePanelBottomAction, IReqorePanelProps } from '../Panel';
|
|
4
|
+
import { IReqoreTagProps } from '../Tag';
|
|
5
|
+
export interface IReqoreCollectionItemProps extends Omit<IReqorePanelProps, 'children' | 'actions' | 'collapsible' | 'onCollapseChange' | 'isCollapsed' | 'unMountContentOnCollapse' | 'bottomActions'> {
|
|
6
|
+
subHeader?: string;
|
|
7
|
+
content?: string | React.ReactNode;
|
|
8
|
+
expandable?: boolean;
|
|
9
|
+
expandedContent?: string | React.ReactNode;
|
|
10
|
+
expandedActions?: IReqorePanelBottomAction[];
|
|
11
|
+
image?: string;
|
|
12
|
+
actions?: IReqoreDropdownItemProps[];
|
|
13
|
+
tags?: IReqoreTagProps[];
|
|
14
|
+
maxContentHeight?: number;
|
|
15
|
+
}
|
|
16
|
+
export declare const StyledCollectionItemContent: any;
|
|
17
|
+
export declare const ReqoreCollectionItem: ({ flat, minimal, style, content, actions, tags, expandable, expandedContent, expandedActions, maxContentHeight, ...rest }: IReqoreCollectionItemProps) => JSX.Element;
|
|
18
|
+
//# sourceMappingURL=item.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../src/components/Collection/item.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAEL,wBAAwB,EACxB,iBAAiB,EAElB,MAAM,UAAU,CAAC;AAElB,OAAkB,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAGpD,MAAM,WAAW,0BACf,SAAQ,IAAI,CACV,iBAAiB,EACf,UAAU,GACV,SAAS,GACT,aAAa,GACb,kBAAkB,GAClB,aAAa,GACb,0BAA0B,GAC1B,eAAe,CAClB;IACD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAC3C,eAAe,CAAC,EAAE,wBAAwB,EAAE,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACrC,IAAI,CAAC,EAAE,eAAe,EAAE,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,2BAA2B,KAwBvC,CAAC;AAEF,eAAO,MAAM,oBAAoB,8HAY9B,0BAA0B,gBA8J5B,CAAC"}
|
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
+
return cooked;
|
|
5
|
+
};
|
|
6
|
+
var __assign = (this && this.__assign) || function () {
|
|
7
|
+
__assign = Object.assign || function(t) {
|
|
8
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
+
s = arguments[i];
|
|
10
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
+
t[p] = s[p];
|
|
12
|
+
}
|
|
13
|
+
return t;
|
|
14
|
+
};
|
|
15
|
+
return __assign.apply(this, arguments);
|
|
16
|
+
};
|
|
17
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
18
|
+
if (k2 === undefined) k2 = k;
|
|
19
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
20
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
21
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
22
|
+
}
|
|
23
|
+
Object.defineProperty(o, k2, desc);
|
|
24
|
+
}) : (function(o, m, k, k2) {
|
|
25
|
+
if (k2 === undefined) k2 = k;
|
|
26
|
+
o[k2] = m[k];
|
|
27
|
+
}));
|
|
28
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
29
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
30
|
+
}) : function(o, v) {
|
|
31
|
+
o["default"] = v;
|
|
32
|
+
});
|
|
33
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
34
|
+
if (mod && mod.__esModule) return mod;
|
|
35
|
+
var result = {};
|
|
36
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
37
|
+
__setModuleDefault(result, mod);
|
|
38
|
+
return result;
|
|
39
|
+
};
|
|
40
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
41
|
+
var t = {};
|
|
42
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
43
|
+
t[p] = s[p];
|
|
44
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
45
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
46
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
47
|
+
t[p[i]] = s[p[i]];
|
|
48
|
+
}
|
|
49
|
+
return t;
|
|
50
|
+
};
|
|
51
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
52
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
53
|
+
if (ar || !(i in from)) {
|
|
54
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
55
|
+
ar[i] = from[i];
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
59
|
+
};
|
|
60
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
61
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
62
|
+
};
|
|
63
|
+
exports.__esModule = true;
|
|
64
|
+
exports.ReqoreCollectionItem = exports.StyledCollectionItemContent = void 0;
|
|
65
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
66
|
+
var lodash_1 = require("lodash");
|
|
67
|
+
var polished_1 = require("polished");
|
|
68
|
+
var react_1 = require("react");
|
|
69
|
+
var react_use_1 = require("react-use");
|
|
70
|
+
var styled_components_1 = __importStar(require("styled-components"));
|
|
71
|
+
var ReqoreContext_1 = __importDefault(require("../../context/ReqoreContext"));
|
|
72
|
+
var colors_1 = require("../../helpers/colors");
|
|
73
|
+
var useTheme_1 = require("../../hooks/useTheme");
|
|
74
|
+
var Drawer_1 = require("../Drawer");
|
|
75
|
+
var Panel_1 = require("../Panel");
|
|
76
|
+
var Spacer_1 = require("../Spacer");
|
|
77
|
+
var Tag_1 = __importDefault(require("../Tag"));
|
|
78
|
+
var group_1 = __importDefault(require("../Tag/group"));
|
|
79
|
+
exports.StyledCollectionItemContent = styled_components_1["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-height: ", ";\n overflow: hidden;\n position: relative;\n transition: 0.3s ease-in-out;\n\n ", "\n"], ["\n max-height: ", ";\n overflow: hidden;\n position: relative;\n transition: 0.3s ease-in-out;\n\n ", "\n"])), function (_a) {
|
|
80
|
+
var providedHeight = _a.providedHeight;
|
|
81
|
+
return (providedHeight ? "".concat(providedHeight, "px") : 'auto');
|
|
82
|
+
}, function (_a) {
|
|
83
|
+
var contentOverflows = _a.contentOverflows, theme = _a.theme, _b = _a.opacity, opacity = _b === void 0 ? 1 : _b;
|
|
84
|
+
return contentOverflows && (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n &:after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100px;\n transition: 0.3s ease-in-out;\n background: linear-gradient(\n to top,\n ", " 0%,\n transparent 100%\n );\n }\n "], ["\n &:after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100px;\n transition: 0.3s ease-in-out;\n background: linear-gradient(\n to top,\n ", " 0%,\n transparent 100%\n );\n }\n "])), (0, polished_1.rgba)((0, colors_1.changeDarkness)((0, colors_1.getMainBackgroundColor)(theme), 0.03), opacity));
|
|
85
|
+
});
|
|
86
|
+
var ReqoreCollectionItem = function (_a) {
|
|
87
|
+
var _b = _a.flat, flat = _b === void 0 ? true : _b, _c = _a.minimal, minimal = _c === void 0 ? true : _c, style = _a.style, content = _a.content, actions = _a.actions, tags = _a.tags, expandable = _a.expandable, expandedContent = _a.expandedContent, expandedActions = _a.expandedActions, maxContentHeight = _a.maxContentHeight, rest = __rest(_a, ["flat", "minimal", "style", "content", "actions", "tags", "expandable", "expandedContent", "expandedActions", "maxContentHeight"]);
|
|
88
|
+
var _d = (0, react_1.useState)(false), isSelected = _d[0], setIsSelected = _d[1];
|
|
89
|
+
var getAndIncreaseZIndex = (0, react_1.useContext)(ReqoreContext_1["default"]).getAndIncreaseZIndex;
|
|
90
|
+
var ref = (0, react_1.useRef)(null);
|
|
91
|
+
var _e = (0, react_use_1.useMeasure)(), contentRef = _e[0], sizes = _e[1];
|
|
92
|
+
var originalDimensions = (0, react_1.useRef)(null);
|
|
93
|
+
var _f = (0, react_1.useState)(undefined), position = _f[0], setPosition = _f[1];
|
|
94
|
+
var theme = (0, useTheme_1.useReqoreTheme)('main', rest.customTheme, rest.intent);
|
|
95
|
+
var _g = (0, react_1.useState)({
|
|
96
|
+
minWidth: undefined,
|
|
97
|
+
minHeight: undefined,
|
|
98
|
+
maxWidth: undefined,
|
|
99
|
+
maxHeight: undefined,
|
|
100
|
+
width: undefined,
|
|
101
|
+
height: undefined,
|
|
102
|
+
left: undefined,
|
|
103
|
+
top: undefined,
|
|
104
|
+
transform: undefined
|
|
105
|
+
}), dimensions = _g[0], setDimensions = _g[1];
|
|
106
|
+
(0, react_1.useEffect)(function () {
|
|
107
|
+
if (isSelected) {
|
|
108
|
+
setPosition('fixed');
|
|
109
|
+
}
|
|
110
|
+
}, [isSelected]);
|
|
111
|
+
(0, react_use_1.useDebounce)(function () {
|
|
112
|
+
if (isSelected) {
|
|
113
|
+
setDimensions(__assign(__assign({}, dimensions), { width: undefined, height: undefined, left: '50%', minWidth: '500px', minHeight: '300px', maxWidth: '90vw', maxHeight: '90vh', top: '50%', transform: 'translateX(-50%) translateY(-50%)' }));
|
|
114
|
+
}
|
|
115
|
+
}, 100, [isSelected]);
|
|
116
|
+
(0, react_use_1.useDebounce)(function () {
|
|
117
|
+
if (!isSelected) {
|
|
118
|
+
setPosition(undefined);
|
|
119
|
+
setDimensions({
|
|
120
|
+
minHeight: undefined,
|
|
121
|
+
minWidth: undefined,
|
|
122
|
+
maxWidth: undefined,
|
|
123
|
+
maxHeight: undefined,
|
|
124
|
+
left: undefined,
|
|
125
|
+
top: undefined,
|
|
126
|
+
transform: 'translateX(0) translateY(0)'
|
|
127
|
+
});
|
|
128
|
+
}
|
|
129
|
+
}, 220, [isSelected]);
|
|
130
|
+
var renderContent = function () {
|
|
131
|
+
var handleItemClick = function (event) {
|
|
132
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
133
|
+
if (expandable) {
|
|
134
|
+
if (isSelected) {
|
|
135
|
+
setDimensions(originalDimensions.current);
|
|
136
|
+
}
|
|
137
|
+
else {
|
|
138
|
+
originalDimensions.current = {
|
|
139
|
+
left: (_a = ref.current.getBoundingClientRect()) === null || _a === void 0 ? void 0 : _a.left,
|
|
140
|
+
top: (_b = ref.current.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.top,
|
|
141
|
+
width: (_c = ref.current.getBoundingClientRect()) === null || _c === void 0 ? void 0 : _c.width,
|
|
142
|
+
height: (_d = ref.current.getBoundingClientRect()) === null || _d === void 0 ? void 0 : _d.height,
|
|
143
|
+
transform: 'translateX(0) translateY(0)'
|
|
144
|
+
};
|
|
145
|
+
setDimensions({
|
|
146
|
+
left: (_e = ref.current.getBoundingClientRect()) === null || _e === void 0 ? void 0 : _e.left,
|
|
147
|
+
top: (_f = ref.current.getBoundingClientRect()) === null || _f === void 0 ? void 0 : _f.top,
|
|
148
|
+
width: (_g = ref.current.getBoundingClientRect()) === null || _g === void 0 ? void 0 : _g.width,
|
|
149
|
+
height: (_h = ref.current.getBoundingClientRect()) === null || _h === void 0 ? void 0 : _h.height,
|
|
150
|
+
transform: 'translateX(0) translateY(0)'
|
|
151
|
+
});
|
|
152
|
+
}
|
|
153
|
+
setIsSelected(!isSelected);
|
|
154
|
+
}
|
|
155
|
+
(_j = rest === null || rest === void 0 ? void 0 : rest.onClick) === null || _j === void 0 ? void 0 : _j.call(rest, event);
|
|
156
|
+
};
|
|
157
|
+
var actualContent = expandedContent && isSelected ? expandedContent : content;
|
|
158
|
+
var actualActions = isSelected
|
|
159
|
+
? __spreadArray(__spreadArray([], (actions || []), true), [{ icon: 'CloseLine', onClick: handleItemClick }], false) : (0, lodash_1.size)(actions)
|
|
160
|
+
? [{ icon: 'More2Fill', actions: actions }]
|
|
161
|
+
: undefined;
|
|
162
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [position && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { style: __assign({}, originalDimensions.current) }), (0, jsx_runtime_1.jsx)(Drawer_1.StyledBackdrop, { zIndex: getAndIncreaseZIndex(), blur: 5, closable: true, onClick: handleItemClick })] })), (0, jsx_runtime_1.jsxs)(Panel_1.ReqorePanel, __assign({}, rest, { flat: flat, headerSize: 3, ref: ref, minimal: minimal, bottomActions: isSelected ? expandedActions : undefined, style: __assign(__assign(__assign(__assign({}, style), { position: position, zIndex: isSelected ? getAndIncreaseZIndex() : undefined }), dimensions), { transformOrigin: 'center' }), onClick: (expandable && !isSelected) || rest.onClick ? handleItemClick : undefined, actions: actualActions, className: "reqore-collection-item ".concat(rest.className || '') }, { children: [(0, jsx_runtime_1.jsx)(exports.StyledCollectionItemContent, __assign({ theme: theme, opacity: rest.opacity, providedHeight: isSelected ? undefined : maxContentHeight, contentOverflows: !isSelected && (sizes === null || sizes === void 0 ? void 0 : sizes.height) > maxContentHeight }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ ref: contentRef }, { children: actualContent })) })), (0, lodash_1.size)(tags) ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Spacer_1.ReqoreSpacer, { height: 10 }), (0, jsx_runtime_1.jsx)(group_1["default"], __assign({ size: isSelected ? 'normal' : 'small' }, { children: (0, lodash_1.map)(tags, function (tagProps, index) { return ((0, jsx_runtime_1.jsx)(Tag_1["default"], __assign({}, tagProps), index)); }) }))] })) : null] }))] }));
|
|
163
|
+
};
|
|
164
|
+
return isSelected ? renderContent() : renderContent();
|
|
165
|
+
};
|
|
166
|
+
exports.ReqoreCollectionItem = ReqoreCollectionItem;
|
|
167
|
+
var templateObject_1, templateObject_2;
|
|
168
|
+
//# sourceMappingURL=item.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"item.js","sourceRoot":"","sources":["../../../src/components/Collection/item.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Columns/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/E,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,WAAW,CAAC;IAC5C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,cAAe,SAAQ,mBAAmB;IACzD,KAAK,CAAC,EAAE,YAAY,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Columns/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/E,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,WAAW,CAAC;IAC5C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,cAAe,SAAQ,mBAAmB;IACzD,KAAK,CAAC,EAAE,YAAY,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,KAczB,CAAC;AAEF,eAAO,MAAM,aAAa,qCAAsC,mBAAmB,gBAMlF,CAAC"}
|
|
@@ -58,7 +58,7 @@ var classnames_1 = __importDefault(require("classnames"));
|
|
|
58
58
|
var styled_components_1 = __importStar(require("styled-components"));
|
|
59
59
|
exports.StyledColumns = styled_components_1["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: grid;\n ", "\n"], ["\n display: grid;\n ", "\n"])), function (_a) {
|
|
60
60
|
var _b = _a.minColumnWidth, minColumnWidth = _b === void 0 ? '300px' : _b, _c = _a.maxColumnWidth, maxColumnWidth = _c === void 0 ? '1fr' : _c, _d = _a.columns, columns = _d === void 0 ? 'auto-fit' : _d, columnsGap = _a.columnsGap, _e = _a.alignItems, alignItems = _e === void 0 ? 'normal' : _e;
|
|
61
|
-
return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n grid-template-columns: repeat(", ", minmax(", ", ", "));\n grid-gap: ", ";\n align-items: ", ";\n "], ["\n grid-template-columns: repeat(", ", minmax(", ", ", "));\n grid-gap: ", ";\n align-items: ", ";\n "])), columns, minColumnWidth, maxColumnWidth, columnsGap, alignItems);
|
|
61
|
+
return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n grid-template-columns: repeat(", ", minmax(", ", ", "));\n grid-auto-rows: max-content;\n grid-gap: ", ";\n align-items: ", ";\n "], ["\n grid-template-columns: repeat(", ", minmax(", ", ", "));\n grid-auto-rows: max-content;\n grid-gap: ", ";\n align-items: ", ";\n "])), columns, minColumnWidth, maxColumnWidth, columnsGap, alignItems);
|
|
62
62
|
});
|
|
63
63
|
var ReqoreColumns = function (_a) {
|
|
64
64
|
var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Columns/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,0DAAoC;AACpC,qEAAgD;AAiBnC,QAAA,aAAa,GAAG,8BAAM,CAAC,GAAG,iGAAgB,wBAEnD,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Columns/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,0DAAoC;AACpC,qEAAgD;AAiBnC,QAAA,aAAa,GAAG,8BAAM,CAAC,GAAG,iGAAgB,wBAEnD,EAWD,IACF,KAZG,UAAC,EAMc;QALf,sBAAwB,EAAxB,cAAc,mBAAG,OAAO,KAAA,EACxB,sBAAsB,EAAtB,cAAc,mBAAG,KAAK,KAAA,EACtB,eAAoB,EAApB,OAAO,mBAAG,UAAU,KAAA,EACpB,UAAU,gBAAA,EACV,kBAAqB,EAArB,UAAU,mBAAG,QAAQ,KAAA;IACD,WAAA,uBAAG,uNAAA,sCACS,EAAO,WAAY,EAAc,IAAK,EAAc,uDAExE,EAAU,sBACP,EAAU,OAC1B,KAJiC,OAAO,EAAY,cAAc,EAAK,cAAc,EAExE,UAAU,EACP,UAAU;AAJL,CAKrB,EACD;AAEK,IAAM,aAAa,GAAG,UAAC,EAAqD;IAAnD,IAAA,QAAQ,cAAA,EAAE,SAAS,eAAA,EAAK,IAAI,cAA9B,yBAAgC,CAAF;IAC1D,OAAO,CACL,uBAAC,qBAAa,eAAK,IAAI,IAAE,SAAS,EAAE,IAAA,uBAAU,EAAC,gBAAgB,EAAE,SAAS,CAAC,gBACxE,QAAQ,IACK,CACjB,CAAC;AACJ,CAAC,CAAC;AANW,QAAA,aAAa,iBAMxB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ControlGroup/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAoB,MAAM,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,MAAM,WAAW,wBAAyB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACpF,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,GAAG,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,wBAAyB,SAAQ,wBAAwB;IACxE,KAAK,EAAE,YAAY,CAAC;CACrB;AAED,eAAO,MAAM,wBAAwB,KAgCpC,CAAC;AAEF,QAAA,MAAM,kBAAkB,oEAQrB,wBAAwB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ControlGroup/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAoB,MAAM,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,MAAM,WAAW,wBAAyB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACpF,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,GAAG,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,wBAAyB,SAAQ,wBAAwB;IACxE,KAAK,EAAE,YAAY,CAAC;CACrB;AAED,eAAO,MAAM,wBAAwB,KAgCpC,CAAC;AAEF,QAAA,MAAM,kBAAkB,oEAQrB,wBAAwB,gBAqB1B,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|