@synerise/ds-sidebar-object 1.0.16 → 1.0.17
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/CHANGELOG.md +586 -1944
- package/README.md +23 -23
- package/dist/Elements/Content/Content.d.ts +1 -1
- package/dist/Elements/Content/Content.types.d.ts +3 -3
- package/dist/Elements/DropdownOverlay/DropdownOverlay.d.ts +1 -1
- package/dist/Elements/DropdownOverlay/DropdownOverlay.js +4 -4
- package/dist/Elements/DropdownOverlay/DropdownOverlay.types.d.ts +3 -3
- package/dist/Elements/Header/Header.d.ts +1 -1
- package/dist/Elements/Header/Header.js +5 -5
- package/dist/Elements/Header/Header.style.d.ts +1 -1
- package/dist/Elements/Header/Header.types.d.ts +2 -2
- package/dist/Elements/ObjectSummary/ObjectSummary.d.ts +1 -1
- package/dist/Elements/Overview/Overview.d.ts +1 -1
- package/dist/Elements/Overview/Overview.js +3 -3
- package/dist/Elements/Overview/Overview.types.d.ts +4 -4
- package/dist/SidebarObject.d.ts +1 -1
- package/dist/SidebarObject.js +3 -3
- package/dist/SidebarObject.types.d.ts +4 -4
- package/package.json +15 -15
package/README.md
CHANGED
|
@@ -28,26 +28,26 @@ import SidebarObject from '@synerise/ds-sidebar-object'
|
|
|
28
28
|
|
|
29
29
|
## API
|
|
30
30
|
|
|
31
|
-
| Property | Description | Type
|
|
32
|
-
| -------------------- | --------------------------------------------------- |
|
|
33
|
-
| avatar | Avatar element of the sidebar | React.ReactNode
|
|
34
|
-
| headerPreffix | Element rendered on the left side of the header | React.ReactNode
|
|
35
|
-
| headerTabs | Tabs component to switch between content | TabItem
|
|
36
|
-
| inputObject | Object to be displayed in the sidebar | object
|
|
37
|
-
| inlineEditInputProps | Props passed to the input of InlineEdit component | InlineEdit.InputProps
|
|
38
|
-
| onArrowUp | Callback executed when arrowUp icon is clicked | void
|
|
39
|
-
| onArrowDown | Callback executed when arrowDown icon is clicked | void
|
|
40
|
-
| onEdit | Callback executed when clicked on edit icon | (inputObject:object) => void
|
|
41
|
-
| onDuplicate | Callback executed when clicked on duplicate icon | (inputObject:object) => void
|
|
42
|
-
| onMove | Callback executed when clicked on move icon | (inputObject:object) => void
|
|
43
|
-
| onDelete | Callback executed when clicked on delete icon | (inputObject:object) => void
|
|
44
|
-
| onId | Callback executed after clicking on the object's ID | (inputObject:object) => void
|
|
45
|
-
| onScrollbar | Callback executed when scroll | boolean
|
|
46
|
-
| texts | Group of texts | HeaderTexts
|
|
47
|
-
| onCloseClick | Prop to close Drawer | void
|
|
48
|
-
| inputObjectId | Unique id of the object passed as string | string
|
|
49
|
-
| handleTabClick | Callback executed when you click on Tab | (index: number) => void
|
|
50
|
-
| footer | Callback executed to show footer | React.ReactNode
|
|
51
|
-
| additionalNode | Callback executed to show additional element | React.ReactNode
|
|
52
|
-
| headerType | Prop to choose editable title | ‘readonly’ , ‘editable’
|
|
53
|
-
| typeButtons | Prop to choose type of buttons | ‘twoButtons’ , ‘withNavigation
|
|
31
|
+
| Property | Description | Type | Default |
|
|
32
|
+
| -------------------- | --------------------------------------------------- | ------------------------------- | ------- |
|
|
33
|
+
| avatar | Avatar element of the sidebar | React.ReactNode | - |
|
|
34
|
+
| headerPreffix | Element rendered on the left side of the header | React.ReactNode | - |
|
|
35
|
+
| headerTabs | Tabs component to switch between content | TabItem | - |
|
|
36
|
+
| inputObject | Object to be displayed in the sidebar | object | - |
|
|
37
|
+
| inlineEditInputProps | Props passed to the input of InlineEdit component | InlineEdit.InputProps | - |
|
|
38
|
+
| onArrowUp | Callback executed when arrowUp icon is clicked | void | - |
|
|
39
|
+
| onArrowDown | Callback executed when arrowDown icon is clicked | void | - |
|
|
40
|
+
| onEdit | Callback executed when clicked on edit icon | (inputObject:object) => void | - |
|
|
41
|
+
| onDuplicate | Callback executed when clicked on duplicate icon | (inputObject:object) => void | - |
|
|
42
|
+
| onMove | Callback executed when clicked on move icon | (inputObject:object) => void | - |
|
|
43
|
+
| onDelete | Callback executed when clicked on delete icon | (inputObject:object) => void | - |
|
|
44
|
+
| onId | Callback executed after clicking on the object's ID | (inputObject:object) => void | - |
|
|
45
|
+
| onScrollbar | Callback executed when scroll | boolean | - |
|
|
46
|
+
| texts | Group of texts | HeaderTexts | - |
|
|
47
|
+
| onCloseClick | Prop to close Drawer | void | - |
|
|
48
|
+
| inputObjectId | Unique id of the object passed as string | string | - |
|
|
49
|
+
| handleTabClick | Callback executed when you click on Tab | (index: number) => void | - |
|
|
50
|
+
| footer | Callback executed to show footer | React.ReactNode | - |
|
|
51
|
+
| additionalNode | Callback executed to show additional element | React.ReactNode | - |
|
|
52
|
+
| headerType | Prop to choose editable title | ‘readonly’ , ‘editable’ | - |
|
|
53
|
+
| typeButtons | Prop to choose type of buttons | ‘twoButtons’ , ‘withNavigation’ | - |
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ContentProps } from './Content.types';
|
|
2
|
+
import { type ContentProps } from './Content.types';
|
|
3
3
|
declare const Content: ({ onFolderSelect, texts, mainContent, descriptionProps, tags, textDescription, onDescriptionChange, }: ContentProps) => React.JSX.Element;
|
|
4
4
|
export default Content;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { SubtleTextAreaProps } from '@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
2
|
+
import { type SubtleTextAreaProps } from '@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types';
|
|
3
|
+
import { type FolderItem } from '../../SidebarObject.types';
|
|
4
|
+
import { type OverviewTexts } from '../Overview/Overview.types';
|
|
5
5
|
export type ContentProps = {
|
|
6
6
|
descriptionProps?: SubtleTextAreaProps;
|
|
7
7
|
mainContent: React.ReactNode;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Props } from './DropdownOverlay.types';
|
|
2
|
+
import { type Props } from './DropdownOverlay.types';
|
|
3
3
|
declare const DropdownOverlay: ({ texts, onClearInput, data, onAddFolderClick, parentFolder, onDropdownOutsideClick, onSearchChange, searchValue, onFolderSelect, foldersIdKey, foldersFilterKey, foldersDisplayKey, }: Props) => React.JSX.Element;
|
|
4
4
|
export default DropdownOverlay;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React, { useMemo, useRef } from 'react';
|
|
2
|
+
import Button from '@synerise/ds-button';
|
|
3
|
+
import { theme } from '@synerise/ds-core';
|
|
2
4
|
import Dropdown from '@synerise/ds-dropdown';
|
|
3
|
-
import Menu from '@synerise/ds-menu';
|
|
4
5
|
import Icon, { Add3M, FolderM, SearchM } from '@synerise/ds-icon';
|
|
5
|
-
import
|
|
6
|
-
import { useOnClickOutside } from '@synerise/ds-utils';
|
|
6
|
+
import Menu from '@synerise/ds-menu';
|
|
7
7
|
import Result from '@synerise/ds-result';
|
|
8
|
-
import
|
|
8
|
+
import { useOnClickOutside } from '@synerise/ds-utils';
|
|
9
9
|
import { DropdownWrapper, MenuWrapper } from './DropdownOverlay.styles';
|
|
10
10
|
var DropdownOverlay = function DropdownOverlay(_ref) {
|
|
11
11
|
var texts = _ref.texts,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { FolderItem } from '../../SidebarObject.types';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import { type FolderItem } from '../../SidebarObject.types';
|
|
2
|
+
import { type HeaderTexts } from '../Header/Header.types';
|
|
3
|
+
import { type OverviewTexts } from '../Overview/Overview.types';
|
|
4
4
|
export interface Props {
|
|
5
5
|
data: FolderItem[];
|
|
6
6
|
onAddFolderClick?: (folderName: string) => void;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { HeaderProps } from './Header.types';
|
|
2
|
+
import { type HeaderProps } from './Header.types';
|
|
3
3
|
declare const Header: ({ avatar, preffix, tabs, onMove, onDuplicate, onDelete, onEdit, onId, texts, onCloseClick, inputObject, inputObjectIdKey, inlineEditInputProps, onArrowUp, onArrowDown, name, onRename, additionalNode, type, typeButtons, onCancelClick, onApplyClick, }: HeaderProps) => React.JSX.Element;
|
|
4
4
|
export default Header;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
2
|
-
import React, {
|
|
3
|
-
import Typography from '@synerise/ds-typography';
|
|
4
|
-
import Drawer from '@synerise/ds-drawer';
|
|
2
|
+
import React, { useMemo, useRef, useState } from 'react';
|
|
5
3
|
import Button from '@synerise/ds-button';
|
|
6
|
-
import
|
|
4
|
+
import Drawer from '@synerise/ds-drawer';
|
|
7
5
|
import Dropdown from '@synerise/ds-dropdown';
|
|
6
|
+
import Icon, { AngleDownM, AngleUpM, CloseM, CopyClipboardM, DuplicateM, EditM, FolderM, OptionHorizontalM, TrashM } from '@synerise/ds-icon';
|
|
8
7
|
import Menu from '@synerise/ds-menu';
|
|
8
|
+
import Typography from '@synerise/ds-typography';
|
|
9
9
|
import { useOnClickOutside } from '@synerise/ds-utils';
|
|
10
|
-
import { ButtonVariant, HeaderType } from './Header.types';
|
|
11
10
|
import * as S from './Header.style';
|
|
11
|
+
import { ButtonVariant, HeaderType } from './Header.types';
|
|
12
12
|
var Header = function Header(_ref) {
|
|
13
13
|
var avatar = _ref.avatar,
|
|
14
14
|
preffix = _ref.preffix,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { InlineEditProps } from '@synerise/ds-inline-edit/dist/InlineEdit.types';
|
|
2
|
+
import { type InlineEditProps } from '@synerise/ds-inline-edit/dist/InlineEdit.types';
|
|
3
3
|
export declare const HeaderWrapper: import("styled-components").StyledComponent<"div", any, {
|
|
4
4
|
dashed: boolean;
|
|
5
5
|
}, never>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { InputProps } from '@synerise/ds-inline-edit/dist/InlineEdit.types';
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import { type InputProps } from '@synerise/ds-inline-edit/dist/InlineEdit.types';
|
|
3
3
|
export type HeaderProps = {
|
|
4
4
|
avatar: ReactNode;
|
|
5
5
|
preffix: ReactNode;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ObjectSummaryProps } from './ObjectSummary.types';
|
|
2
|
+
import { type ObjectSummaryProps } from './ObjectSummary.types';
|
|
3
3
|
declare const ObjectSummary: ({ inputObject }: ObjectSummaryProps) => React.JSX.Element;
|
|
4
4
|
export default ObjectSummary;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { OverviewObjectProps } from './Overview.types';
|
|
2
|
+
import { type OverviewObjectProps } from './Overview.types';
|
|
3
3
|
declare const Overview: ({ inputObject, contentTags, folders, foldersDisplayKey, foldersFilterKey, foldersIdKey, parentFolder, texts, textDescription, onFolderSelect, onDescriptionChange, descriptionProps, onAddFolderClick, }: OverviewObjectProps) => React.JSX.Element;
|
|
4
4
|
export default Overview;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React, { useState } from 'react';
|
|
2
|
-
import Dropdown from '@synerise/ds-dropdown';
|
|
3
2
|
import Button from '@synerise/ds-button';
|
|
3
|
+
import Dropdown from '@synerise/ds-dropdown';
|
|
4
4
|
import Icon, { AngleDownS } from '@synerise/ds-icon';
|
|
5
|
-
import * as S from '../Header/Header.style';
|
|
6
|
-
import DropdownOverlay from '../DropdownOverlay/DropdownOverlay';
|
|
7
5
|
import Content from '../Content/Content';
|
|
6
|
+
import DropdownOverlay from '../DropdownOverlay/DropdownOverlay';
|
|
7
|
+
import * as S from '../Header/Header.style';
|
|
8
8
|
import ObjectSummary from '../ObjectSummary/ObjectSummary';
|
|
9
9
|
var Overview = function Overview(_ref) {
|
|
10
10
|
var inputObject = _ref.inputObject,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { SubtleTextAreaProps } from '@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import { type SubtleTextAreaProps } from '@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types';
|
|
3
|
+
import { type FolderItem } from '../../SidebarObject.types';
|
|
4
|
+
import { type HeaderTexts } from '../Header/Header.types';
|
|
5
5
|
export type OverviewObjectProps = {
|
|
6
6
|
inputObject: {
|
|
7
7
|
[key: string]: string | ReactNode;
|
package/dist/SidebarObject.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { SidebarObjectProps } from './SidebarObject.types';
|
|
2
|
+
import { type SidebarObjectProps } from './SidebarObject.types';
|
|
3
3
|
declare const SidebarObject: ({ avatar, headerPreffix, headerTabs, inputObject, inlineEditInputProps, onEdit, onDelete, onDuplicate, onMove, onId, texts, onCloseClick, onArrowUp, onArrowDown, withScrollbar, handleTabClick, footer, name, onRename, inputObjectIdKey, additionalNode, activeTab, headerType, typeButtons, onCancelClick, onApplyClick, }: SidebarObjectProps) => React.JSX.Element;
|
|
4
4
|
export default SidebarObject;
|
package/dist/SidebarObject.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import Tabs from '@synerise/ds-tabs';
|
|
3
2
|
import Scrollbar from '@synerise/ds-scrollbar';
|
|
3
|
+
import Tabs from '@synerise/ds-tabs';
|
|
4
4
|
import Header from './Elements/Header/Header';
|
|
5
|
-
import * as S from './SidebarObject.style';
|
|
6
5
|
import { HeaderType } from './Elements/Header/Header.types';
|
|
6
|
+
import * as S from './SidebarObject.style';
|
|
7
7
|
var SidebarObject = function SidebarObject(_ref) {
|
|
8
8
|
var _headerTabs$activeTab, _headerTabs$activeTab2;
|
|
9
9
|
var avatar = _ref.avatar,
|
|
@@ -67,7 +67,7 @@ var SidebarObject = function SidebarObject(_ref) {
|
|
|
67
67
|
}), /*#__PURE__*/React.createElement(Scrollbar, {
|
|
68
68
|
absolute: true,
|
|
69
69
|
maxHeight: "100vh"
|
|
70
|
-
// @ts-
|
|
70
|
+
// @ts-expect-error Property 'options' does not exist on type
|
|
71
71
|
,
|
|
72
72
|
options: {
|
|
73
73
|
suppressScrollY: !withScrollbar
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import { HeaderTexts, HeaderType
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import { type InputProps } from '@synerise/ds-inline-edit/dist/InlineEdit.types';
|
|
3
|
+
import { type TabItem } from '@synerise/ds-tabs';
|
|
4
|
+
import { type ButtonVariant, type HeaderTexts, type HeaderType } from './Elements/Header/Header.types';
|
|
5
5
|
export type SidebarObjectProps = {
|
|
6
6
|
avatar?: ReactNode;
|
|
7
7
|
headerPreffix?: ReactNode;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synerise/ds-sidebar-object",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.17",
|
|
4
4
|
"description": "SidebarObject UI Component for the Synerise Design System",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"repository": "Synerise/synerise-design",
|
|
@@ -34,19 +34,19 @@
|
|
|
34
34
|
],
|
|
35
35
|
"types": "dist/index.d.ts",
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@synerise/ds-button": "^1.4.
|
|
38
|
-
"@synerise/ds-description": "^1.1.
|
|
39
|
-
"@synerise/ds-drawer": "^1.0.
|
|
40
|
-
"@synerise/ds-dropdown": "^1.0.
|
|
41
|
-
"@synerise/ds-icon": "^1.5.
|
|
42
|
-
"@synerise/ds-inline-edit": "^1.0.
|
|
43
|
-
"@synerise/ds-menu": "^1.0.
|
|
44
|
-
"@synerise/ds-result": "^1.0.
|
|
45
|
-
"@synerise/ds-scrollbar": "^1.1.
|
|
46
|
-
"@synerise/ds-subtle-form": "^1.1.
|
|
47
|
-
"@synerise/ds-tabs": "^1.0.
|
|
48
|
-
"@synerise/ds-typography": "^1.0.
|
|
49
|
-
"@synerise/ds-utils": "^1.3.
|
|
37
|
+
"@synerise/ds-button": "^1.4.2",
|
|
38
|
+
"@synerise/ds-description": "^1.1.2",
|
|
39
|
+
"@synerise/ds-drawer": "^1.0.6",
|
|
40
|
+
"@synerise/ds-dropdown": "^1.0.15",
|
|
41
|
+
"@synerise/ds-icon": "^1.5.4",
|
|
42
|
+
"@synerise/ds-inline-edit": "^1.0.17",
|
|
43
|
+
"@synerise/ds-menu": "^1.0.14",
|
|
44
|
+
"@synerise/ds-result": "^1.0.14",
|
|
45
|
+
"@synerise/ds-scrollbar": "^1.1.2",
|
|
46
|
+
"@synerise/ds-subtle-form": "^1.1.11",
|
|
47
|
+
"@synerise/ds-tabs": "^1.0.16",
|
|
48
|
+
"@synerise/ds-typography": "^1.0.13",
|
|
49
|
+
"@synerise/ds-utils": "^1.3.1"
|
|
50
50
|
},
|
|
51
51
|
"peerDependencies": {
|
|
52
52
|
"@synerise/ds-core": "*",
|
|
@@ -54,5 +54,5 @@
|
|
|
54
54
|
"react": ">=16.9.0 <= 18.3.1",
|
|
55
55
|
"styled-components": "^5.3.3"
|
|
56
56
|
},
|
|
57
|
-
"gitHead": "
|
|
57
|
+
"gitHead": "4512641033ba3581a3df208143c547fcfed45895"
|
|
58
58
|
}
|