@webiny/lexical-editor-actions 0.0.0-unstable.06b2ede40f
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/LICENSE +21 -0
- package/LexicalEditorActions.d.ts +2 -0
- package/LexicalEditorActions.js +18 -0
- package/LexicalEditorActions.js.map +1 -0
- package/README.md +15 -0
- package/components/LexicalColorPicker/LexicalColorPicker.d.ts +9 -0
- package/components/LexicalColorPicker/LexicalColorPicker.js +222 -0
- package/components/LexicalColorPicker/LexicalColorPicker.js.map +1 -0
- package/components/LexicalColorPicker/round-color_lens-24px.svg +19 -0
- package/components/LexicalColorPicker/unselected.svg +10 -0
- package/components/LexicalColorPickerDropdown.d.ts +2 -0
- package/components/LexicalColorPickerDropdown.js +26 -0
- package/components/LexicalColorPickerDropdown.js.map +1 -0
- package/components/TextAlignmentDropdown.d.ts +2 -0
- package/components/TextAlignmentDropdown.js +78 -0
- package/components/TextAlignmentDropdown.js.map +1 -0
- package/index.d.ts +1 -0
- package/index.js +3 -0
- package/index.js.map +1 -0
- package/package.json +27 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) Webiny
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { TextAlignmentAction } from "@webiny/lexical-editor";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { LexicalColorPickerDropdown } from "./components/LexicalColorPickerDropdown";
|
|
4
|
+
import { FontColorAction } from "@webiny/lexical-editor";
|
|
5
|
+
import { TextAlignmentDropdown } from "./components/TextAlignmentDropdown";
|
|
6
|
+
|
|
7
|
+
/*
|
|
8
|
+
* Lexical editor configuration and components with global composition scope
|
|
9
|
+
*/
|
|
10
|
+
export const LexicalEditorActions = () => {
|
|
11
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FontColorAction.ColorPicker, {
|
|
12
|
+
element: /*#__PURE__*/React.createElement(LexicalColorPickerDropdown, null)
|
|
13
|
+
}), /*#__PURE__*/React.createElement(TextAlignmentAction.TextAlignmentDropDown, {
|
|
14
|
+
element: /*#__PURE__*/React.createElement(TextAlignmentDropdown, null)
|
|
15
|
+
}));
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
//# sourceMappingURL=LexicalEditorActions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["TextAlignmentAction","React","LexicalColorPickerDropdown","FontColorAction","TextAlignmentDropdown","LexicalEditorActions","createElement","Fragment","ColorPicker","element","TextAlignmentDropDown"],"sources":["LexicalEditorActions.tsx"],"sourcesContent":["import { TextAlignmentAction } from \"@webiny/lexical-editor\";\nimport React from \"react\";\nimport { LexicalColorPickerDropdown } from \"~/components/LexicalColorPickerDropdown\";\nimport { FontColorAction } from \"@webiny/lexical-editor\";\nimport { TextAlignmentDropdown } from \"~/components/TextAlignmentDropdown\";\n\n/*\n * Lexical editor configuration and components with global composition scope\n */\nexport const LexicalEditorActions = () => {\n return (\n <>\n <FontColorAction.ColorPicker element={<LexicalColorPickerDropdown />} />\n <TextAlignmentAction.TextAlignmentDropDown element={<TextAlignmentDropdown />} />\n </>\n );\n};\n"],"mappings":"AAAA,SAASA,mBAAmB,QAAQ,wBAAwB;AAC5D,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,0BAA0B;AACnC,SAASC,eAAe,QAAQ,wBAAwB;AACxD,SAASC,qBAAqB;;AAE9B;AACA;AACA;AACA,OAAO,MAAMC,oBAAoB,GAAGA,CAAA,KAAM;EACtC,oBACIJ,KAAA,CAAAK,aAAA,CAAAL,KAAA,CAAAM,QAAA,qBACIN,KAAA,CAAAK,aAAA,CAACH,eAAe,CAACK,WAAW;IAACC,OAAO,eAAER,KAAA,CAAAK,aAAA,CAACJ,0BAA0B,MAAE;EAAE,CAAE,CAAC,eACxED,KAAA,CAAAK,aAAA,CAACN,mBAAmB,CAACU,qBAAqB;IAACD,OAAO,eAAER,KAAA,CAAAK,aAAA,CAACF,qBAAqB,MAAE;EAAE,CAAE,CAClF,CAAC;AAEX,CAAC","ignoreList":[]}
|
package/README.md
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
# @webiny/lexical-editor-actions
|
|
2
|
+
[](https://www.npmjs.com/package/@webiny/lexical-editor)
|
|
3
|
+
[](https://www.npmjs.com/package/@webiny/lexical-editor)
|
|
4
|
+
[](https://github.com/prettier/prettier)
|
|
5
|
+
[](http://makeapullrequest.com)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## About
|
|
9
|
+
|
|
10
|
+
This package provides actions plugins for Lexical editor.
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
## Where is it used?
|
|
14
|
+
|
|
15
|
+
Currently, this packaged is used in [@webiny/app-serverless-cms](../app-serverless-cms).
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
interface LexicalColorPickerProps {
|
|
3
|
+
value: string;
|
|
4
|
+
onChange?: (color: string) => void;
|
|
5
|
+
onChangeComplete: (color: string, name?: string) => void;
|
|
6
|
+
handlerClassName?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare const LexicalColorPicker: ({ value, onChange, onChangeComplete }: LexicalColorPickerProps) => React.JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,222 @@
|
|
|
1
|
+
import _styled from "@emotion/styled/base";
|
|
2
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { 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)."; }
|
|
3
|
+
import React, { useCallback, useState, useEffect, useMemo } from "react";
|
|
4
|
+
import { css } from "emotion";
|
|
5
|
+
import { ChromePicker } from "react-color";
|
|
6
|
+
import { Tooltip } from "@webiny/ui/Tooltip";
|
|
7
|
+
|
|
8
|
+
// Icons
|
|
9
|
+
import { ReactComponent as IconPalette } from "./round-color_lens-24px.svg";
|
|
10
|
+
import { useRichTextEditor } from "@webiny/lexical-editor";
|
|
11
|
+
const ColorPickerStyle = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
|
|
12
|
+
target: "ewrv11k2"
|
|
13
|
+
} : {
|
|
14
|
+
target: "ewrv11k2",
|
|
15
|
+
label: "ColorPickerStyle"
|
|
16
|
+
})(process.env.NODE_ENV === "production" ? {
|
|
17
|
+
name: "1tb6adp",
|
|
18
|
+
styles: "position:relative;display:flex;flex-wrap:wrap;justify-content:flex-start;width:240px;padding:15px;background-color:#fff"
|
|
19
|
+
} : {
|
|
20
|
+
name: "1tb6adp",
|
|
21
|
+
styles: "position:relative;display:flex;flex-wrap:wrap;justify-content:flex-start;width:240px;padding:15px;background-color:#fff",
|
|
22
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxleGljYWxDb2xvclBpY2tlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBYXlCIiwiZmlsZSI6IkxleGljYWxDb2xvclBpY2tlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFN5bnRoZXRpY0V2ZW50IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgUmVhY3QsIHsgdXNlQ2FsbGJhY2ssIHVzZVN0YXRlLCB1c2VFZmZlY3QsIHVzZU1lbW8gfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcImVtb3Rpb25cIjtcbmltcG9ydCB0eXBlIHsgQ29sb3JTdGF0ZSwgUkdCQ29sb3IgfSBmcm9tIFwicmVhY3QtY29sb3JcIjtcbmltcG9ydCB7IENocm9tZVBpY2tlciB9IGZyb20gXCJyZWFjdC1jb2xvclwiO1xuaW1wb3J0IHR5cGUgeyBPbkNoYW5nZUhhbmRsZXIgfSBmcm9tIFwicmVhY3QtY29sb3IvbGliL2NvbXBvbmVudHMvY29tbW9uL0NvbG9yV3JhcFwiO1xuaW1wb3J0IHsgVG9vbHRpcCB9IGZyb20gXCJAd2ViaW55L3VpL1Rvb2x0aXBcIjtcblxuLy8gSWNvbnNcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEljb25QYWxldHRlIH0gZnJvbSBcIi4vcm91bmQtY29sb3JfbGVucy0yNHB4LnN2Z1wiO1xuaW1wb3J0IHsgdXNlUmljaFRleHRFZGl0b3IgfSBmcm9tIFwiQHdlYmlueS9sZXhpY2FsLWVkaXRvclwiO1xuXG5jb25zdCBDb2xvclBpY2tlclN0eWxlID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhXcmFwOiBcIndyYXBcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJmbGV4LXN0YXJ0XCIsXG4gICAgd2lkdGg6IDI0MCxcbiAgICBwYWRkaW5nOiAxNSxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IFwiI2ZmZlwiXG59KTtcblxuY29uc3QgQ29sb3JCb3ggPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgd2lkdGg6IDQwLFxuICAgIGhlaWdodDogNDAsXG4gICAgYm9yZGVyUmFkaXVzOiBcIjUwJVwiLFxuICAgIG1hcmdpbjogNSxcbiAgICBib3JkZXI6IFwiMXB4IHNvbGlkIHZhcigtLW1kYy10aGVtZS1vbi1iYWNrZ3JvdW5kKVwiLFxuICAgIHBhZGRpbmc6IDMsXG4gICAgYm94U2l6aW5nOiBcImNvbnRlbnQtYm94XCJcbn0pO1xuXG5jb25zdCBDb2xvciA9IHN0eWxlZChcImJ1dHRvblwiKSh7XG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICB3aWR0aDogNDAsXG4gICAgaGVpZ2h0OiA0MCxcbiAgICB0cmFuc2l0aW9uOiBcInRyYW5zZm9ybSAwLjFzLCBib3JkZXIgMC4yc1wiLFxuICAgIGJvcmRlckNvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBib3JkZXJSYWRpdXM6IFwiNTAlXCIsXG4gICAgXCImOjphZnRlclwiOiB7XG4gICAgICAgIHRyYW5zaXRpb246IFwib3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjE2NSwgMC44NCwgMC40NCwgMSlcIixcbiAgICAgICAgY29udGVudDogJ1wiXCInLFxuICAgICAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgICAgICB0b3A6IDAsXG4gICAgICAgIGxlZnQ6IDAsXG4gICAgICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICAgICAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgICAgICAgekluZGV4OiAtMSxcbiAgICAgICAgb3BhY2l0eTogMFxuICAgIH0sXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgICAgdHJhbnNmb3JtOiBcInNjYWxlKDEuMSlcIixcbiAgICAgICAgYm94U2hhZG93OiBcIjAgMC4yNXJlbSAwLjEyNXJlbSAwIHJnYmEoMCwwLDAsMC4wNSlcIixcbiAgICAgICAgXCImOjphZnRlclwiOiB7XG4gICAgICAgICAgICBvcGFjaXR5OiAxXG4gICAgICAgIH1cbiAgICB9XG59KTtcblxuY29uc3QgaWNvblBhbGV0dGVTdHlsZSA9IGNzcyh7XG4gICAgaGVpZ2h0OiAyMCxcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgbWFyZ2luVG9wOiAxLFxuICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1zZWNvbmRhcnkpXCJcbn0pO1xuXG5jb25zdCBDT0xPUlMgPSB7XG4gICAgbGlnaHRHcmF5OiBcImhzbGEoMCwgMCUsIDk3JSwgMSlcIixcbiAgICBncmF5OiBcImhzbGEoMzAwLCAyJSwgOTIlLCAxKVwiLFxuICAgIGRhcmtHcmF5OiBcImhzbGEoMCwgMCUsIDcwJSwgMSlcIixcbiAgICBkYXJrZXN0R3JheTogXCJoc2xhKDAsIDAlLCAyMCUsIDEpXCIsXG4gICAgYmxhY2s6IFwiaHNsYSgyMDgsIDEwMCUsIDUlLCAxKVwiXG59O1xuXG5jb25zdCBzdHlsZXMgPSB7XG4gICAgc2VsZWN0ZWRDb2xvcjogY3NzKHtcbiAgICAgICAgYm94U2hhZG93OiBcImluc2V0IDBweCAwcHggMHB4IDEwcHggdmFyKC0tbWRjLXRoZW1lLXNlY29uZGFyeSlcIixcbiAgICAgICAgYnV0dG9uOiB7XG4gICAgICAgICAgICBib3JkZXI6IFwiNXB4IHNvbGlkIHZhcigtLW1kYy10aGVtZS1zdXJmYWNlKVwiXG4gICAgICAgIH1cbiAgICB9KSxcbiAgICBidXR0b246IGNzcyh7XG4gICAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgICAgIGhlaWdodDogMzAsXG4gICAgICAgIGJveFNpemluZzogXCJib3JkZXItYm94XCIsXG4gICAgICAgIFwiJjpob3Zlcjpub3QoOmRpc2FibGVkKVwiOiB7IGJhY2tncm91bmRDb2xvcjogQ09MT1JTLmdyYXkgfSxcbiAgICAgICAgXCImOmZvY3VzOm5vdCg6ZGlzYWJsZWQpXCI6IHtcbiAgICAgICAgICAgIG91dGxpbmU6IFwibm9uZVwiXG4gICAgICAgIH0sXG4gICAgICAgIFwiJjpkaXNhYmxlZFwiOiB7XG4gICAgICAgICAgICBvcGFjaXR5OiAwLjUsXG4gICAgICAgICAgICBjdXJzb3I6IFwibm90LWFsbG93ZWRcIlxuICAgICAgICB9LFxuICAgICAgICBcIiYgc3ZnXCI6IHtcbiAgICAgICAgICAgIHdpZHRoOiAxNixcbiAgICAgICAgICAgIGhlaWdodDogMTZcbiAgICAgICAgfVxuICAgIH0pLFxuICAgIGNvbG9yOiBjc3Moe1xuICAgICAgICB3aWR0aDogXCI0MHB4XCIsXG4gICAgICAgIGhlaWdodDogXCIxMDAlXCJcbiAgICB9KVxufTtcblxuY29uc3QgY2hyb21lUGlja2VyU3R5bGUgPSBjc3Moe1xuICAgIHdpZHRoOiBcIjI3MHB4ICFpbXBvcnRhbnRcIixcbiAgICBtYXJnaW46IFwiMTVweCAtMTVweCAtMTVweCAtMTVweFwiXG59KTtcblxuaW50ZXJmYWNlIExleGljYWxDb2xvclBpY2tlclByb3BzIHtcbiAgICB2YWx1ZTogc3RyaW5nO1xuICAgIG9uQ2hhbmdlPzogKGNvbG9yOiBzdHJpbmcpID0+IHZvaWQ7XG4gICAgb25DaGFuZ2VDb21wbGV0ZTogKGNvbG9yOiBzdHJpbmcsIG5hbWU/OiBzdHJpbmcpID0+IHZvaWQ7XG4gICAgaGFuZGxlckNsYXNzTmFtZT86IHN0cmluZztcbn1cblxuY29uc3Qgc2hvd1BpY2tlclN0eWxlID0geyBkaXNwbGF5OiBcImJsb2NrXCIgfTtcbmNvbnN0IGhpZGVQaWNrZXJTdHlsZSA9IHsgZGlzcGxheTogXCJub25lXCIgfTtcblxuZXhwb3J0IGNvbnN0IExleGljYWxDb2xvclBpY2tlciA9ICh7XG4gICAgdmFsdWUsXG4gICAgb25DaGFuZ2UsXG4gICAgb25DaGFuZ2VDb21wbGV0ZVxufTogTGV4aWNhbENvbG9yUGlja2VyUHJvcHMpID0+IHtcbiAgICBjb25zdCBbc2hvd1BpY2tlciwgc2V0U2hvd1BpY2tlcl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gICAgLy8gRWl0aGVyIGEgY3VzdG9tIGNvbG9yIG9yIGEgY29sb3IgY29taW5nIGZyb20gdGhlIHRoZW1lIG9iamVjdC5cbiAgICBjb25zdCBbYWN0dWFsU2VsZWN0ZWRDb2xvciwgc2V0QWN0dWFsU2VsZWN0ZWRDb2xvcl0gPSB1c2VTdGF0ZSh2YWx1ZSB8fCBcIiNmZmZcIik7XG4gICAgY29uc3QgW2lzVGhlbWVDb2xvciwgc2V0SXNUaGVtZUNvbG9yXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgICAgIGlmICh2YWx1ZSkge1xuICAgICAgICAgICAgc2V0QWN0dWFsU2VsZWN0ZWRDb2xvcih2YWx1ZSk7XG4gICAgICAgIH1cbiAgICB9LCBbdmFsdWVdKTtcblxuICAgIGNvbnN0IGdldENvbG9yVmFsdWUgPSB1c2VDYWxsYmFjaygocmdiOiBSR0JDb2xvciwgYWxwaGE/OiBudW1iZXIpID0+IHtcbiAgICAgICAgcmV0dXJuIGByZ2JhKCR7cmdiLnJ9LCAke3JnYi5nfSwgJHtyZ2IuYn0sICR7YWxwaGEgPz8gcmdiLmF9KWA7XG4gICAgfSwgW10pO1xuXG4gICAgY29uc3Qgb25Db2xvckNoYW5nZSA9IHVzZUNhbGxiYWNrKFxuICAgICAgICAoY29sb3I6IENvbG9yU3RhdGUsIGV2ZW50OiBSZWFjdC5TeW50aGV0aWNFdmVudCkgPT4ge1xuICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICAgIC8vIGNvbnRyb2xzIG9mIHRoZSBwaWNrZXIgYXJlIHVwZGF0ZWQgYXMgdXNlciBtb3ZlcyB0aGUgbW91c2VcbiAgICAgICAgICAgIGNvbnN0IGN1c3RvbUNvbG9yID0gZ2V0Q29sb3JWYWx1ZShjb2xvci5yZ2IsIGNvbG9yLnJnYi5hID09PSAwID8gMSA6IGNvbG9yLnJnYi5hKTtcbiAgICAgICAgICAgIHNldEFjdHVhbFNlbGVjdGVkQ29sb3IoY3VzdG9tQ29sb3IpO1xuICAgICAgICAgICAgaWYgKHR5cGVvZiBvbkNoYW5nZSA9PT0gXCJmdW5jdGlvblwiKSB7XG4gICAgICAgICAgICAgICAgb25DaGFuZ2UoY3VzdG9tQ29sb3IpO1xuICAgICAgICAgICAgfVxuICAgICAgICB9LFxuICAgICAgICBbb25DaGFuZ2VdXG4gICAgKTtcblxuICAgIGNvbnN0IG9uQ29sb3JDaGFuZ2VDb21wbGV0ZSA9IHVzZUNhbGxiYWNrKFxuICAgICAgICAoeyByZ2IgfTogQ29sb3JTdGF0ZSwgZXZlbnQ6IFJlYWN0LlN5bnRoZXRpY0V2ZW50KSA9PiB7XG4gICAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgICAgY29uc3QgY29sb3IgPSBnZXRDb2xvclZhbHVlKHJnYiwgcmdiLmEgPT09IDAgPyAxIDogcmdiLmEpO1xuICAgICAgICAgICAgc2V0QWN0dWFsU2VsZWN0ZWRDb2xvcihjb2xvcik7XG4gICAgICAgICAgICBvbkNoYW5nZUNvbXBsZXRlKGNvbG9yKTtcbiAgICAgICAgfSxcbiAgICAgICAgW29uQ2hhbmdlQ29tcGxldGVdXG4gICAgKTtcblxuICAgIGNvbnN0IHRvZ2dsZVBpY2tlciA9IHVzZUNhbGxiYWNrKChlOiBTeW50aGV0aWNFdmVudCkgPT4ge1xuICAgICAgICBlLnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgICBzZXRTaG93UGlja2VyKHN0YXRlID0+ICFzdGF0ZSk7XG4gICAgfSwgW10pO1xuXG4gICAgY29uc3QgeyB0aGVtZSB9ID0gdXNlUmljaFRleHRFZGl0b3IoKTtcblxuICAgIGNvbnN0IHRoZW1lQ29sb3JzOiBSZWNvcmQ8c3RyaW5nLCBhbnk+ID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIGNvbnN0IGNvbG9ycyA9IHRoZW1lPy5zdHlsZXM/LmNvbG9ycyA/PyB7fTtcblxuICAgICAgICByZXR1cm4gT2JqZWN0LmtleXMoY29sb3JzKS5yZWR1Y2UoKGFjYywga2V5KSA9PiB7XG4gICAgICAgICAgICByZXR1cm4geyAuLi5hY2MsIFtrZXldOiBjb2xvcnNba2V5XSB9O1xuICAgICAgICB9LCB7fSk7XG4gICAgfSwgW3RoZW1lPy5zdHlsZXM/LmNvbG9yc10pO1xuXG4gICAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAgICAgY29uc3QgaXNUaGVtZUNvbG9yID0gT2JqZWN0LmtleXModGhlbWVDb2xvcnMpLnNvbWUoa2V5ID0+IHRoZW1lQ29sb3JzW2tleV0gPT09IHZhbHVlKTtcbiAgICAgICAgc2V0SXNUaGVtZUNvbG9yKGlzVGhlbWVDb2xvcik7XG4gICAgfSwgW3RoZW1lQ29sb3JzLCB2YWx1ZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPENvbG9yUGlja2VyU3R5bGU+XG4gICAgICAgICAgICB7T2JqZWN0LmtleXModGhlbWVDb2xvcnMpLm1hcCgoa2V5LCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgICAgIGNvbnN0IGNvbG9yID0gdGhlbWVDb2xvcnNba2V5XTtcblxuICAgICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgICAgIDxDb2xvckJveCBrZXk9e2luZGV4fSBjbGFzc05hbWU9e2NvbG9yID09PSB2YWx1ZSA/IHN0eWxlcy5zZWxlY3RlZENvbG9yIDogXCJcIn0+XG4gICAgICAgICAgICAgICAgICAgICAgICA8VG9vbHRpcCBjb250ZW50PXs8c3Bhbj57Y29sb3J9PC9zcGFuPn0gcGxhY2VtZW50PVwiYm90dG9tXCI+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPENvbG9yXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHN0eWxlPXt7IGJhY2tncm91bmRDb2xvcjogY29sb3IgfX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgb25DbGljaz17KCkgPT4ge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgLy8gV2l0aCBwYWdlIGVsZW1lbnRzIGltcGxlbWVudGF0aW9uLCB3ZSB3YW50IHRvIHN0b3JlIHRoZSBjb2xvciBrZXkgYW5kXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvLyB0aGVuIHRoZSBhY3R1YWwgY29sb3Igd2lsbCBiZSByZXRyaWV2ZWQgZnJvbSB0aGUgdGhlbWUgb2JqZWN0LlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uc3QgY29sb3JzID0gdGhlbWU/LnN0eWxlcz8uY29sb3JzO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgb25DaGFuZ2VDb21wbGV0ZShjb2xvcnNba2V5XSwga2V5KTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9Ub29sdGlwPlxuICAgICAgICAgICAgICAgICAgICA8L0NvbG9yQm94PlxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICB9KX1cblxuICAgICAgICAgICAgPENvbG9yQm94IGNsYXNzTmFtZT17dmFsdWUgJiYgIWlzVGhlbWVDb2xvciA/IHN0eWxlcy5zZWxlY3RlZENvbG9yIDogXCJcIn0+XG4gICAgICAgICAgICAgICAgPFRvb2x0aXAgY29udGVudD17PHNwYW4+Q29sb3IgcGlja2VyPC9zcGFuPn0gcGxhY2VtZW50PVwiYm90dG9tXCI+XG4gICAgICAgICAgICAgICAgICAgIDxDb2xvclxuICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e3sgYmFja2dyb3VuZENvbG9yOiBpc1RoZW1lQ29sb3IgPyBcIiNmZmZcIiA6IHZhbHVlIH19XG4gICAgICAgICAgICAgICAgICAgICAgICBvbkNsaWNrPXt0b2dnbGVQaWNrZXJ9XG4gICAgICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxJY29uUGFsZXR0ZSBjbGFzc05hbWU9e2ljb25QYWxldHRlU3R5bGV9IC8+XG4gICAgICAgICAgICAgICAgICAgIDwvQ29sb3I+XG4gICAgICAgICAgICAgICAgPC9Ub29sdGlwPlxuICAgICAgICAgICAgPC9Db2xvckJveD5cblxuICAgICAgICAgICAgPGRpdiBzdHlsZT17c2hvd1BpY2tlciA/IHNob3dQaWNrZXJTdHlsZSA6IGhpZGVQaWNrZXJTdHlsZX0+XG4gICAgICAgICAgICAgICAgPENocm9tZVBpY2tlclxuICAgICAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2Nocm9tZVBpY2tlclN0eWxlfVxuICAgICAgICAgICAgICAgICAgICBjb2xvcj17YWN0dWFsU2VsZWN0ZWRDb2xvcn1cbiAgICAgICAgICAgICAgICAgICAgZGlzYWJsZUFscGhhPXt0cnVlfVxuICAgICAgICAgICAgICAgICAgICBvbkNoYW5nZT17b25Db2xvckNoYW5nZSBhcyBPbkNoYW5nZUhhbmRsZXJ9XG4gICAgICAgICAgICAgICAgICAgIG9uQ2hhbmdlQ29tcGxldGU9e29uQ29sb3JDaGFuZ2VDb21wbGV0ZSBhcyBPbkNoYW5nZUhhbmRsZXJ9XG4gICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L0NvbG9yUGlja2VyU3R5bGU+XG4gICAgKTtcbn07XG4iXX0= */",
|
|
23
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
24
|
+
});
|
|
25
|
+
const ColorBox = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
|
|
26
|
+
target: "ewrv11k1"
|
|
27
|
+
} : {
|
|
28
|
+
target: "ewrv11k1",
|
|
29
|
+
label: "ColorBox"
|
|
30
|
+
})(process.env.NODE_ENV === "production" ? {
|
|
31
|
+
name: "tujbiz",
|
|
32
|
+
styles: "cursor:pointer;width:40px;height:40px;border-radius:50%;margin:5px;border:1px solid var(--mdc-theme-on-background);padding:3px;box-sizing:content-box"
|
|
33
|
+
} : {
|
|
34
|
+
name: "tujbiz",
|
|
35
|
+
styles: "cursor:pointer;width:40px;height:40px;border-radius:50%;margin:5px;border:1px solid var(--mdc-theme-on-background);padding:3px;box-sizing:content-box",
|
|
36
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxleGljYWxDb2xvclBpY2tlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUJpQiIsImZpbGUiOiJMZXhpY2FsQ29sb3JQaWNrZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBTeW50aGV0aWNFdmVudCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IFJlYWN0LCB7IHVzZUNhbGxiYWNrLCB1c2VTdGF0ZSwgdXNlRWZmZWN0LCB1c2VNZW1vIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IGNzcyB9IGZyb20gXCJlbW90aW9uXCI7XG5pbXBvcnQgdHlwZSB7IENvbG9yU3RhdGUsIFJHQkNvbG9yIH0gZnJvbSBcInJlYWN0LWNvbG9yXCI7XG5pbXBvcnQgeyBDaHJvbWVQaWNrZXIgfSBmcm9tIFwicmVhY3QtY29sb3JcIjtcbmltcG9ydCB0eXBlIHsgT25DaGFuZ2VIYW5kbGVyIH0gZnJvbSBcInJlYWN0LWNvbG9yL2xpYi9jb21wb25lbnRzL2NvbW1vbi9Db2xvcldyYXBcIjtcbmltcG9ydCB7IFRvb2x0aXAgfSBmcm9tIFwiQHdlYmlueS91aS9Ub29sdGlwXCI7XG5cbi8vIEljb25zXG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBJY29uUGFsZXR0ZSB9IGZyb20gXCIuL3JvdW5kLWNvbG9yX2xlbnMtMjRweC5zdmdcIjtcbmltcG9ydCB7IHVzZVJpY2hUZXh0RWRpdG9yIH0gZnJvbSBcIkB3ZWJpbnkvbGV4aWNhbC1lZGl0b3JcIjtcblxuY29uc3QgQ29sb3JQaWNrZXJTdHlsZSA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBmbGV4V3JhcDogXCJ3cmFwXCIsXG4gICAganVzdGlmeUNvbnRlbnQ6IFwiZmxleC1zdGFydFwiLFxuICAgIHdpZHRoOiAyNDAsXG4gICAgcGFkZGluZzogMTUsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiNmZmZcIlxufSk7XG5cbmNvbnN0IENvbG9yQm94ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIHdpZHRoOiA0MCxcbiAgICBoZWlnaHQ6IDQwLFxuICAgIGJvcmRlclJhZGl1czogXCI1MCVcIixcbiAgICBtYXJnaW46IDUsXG4gICAgYm9yZGVyOiBcIjFweCBzb2xpZCB2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZClcIixcbiAgICBwYWRkaW5nOiAzLFxuICAgIGJveFNpemluZzogXCJjb250ZW50LWJveFwiXG59KTtcblxuY29uc3QgQ29sb3IgPSBzdHlsZWQoXCJidXR0b25cIikoe1xuICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgd2lkdGg6IDQwLFxuICAgIGhlaWdodDogNDAsXG4gICAgdHJhbnNpdGlvbjogXCJ0cmFuc2Zvcm0gMC4xcywgYm9yZGVyIDAuMnNcIixcbiAgICBib3JkZXJDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgYm9yZGVyUmFkaXVzOiBcIjUwJVwiLFxuICAgIFwiJjo6YWZ0ZXJcIjoge1xuICAgICAgICB0cmFuc2l0aW9uOiBcIm9wYWNpdHkgMC41cyBjdWJpYy1iZXppZXIoMC4xNjUsIDAuODQsIDAuNDQsIDEpXCIsXG4gICAgICAgIGNvbnRlbnQ6ICdcIlwiJyxcbiAgICAgICAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgICAgICAgdG9wOiAwLFxuICAgICAgICBsZWZ0OiAwLFxuICAgICAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgICAgIHpJbmRleDogLTEsXG4gICAgICAgIG9wYWNpdHk6IDBcbiAgICB9LFxuICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgIHRyYW5zZm9ybTogXCJzY2FsZSgxLjEpXCIsXG4gICAgICAgIGJveFNoYWRvdzogXCIwIDAuMjVyZW0gMC4xMjVyZW0gMCByZ2JhKDAsMCwwLDAuMDUpXCIsXG4gICAgICAgIFwiJjo6YWZ0ZXJcIjoge1xuICAgICAgICAgICAgb3BhY2l0eTogMVxuICAgICAgICB9XG4gICAgfVxufSk7XG5cbmNvbnN0IGljb25QYWxldHRlU3R5bGUgPSBjc3Moe1xuICAgIGhlaWdodDogMjAsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIG1hcmdpblRvcDogMSxcbiAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtc2Vjb25kYXJ5KVwiXG59KTtcblxuY29uc3QgQ09MT1JTID0ge1xuICAgIGxpZ2h0R3JheTogXCJoc2xhKDAsIDAlLCA5NyUsIDEpXCIsXG4gICAgZ3JheTogXCJoc2xhKDMwMCwgMiUsIDkyJSwgMSlcIixcbiAgICBkYXJrR3JheTogXCJoc2xhKDAsIDAlLCA3MCUsIDEpXCIsXG4gICAgZGFya2VzdEdyYXk6IFwiaHNsYSgwLCAwJSwgMjAlLCAxKVwiLFxuICAgIGJsYWNrOiBcImhzbGEoMjA4LCAxMDAlLCA1JSwgMSlcIlxufTtcblxuY29uc3Qgc3R5bGVzID0ge1xuICAgIHNlbGVjdGVkQ29sb3I6IGNzcyh7XG4gICAgICAgIGJveFNoYWRvdzogXCJpbnNldCAwcHggMHB4IDBweCAxMHB4IHZhcigtLW1kYy10aGVtZS1zZWNvbmRhcnkpXCIsXG4gICAgICAgIGJ1dHRvbjoge1xuICAgICAgICAgICAgYm9yZGVyOiBcIjVweCBzb2xpZCB2YXIoLS1tZGMtdGhlbWUtc3VyZmFjZSlcIlxuICAgICAgICB9XG4gICAgfSksXG4gICAgYnV0dG9uOiBjc3Moe1xuICAgICAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgICAgICBoZWlnaHQ6IDMwLFxuICAgICAgICBib3hTaXppbmc6IFwiYm9yZGVyLWJveFwiLFxuICAgICAgICBcIiY6aG92ZXI6bm90KDpkaXNhYmxlZClcIjogeyBiYWNrZ3JvdW5kQ29sb3I6IENPTE9SUy5ncmF5IH0sXG4gICAgICAgIFwiJjpmb2N1czpub3QoOmRpc2FibGVkKVwiOiB7XG4gICAgICAgICAgICBvdXRsaW5lOiBcIm5vbmVcIlxuICAgICAgICB9LFxuICAgICAgICBcIiY6ZGlzYWJsZWRcIjoge1xuICAgICAgICAgICAgb3BhY2l0eTogMC41LFxuICAgICAgICAgICAgY3Vyc29yOiBcIm5vdC1hbGxvd2VkXCJcbiAgICAgICAgfSxcbiAgICAgICAgXCImIHN2Z1wiOiB7XG4gICAgICAgICAgICB3aWR0aDogMTYsXG4gICAgICAgICAgICBoZWlnaHQ6IDE2XG4gICAgICAgIH1cbiAgICB9KSxcbiAgICBjb2xvcjogY3NzKHtcbiAgICAgICAgd2lkdGg6IFwiNDBweFwiLFxuICAgICAgICBoZWlnaHQ6IFwiMTAwJVwiXG4gICAgfSlcbn07XG5cbmNvbnN0IGNocm9tZVBpY2tlclN0eWxlID0gY3NzKHtcbiAgICB3aWR0aDogXCIyNzBweCAhaW1wb3J0YW50XCIsXG4gICAgbWFyZ2luOiBcIjE1cHggLTE1cHggLTE1cHggLTE1cHhcIlxufSk7XG5cbmludGVyZmFjZSBMZXhpY2FsQ29sb3JQaWNrZXJQcm9wcyB7XG4gICAgdmFsdWU6IHN0cmluZztcbiAgICBvbkNoYW5nZT86IChjb2xvcjogc3RyaW5nKSA9PiB2b2lkO1xuICAgIG9uQ2hhbmdlQ29tcGxldGU6IChjb2xvcjogc3RyaW5nLCBuYW1lPzogc3RyaW5nKSA9PiB2b2lkO1xuICAgIGhhbmRsZXJDbGFzc05hbWU/OiBzdHJpbmc7XG59XG5cbmNvbnN0IHNob3dQaWNrZXJTdHlsZSA9IHsgZGlzcGxheTogXCJibG9ja1wiIH07XG5jb25zdCBoaWRlUGlja2VyU3R5bGUgPSB7IGRpc3BsYXk6IFwibm9uZVwiIH07XG5cbmV4cG9ydCBjb25zdCBMZXhpY2FsQ29sb3JQaWNrZXIgPSAoe1xuICAgIHZhbHVlLFxuICAgIG9uQ2hhbmdlLFxuICAgIG9uQ2hhbmdlQ29tcGxldGVcbn06IExleGljYWxDb2xvclBpY2tlclByb3BzKSA9PiB7XG4gICAgY29uc3QgW3Nob3dQaWNrZXIsIHNldFNob3dQaWNrZXJdID0gdXNlU3RhdGUoZmFsc2UpO1xuICAgIC8vIEVpdGhlciBhIGN1c3RvbSBjb2xvciBvciBhIGNvbG9yIGNvbWluZyBmcm9tIHRoZSB0aGVtZSBvYmplY3QuXG4gICAgY29uc3QgW2FjdHVhbFNlbGVjdGVkQ29sb3IsIHNldEFjdHVhbFNlbGVjdGVkQ29sb3JdID0gdXNlU3RhdGUodmFsdWUgfHwgXCIjZmZmXCIpO1xuICAgIGNvbnN0IFtpc1RoZW1lQ29sb3IsIHNldElzVGhlbWVDb2xvcl0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgICBpZiAodmFsdWUpIHtcbiAgICAgICAgICAgIHNldEFjdHVhbFNlbGVjdGVkQ29sb3IodmFsdWUpO1xuICAgICAgICB9XG4gICAgfSwgW3ZhbHVlXSk7XG5cbiAgICBjb25zdCBnZXRDb2xvclZhbHVlID0gdXNlQ2FsbGJhY2soKHJnYjogUkdCQ29sb3IsIGFscGhhPzogbnVtYmVyKSA9PiB7XG4gICAgICAgIHJldHVybiBgcmdiYSgke3JnYi5yfSwgJHtyZ2IuZ30sICR7cmdiLmJ9LCAke2FscGhhID8/IHJnYi5hfSlgO1xuICAgIH0sIFtdKTtcblxuICAgIGNvbnN0IG9uQ29sb3JDaGFuZ2UgPSB1c2VDYWxsYmFjayhcbiAgICAgICAgKGNvbG9yOiBDb2xvclN0YXRlLCBldmVudDogUmVhY3QuU3ludGhldGljRXZlbnQpID0+IHtcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgICAvLyBjb250cm9scyBvZiB0aGUgcGlja2VyIGFyZSB1cGRhdGVkIGFzIHVzZXIgbW92ZXMgdGhlIG1vdXNlXG4gICAgICAgICAgICBjb25zdCBjdXN0b21Db2xvciA9IGdldENvbG9yVmFsdWUoY29sb3IucmdiLCBjb2xvci5yZ2IuYSA9PT0gMCA/IDEgOiBjb2xvci5yZ2IuYSk7XG4gICAgICAgICAgICBzZXRBY3R1YWxTZWxlY3RlZENvbG9yKGN1c3RvbUNvbG9yKTtcbiAgICAgICAgICAgIGlmICh0eXBlb2Ygb25DaGFuZ2UgPT09IFwiZnVuY3Rpb25cIikge1xuICAgICAgICAgICAgICAgIG9uQ2hhbmdlKGN1c3RvbUNvbG9yKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfSxcbiAgICAgICAgW29uQ2hhbmdlXVxuICAgICk7XG5cbiAgICBjb25zdCBvbkNvbG9yQ2hhbmdlQ29tcGxldGUgPSB1c2VDYWxsYmFjayhcbiAgICAgICAgKHsgcmdiIH06IENvbG9yU3RhdGUsIGV2ZW50OiBSZWFjdC5TeW50aGV0aWNFdmVudCkgPT4ge1xuICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICAgIGNvbnN0IGNvbG9yID0gZ2V0Q29sb3JWYWx1ZShyZ2IsIHJnYi5hID09PSAwID8gMSA6IHJnYi5hKTtcbiAgICAgICAgICAgIHNldEFjdHVhbFNlbGVjdGVkQ29sb3IoY29sb3IpO1xuICAgICAgICAgICAgb25DaGFuZ2VDb21wbGV0ZShjb2xvcik7XG4gICAgICAgIH0sXG4gICAgICAgIFtvbkNoYW5nZUNvbXBsZXRlXVxuICAgICk7XG5cbiAgICBjb25zdCB0b2dnbGVQaWNrZXIgPSB1c2VDYWxsYmFjaygoZTogU3ludGhldGljRXZlbnQpID0+IHtcbiAgICAgICAgZS5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICAgICAgc2V0U2hvd1BpY2tlcihzdGF0ZSA9PiAhc3RhdGUpO1xuICAgIH0sIFtdKTtcblxuICAgIGNvbnN0IHsgdGhlbWUgfSA9IHVzZVJpY2hUZXh0RWRpdG9yKCk7XG5cbiAgICBjb25zdCB0aGVtZUNvbG9yczogUmVjb3JkPHN0cmluZywgYW55PiA9IHVzZU1lbW8oKCkgPT4ge1xuICAgICAgICBjb25zdCBjb2xvcnMgPSB0aGVtZT8uc3R5bGVzPy5jb2xvcnMgPz8ge307XG5cbiAgICAgICAgcmV0dXJuIE9iamVjdC5rZXlzKGNvbG9ycykucmVkdWNlKChhY2MsIGtleSkgPT4ge1xuICAgICAgICAgICAgcmV0dXJuIHsgLi4uYWNjLCBba2V5XTogY29sb3JzW2tleV0gfTtcbiAgICAgICAgfSwge30pO1xuICAgIH0sIFt0aGVtZT8uc3R5bGVzPy5jb2xvcnNdKTtcblxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgICAgIGNvbnN0IGlzVGhlbWVDb2xvciA9IE9iamVjdC5rZXlzKHRoZW1lQ29sb3JzKS5zb21lKGtleSA9PiB0aGVtZUNvbG9yc1trZXldID09PSB2YWx1ZSk7XG4gICAgICAgIHNldElzVGhlbWVDb2xvcihpc1RoZW1lQ29sb3IpO1xuICAgIH0sIFt0aGVtZUNvbG9ycywgdmFsdWVdKTtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDxDb2xvclBpY2tlclN0eWxlPlxuICAgICAgICAgICAge09iamVjdC5rZXlzKHRoZW1lQ29sb3JzKS5tYXAoKGtleSwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgICBjb25zdCBjb2xvciA9IHRoZW1lQ29sb3JzW2tleV07XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgICA8Q29sb3JCb3gga2V5PXtpbmRleH0gY2xhc3NOYW1lPXtjb2xvciA9PT0gdmFsdWUgPyBzdHlsZXMuc2VsZWN0ZWRDb2xvciA6IFwiXCJ9PlxuICAgICAgICAgICAgICAgICAgICAgICAgPFRvb2x0aXAgY29udGVudD17PHNwYW4+e2NvbG9yfTwvc3Bhbj59IHBsYWNlbWVudD1cImJvdHRvbVwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxDb2xvclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBzdHlsZT17eyBiYWNrZ3JvdW5kQ29sb3I6IGNvbG9yIH19XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC8vIFdpdGggcGFnZSBlbGVtZW50cyBpbXBsZW1lbnRhdGlvbiwgd2Ugd2FudCB0byBzdG9yZSB0aGUgY29sb3Iga2V5IGFuZFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgLy8gdGhlbiB0aGUgYWN0dWFsIGNvbG9yIHdpbGwgYmUgcmV0cmlldmVkIGZyb20gdGhlIHRoZW1lIG9iamVjdC5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNvbnN0IGNvbG9ycyA9IHRoZW1lPy5zdHlsZXM/LmNvbG9ycztcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIG9uQ2hhbmdlQ29tcGxldGUoY29sb3JzW2tleV0sIGtleSk7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvVG9vbHRpcD5cbiAgICAgICAgICAgICAgICAgICAgPC9Db2xvckJveD5cbiAgICAgICAgICAgICAgICApO1xuICAgICAgICAgICAgfSl9XG5cbiAgICAgICAgICAgIDxDb2xvckJveCBjbGFzc05hbWU9e3ZhbHVlICYmICFpc1RoZW1lQ29sb3IgPyBzdHlsZXMuc2VsZWN0ZWRDb2xvciA6IFwiXCJ9PlxuICAgICAgICAgICAgICAgIDxUb29sdGlwIGNvbnRlbnQ9ezxzcGFuPkNvbG9yIHBpY2tlcjwvc3Bhbj59IHBsYWNlbWVudD1cImJvdHRvbVwiPlxuICAgICAgICAgICAgICAgICAgICA8Q29sb3JcbiAgICAgICAgICAgICAgICAgICAgICAgIHN0eWxlPXt7IGJhY2tncm91bmRDb2xvcjogaXNUaGVtZUNvbG9yID8gXCIjZmZmXCIgOiB2YWx1ZSB9fVxuICAgICAgICAgICAgICAgICAgICAgICAgb25DbGljaz17dG9nZ2xlUGlja2VyfVxuICAgICAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgICAgICA8SWNvblBhbGV0dGUgY2xhc3NOYW1lPXtpY29uUGFsZXR0ZVN0eWxlfSAvPlxuICAgICAgICAgICAgICAgICAgICA8L0NvbG9yPlxuICAgICAgICAgICAgICAgIDwvVG9vbHRpcD5cbiAgICAgICAgICAgIDwvQ29sb3JCb3g+XG5cbiAgICAgICAgICAgIDxkaXYgc3R5bGU9e3Nob3dQaWNrZXIgPyBzaG93UGlja2VyU3R5bGUgOiBoaWRlUGlja2VyU3R5bGV9PlxuICAgICAgICAgICAgICAgIDxDaHJvbWVQaWNrZXJcbiAgICAgICAgICAgICAgICAgICAgY2xhc3NOYW1lPXtjaHJvbWVQaWNrZXJTdHlsZX1cbiAgICAgICAgICAgICAgICAgICAgY29sb3I9e2FjdHVhbFNlbGVjdGVkQ29sb3J9XG4gICAgICAgICAgICAgICAgICAgIGRpc2FibGVBbHBoYT17dHJ1ZX1cbiAgICAgICAgICAgICAgICAgICAgb25DaGFuZ2U9e29uQ29sb3JDaGFuZ2UgYXMgT25DaGFuZ2VIYW5kbGVyfVxuICAgICAgICAgICAgICAgICAgICBvbkNoYW5nZUNvbXBsZXRlPXtvbkNvbG9yQ2hhbmdlQ29tcGxldGUgYXMgT25DaGFuZ2VIYW5kbGVyfVxuICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9Db2xvclBpY2tlclN0eWxlPlxuICAgICk7XG59O1xuIl19 */",
|
|
37
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
38
|
+
});
|
|
39
|
+
const Color = /*#__PURE__*/_styled("button", process.env.NODE_ENV === "production" ? {
|
|
40
|
+
target: "ewrv11k0"
|
|
41
|
+
} : {
|
|
42
|
+
target: "ewrv11k0",
|
|
43
|
+
label: "Color"
|
|
44
|
+
})({
|
|
45
|
+
cursor: "pointer",
|
|
46
|
+
width: 40,
|
|
47
|
+
height: 40,
|
|
48
|
+
transition: "transform 0.1s, border 0.2s",
|
|
49
|
+
borderColor: "transparent",
|
|
50
|
+
display: "flex",
|
|
51
|
+
alignItems: "center",
|
|
52
|
+
borderRadius: "50%",
|
|
53
|
+
"&::after": {
|
|
54
|
+
transition: "opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)",
|
|
55
|
+
content: '""',
|
|
56
|
+
position: "absolute",
|
|
57
|
+
top: 0,
|
|
58
|
+
left: 0,
|
|
59
|
+
width: "100%",
|
|
60
|
+
height: "100%",
|
|
61
|
+
zIndex: -1,
|
|
62
|
+
opacity: 0
|
|
63
|
+
},
|
|
64
|
+
"&:hover": {
|
|
65
|
+
transform: "scale(1.1)",
|
|
66
|
+
boxShadow: "0 0.25rem 0.125rem 0 rgba(0,0,0,0.05)",
|
|
67
|
+
"&::after": {
|
|
68
|
+
opacity: 1
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxleGljYWxDb2xvclBpY2tlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0NjIiwiZmlsZSI6IkxleGljYWxDb2xvclBpY2tlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFN5bnRoZXRpY0V2ZW50IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgUmVhY3QsIHsgdXNlQ2FsbGJhY2ssIHVzZVN0YXRlLCB1c2VFZmZlY3QsIHVzZU1lbW8gfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSBcImVtb3Rpb25cIjtcbmltcG9ydCB0eXBlIHsgQ29sb3JTdGF0ZSwgUkdCQ29sb3IgfSBmcm9tIFwicmVhY3QtY29sb3JcIjtcbmltcG9ydCB7IENocm9tZVBpY2tlciB9IGZyb20gXCJyZWFjdC1jb2xvclwiO1xuaW1wb3J0IHR5cGUgeyBPbkNoYW5nZUhhbmRsZXIgfSBmcm9tIFwicmVhY3QtY29sb3IvbGliL2NvbXBvbmVudHMvY29tbW9uL0NvbG9yV3JhcFwiO1xuaW1wb3J0IHsgVG9vbHRpcCB9IGZyb20gXCJAd2ViaW55L3VpL1Rvb2x0aXBcIjtcblxuLy8gSWNvbnNcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIEljb25QYWxldHRlIH0gZnJvbSBcIi4vcm91bmQtY29sb3JfbGVucy0yNHB4LnN2Z1wiO1xuaW1wb3J0IHsgdXNlUmljaFRleHRFZGl0b3IgfSBmcm9tIFwiQHdlYmlueS9sZXhpY2FsLWVkaXRvclwiO1xuXG5jb25zdCBDb2xvclBpY2tlclN0eWxlID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhXcmFwOiBcIndyYXBcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJmbGV4LXN0YXJ0XCIsXG4gICAgd2lkdGg6IDI0MCxcbiAgICBwYWRkaW5nOiAxNSxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IFwiI2ZmZlwiXG59KTtcblxuY29uc3QgQ29sb3JCb3ggPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgd2lkdGg6IDQwLFxuICAgIGhlaWdodDogNDAsXG4gICAgYm9yZGVyUmFkaXVzOiBcIjUwJVwiLFxuICAgIG1hcmdpbjogNSxcbiAgICBib3JkZXI6IFwiMXB4IHNvbGlkIHZhcigtLW1kYy10aGVtZS1vbi1iYWNrZ3JvdW5kKVwiLFxuICAgIHBhZGRpbmc6IDMsXG4gICAgYm94U2l6aW5nOiBcImNvbnRlbnQtYm94XCJcbn0pO1xuXG5jb25zdCBDb2xvciA9IHN0eWxlZChcImJ1dHRvblwiKSh7XG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICB3aWR0aDogNDAsXG4gICAgaGVpZ2h0OiA0MCxcbiAgICB0cmFuc2l0aW9uOiBcInRyYW5zZm9ybSAwLjFzLCBib3JkZXIgMC4yc1wiLFxuICAgIGJvcmRlckNvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBib3JkZXJSYWRpdXM6IFwiNTAlXCIsXG4gICAgXCImOjphZnRlclwiOiB7XG4gICAgICAgIHRyYW5zaXRpb246IFwib3BhY2l0eSAwLjVzIGN1YmljLWJlemllcigwLjE2NSwgMC44NCwgMC40NCwgMSlcIixcbiAgICAgICAgY29udGVudDogJ1wiXCInLFxuICAgICAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgICAgICB0b3A6IDAsXG4gICAgICAgIGxlZnQ6IDAsXG4gICAgICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICAgICAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgICAgICAgekluZGV4OiAtMSxcbiAgICAgICAgb3BhY2l0eTogMFxuICAgIH0sXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgICAgdHJhbnNmb3JtOiBcInNjYWxlKDEuMSlcIixcbiAgICAgICAgYm94U2hhZG93OiBcIjAgMC4yNXJlbSAwLjEyNXJlbSAwIHJnYmEoMCwwLDAsMC4wNSlcIixcbiAgICAgICAgXCImOjphZnRlclwiOiB7XG4gICAgICAgICAgICBvcGFjaXR5OiAxXG4gICAgICAgIH1cbiAgICB9XG59KTtcblxuY29uc3QgaWNvblBhbGV0dGVTdHlsZSA9IGNzcyh7XG4gICAgaGVpZ2h0OiAyMCxcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgbWFyZ2luVG9wOiAxLFxuICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1zZWNvbmRhcnkpXCJcbn0pO1xuXG5jb25zdCBDT0xPUlMgPSB7XG4gICAgbGlnaHRHcmF5OiBcImhzbGEoMCwgMCUsIDk3JSwgMSlcIixcbiAgICBncmF5OiBcImhzbGEoMzAwLCAyJSwgOTIlLCAxKVwiLFxuICAgIGRhcmtHcmF5OiBcImhzbGEoMCwgMCUsIDcwJSwgMSlcIixcbiAgICBkYXJrZXN0R3JheTogXCJoc2xhKDAsIDAlLCAyMCUsIDEpXCIsXG4gICAgYmxhY2s6IFwiaHNsYSgyMDgsIDEwMCUsIDUlLCAxKVwiXG59O1xuXG5jb25zdCBzdHlsZXMgPSB7XG4gICAgc2VsZWN0ZWRDb2xvcjogY3NzKHtcbiAgICAgICAgYm94U2hhZG93OiBcImluc2V0IDBweCAwcHggMHB4IDEwcHggdmFyKC0tbWRjLXRoZW1lLXNlY29uZGFyeSlcIixcbiAgICAgICAgYnV0dG9uOiB7XG4gICAgICAgICAgICBib3JkZXI6IFwiNXB4IHNvbGlkIHZhcigtLW1kYy10aGVtZS1zdXJmYWNlKVwiXG4gICAgICAgIH1cbiAgICB9KSxcbiAgICBidXR0b246IGNzcyh7XG4gICAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgICAgIGhlaWdodDogMzAsXG4gICAgICAgIGJveFNpemluZzogXCJib3JkZXItYm94XCIsXG4gICAgICAgIFwiJjpob3Zlcjpub3QoOmRpc2FibGVkKVwiOiB7IGJhY2tncm91bmRDb2xvcjogQ09MT1JTLmdyYXkgfSxcbiAgICAgICAgXCImOmZvY3VzOm5vdCg6ZGlzYWJsZWQpXCI6IHtcbiAgICAgICAgICAgIG91dGxpbmU6IFwibm9uZVwiXG4gICAgICAgIH0sXG4gICAgICAgIFwiJjpkaXNhYmxlZFwiOiB7XG4gICAgICAgICAgICBvcGFjaXR5OiAwLjUsXG4gICAgICAgICAgICBjdXJzb3I6IFwibm90LWFsbG93ZWRcIlxuICAgICAgICB9LFxuICAgICAgICBcIiYgc3ZnXCI6IHtcbiAgICAgICAgICAgIHdpZHRoOiAxNixcbiAgICAgICAgICAgIGhlaWdodDogMTZcbiAgICAgICAgfVxuICAgIH0pLFxuICAgIGNvbG9yOiBjc3Moe1xuICAgICAgICB3aWR0aDogXCI0MHB4XCIsXG4gICAgICAgIGhlaWdodDogXCIxMDAlXCJcbiAgICB9KVxufTtcblxuY29uc3QgY2hyb21lUGlja2VyU3R5bGUgPSBjc3Moe1xuICAgIHdpZHRoOiBcIjI3MHB4ICFpbXBvcnRhbnRcIixcbiAgICBtYXJnaW46IFwiMTVweCAtMTVweCAtMTVweCAtMTVweFwiXG59KTtcblxuaW50ZXJmYWNlIExleGljYWxDb2xvclBpY2tlclByb3BzIHtcbiAgICB2YWx1ZTogc3RyaW5nO1xuICAgIG9uQ2hhbmdlPzogKGNvbG9yOiBzdHJpbmcpID0+IHZvaWQ7XG4gICAgb25DaGFuZ2VDb21wbGV0ZTogKGNvbG9yOiBzdHJpbmcsIG5hbWU/OiBzdHJpbmcpID0+IHZvaWQ7XG4gICAgaGFuZGxlckNsYXNzTmFtZT86IHN0cmluZztcbn1cblxuY29uc3Qgc2hvd1BpY2tlclN0eWxlID0geyBkaXNwbGF5OiBcImJsb2NrXCIgfTtcbmNvbnN0IGhpZGVQaWNrZXJTdHlsZSA9IHsgZGlzcGxheTogXCJub25lXCIgfTtcblxuZXhwb3J0IGNvbnN0IExleGljYWxDb2xvclBpY2tlciA9ICh7XG4gICAgdmFsdWUsXG4gICAgb25DaGFuZ2UsXG4gICAgb25DaGFuZ2VDb21wbGV0ZVxufTogTGV4aWNhbENvbG9yUGlja2VyUHJvcHMpID0+IHtcbiAgICBjb25zdCBbc2hvd1BpY2tlciwgc2V0U2hvd1BpY2tlcl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gICAgLy8gRWl0aGVyIGEgY3VzdG9tIGNvbG9yIG9yIGEgY29sb3IgY29taW5nIGZyb20gdGhlIHRoZW1lIG9iamVjdC5cbiAgICBjb25zdCBbYWN0dWFsU2VsZWN0ZWRDb2xvciwgc2V0QWN0dWFsU2VsZWN0ZWRDb2xvcl0gPSB1c2VTdGF0ZSh2YWx1ZSB8fCBcIiNmZmZcIik7XG4gICAgY29uc3QgW2lzVGhlbWVDb2xvciwgc2V0SXNUaGVtZUNvbG9yXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgICAgIGlmICh2YWx1ZSkge1xuICAgICAgICAgICAgc2V0QWN0dWFsU2VsZWN0ZWRDb2xvcih2YWx1ZSk7XG4gICAgICAgIH1cbiAgICB9LCBbdmFsdWVdKTtcblxuICAgIGNvbnN0IGdldENvbG9yVmFsdWUgPSB1c2VDYWxsYmFjaygocmdiOiBSR0JDb2xvciwgYWxwaGE/OiBudW1iZXIpID0+IHtcbiAgICAgICAgcmV0dXJuIGByZ2JhKCR7cmdiLnJ9LCAke3JnYi5nfSwgJHtyZ2IuYn0sICR7YWxwaGEgPz8gcmdiLmF9KWA7XG4gICAgfSwgW10pO1xuXG4gICAgY29uc3Qgb25Db2xvckNoYW5nZSA9IHVzZUNhbGxiYWNrKFxuICAgICAgICAoY29sb3I6IENvbG9yU3RhdGUsIGV2ZW50OiBSZWFjdC5TeW50aGV0aWNFdmVudCkgPT4ge1xuICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICAgIC8vIGNvbnRyb2xzIG9mIHRoZSBwaWNrZXIgYXJlIHVwZGF0ZWQgYXMgdXNlciBtb3ZlcyB0aGUgbW91c2VcbiAgICAgICAgICAgIGNvbnN0IGN1c3RvbUNvbG9yID0gZ2V0Q29sb3JWYWx1ZShjb2xvci5yZ2IsIGNvbG9yLnJnYi5hID09PSAwID8gMSA6IGNvbG9yLnJnYi5hKTtcbiAgICAgICAgICAgIHNldEFjdHVhbFNlbGVjdGVkQ29sb3IoY3VzdG9tQ29sb3IpO1xuICAgICAgICAgICAgaWYgKHR5cGVvZiBvbkNoYW5nZSA9PT0gXCJmdW5jdGlvblwiKSB7XG4gICAgICAgICAgICAgICAgb25DaGFuZ2UoY3VzdG9tQ29sb3IpO1xuICAgICAgICAgICAgfVxuICAgICAgICB9LFxuICAgICAgICBbb25DaGFuZ2VdXG4gICAgKTtcblxuICAgIGNvbnN0IG9uQ29sb3JDaGFuZ2VDb21wbGV0ZSA9IHVzZUNhbGxiYWNrKFxuICAgICAgICAoeyByZ2IgfTogQ29sb3JTdGF0ZSwgZXZlbnQ6IFJlYWN0LlN5bnRoZXRpY0V2ZW50KSA9PiB7XG4gICAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgICAgY29uc3QgY29sb3IgPSBnZXRDb2xvclZhbHVlKHJnYiwgcmdiLmEgPT09IDAgPyAxIDogcmdiLmEpO1xuICAgICAgICAgICAgc2V0QWN0dWFsU2VsZWN0ZWRDb2xvcihjb2xvcik7XG4gICAgICAgICAgICBvbkNoYW5nZUNvbXBsZXRlKGNvbG9yKTtcbiAgICAgICAgfSxcbiAgICAgICAgW29uQ2hhbmdlQ29tcGxldGVdXG4gICAgKTtcblxuICAgIGNvbnN0IHRvZ2dsZVBpY2tlciA9IHVzZUNhbGxiYWNrKChlOiBTeW50aGV0aWNFdmVudCkgPT4ge1xuICAgICAgICBlLnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgICBzZXRTaG93UGlja2VyKHN0YXRlID0+ICFzdGF0ZSk7XG4gICAgfSwgW10pO1xuXG4gICAgY29uc3QgeyB0aGVtZSB9ID0gdXNlUmljaFRleHRFZGl0b3IoKTtcblxuICAgIGNvbnN0IHRoZW1lQ29sb3JzOiBSZWNvcmQ8c3RyaW5nLCBhbnk+ID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIGNvbnN0IGNvbG9ycyA9IHRoZW1lPy5zdHlsZXM/LmNvbG9ycyA/PyB7fTtcblxuICAgICAgICByZXR1cm4gT2JqZWN0LmtleXMoY29sb3JzKS5yZWR1Y2UoKGFjYywga2V5KSA9PiB7XG4gICAgICAgICAgICByZXR1cm4geyAuLi5hY2MsIFtrZXldOiBjb2xvcnNba2V5XSB9O1xuICAgICAgICB9LCB7fSk7XG4gICAgfSwgW3RoZW1lPy5zdHlsZXM/LmNvbG9yc10pO1xuXG4gICAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAgICAgY29uc3QgaXNUaGVtZUNvbG9yID0gT2JqZWN0LmtleXModGhlbWVDb2xvcnMpLnNvbWUoa2V5ID0+IHRoZW1lQ29sb3JzW2tleV0gPT09IHZhbHVlKTtcbiAgICAgICAgc2V0SXNUaGVtZUNvbG9yKGlzVGhlbWVDb2xvcik7XG4gICAgfSwgW3RoZW1lQ29sb3JzLCB2YWx1ZV0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPENvbG9yUGlja2VyU3R5bGU+XG4gICAgICAgICAgICB7T2JqZWN0LmtleXModGhlbWVDb2xvcnMpLm1hcCgoa2V5LCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgICAgIGNvbnN0IGNvbG9yID0gdGhlbWVDb2xvcnNba2V5XTtcblxuICAgICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgICAgIDxDb2xvckJveCBrZXk9e2luZGV4fSBjbGFzc05hbWU9e2NvbG9yID09PSB2YWx1ZSA/IHN0eWxlcy5zZWxlY3RlZENvbG9yIDogXCJcIn0+XG4gICAgICAgICAgICAgICAgICAgICAgICA8VG9vbHRpcCBjb250ZW50PXs8c3Bhbj57Y29sb3J9PC9zcGFuPn0gcGxhY2VtZW50PVwiYm90dG9tXCI+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPENvbG9yXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHN0eWxlPXt7IGJhY2tncm91bmRDb2xvcjogY29sb3IgfX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgb25DbGljaz17KCkgPT4ge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgLy8gV2l0aCBwYWdlIGVsZW1lbnRzIGltcGxlbWVudGF0aW9uLCB3ZSB3YW50IHRvIHN0b3JlIHRoZSBjb2xvciBrZXkgYW5kXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvLyB0aGVuIHRoZSBhY3R1YWwgY29sb3Igd2lsbCBiZSByZXRyaWV2ZWQgZnJvbSB0aGUgdGhlbWUgb2JqZWN0LlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uc3QgY29sb3JzID0gdGhlbWU/LnN0eWxlcz8uY29sb3JzO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgb25DaGFuZ2VDb21wbGV0ZShjb2xvcnNba2V5XSwga2V5KTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9Ub29sdGlwPlxuICAgICAgICAgICAgICAgICAgICA8L0NvbG9yQm94PlxuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICB9KX1cblxuICAgICAgICAgICAgPENvbG9yQm94IGNsYXNzTmFtZT17dmFsdWUgJiYgIWlzVGhlbWVDb2xvciA/IHN0eWxlcy5zZWxlY3RlZENvbG9yIDogXCJcIn0+XG4gICAgICAgICAgICAgICAgPFRvb2x0aXAgY29udGVudD17PHNwYW4+Q29sb3IgcGlja2VyPC9zcGFuPn0gcGxhY2VtZW50PVwiYm90dG9tXCI+XG4gICAgICAgICAgICAgICAgICAgIDxDb2xvclxuICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e3sgYmFja2dyb3VuZENvbG9yOiBpc1RoZW1lQ29sb3IgPyBcIiNmZmZcIiA6IHZhbHVlIH19XG4gICAgICAgICAgICAgICAgICAgICAgICBvbkNsaWNrPXt0b2dnbGVQaWNrZXJ9XG4gICAgICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxJY29uUGFsZXR0ZSBjbGFzc05hbWU9e2ljb25QYWxldHRlU3R5bGV9IC8+XG4gICAgICAgICAgICAgICAgICAgIDwvQ29sb3I+XG4gICAgICAgICAgICAgICAgPC9Ub29sdGlwPlxuICAgICAgICAgICAgPC9Db2xvckJveD5cblxuICAgICAgICAgICAgPGRpdiBzdHlsZT17c2hvd1BpY2tlciA/IHNob3dQaWNrZXJTdHlsZSA6IGhpZGVQaWNrZXJTdHlsZX0+XG4gICAgICAgICAgICAgICAgPENocm9tZVBpY2tlclxuICAgICAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2Nocm9tZVBpY2tlclN0eWxlfVxuICAgICAgICAgICAgICAgICAgICBjb2xvcj17YWN0dWFsU2VsZWN0ZWRDb2xvcn1cbiAgICAgICAgICAgICAgICAgICAgZGlzYWJsZUFscGhhPXt0cnVlfVxuICAgICAgICAgICAgICAgICAgICBvbkNoYW5nZT17b25Db2xvckNoYW5nZSBhcyBPbkNoYW5nZUhhbmRsZXJ9XG4gICAgICAgICAgICAgICAgICAgIG9uQ2hhbmdlQ29tcGxldGU9e29uQ29sb3JDaGFuZ2VDb21wbGV0ZSBhcyBPbkNoYW5nZUhhbmRsZXJ9XG4gICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L0NvbG9yUGlja2VyU3R5bGU+XG4gICAgKTtcbn07XG4iXX0= */");
|
|
72
|
+
const iconPaletteStyle = css({
|
|
73
|
+
height: 20,
|
|
74
|
+
width: "100%",
|
|
75
|
+
marginTop: 1,
|
|
76
|
+
color: "var(--mdc-theme-secondary)"
|
|
77
|
+
});
|
|
78
|
+
const COLORS = {
|
|
79
|
+
lightGray: "hsla(0, 0%, 97%, 1)",
|
|
80
|
+
gray: "hsla(300, 2%, 92%, 1)",
|
|
81
|
+
darkGray: "hsla(0, 0%, 70%, 1)",
|
|
82
|
+
darkestGray: "hsla(0, 0%, 20%, 1)",
|
|
83
|
+
black: "hsla(208, 100%, 5%, 1)"
|
|
84
|
+
};
|
|
85
|
+
const styles = {
|
|
86
|
+
selectedColor: css({
|
|
87
|
+
boxShadow: "inset 0px 0px 0px 10px var(--mdc-theme-secondary)",
|
|
88
|
+
button: {
|
|
89
|
+
border: "5px solid var(--mdc-theme-surface)"
|
|
90
|
+
}
|
|
91
|
+
}),
|
|
92
|
+
button: css({
|
|
93
|
+
cursor: "pointer",
|
|
94
|
+
height: 30,
|
|
95
|
+
boxSizing: "border-box",
|
|
96
|
+
"&:hover:not(:disabled)": {
|
|
97
|
+
backgroundColor: COLORS.gray
|
|
98
|
+
},
|
|
99
|
+
"&:focus:not(:disabled)": {
|
|
100
|
+
outline: "none"
|
|
101
|
+
},
|
|
102
|
+
"&:disabled": {
|
|
103
|
+
opacity: 0.5,
|
|
104
|
+
cursor: "not-allowed"
|
|
105
|
+
},
|
|
106
|
+
"& svg": {
|
|
107
|
+
width: 16,
|
|
108
|
+
height: 16
|
|
109
|
+
}
|
|
110
|
+
}),
|
|
111
|
+
color: css({
|
|
112
|
+
width: "40px",
|
|
113
|
+
height: "100%"
|
|
114
|
+
})
|
|
115
|
+
};
|
|
116
|
+
const chromePickerStyle = css({
|
|
117
|
+
width: "270px !important",
|
|
118
|
+
margin: "15px -15px -15px -15px"
|
|
119
|
+
});
|
|
120
|
+
const showPickerStyle = {
|
|
121
|
+
display: "block"
|
|
122
|
+
};
|
|
123
|
+
const hidePickerStyle = {
|
|
124
|
+
display: "none"
|
|
125
|
+
};
|
|
126
|
+
export const LexicalColorPicker = ({
|
|
127
|
+
value,
|
|
128
|
+
onChange,
|
|
129
|
+
onChangeComplete
|
|
130
|
+
}) => {
|
|
131
|
+
const [showPicker, setShowPicker] = useState(false);
|
|
132
|
+
// Either a custom color or a color coming from the theme object.
|
|
133
|
+
const [actualSelectedColor, setActualSelectedColor] = useState(value || "#fff");
|
|
134
|
+
const [isThemeColor, setIsThemeColor] = useState(false);
|
|
135
|
+
useEffect(() => {
|
|
136
|
+
if (value) {
|
|
137
|
+
setActualSelectedColor(value);
|
|
138
|
+
}
|
|
139
|
+
}, [value]);
|
|
140
|
+
const getColorValue = useCallback((rgb, alpha) => {
|
|
141
|
+
return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha ?? rgb.a})`;
|
|
142
|
+
}, []);
|
|
143
|
+
const onColorChange = useCallback((color, event) => {
|
|
144
|
+
event.preventDefault();
|
|
145
|
+
// controls of the picker are updated as user moves the mouse
|
|
146
|
+
const customColor = getColorValue(color.rgb, color.rgb.a === 0 ? 1 : color.rgb.a);
|
|
147
|
+
setActualSelectedColor(customColor);
|
|
148
|
+
if (typeof onChange === "function") {
|
|
149
|
+
onChange(customColor);
|
|
150
|
+
}
|
|
151
|
+
}, [onChange]);
|
|
152
|
+
const onColorChangeComplete = useCallback(({
|
|
153
|
+
rgb
|
|
154
|
+
}, event) => {
|
|
155
|
+
event.preventDefault();
|
|
156
|
+
const color = getColorValue(rgb, rgb.a === 0 ? 1 : rgb.a);
|
|
157
|
+
setActualSelectedColor(color);
|
|
158
|
+
onChangeComplete(color);
|
|
159
|
+
}, [onChangeComplete]);
|
|
160
|
+
const togglePicker = useCallback(e => {
|
|
161
|
+
e.stopPropagation();
|
|
162
|
+
setShowPicker(state => !state);
|
|
163
|
+
}, []);
|
|
164
|
+
const {
|
|
165
|
+
theme
|
|
166
|
+
} = useRichTextEditor();
|
|
167
|
+
const themeColors = useMemo(() => {
|
|
168
|
+
const colors = theme?.styles?.colors ?? {};
|
|
169
|
+
return Object.keys(colors).reduce((acc, key) => {
|
|
170
|
+
return {
|
|
171
|
+
...acc,
|
|
172
|
+
[key]: colors[key]
|
|
173
|
+
};
|
|
174
|
+
}, {});
|
|
175
|
+
}, [theme?.styles?.colors]);
|
|
176
|
+
useEffect(() => {
|
|
177
|
+
const isThemeColor = Object.keys(themeColors).some(key => themeColors[key] === value);
|
|
178
|
+
setIsThemeColor(isThemeColor);
|
|
179
|
+
}, [themeColors, value]);
|
|
180
|
+
return /*#__PURE__*/React.createElement(ColorPickerStyle, null, Object.keys(themeColors).map((key, index) => {
|
|
181
|
+
const color = themeColors[key];
|
|
182
|
+
return /*#__PURE__*/React.createElement(ColorBox, {
|
|
183
|
+
key: index,
|
|
184
|
+
className: color === value ? styles.selectedColor : ""
|
|
185
|
+
}, /*#__PURE__*/React.createElement(Tooltip, {
|
|
186
|
+
content: /*#__PURE__*/React.createElement("span", null, color),
|
|
187
|
+
placement: "bottom"
|
|
188
|
+
}, /*#__PURE__*/React.createElement(Color, {
|
|
189
|
+
style: {
|
|
190
|
+
backgroundColor: color
|
|
191
|
+
},
|
|
192
|
+
onClick: () => {
|
|
193
|
+
// With page elements implementation, we want to store the color key and
|
|
194
|
+
// then the actual color will be retrieved from the theme object.
|
|
195
|
+
const colors = theme?.styles?.colors;
|
|
196
|
+
onChangeComplete(colors[key], key);
|
|
197
|
+
}
|
|
198
|
+
})));
|
|
199
|
+
}), /*#__PURE__*/React.createElement(ColorBox, {
|
|
200
|
+
className: value && !isThemeColor ? styles.selectedColor : ""
|
|
201
|
+
}, /*#__PURE__*/React.createElement(Tooltip, {
|
|
202
|
+
content: /*#__PURE__*/React.createElement("span", null, "Color picker"),
|
|
203
|
+
placement: "bottom"
|
|
204
|
+
}, /*#__PURE__*/React.createElement(Color, {
|
|
205
|
+
style: {
|
|
206
|
+
backgroundColor: isThemeColor ? "#fff" : value
|
|
207
|
+
},
|
|
208
|
+
onClick: togglePicker
|
|
209
|
+
}, /*#__PURE__*/React.createElement(IconPalette, {
|
|
210
|
+
className: iconPaletteStyle
|
|
211
|
+
})))), /*#__PURE__*/React.createElement("div", {
|
|
212
|
+
style: showPicker ? showPickerStyle : hidePickerStyle
|
|
213
|
+
}, /*#__PURE__*/React.createElement(ChromePicker, {
|
|
214
|
+
className: chromePickerStyle,
|
|
215
|
+
color: actualSelectedColor,
|
|
216
|
+
disableAlpha: true,
|
|
217
|
+
onChange: onColorChange,
|
|
218
|
+
onChangeComplete: onColorChangeComplete
|
|
219
|
+
})));
|
|
220
|
+
};
|
|
221
|
+
|
|
222
|
+
//# sourceMappingURL=LexicalColorPicker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useCallback","useState","useEffect","useMemo","css","ChromePicker","Tooltip","ReactComponent","IconPalette","useRichTextEditor","ColorPickerStyle","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","ColorBox","Color","cursor","width","height","transition","borderColor","display","alignItems","borderRadius","content","position","top","left","zIndex","opacity","transform","boxShadow","iconPaletteStyle","marginTop","color","COLORS","lightGray","gray","darkGray","darkestGray","black","selectedColor","button","border","boxSizing","backgroundColor","outline","chromePickerStyle","margin","showPickerStyle","hidePickerStyle","LexicalColorPicker","value","onChange","onChangeComplete","showPicker","setShowPicker","actualSelectedColor","setActualSelectedColor","isThemeColor","setIsThemeColor","getColorValue","rgb","alpha","r","g","b","a","onColorChange","event","preventDefault","customColor","onColorChangeComplete","togglePicker","e","stopPropagation","state","theme","themeColors","colors","Object","keys","reduce","acc","key","some","createElement","index","className","placement","style","onClick","disableAlpha"],"sources":["LexicalColorPicker.tsx"],"sourcesContent":["import type { SyntheticEvent } from \"react\";\nimport React, { useCallback, useState, useEffect, useMemo } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport type { ColorState, RGBColor } from \"react-color\";\nimport { ChromePicker } from \"react-color\";\nimport type { OnChangeHandler } from \"react-color/lib/components/common/ColorWrap\";\nimport { Tooltip } from \"@webiny/ui/Tooltip\";\n\n// Icons\nimport { ReactComponent as IconPalette } from \"./round-color_lens-24px.svg\";\nimport { useRichTextEditor } from \"@webiny/lexical-editor\";\n\nconst ColorPickerStyle = styled(\"div\")({\n position: \"relative\",\n display: \"flex\",\n flexWrap: \"wrap\",\n justifyContent: \"flex-start\",\n width: 240,\n padding: 15,\n backgroundColor: \"#fff\"\n});\n\nconst ColorBox = styled(\"div\")({\n cursor: \"pointer\",\n width: 40,\n height: 40,\n borderRadius: \"50%\",\n margin: 5,\n border: \"1px solid var(--mdc-theme-on-background)\",\n padding: 3,\n boxSizing: \"content-box\"\n});\n\nconst Color = styled(\"button\")({\n cursor: \"pointer\",\n width: 40,\n height: 40,\n transition: \"transform 0.1s, border 0.2s\",\n borderColor: \"transparent\",\n display: \"flex\",\n alignItems: \"center\",\n borderRadius: \"50%\",\n \"&::after\": {\n transition: \"opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)\",\n content: '\"\"',\n position: \"absolute\",\n top: 0,\n left: 0,\n width: \"100%\",\n height: \"100%\",\n zIndex: -1,\n opacity: 0\n },\n \"&:hover\": {\n transform: \"scale(1.1)\",\n boxShadow: \"0 0.25rem 0.125rem 0 rgba(0,0,0,0.05)\",\n \"&::after\": {\n opacity: 1\n }\n }\n});\n\nconst iconPaletteStyle = css({\n height: 20,\n width: \"100%\",\n marginTop: 1,\n color: \"var(--mdc-theme-secondary)\"\n});\n\nconst COLORS = {\n lightGray: \"hsla(0, 0%, 97%, 1)\",\n gray: \"hsla(300, 2%, 92%, 1)\",\n darkGray: \"hsla(0, 0%, 70%, 1)\",\n darkestGray: \"hsla(0, 0%, 20%, 1)\",\n black: \"hsla(208, 100%, 5%, 1)\"\n};\n\nconst styles = {\n selectedColor: css({\n boxShadow: \"inset 0px 0px 0px 10px var(--mdc-theme-secondary)\",\n button: {\n border: \"5px solid var(--mdc-theme-surface)\"\n }\n }),\n button: css({\n cursor: \"pointer\",\n height: 30,\n boxSizing: \"border-box\",\n \"&:hover:not(:disabled)\": { backgroundColor: COLORS.gray },\n \"&:focus:not(:disabled)\": {\n outline: \"none\"\n },\n \"&:disabled\": {\n opacity: 0.5,\n cursor: \"not-allowed\"\n },\n \"& svg\": {\n width: 16,\n height: 16\n }\n }),\n color: css({\n width: \"40px\",\n height: \"100%\"\n })\n};\n\nconst chromePickerStyle = css({\n width: \"270px !important\",\n margin: \"15px -15px -15px -15px\"\n});\n\ninterface LexicalColorPickerProps {\n value: string;\n onChange?: (color: string) => void;\n onChangeComplete: (color: string, name?: string) => void;\n handlerClassName?: string;\n}\n\nconst showPickerStyle = { display: \"block\" };\nconst hidePickerStyle = { display: \"none\" };\n\nexport const LexicalColorPicker = ({\n value,\n onChange,\n onChangeComplete\n}: LexicalColorPickerProps) => {\n const [showPicker, setShowPicker] = useState(false);\n // Either a custom color or a color coming from the theme object.\n const [actualSelectedColor, setActualSelectedColor] = useState(value || \"#fff\");\n const [isThemeColor, setIsThemeColor] = useState(false);\n\n useEffect(() => {\n if (value) {\n setActualSelectedColor(value);\n }\n }, [value]);\n\n const getColorValue = useCallback((rgb: RGBColor, alpha?: number) => {\n return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha ?? rgb.a})`;\n }, []);\n\n const onColorChange = useCallback(\n (color: ColorState, event: React.SyntheticEvent) => {\n event.preventDefault();\n // controls of the picker are updated as user moves the mouse\n const customColor = getColorValue(color.rgb, color.rgb.a === 0 ? 1 : color.rgb.a);\n setActualSelectedColor(customColor);\n if (typeof onChange === \"function\") {\n onChange(customColor);\n }\n },\n [onChange]\n );\n\n const onColorChangeComplete = useCallback(\n ({ rgb }: ColorState, event: React.SyntheticEvent) => {\n event.preventDefault();\n const color = getColorValue(rgb, rgb.a === 0 ? 1 : rgb.a);\n setActualSelectedColor(color);\n onChangeComplete(color);\n },\n [onChangeComplete]\n );\n\n const togglePicker = useCallback((e: SyntheticEvent) => {\n e.stopPropagation();\n setShowPicker(state => !state);\n }, []);\n\n const { theme } = useRichTextEditor();\n\n const themeColors: Record<string, any> = useMemo(() => {\n const colors = theme?.styles?.colors ?? {};\n\n return Object.keys(colors).reduce((acc, key) => {\n return { ...acc, [key]: colors[key] };\n }, {});\n }, [theme?.styles?.colors]);\n\n useEffect(() => {\n const isThemeColor = Object.keys(themeColors).some(key => themeColors[key] === value);\n setIsThemeColor(isThemeColor);\n }, [themeColors, value]);\n\n return (\n <ColorPickerStyle>\n {Object.keys(themeColors).map((key, index) => {\n const color = themeColors[key];\n\n return (\n <ColorBox key={index} className={color === value ? styles.selectedColor : \"\"}>\n <Tooltip content={<span>{color}</span>} placement=\"bottom\">\n <Color\n style={{ backgroundColor: color }}\n onClick={() => {\n // With page elements implementation, we want to store the color key and\n // then the actual color will be retrieved from the theme object.\n const colors = theme?.styles?.colors;\n onChangeComplete(colors[key], key);\n }}\n />\n </Tooltip>\n </ColorBox>\n );\n })}\n\n <ColorBox className={value && !isThemeColor ? styles.selectedColor : \"\"}>\n <Tooltip content={<span>Color picker</span>} placement=\"bottom\">\n <Color\n style={{ backgroundColor: isThemeColor ? \"#fff\" : value }}\n onClick={togglePicker}\n >\n <IconPalette className={iconPaletteStyle} />\n </Color>\n </Tooltip>\n </ColorBox>\n\n <div style={showPicker ? showPickerStyle : hidePickerStyle}>\n <ChromePicker\n className={chromePickerStyle}\n color={actualSelectedColor}\n disableAlpha={true}\n onChange={onColorChange as OnChangeHandler}\n onChangeComplete={onColorChangeComplete as OnChangeHandler}\n />\n </div>\n </ColorPickerStyle>\n );\n};\n"],"mappings":";;AACA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAExE,SAASC,GAAG,QAAQ,SAAS;AAE7B,SAASC,YAAY,QAAQ,aAAa;AAE1C,SAASC,OAAO,QAAQ,oBAAoB;;AAE5C;AACA,SAASC,cAAc,IAAIC,WAAW;AACtC,SAASC,iBAAiB,QAAQ,wBAAwB;AAE1D,MAAMC,gBAAgB,gBAAGC,OAAA,CAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,CAQrC,CAAC;AAEF,MAAMC,QAAQ,gBAAGX,OAAA,CAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,CAS7B,CAAC;AAEF,MAAME,KAAK,gBAAGZ,OAAA,CAAO,QAAQ,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAC;EAC3BQ,MAAM,EAAE,SAAS;EACjBC,KAAK,EAAE,EAAE;EACTC,MAAM,EAAE,EAAE;EACVC,UAAU,EAAE,6BAA6B;EACzCC,WAAW,EAAE,aAAa;EAC1BC,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBC,YAAY,EAAE,KAAK;EACnB,UAAU,EAAE;IACRJ,UAAU,EAAE,iDAAiD;IAC7DK,OAAO,EAAE,IAAI;IACbC,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,IAAI,EAAE,CAAC;IACPV,KAAK,EAAE,MAAM;IACbC,MAAM,EAAE,MAAM;IACdU,MAAM,EAAE,CAAC,CAAC;IACVC,OAAO,EAAE;EACb,CAAC;EACD,SAAS,EAAE;IACPC,SAAS,EAAE,YAAY;IACvBC,SAAS,EAAE,uCAAuC;IAClD,UAAU,EAAE;MACRF,OAAO,EAAE;IACb;EACJ;AACJ,CAAC,EAAAzB,OAAA,CAAAC,GAAA,CAAAC,QAAA,2sUAAC;AAEF,MAAM0B,gBAAgB,GAAGpC,GAAG,CAAC;EACzBsB,MAAM,EAAE,EAAE;EACVD,KAAK,EAAE,MAAM;EACbgB,SAAS,EAAE,CAAC;EACZC,KAAK,EAAE;AACX,CAAC,CAAC;AAEF,MAAMC,MAAM,GAAG;EACXC,SAAS,EAAE,qBAAqB;EAChCC,IAAI,EAAE,uBAAuB;EAC7BC,QAAQ,EAAE,qBAAqB;EAC/BC,WAAW,EAAE,qBAAqB;EAClCC,KAAK,EAAE;AACX,CAAC;AAED,MAAM9B,MAAM,GAAG;EACX+B,aAAa,EAAE7C,GAAG,CAAC;IACfmC,SAAS,EAAE,mDAAmD;IAC9DW,MAAM,EAAE;MACJC,MAAM,EAAE;IACZ;EACJ,CAAC,CAAC;EACFD,MAAM,EAAE9C,GAAG,CAAC;IACRoB,MAAM,EAAE,SAAS;IACjBE,MAAM,EAAE,EAAE;IACV0B,SAAS,EAAE,YAAY;IACvB,wBAAwB,EAAE;MAAEC,eAAe,EAAEV,MAAM,CAACE;IAAK,CAAC;IAC1D,wBAAwB,EAAE;MACtBS,OAAO,EAAE;IACb,CAAC;IACD,YAAY,EAAE;MACVjB,OAAO,EAAE,GAAG;MACZb,MAAM,EAAE;IACZ,CAAC;IACD,OAAO,EAAE;MACLC,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE;IACZ;EACJ,CAAC,CAAC;EACFgB,KAAK,EAAEtC,GAAG,CAAC;IACPqB,KAAK,EAAE,MAAM;IACbC,MAAM,EAAE;EACZ,CAAC;AACL,CAAC;AAED,MAAM6B,iBAAiB,GAAGnD,GAAG,CAAC;EAC1BqB,KAAK,EAAE,kBAAkB;EACzB+B,MAAM,EAAE;AACZ,CAAC,CAAC;AASF,MAAMC,eAAe,GAAG;EAAE5B,OAAO,EAAE;AAAQ,CAAC;AAC5C,MAAM6B,eAAe,GAAG;EAAE7B,OAAO,EAAE;AAAO,CAAC;AAE3C,OAAO,MAAM8B,kBAAkB,GAAGA,CAAC;EAC/BC,KAAK;EACLC,QAAQ;EACRC;AACqB,CAAC,KAAK;EAC3B,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG/D,QAAQ,CAAC,KAAK,CAAC;EACnD;EACA,MAAM,CAACgE,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGjE,QAAQ,CAAC2D,KAAK,IAAI,MAAM,CAAC;EAC/E,MAAM,CAACO,YAAY,EAAEC,eAAe,CAAC,GAAGnE,QAAQ,CAAC,KAAK,CAAC;EAEvDC,SAAS,CAAC,MAAM;IACZ,IAAI0D,KAAK,EAAE;MACPM,sBAAsB,CAACN,KAAK,CAAC;IACjC;EACJ,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,MAAMS,aAAa,GAAGrE,WAAW,CAAC,CAACsE,GAAa,EAAEC,KAAc,KAAK;IACjE,OAAO,QAAQD,GAAG,CAACE,CAAC,KAAKF,GAAG,CAACG,CAAC,KAAKH,GAAG,CAACI,CAAC,KAAKH,KAAK,IAAID,GAAG,CAACK,CAAC,GAAG;EAClE,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,aAAa,GAAG5E,WAAW,CAC7B,CAAC0C,KAAiB,EAAEmC,KAA2B,KAAK;IAChDA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtB;IACA,MAAMC,WAAW,GAAGV,aAAa,CAAC3B,KAAK,CAAC4B,GAAG,EAAE5B,KAAK,CAAC4B,GAAG,CAACK,CAAC,KAAK,CAAC,GAAG,CAAC,GAAGjC,KAAK,CAAC4B,GAAG,CAACK,CAAC,CAAC;IACjFT,sBAAsB,CAACa,WAAW,CAAC;IACnC,IAAI,OAAOlB,QAAQ,KAAK,UAAU,EAAE;MAChCA,QAAQ,CAACkB,WAAW,CAAC;IACzB;EACJ,CAAC,EACD,CAAClB,QAAQ,CACb,CAAC;EAED,MAAMmB,qBAAqB,GAAGhF,WAAW,CACrC,CAAC;IAAEsE;EAAgB,CAAC,EAAEO,KAA2B,KAAK;IAClDA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtB,MAAMpC,KAAK,GAAG2B,aAAa,CAACC,GAAG,EAAEA,GAAG,CAACK,CAAC,KAAK,CAAC,GAAG,CAAC,GAAGL,GAAG,CAACK,CAAC,CAAC;IACzDT,sBAAsB,CAACxB,KAAK,CAAC;IAC7BoB,gBAAgB,CAACpB,KAAK,CAAC;EAC3B,CAAC,EACD,CAACoB,gBAAgB,CACrB,CAAC;EAED,MAAMmB,YAAY,GAAGjF,WAAW,CAAEkF,CAAiB,IAAK;IACpDA,CAAC,CAACC,eAAe,CAAC,CAAC;IACnBnB,aAAa,CAACoB,KAAK,IAAI,CAACA,KAAK,CAAC;EAClC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAM;IAAEC;EAAM,CAAC,GAAG5E,iBAAiB,CAAC,CAAC;EAErC,MAAM6E,WAAgC,GAAGnF,OAAO,CAAC,MAAM;IACnD,MAAMoF,MAAM,GAAGF,KAAK,EAAEnE,MAAM,EAAEqE,MAAM,IAAI,CAAC,CAAC;IAE1C,OAAOC,MAAM,CAACC,IAAI,CAACF,MAAM,CAAC,CAACG,MAAM,CAAC,CAACC,GAAG,EAAEC,GAAG,KAAK;MAC5C,OAAO;QAAE,GAAGD,GAAG;QAAE,CAACC,GAAG,GAAGL,MAAM,CAACK,GAAG;MAAE,CAAC;IACzC,CAAC,EAAE,CAAC,CAAC,CAAC;EACV,CAAC,EAAE,CAACP,KAAK,EAAEnE,MAAM,EAAEqE,MAAM,CAAC,CAAC;EAE3BrF,SAAS,CAAC,MAAM;IACZ,MAAMiE,YAAY,GAAGqB,MAAM,CAACC,IAAI,CAACH,WAAW,CAAC,CAACO,IAAI,CAACD,GAAG,IAAIN,WAAW,CAACM,GAAG,CAAC,KAAKhC,KAAK,CAAC;IACrFQ,eAAe,CAACD,YAAY,CAAC;EACjC,CAAC,EAAE,CAACmB,WAAW,EAAE1B,KAAK,CAAC,CAAC;EAExB,oBACI7D,KAAA,CAAA+F,aAAA,CAACpF,gBAAgB,QACZ8E,MAAM,CAACC,IAAI,CAACH,WAAW,CAAC,CAACnE,GAAG,CAAC,CAACyE,GAAG,EAAEG,KAAK,KAAK;IAC1C,MAAMrD,KAAK,GAAG4C,WAAW,CAACM,GAAG,CAAC;IAE9B,oBACI7F,KAAA,CAAA+F,aAAA,CAACxE,QAAQ;MAACsE,GAAG,EAAEG,KAAM;MAACC,SAAS,EAAEtD,KAAK,KAAKkB,KAAK,GAAG1C,MAAM,CAAC+B,aAAa,GAAG;IAAG,gBACzElD,KAAA,CAAA+F,aAAA,CAACxF,OAAO;MAAC0B,OAAO,eAAEjC,KAAA,CAAA+F,aAAA,eAAOpD,KAAY,CAAE;MAACuD,SAAS,EAAC;IAAQ,gBACtDlG,KAAA,CAAA+F,aAAA,CAACvE,KAAK;MACF2E,KAAK,EAAE;QAAE7C,eAAe,EAAEX;MAAM,CAAE;MAClCyD,OAAO,EAAEA,CAAA,KAAM;QACX;QACA;QACA,MAAMZ,MAAM,GAAGF,KAAK,EAAEnE,MAAM,EAAEqE,MAAM;QACpCzB,gBAAgB,CAACyB,MAAM,CAACK,GAAG,CAAC,EAAEA,GAAG,CAAC;MACtC;IAAE,CACL,CACI,CACH,CAAC;EAEnB,CAAC,CAAC,eAEF7F,KAAA,CAAA+F,aAAA,CAACxE,QAAQ;IAAC0E,SAAS,EAAEpC,KAAK,IAAI,CAACO,YAAY,GAAGjD,MAAM,CAAC+B,aAAa,GAAG;EAAG,gBACpElD,KAAA,CAAA+F,aAAA,CAACxF,OAAO;IAAC0B,OAAO,eAAEjC,KAAA,CAAA+F,aAAA,eAAM,cAAkB,CAAE;IAACG,SAAS,EAAC;EAAQ,gBAC3DlG,KAAA,CAAA+F,aAAA,CAACvE,KAAK;IACF2E,KAAK,EAAE;MAAE7C,eAAe,EAAEc,YAAY,GAAG,MAAM,GAAGP;IAAM,CAAE;IAC1DuC,OAAO,EAAElB;EAAa,gBAEtBlF,KAAA,CAAA+F,aAAA,CAACtF,WAAW;IAACwF,SAAS,EAAExD;EAAiB,CAAE,CACxC,CACF,CACH,CAAC,eAEXzC,KAAA,CAAA+F,aAAA;IAAKI,KAAK,EAAEnC,UAAU,GAAGN,eAAe,GAAGC;EAAgB,gBACvD3D,KAAA,CAAA+F,aAAA,CAACzF,YAAY;IACT2F,SAAS,EAAEzC,iBAAkB;IAC7Bb,KAAK,EAAEuB,mBAAoB;IAC3BmC,YAAY,EAAE,IAAK;IACnBvC,QAAQ,EAAEe,aAAiC;IAC3Cd,gBAAgB,EAAEkB;EAAyC,CAC9D,CACA,CACS,CAAC;AAE3B,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="utf-8"?>
|
|
2
|
+
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
|
3
|
+
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px"
|
|
4
|
+
height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
|
|
5
|
+
<g id="Bounding_Boxes">
|
|
6
|
+
<g id="ui_x5F_spec_x5F_header_copy_3">
|
|
7
|
+
</g>
|
|
8
|
+
<rect fill="none" width="24" height="24"/>
|
|
9
|
+
</g>
|
|
10
|
+
<g id="Rounded">
|
|
11
|
+
<g id="ui_x5F_spec_x5F_header_copy_7">
|
|
12
|
+
</g>
|
|
13
|
+
<path fill="currentColor" d="M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9c0.83,0,1.5-0.67,1.5-1.5c0-0.39-0.15-0.74-0.39-1.01c-0.23-0.26-0.38-0.61-0.38-0.99
|
|
14
|
+
c0-0.83,0.67-1.5,1.5-1.5H16c2.76,0,5-2.24,5-5C21,6.58,16.97,3,12,3z M6.5,12C5.67,12,5,11.33,5,10.5S5.67,9,6.5,9S8,9.67,8,10.5
|
|
15
|
+
S7.33,12,6.5,12z M9.5,8C8.67,8,8,7.33,8,6.5S8.67,5,9.5,5S11,5.67,11,6.5S10.33,8,9.5,8z M14.5,8C13.67,8,13,7.33,13,6.5
|
|
16
|
+
S13.67,5,14.5,5S16,5.67,16,6.5S15.33,8,14.5,8z M17.5,12c-0.83,0-1.5-0.67-1.5-1.5S16.67,9,17.5,9S19,9.67,19,10.5
|
|
17
|
+
S18.33,12,17.5,12z"/>
|
|
18
|
+
</g>
|
|
19
|
+
</svg>
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
<svg width="22" height="20" viewBox="0 0 22 20" fill="none"
|
|
2
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
3
|
+
<rect x="0.5" y="0.889587" width="20.8636" height="18.5455" rx="1" fill="white" stroke="#DDDDDD"/>
|
|
4
|
+
<mask id="mask0" maskUnits="userSpaceOnUse" x="0" y="0" width="22" height="20" style="{ mask-type:alpha; }">
|
|
5
|
+
<rect x="0.5" y="0.889587" width="20.8636" height="18.5455" rx="1" fill="white" stroke="white"/>
|
|
6
|
+
</mask>
|
|
7
|
+
<g mask="url(#mask0)">
|
|
8
|
+
<path d="M20.9999 1.41229L0.999878 18.4123" stroke="#BF0000" stroke-linecap="round" stroke-linejoin="round"/>
|
|
9
|
+
</g>
|
|
10
|
+
</svg>
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { useFontColorPicker, DropDown } from "@webiny/lexical-editor";
|
|
3
|
+
import { LexicalColorPicker } from "./LexicalColorPicker/LexicalColorPicker";
|
|
4
|
+
import { css } from "emotion";
|
|
5
|
+
export const LexicalColorPickerDropdown = () => {
|
|
6
|
+
const {
|
|
7
|
+
value,
|
|
8
|
+
applyColor
|
|
9
|
+
} = useFontColorPicker();
|
|
10
|
+
const buttonColorSelection = css({
|
|
11
|
+
borderBottom: "3px solid " + value
|
|
12
|
+
});
|
|
13
|
+
return /*#__PURE__*/React.createElement(DropDown, {
|
|
14
|
+
buttonClassName: "toolbar-item color-picker",
|
|
15
|
+
buttonAriaLabel: "Formatting options for text color",
|
|
16
|
+
buttonIconClassName: "icon font-color " + buttonColorSelection,
|
|
17
|
+
stopCloseOnClickSelf: true,
|
|
18
|
+
disabled: false,
|
|
19
|
+
showScroll: false
|
|
20
|
+
}, /*#__PURE__*/React.createElement(LexicalColorPicker, {
|
|
21
|
+
value: value,
|
|
22
|
+
onChangeComplete: applyColor
|
|
23
|
+
}));
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
//# sourceMappingURL=LexicalColorPickerDropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useFontColorPicker","DropDown","LexicalColorPicker","css","LexicalColorPickerDropdown","value","applyColor","buttonColorSelection","borderBottom","createElement","buttonClassName","buttonAriaLabel","buttonIconClassName","stopCloseOnClickSelf","disabled","showScroll","onChangeComplete"],"sources":["LexicalColorPickerDropdown.tsx"],"sourcesContent":["import React from \"react\";\nimport { useFontColorPicker, DropDown } from \"@webiny/lexical-editor\";\nimport { LexicalColorPicker } from \"~/components/LexicalColorPicker/LexicalColorPicker\";\nimport { css } from \"emotion\";\n\nexport const LexicalColorPickerDropdown = () => {\n const { value, applyColor } = useFontColorPicker();\n\n const buttonColorSelection = css({\n borderBottom: \"3px solid \" + value\n });\n\n return (\n <DropDown\n buttonClassName=\"toolbar-item color-picker\"\n buttonAriaLabel={\"Formatting options for text color\"}\n buttonIconClassName={\"icon font-color \" + buttonColorSelection}\n stopCloseOnClickSelf={true}\n disabled={false}\n showScroll={false}\n >\n <LexicalColorPicker value={value} onChangeComplete={applyColor} />\n </DropDown>\n );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,kBAAkB,EAAEC,QAAQ,QAAQ,wBAAwB;AACrE,SAASC,kBAAkB;AAC3B,SAASC,GAAG,QAAQ,SAAS;AAE7B,OAAO,MAAMC,0BAA0B,GAAGA,CAAA,KAAM;EAC5C,MAAM;IAAEC,KAAK;IAAEC;EAAW,CAAC,GAAGN,kBAAkB,CAAC,CAAC;EAElD,MAAMO,oBAAoB,GAAGJ,GAAG,CAAC;IAC7BK,YAAY,EAAE,YAAY,GAAGH;EACjC,CAAC,CAAC;EAEF,oBACIN,KAAA,CAAAU,aAAA,CAACR,QAAQ;IACLS,eAAe,EAAC,2BAA2B;IAC3CC,eAAe,EAAE,mCAAoC;IACrDC,mBAAmB,EAAE,kBAAkB,GAAGL,oBAAqB;IAC/DM,oBAAoB,EAAE,IAAK;IAC3BC,QAAQ,EAAE,KAAM;IAChBC,UAAU,EAAE;EAAM,gBAElBhB,KAAA,CAAAU,aAAA,CAACP,kBAAkB;IAACG,KAAK,EAAEA,KAAM;IAACW,gBAAgB,EAAEV;EAAW,CAAE,CAC3D,CAAC;AAEnB,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { $isParentElementRTL } from "@lexical/selection";
|
|
3
|
+
import { Divider, DropDown, DropDownItem, useTextAlignmentAction } from "@webiny/lexical-editor";
|
|
4
|
+
import { useDeriveValueFromSelection } from "@webiny/lexical-editor/hooks/useCurrentSelection";
|
|
5
|
+
export const TextAlignmentDropdown = () => {
|
|
6
|
+
const {
|
|
7
|
+
applyTextAlignment,
|
|
8
|
+
outdentText,
|
|
9
|
+
indentText
|
|
10
|
+
} = useTextAlignmentAction();
|
|
11
|
+
const isRTL = useDeriveValueFromSelection(({
|
|
12
|
+
rangeSelection
|
|
13
|
+
}) => {
|
|
14
|
+
return rangeSelection ? $isParentElementRTL(rangeSelection) : false;
|
|
15
|
+
});
|
|
16
|
+
return /*#__PURE__*/React.createElement(DropDown, {
|
|
17
|
+
buttonLabel: "Align",
|
|
18
|
+
buttonIconClassName: "icon left-align",
|
|
19
|
+
buttonClassName: "toolbar-item spaced alignment",
|
|
20
|
+
buttonAriaLabel: "Formatting options for text alignment"
|
|
21
|
+
}, /*#__PURE__*/React.createElement(DropDownItem, {
|
|
22
|
+
onClick: () => {
|
|
23
|
+
applyTextAlignment("left");
|
|
24
|
+
},
|
|
25
|
+
className: "item"
|
|
26
|
+
}, /*#__PURE__*/React.createElement("i", {
|
|
27
|
+
className: "icon left-align"
|
|
28
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
29
|
+
className: "text"
|
|
30
|
+
}, "Left Align")), /*#__PURE__*/React.createElement(DropDownItem, {
|
|
31
|
+
onClick: () => {
|
|
32
|
+
applyTextAlignment("center");
|
|
33
|
+
},
|
|
34
|
+
className: "item"
|
|
35
|
+
}, /*#__PURE__*/React.createElement("i", {
|
|
36
|
+
className: "icon center-align"
|
|
37
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
38
|
+
className: "text"
|
|
39
|
+
}, "Center Align")), /*#__PURE__*/React.createElement(DropDownItem, {
|
|
40
|
+
onClick: () => {
|
|
41
|
+
applyTextAlignment("right");
|
|
42
|
+
},
|
|
43
|
+
className: "item"
|
|
44
|
+
}, /*#__PURE__*/React.createElement("i", {
|
|
45
|
+
className: "icon right-align"
|
|
46
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
47
|
+
className: "text"
|
|
48
|
+
}, "Right Align")), /*#__PURE__*/React.createElement(DropDownItem, {
|
|
49
|
+
onClick: () => {
|
|
50
|
+
applyTextAlignment("justify");
|
|
51
|
+
},
|
|
52
|
+
className: "item"
|
|
53
|
+
}, /*#__PURE__*/React.createElement("i", {
|
|
54
|
+
className: "icon justify-align"
|
|
55
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
56
|
+
className: "text"
|
|
57
|
+
}, "Justify Align")), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(DropDownItem, {
|
|
58
|
+
onClick: () => {
|
|
59
|
+
outdentText();
|
|
60
|
+
},
|
|
61
|
+
className: "item"
|
|
62
|
+
}, /*#__PURE__*/React.createElement("i", {
|
|
63
|
+
className: "icon " + (isRTL ? "indent" : "outdent")
|
|
64
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
65
|
+
className: "text"
|
|
66
|
+
}, "Outdent")), /*#__PURE__*/React.createElement(DropDownItem, {
|
|
67
|
+
onClick: () => {
|
|
68
|
+
indentText();
|
|
69
|
+
},
|
|
70
|
+
className: "item"
|
|
71
|
+
}, /*#__PURE__*/React.createElement("i", {
|
|
72
|
+
className: "icon " + (isRTL ? "outdent" : "indent")
|
|
73
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
74
|
+
className: "text"
|
|
75
|
+
}, "Indent")));
|
|
76
|
+
};
|
|
77
|
+
|
|
78
|
+
//# sourceMappingURL=TextAlignmentDropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","$isParentElementRTL","Divider","DropDown","DropDownItem","useTextAlignmentAction","useDeriveValueFromSelection","TextAlignmentDropdown","applyTextAlignment","outdentText","indentText","isRTL","rangeSelection","createElement","buttonLabel","buttonIconClassName","buttonClassName","buttonAriaLabel","onClick","className"],"sources":["TextAlignmentDropdown.tsx"],"sourcesContent":["import React from \"react\";\nimport { $isParentElementRTL } from \"@lexical/selection\";\nimport { Divider, DropDown, DropDownItem, useTextAlignmentAction } from \"@webiny/lexical-editor\";\nimport { useDeriveValueFromSelection } from \"@webiny/lexical-editor/hooks/useCurrentSelection\";\n\nexport const TextAlignmentDropdown = () => {\n const { applyTextAlignment, outdentText, indentText } = useTextAlignmentAction();\n\n const isRTL = useDeriveValueFromSelection(({ rangeSelection }) => {\n return rangeSelection ? $isParentElementRTL(rangeSelection) : false;\n });\n\n return (\n <DropDown\n buttonLabel=\"Align\"\n buttonIconClassName=\"icon left-align\"\n buttonClassName=\"toolbar-item spaced alignment\"\n buttonAriaLabel=\"Formatting options for text alignment\"\n >\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"left\");\n }}\n className=\"item\"\n >\n <i className=\"icon left-align\" />\n <span className=\"text\">Left Align</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"center\");\n }}\n className=\"item\"\n >\n <i className=\"icon center-align\" />\n <span className=\"text\">Center Align</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"right\");\n }}\n className=\"item\"\n >\n <i className=\"icon right-align\" />\n <span className=\"text\">Right Align</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n applyTextAlignment(\"justify\");\n }}\n className=\"item\"\n >\n <i className=\"icon justify-align\" />\n <span className=\"text\">Justify Align</span>\n </DropDownItem>\n <Divider />\n <DropDownItem\n onClick={() => {\n outdentText();\n }}\n className=\"item\"\n >\n <i className={\"icon \" + (isRTL ? \"indent\" : \"outdent\")} />\n <span className=\"text\">Outdent</span>\n </DropDownItem>\n <DropDownItem\n onClick={() => {\n indentText();\n }}\n className=\"item\"\n >\n <i className={\"icon \" + (isRTL ? \"outdent\" : \"indent\")} />\n <span className=\"text\">Indent</span>\n </DropDownItem>\n </DropDown>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
package/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { LexicalEditorActions } from "./LexicalEditorActions";
|
package/index.js
ADDED
package/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["LexicalEditorActions"],"sources":["index.ts"],"sourcesContent":["export { LexicalEditorActions } from \"~/LexicalEditorActions\";\n"],"mappings":"AAAA,SAASA,oBAAoB","ignoreList":[]}
|
package/package.json
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@webiny/lexical-editor-actions",
|
|
3
|
+
"version": "0.0.0-unstable.06b2ede40f",
|
|
4
|
+
"dependencies": {
|
|
5
|
+
"@emotion/styled": "11.10.6",
|
|
6
|
+
"@lexical/selection": "0.23.1",
|
|
7
|
+
"@webiny/lexical-editor": "0.0.0-unstable.06b2ede40f",
|
|
8
|
+
"@webiny/ui": "0.0.0-unstable.06b2ede40f",
|
|
9
|
+
"emotion": "10.0.27",
|
|
10
|
+
"react": "18.2.0",
|
|
11
|
+
"react-color": "2.19.3",
|
|
12
|
+
"react-dom": "18.2.0"
|
|
13
|
+
},
|
|
14
|
+
"devDependencies": {
|
|
15
|
+
"@types/react-color": "2.17.11",
|
|
16
|
+
"@webiny/project-utils": "0.0.0-unstable.06b2ede40f"
|
|
17
|
+
},
|
|
18
|
+
"publishConfig": {
|
|
19
|
+
"access": "public",
|
|
20
|
+
"directory": "dist"
|
|
21
|
+
},
|
|
22
|
+
"scripts": {
|
|
23
|
+
"build": "node ../cli/bin.js run build",
|
|
24
|
+
"watch": "node ../cli/bin.js run watch"
|
|
25
|
+
},
|
|
26
|
+
"gitHead": "06b2ede40fc2212a70eeafd74afd50b56fb0ce82"
|
|
27
|
+
}
|