@elliemae/ds-toolbar 2.3.0-alpha.8 → 2.3.0-next.10
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/cjs/DSToolbarItemV2.js +50 -0
- package/cjs/DSToolbarSeparatorV2.js +18 -0
- package/cjs/DSToolbarV2.js +80 -0
- package/cjs/DSToolbarV2Context.js +13 -0
- package/cjs/deprecated/DSToolbar.js +99 -0
- package/cjs/deprecated/ToolbarDivider.js +9 -0
- package/cjs/deprecated/ToolbarGroup.js +37 -0
- package/cjs/deprecated/ToolbarItem.js +60 -0
- package/cjs/deprecated/decorateToolbarChildren.js +28 -0
- package/cjs/deprecated/index.js +17 -0
- package/cjs/index.js +24 -0
- package/cjs/props.js +14 -0
- package/cjs/styled.js +25 -0
- package/cjs/useToolbarItemHandlers.js +39 -0
- package/esm/DSToolbarItemV2.js +42 -0
- package/esm/DSToolbarSeparatorV2.js +10 -0
- package/esm/DSToolbarV2.js +69 -0
- package/esm/DSToolbarV2Context.js +9 -0
- package/esm/deprecated/DSToolbar.js +83 -0
- package/esm/deprecated/ToolbarDivider.js +7 -0
- package/esm/deprecated/ToolbarGroup.js +31 -0
- package/esm/deprecated/ToolbarItem.js +51 -0
- package/esm/deprecated/decorateToolbarChildren.js +21 -0
- package/esm/deprecated/index.js +4 -0
- package/esm/index.js +7 -0
- package/esm/props.js +10 -0
- package/esm/styled.js +14 -0
- package/esm/useToolbarItemHandlers.js +35 -0
- package/package.json +52 -54
- package/types/DSToolbarItemV2.d.ts +8 -0
- package/types/DSToolbarSeparatorV2.d.ts +2 -0
- package/types/DSToolbarV2.d.ts +10 -0
- package/types/DSToolbarV2Context.d.ts +8 -0
- package/types/deprecated/DSToolbar.d.ts +51 -0
- package/types/deprecated/ToolbarDivider.d.ts +3 -0
- package/types/deprecated/ToolbarGroup.d.ts +15 -0
- package/types/deprecated/ToolbarItem.d.ts +16 -0
- package/types/deprecated/decorateToolbarChildren.d.ts +2 -0
- package/types/deprecated/index.d.ts +2 -0
- package/types/index.d.ts +5 -0
- package/types/props.d.ts +18 -0
- package/types/styled.d.ts +4 -0
- package/types/tests/DSToolbar.test.d.ts +1 -0
- package/types/useToolbarItemHandlers.d.ts +3 -0
- package/dist/cjs/DSToolbarItemV2.js +0 -55
- package/dist/cjs/DSToolbarItemV2.js.map +0 -7
- package/dist/cjs/DSToolbarSeparatorV2.js +0 -39
- package/dist/cjs/DSToolbarSeparatorV2.js.map +0 -7
- package/dist/cjs/DSToolbarV2.js +0 -73
- package/dist/cjs/DSToolbarV2.js.map +0 -7
- package/dist/cjs/DSToolbarV2Context.js +0 -40
- package/dist/cjs/DSToolbarV2Context.js.map +0 -7
- package/dist/cjs/deprecated/DSToolbar.js +0 -96
- package/dist/cjs/deprecated/DSToolbar.js.map +0 -7
- package/dist/cjs/deprecated/ToolbarDivider.js +0 -39
- package/dist/cjs/deprecated/ToolbarDivider.js.map +0 -7
- package/dist/cjs/deprecated/ToolbarGroup.js +0 -51
- package/dist/cjs/deprecated/ToolbarGroup.js.map +0 -7
- package/dist/cjs/deprecated/ToolbarItem.js +0 -64
- package/dist/cjs/deprecated/ToolbarItem.js.map +0 -7
- package/dist/cjs/deprecated/decorateToolbarChildren.js +0 -40
- package/dist/cjs/deprecated/decorateToolbarChildren.js.map +0 -7
- package/dist/cjs/deprecated/index.js +0 -36
- package/dist/cjs/deprecated/index.js.map +0 -7
- package/dist/cjs/index.js +0 -39
- package/dist/cjs/index.js.map +0 -7
- package/dist/cjs/props.js +0 -41
- package/dist/cjs/props.js.map +0 -7
- package/dist/cjs/styled.js +0 -54
- package/dist/cjs/styled.js.map +0 -7
- package/dist/cjs/useToolbarItemHandlers.js +0 -59
- package/dist/cjs/useToolbarItemHandlers.js.map +0 -7
- package/dist/esm/DSToolbarItemV2.js +0 -26
- package/dist/esm/DSToolbarItemV2.js.map +0 -7
- package/dist/esm/DSToolbarSeparatorV2.js +0 -10
- package/dist/esm/DSToolbarSeparatorV2.js.map +0 -7
- package/dist/esm/DSToolbarV2.js +0 -44
- package/dist/esm/DSToolbarV2.js.map +0 -7
- package/dist/esm/DSToolbarV2Context.js +0 -11
- package/dist/esm/DSToolbarV2Context.js.map +0 -7
- package/dist/esm/deprecated/DSToolbar.js +0 -67
- package/dist/esm/deprecated/DSToolbar.js.map +0 -7
- package/dist/esm/deprecated/ToolbarDivider.js +0 -10
- package/dist/esm/deprecated/ToolbarDivider.js.map +0 -7
- package/dist/esm/deprecated/ToolbarGroup.js +0 -22
- package/dist/esm/deprecated/ToolbarGroup.js.map +0 -7
- package/dist/esm/deprecated/ToolbarItem.js +0 -35
- package/dist/esm/deprecated/ToolbarItem.js.map +0 -7
- package/dist/esm/deprecated/decorateToolbarChildren.js +0 -11
- package/dist/esm/deprecated/decorateToolbarChildren.js.map +0 -7
- package/dist/esm/deprecated/index.js +0 -7
- package/dist/esm/deprecated/index.js.map +0 -7
- package/dist/esm/index.js +0 -10
- package/dist/esm/index.js.map +0 -7
- package/dist/esm/props.js +0 -12
- package/dist/esm/props.js.map +0 -7
- package/dist/esm/styled.js +0 -25
- package/dist/esm/styled.js.map +0 -7
- package/dist/esm/useToolbarItemHandlers.js +0 -30
- package/dist/esm/useToolbarItemHandlers.js.map +0 -7
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/decorateToolbarChildren.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { cloneElement } from 'react';\n\nexport default (children, extraProps = {}) =>\n React.Children.map(\n children,\n component =>\n component\n ? cloneElement(component, {\n ...extraProps,\n ...component.props,\n className: `${component.props.className} toolbar-item`,\n })\n : component,\n null,\n );\n"],
|
|
5
|
-
"mappings": "AAAA;ACAA;AAEA,IAAO,kCAAQ,CAAC,UAAU,aAAa,OACrC,OAAM,SAAS,IACb,UACA,eACE,YACI,aAAa,WAAW;AAAA,KACnB;AAAA,KACA,UAAU;AAAA,EACb,WAAW,GAAG,UAAU,MAAM;AAAA,KAEhC,WACN;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/export */\nexport * from './DSToolbar';\n\nexport { default } from './DSToolbar';\n"],
|
|
5
|
-
"mappings": "AAAA;ACCA;AAEA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/esm/index.js
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
export * from "./deprecated";
|
|
3
|
-
import { default as default2 } from "./deprecated";
|
|
4
|
-
export * from "./DSToolbarV2";
|
|
5
|
-
export * from "./DSToolbarItemV2";
|
|
6
|
-
export * from "./DSToolbarSeparatorV2";
|
|
7
|
-
export {
|
|
8
|
-
default2 as default
|
|
9
|
-
};
|
|
10
|
-
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './deprecated';\nexport { default } from './deprecated';\nexport * from './DSToolbarV2';\nexport * from './DSToolbarItemV2';\nexport * from './DSToolbarSeparatorV2';\n"],
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/esm/props.js
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { PropTypes } from "react-desc";
|
|
3
|
-
const DSToolbarV2Schema = {
|
|
4
|
-
alignment: PropTypes.oneOf(["right", "left"]).description("Whether to align the content left or right").defaultValue("right"),
|
|
5
|
-
withDepth: PropTypes.bool.description("Whether to add a box-shadow to the container").defaultValue(true),
|
|
6
|
-
compact: PropTypes.bool.description("Whether you want the compact version of the toolbar").defaultValue(false),
|
|
7
|
-
innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description("Reference to attach to the wrapper")
|
|
8
|
-
};
|
|
9
|
-
export {
|
|
10
|
-
DSToolbarV2Schema
|
|
11
|
-
};
|
|
12
|
-
//# sourceMappingURL=props.js.map
|
package/dist/esm/props.js.map
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/props.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from 'react-desc';\n\nexport const DSToolbarV2Schema = {\n alignment: PropTypes.oneOf(['right', 'left'])\n .description('Whether to align the content left or right')\n .defaultValue('right'),\n withDepth: PropTypes.bool.description('Whether to add a box-shadow to the container').defaultValue(true),\n compact: PropTypes.bool.description('Whether you want the compact version of the toolbar').defaultValue(false),\n innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Reference to attach to the wrapper'),\n};\n"],
|
|
5
|
-
"mappings": "AAAA;ACAA;AAEO,MAAM,oBAAoB;AAAA,EAC/B,WAAW,UAAU,MAAM,CAAC,SAAS,SAClC,YAAY,8CACZ,aAAa;AAAA,EAChB,WAAW,UAAU,KAAK,YAAY,gDAAgD,aAAa;AAAA,EACnG,SAAS,UAAU,KAAK,YAAY,uDAAuD,aAAa;AAAA,EACxG,UAAU,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,SAAS,YAAY;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/esm/styled.js
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import styled from "styled-components";
|
|
3
|
-
import Grid from "@elliemae/ds-grid";
|
|
4
|
-
const StyledToolbarWrapper = styled(Grid)`
|
|
5
|
-
background-color: ${(props) => props.theme.colors.neutral["000"]};
|
|
6
|
-
|
|
7
|
-
min-height: ${(props) => props.compact ? "28px" : "40px"};
|
|
8
|
-
max-height: ${(props) => props.theme.space.xxl};
|
|
9
|
-
|
|
10
|
-
padding: 0 ${(props) => props.theme.space.xxs};
|
|
11
|
-
|
|
12
|
-
box-shadow: ${(props) => !props.withDepth ? "none" : "0 1px 5px 0 rgb(0 0 0 / 13%), 0 2px 4px 0 rgb(0 0 0 / 20%)"};
|
|
13
|
-
`;
|
|
14
|
-
const StyledToolbarItem = styled(Grid)``;
|
|
15
|
-
const StyledSeparator = styled(Grid)`
|
|
16
|
-
height: 30px;
|
|
17
|
-
width: 1px;
|
|
18
|
-
background-color: ${(props) => props.theme.colors.neutral[200]};
|
|
19
|
-
`;
|
|
20
|
-
export {
|
|
21
|
-
StyledSeparator,
|
|
22
|
-
StyledToolbarItem,
|
|
23
|
-
StyledToolbarWrapper
|
|
24
|
-
};
|
|
25
|
-
//# sourceMappingURL=styled.js.map
|
package/dist/esm/styled.js.map
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled from 'styled-components';\nimport Grid from '@elliemae/ds-grid';\n\nexport const StyledToolbarWrapper = styled(Grid)`\n background-color: ${(props) => props.theme.colors.neutral['000']};\n\n min-height: ${(props) => (props.compact ? '28px' : '40px')};\n max-height: ${(props) => props.theme.space.xxl};\n\n padding: 0 ${(props) => props.theme.space.xxs};\n\n box-shadow: ${(props) => (!props.withDepth ? 'none' : '0 1px 5px 0 rgb(0 0 0 / 13%), 0 2px 4px 0 rgb(0 0 0 / 20%)')};\n`;\n\nexport const StyledToolbarItem = styled(Grid)``;\n\nexport const StyledSeparator = styled(Grid)`\n height: 30px;\n width: 1px;\n background-color: ${(props) => props.theme.colors.neutral[200]};\n`;\n"],
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AAEO,MAAM,uBAAuB,OAAO;AAAA,sBACrB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,gBAE5C,CAAC,UAAW,MAAM,UAAU,SAAS;AAAA,gBACrC,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,eAE9B,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,gBAE5B,CAAC,UAAW,CAAC,MAAM,YAAY,SAAS;AAAA;AAGjD,MAAM,oBAAoB,OAAO;AAEjC,MAAM,kBAAkB,OAAO;AAAA;AAAA;AAAA,sBAGhB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { useCallback, useContext } from "react";
|
|
3
|
-
import { DSToolbarV2Context } from "./DSToolbarV2Context";
|
|
4
|
-
const useToolbarItemHandlers = (toolbarItemId) => {
|
|
5
|
-
const { toolbarUid, itemReferences } = useContext(DSToolbarV2Context);
|
|
6
|
-
const onKeyDown = useCallback((e) => {
|
|
7
|
-
const toolbarItems = [...document.querySelectorAll(`#${toolbarUid} .ds-toolbar-item`)];
|
|
8
|
-
let nextToolbarItemIndex = -1;
|
|
9
|
-
if (["ArrowLeft", "ArrowRight"].includes(e.code)) {
|
|
10
|
-
const toolbarItemIndex = toolbarItems.findIndex((domElem) => domElem.id === toolbarItemId);
|
|
11
|
-
nextToolbarItemIndex = toolbarItemIndex + (e.code === "ArrowLeft" ? -1 : 1);
|
|
12
|
-
} else if (e.code === "Home") {
|
|
13
|
-
nextToolbarItemIndex = 0;
|
|
14
|
-
} else if (e.code === "End") {
|
|
15
|
-
nextToolbarItemIndex = toolbarItems.length - 1;
|
|
16
|
-
}
|
|
17
|
-
if (nextToolbarItemIndex >= 0 && nextToolbarItemIndex < toolbarItems.length) {
|
|
18
|
-
e.preventDefault();
|
|
19
|
-
e.stopPropagation();
|
|
20
|
-
const ref = itemReferences[toolbarItems[nextToolbarItemIndex].id];
|
|
21
|
-
if (ref.current)
|
|
22
|
-
ref.current.focus();
|
|
23
|
-
}
|
|
24
|
-
}, [toolbarUid, toolbarItemId, itemReferences]);
|
|
25
|
-
return { onKeyDown };
|
|
26
|
-
};
|
|
27
|
-
export {
|
|
28
|
-
useToolbarItemHandlers
|
|
29
|
-
};
|
|
30
|
-
//# sourceMappingURL=useToolbarItemHandlers.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/useToolbarItemHandlers.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback, useContext } from 'react';\nimport { DSToolbarV2Context } from './DSToolbarV2Context';\n\nexport const useToolbarItemHandlers = (\n toolbarItemId: string,\n): {\n onKeyDown: React.KeyboardEventHandler;\n} => {\n const { toolbarUid, itemReferences } = useContext(DSToolbarV2Context);\n\n const onKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n const toolbarItems = [...document.querySelectorAll(`#${toolbarUid} .ds-toolbar-item`)];\n let nextToolbarItemIndex = -1;\n\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n const toolbarItemIndex = toolbarItems.findIndex((domElem) => domElem.id === toolbarItemId);\n nextToolbarItemIndex = toolbarItemIndex + (e.code === 'ArrowLeft' ? -1 : 1);\n } else if (e.code === 'Home') {\n nextToolbarItemIndex = 0;\n } else if (e.code === 'End') {\n nextToolbarItemIndex = toolbarItems.length - 1;\n }\n\n if (nextToolbarItemIndex >= 0 && nextToolbarItemIndex < toolbarItems.length) {\n e.preventDefault();\n e.stopPropagation();\n const ref = itemReferences[toolbarItems[nextToolbarItemIndex].id];\n if (ref.current) ref.current.focus();\n }\n },\n [toolbarUid, toolbarItemId, itemReferences],\n );\n\n return { onKeyDown };\n};\n"],
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AAEO,MAAM,yBAAyB,CACpC,kBAGG;AACH,QAAM,EAAE,YAAY,mBAAmB,WAAW;AAElD,QAAM,YAAwC,YAC5C,CAAC,MAAM;AACL,UAAM,eAAe,CAAC,GAAG,SAAS,iBAAiB,IAAI;AACvD,QAAI,uBAAuB;AAE3B,QAAI,CAAC,aAAa,cAAc,SAAS,EAAE,OAAO;AAChD,YAAM,mBAAmB,aAAa,UAAU,CAAC,YAAY,QAAQ,OAAO;AAC5E,6BAAuB,mBAAoB,GAAE,SAAS,cAAc,KAAK;AAAA,eAChE,EAAE,SAAS,QAAQ;AAC5B,6BAAuB;AAAA,eACd,EAAE,SAAS,OAAO;AAC3B,6BAAuB,aAAa,SAAS;AAAA;AAG/C,QAAI,wBAAwB,KAAK,uBAAuB,aAAa,QAAQ;AAC3E,QAAE;AACF,QAAE;AACF,YAAM,MAAM,eAAe,aAAa,sBAAsB;AAC9D,UAAI,IAAI;AAAS,YAAI,QAAQ;AAAA;AAAA,KAGjC,CAAC,YAAY,eAAe;AAG9B,SAAO,EAAE;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|