npm - @finsemble/finsemble-ui - Versions diffs - 6.3.1 → 6.3.2 - Mend

@finsemble/finsemble-ui 6.3.1 → 6.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (544) hide show

package/react/components/common/ColorPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../src/components/common/ColorPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from \"react\";\r\nimport \"./css/color-picker.css\";\r\n\r\nconst RE_HEX_COLOR = /^#[0-9a-f]{6}$/i;\r\n\r\nexport enum RGBA_CHANNEL {\r\n\tRED = 0,\r\n\tGREEN = 1,\r\n\tBLUE = 2,\r\n\tALPHA = 3,\r\n}\r\n\r\n// From https://stackoverflow.com/a/24390910\r\nexport function colorToRGBA(color: string) {\r\n\t// Returns the color as an array of [r, g, b, a] -- all range from 0 - 255\r\n\t// color must be a valid canvas fillStyle. This will cover most anything\r\n\t// you'd want to use.\r\n\t// Examples:\r\n\t// colorToRGBA('red') # [255, 0, 0, 255]\r\n\t// colorToRGBA('#f00') # [255, 0, 0, 255]\r\n\tconst cvs = document.createElement(\"canvas\");\r\n\tcvs.height = 1;\r\n\tcvs.width = 1;\r\n\r\n\tconst ctx = cvs.getContext(\"2d\")!;\r\n\tctx.fillStyle = color;\r\n\tctx.fillRect(0, 0, 1, 1);\r\n\treturn ctx.getImageData(0, 0, 1, 1).data;\r\n}\r\n\r\nfunction byteToHex(num: number) {\r\n\t// Turns a number (0-255) into a 2-character hex number (00-ff)\r\n\treturn `0${num.toString(16)}`.slice(-2);\r\n}\r\n\r\nfunction colorToHex(color: string) {\r\n\t// Convert any CSS color to a hex representation\r\n\t// Examples:\r\n\t// colorToHex('red') # '#ff0000'\r\n\t// colorToHex('rgb(255, 0, 0)') # '#ff0000'\r\n\t// colorToHex('#ff0000') # '#ff0000'\r\n\tif (color.match(RE_HEX_COLOR) !== null) {\r\n\t\treturn color;\r\n\t}\r\n\tconst rgba = colorToRGBA(color);\r\n\tconst hex = [0, 1, 2].map((idx) => byteToHex(rgba[idx])).join(\"\");\r\n\treturn `#${hex}`;\r\n}\r\n\r\nexport interface ColorPickerProps {\r\n\tstartColor: string;\r\n\tupdateColor: (newColor: string) => void;\r\n\tid?: string;\r\n}\r\n\r\n/*\r\n ColorPicker component to update theme variables. Displays a browser color input alongside a text version for hex color values.\r\n \r\n @param {{ [id]: string, startColor: string; updateColor: function }} { id, startColor, callback }\r\n */\r\nexport const ColorPicker = ({ id, startColor, updateColor }: ColorPickerProps) => {\r\n\tconst [color, setColor] = useState(colorToHex(startColor));\r\n\tconst isValid = color.match(RE_HEX_COLOR) !== null;\r\n\r\n\tuseEffect(() => {\r\n\t\tif (isValid) {\r\n\t\t\tupdateColor(color);\r\n\t\t}\r\n\t}, [color]);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (startColor) {\r\n\t\t\tsetColor(startColor);\r\n\t\t}\r\n\t}, [startColor]);\r\n\r\n\tconst onColorChanged = ({ target }: { target: HTMLInputElement }) => {\r\n\t\tsetColor(target.value);\r\n\t};\r\n\r\n\treturn (\r\n\t\t<div className=\"color-picker\">\r\n\t\t\t<input\r\n\t\t\t\tclassName=\"theme-color-picker\"\r\n\t\t\t\ttype=\"color\"\r\n\t\t\t\tvalue={color}\r\n\t\t\t\tonChange={onColorChanged}\r\n\t\t\t\taria-hidden=\"true\"\r\n\t\t\t></input>\r\n\t\t\t<input\r\n\t\t\t\tclassName=\"theme-color-picker-text\"\r\n\t\t\t\ttype=\"text\"\r\n\t\t\t\taria-invalid={!isValid}\r\n\t\t\t\tvalue={color}\r\n\t\t\t\tonChange={onColorChanged}\r\n\t\t\t\t{...{ id }}\r\n\t\t\t></input>\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../src/components/common/ColorPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport \"./css/color-picker.css\";\n\nconst RE_HEX_COLOR = /^#[0-9a-f]{6}$/i;\n\nexport enum RGBA_CHANNEL {\n\tRED = 0,\n\tGREEN = 1,\n\tBLUE = 2,\n\tALPHA = 3,\n}\n\n// From https://stackoverflow.com/a/24390910\nexport function colorToRGBA(color: string) {\n\t// Returns the color as an array of [r, g, b, a] -- all range from 0 - 255\n\t// color must be a valid canvas fillStyle. This will cover most anything\n\t// you'd want to use.\n\t// Examples:\n\t// colorToRGBA('red') # [255, 0, 0, 255]\n\t// colorToRGBA('#f00') # [255, 0, 0, 255]\n\tconst cvs = document.createElement(\"canvas\");\n\tcvs.height = 1;\n\tcvs.width = 1;\n\n\tconst ctx = cvs.getContext(\"2d\")!;\n\tctx.fillStyle = color;\n\tctx.fillRect(0, 0, 1, 1);\n\treturn ctx.getImageData(0, 0, 1, 1).data;\n}\n\nfunction byteToHex(num: number) {\n\t// Turns a number (0-255) into a 2-character hex number (00-ff)\n\treturn `0${num.toString(16)}`.slice(-2);\n}\n\nfunction colorToHex(color: string) {\n\t// Convert any CSS color to a hex representation\n\t// Examples:\n\t// colorToHex('red') # '#ff0000'\n\t// colorToHex('rgb(255, 0, 0)') # '#ff0000'\n\t// colorToHex('#ff0000') # '#ff0000'\n\tif (color.match(RE_HEX_COLOR) !== null) {\n\t\treturn color;\n\t}\n\tconst rgba = colorToRGBA(color);\n\tconst hex = [0, 1, 2].map((idx) => byteToHex(rgba[idx])).join(\"\");\n\treturn `#${hex}`;\n}\n\nexport interface ColorPickerProps {\n\tstartColor: string;\n\tupdateColor: (newColor: string) => void;\n\tid?: string;\n}\n\n/*\n ColorPicker component to update theme variables. Displays a browser color input alongside a text version for hex color values.\n \n @param {{ [id]: string, startColor: string; updateColor: function }} { id, startColor, callback }\n */\nexport const ColorPicker = ({ id, startColor, updateColor }: ColorPickerProps) => {\n\tconst [color, setColor] = useState(colorToHex(startColor));\n\tconst isValid = color.match(RE_HEX_COLOR) !== null;\n\n\tuseEffect(() => {\n\t\tif (isValid) {\n\t\t\tupdateColor(color);\n\t\t}\n\t}, [color]);\n\n\tuseEffect(() => {\n\t\tif (startColor) {\n\t\t\tsetColor(startColor);\n\t\t}\n\t}, [startColor]);\n\n\tconst onColorChanged = ({ target }: { target: HTMLInputElement }) => {\n\t\tsetColor(target.value);\n\t};\n\n\treturn (\n\t\t<div className=\"color-picker\">\n\t\t\t<input\n\t\t\t\tclassName=\"theme-color-picker\"\n\t\t\t\ttype=\"color\"\n\t\t\t\tvalue={color}\n\t\t\t\tonChange={onColorChanged}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t></input>\n\t\t\t<input\n\t\t\t\tclassName=\"theme-color-picker-text\"\n\t\t\t\ttype=\"text\"\n\t\t\t\taria-invalid={!isValid}\n\t\t\t\tvalue={color}\n\t\t\t\tonChange={onColorChanged}\n\t\t\t\t{...{ id }}\n\t\t\t></input>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/common/DropZone.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropZone.js","sourceRoot":"","sources":["../../../src/components/common/DropZone.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,qBAAqB,CAAC;AAsB7B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,GAAG,KAAK,EAAiB,EAAE,EAAE;IACtF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjD,MAAM,eAAe,GAAG,CAAC,CAA0D,EAAE,EAAE;QACtF,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;IACrB,CAAC,CAAC;IAIF,IAAI,SAAS,EAAE;QAId,IAAI,OAAO,GAA0B,IAAI,CAAC;QAC1C,QAAQ,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC,CAAC,EAAE,EAAE;YAC3C,eAAe,CAAC,CAAC,CAAC,CAAC;YACnB,YAAY,CAAC,IAAI,CAAC,CAAC;YAGnB,IAAI,OAAO,KAAK,IAAI,EAAE;gBACrB,YAAY,CAAC,OAAO,CAAC,CAAC;aACtB;YAGD,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBAEzB,YAAY,CAAC,KAAK,CAAC,CAAC;YACrB,CAAC,EAAE,GAAG,CAAC,CAAC;QAET,CAAC,CAAC,CAAC;QACH,YAAY,CAAC,KAAK,CAAC,CAAC;KACpB;IAED,OAAO,QAAQ,CAAC,CAAC,CAAC,CACjB,0CAAG,QAAQ,CAAI,CACf,CAAC,CAAC,CAAC,CACH,6BACC,SAAS,EAAE,YAAY,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE,EACnF,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,eAAe,CAAC,CAAC,CAAC,CAAC;YACnB,aAAa,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,eAAe,CAAC,CAAC,CAAC,CAAC;YACnB,aAAa,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,EACD,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACb,aAAa,CAAC,KAAK,CAAC,CAAC;YAErB,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,YAAY,CAAC;YACjC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBACtC,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE;oBACtB,SAAS;iBACT;gBACD,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;aACzB;YAED,eAAe,CAAC,CAAC,CAAC,CAAC;QACpB,CAAC,IAEA,QAAQ,CACJ,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useState } from \"react\";\r\nimport \"./css/drop-zone.css\";\r\n\r\n// Electron adds File.path\r\nexport type FileWithPath = File & { path?: string };\r\n\r\nexport type DropZoneProps = {\r\n\tchildren: React.ReactNode;\r\n\tprocessFile: (fileObj: FileWithPath, index: number) => void;\r\n\tsuppress?: boolean;\r\n};\r\n\r\n/**\r\n Component that serves as a drop zone. It also keeps track of visual concerns and event handlers for\r\n * drag-and-drop.\r\n \r\n The DropZone component is intended to be a container element for other elements, such as text, lists,\r\n * images, input elements, etc.\r\n \r\n @callback processFile - This function will be called for each file that is dropped in the dropzone.\r\n * @param {ReactNode} children - React will fill this in.\r\n * @param {boolean} suppress=false - If the dropzone-ness should be suppressed, which would turn this container into just a div\r\n */\r\nexport const DropZone = ({ processFile, children, suppress = false }: DropZoneProps) => {\r\n\tconst [isDragging, setIsDragging] = useState(false);\r\n\tconst [potential, setPotential] = useState(false);\r\n\tconst [singleton, setSingleton] = useState(true);\r\n\r\n\tconst preventDefaults = (e: { preventDefault: Function; stopPropagation: Function }) => {\r\n\t\te.preventDefault();\r\n\t\te.stopPropagation();\r\n\t};\r\n\r\n\t// Check if something is being dragged somewhere on the page\r\n\t// If dragging is happening on the page, there will be a visual indication for potential drop zone\r\n\tif (singleton) {\r\n\t\t// \"dragenter\" and \"dragleave\" events are fired off of every single child element, and counting them isn't reliable\r\n\t\t// so, when \"dragover\" events are fired, we know dragging is happening.\r\n\t\t// we will wait 100ms after the last \"dragover\" event is fired, and then turn off the potential zone.\r\n\t\tlet timeout: NodeJS.Timeout \| null = null;\r\n\t\tdocument.addEventListener(\"dragover\", (e) => {\r\n\t\t\tpreventDefaults(e);\r\n\t\t\tsetPotential(true);\r\n\r\n\t\t\t// If timeout was previously set, clear it\r\n\t\t\tif (timeout !== null) {\r\n\t\t\t\tclearTimeout(timeout);\r\n\t\t\t}\r\n\r\n\t\t\t// Set a new timeout, now that we've gotten a new dragover event\r\n\t\t\ttimeout = setTimeout(() => {\r\n\t\t\t\t// If it's been 100ms and no dragover event has been fired, assume the user isn't dragging anymore.\r\n\t\t\t\tsetPotential(false);\r\n\t\t\t}, 100); // 100ms was chosen by trial and error.\r\n\t\t\t// 10ms was too little time, and caused flicker. 100ms doesn't have a flicker, and turns off potential without a noticeable delay\r\n\t\t});\r\n\t\tsetSingleton(false);\r\n\t}\r\n\r\n\treturn suppress ? (\r\n\t\t<>{children}</>\r\n\t) : (\r\n\t\t<div\r\n\t\t\tclassName={`dropZone ${isDragging ? \"isDragging\" : potential ? \"isPotential\" : \"\"}`}\r\n\t\t\tonDragEnter={(e) => {\r\n\t\t\t\tpreventDefaults(e);\r\n\t\t\t\tsetIsDragging(true);\r\n\t\t\t}}\r\n\t\t\tonDragLeave={(e) => {\r\n\t\t\t\tpreventDefaults(e);\r\n\t\t\t\tsetIsDragging(false);\r\n\t\t\t}}\r\n\t\t\tonDrop={(e) => {\r\n\t\t\t\tsetIsDragging(false);\r\n\r\n\t\t\t\tconst { files } = e.dataTransfer;\r\n\t\t\t\tfor (let i = 0; i < files.length; i++) {\r\n\t\t\t\t\tif (files[i] === null) {\r\n\t\t\t\t\t\tcontinue;\r\n\t\t\t\t\t}\r\n\t\t\t\t\tprocessFile(files[i], i);\r\n\t\t\t\t}\r\n\r\n\t\t\t\tpreventDefaults(e);\r\n\t\t\t}}\r\n\t\t>\r\n\t\t\t{children}\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"DropZone.js","sourceRoot":"","sources":["../../../src/components/common/DropZone.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,qBAAqB,CAAC;AAsB7B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,GAAG,KAAK,EAAiB,EAAE,EAAE;IACtF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjD,MAAM,eAAe,GAAG,CAAC,CAA0D,EAAE,EAAE;QACtF,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;IACrB,CAAC,CAAC;IAIF,IAAI,SAAS,EAAE;QAId,IAAI,OAAO,GAA0B,IAAI,CAAC;QAC1C,QAAQ,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC,CAAC,EAAE,EAAE;YAC3C,eAAe,CAAC,CAAC,CAAC,CAAC;YACnB,YAAY,CAAC,IAAI,CAAC,CAAC;YAGnB,IAAI,OAAO,KAAK,IAAI,EAAE;gBACrB,YAAY,CAAC,OAAO,CAAC,CAAC;aACtB;YAGD,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBAEzB,YAAY,CAAC,KAAK,CAAC,CAAC;YACrB,CAAC,EAAE,GAAG,CAAC,CAAC;QAET,CAAC,CAAC,CAAC;QACH,YAAY,CAAC,KAAK,CAAC,CAAC;KACpB;IAED,OAAO,QAAQ,CAAC,CAAC,CAAC,CACjB,0CAAG,QAAQ,CAAI,CACf,CAAC,CAAC,CAAC,CACH,6BACC,SAAS,EAAE,YAAY,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE,EACnF,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,eAAe,CAAC,CAAC,CAAC,CAAC;YACnB,aAAa,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC,EACD,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,eAAe,CAAC,CAAC,CAAC,CAAC;YACnB,aAAa,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,EACD,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACb,aAAa,CAAC,KAAK,CAAC,CAAC;YAErB,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,YAAY,CAAC;YACjC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBACtC,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE;oBACtB,SAAS;iBACT;gBACD,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;aACzB;YAED,eAAe,CAAC,CAAC,CAAC,CAAC;QACpB,CAAC,IAEA,QAAQ,CACJ,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useState } from \"react\";\nimport \"./css/drop-zone.css\";\n\n// Electron adds File.path\nexport type FileWithPath = File & { path?: string };\n\nexport type DropZoneProps = {\n\tchildren: React.ReactNode;\n\tprocessFile: (fileObj: FileWithPath, index: number) => void;\n\tsuppress?: boolean;\n};\n\n/**\n Component that serves as a drop zone. It also keeps track of visual concerns and event handlers for\n * drag-and-drop.\n \n The DropZone component is intended to be a container element for other elements, such as text, lists,\n * images, input elements, etc.\n \n @callback processFile - This function will be called for each file that is dropped in the dropzone.\n * @param {ReactNode} children - React will fill this in.\n * @param {boolean} suppress=false - If the dropzone-ness should be suppressed, which would turn this container into just a div\n */\nexport const DropZone = ({ processFile, children, suppress = false }: DropZoneProps) => {\n\tconst [isDragging, setIsDragging] = useState(false);\n\tconst [potential, setPotential] = useState(false);\n\tconst [singleton, setSingleton] = useState(true);\n\n\tconst preventDefaults = (e: { preventDefault: Function; stopPropagation: Function }) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t};\n\n\t// Check if something is being dragged somewhere on the page\n\t// If dragging is happening on the page, there will be a visual indication for potential drop zone\n\tif (singleton) {\n\t\t// \"dragenter\" and \"dragleave\" events are fired off of every single child element, and counting them isn't reliable\n\t\t// so, when \"dragover\" events are fired, we know dragging is happening.\n\t\t// we will wait 100ms after the last \"dragover\" event is fired, and then turn off the potential zone.\n\t\tlet timeout: NodeJS.Timeout \| null = null;\n\t\tdocument.addEventListener(\"dragover\", (e) => {\n\t\t\tpreventDefaults(e);\n\t\t\tsetPotential(true);\n\n\t\t\t// If timeout was previously set, clear it\n\t\t\tif (timeout !== null) {\n\t\t\t\tclearTimeout(timeout);\n\t\t\t}\n\n\t\t\t// Set a new timeout, now that we've gotten a new dragover event\n\t\t\ttimeout = setTimeout(() => {\n\t\t\t\t// If it's been 100ms and no dragover event has been fired, assume the user isn't dragging anymore.\n\t\t\t\tsetPotential(false);\n\t\t\t}, 100); // 100ms was chosen by trial and error.\n\t\t\t// 10ms was too little time, and caused flicker. 100ms doesn't have a flicker, and turns off potential without a noticeable delay\n\t\t});\n\t\tsetSingleton(false);\n\t}\n\n\treturn suppress ? (\n\t\t<>{children}</>\n\t) : (\n\t\t<div\n\t\t\tclassName={`dropZone ${isDragging ? \"isDragging\" : potential ? \"isPotential\" : \"\"}`}\n\t\t\tonDragEnter={(e) => {\n\t\t\t\tpreventDefaults(e);\n\t\t\t\tsetIsDragging(true);\n\t\t\t}}\n\t\t\tonDragLeave={(e) => {\n\t\t\t\tpreventDefaults(e);\n\t\t\t\tsetIsDragging(false);\n\t\t\t}}\n\t\t\tonDrop={(e) => {\n\t\t\t\tsetIsDragging(false);\n\n\t\t\t\tconst { files } = e.dataTransfer;\n\t\t\t\tfor (let i = 0; i < files.length; i++) {\n\t\t\t\t\tif (files[i] === null) {\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\t\t\t\t\tprocessFile(files[i], i);\n\t\t\t\t}\n\n\t\t\t\tpreventDefaults(e);\n\t\t\t}}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n"]}

package/react/components/common/DropdownButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropdownButton.js","sourceRoot":"","sources":["../../../src/components/common/DropdownButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,6BAA6B,CAAC;AACrC,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAS9E,MAAM,cAAc,GAAiE,CAAC,EACrF,WAAW,GAAG,OAAO,EACrB,aAAa,GAAG,EAAE,EAClB,UAAU,GAC2B,EAAE,EAAE;IACzC,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,uBAAuB,CAAC,UAAU,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;IAE9D,MAAM,OAAO,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CACpD,6BACC,GAAG,EAAE,KAAK,EACV,SAAS,EAAC,uCAAuC,EACjD,OAAO,EAAE,GAAG,EAAE;YACb,MAAM,CAAC,YAAY,EAAE,CAAC;YACtB,WAAW,CAAC,KAAK,CAAC,CAAC;QACpB,CAAC,IAEA,MAAM,CAAC,WAAW,CACd,CACN,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,GAAG,EAAE;QACzB,IAAI,QAAQ,EAAE;YACb,WAAW,CAAC,KAAK,CAAC,CAAC;YACnB,OAAO;SACP;QAED,IAAI,UAAU,EAAE;YACf,UAAU,EAAE,CAAC;SACb;aAAM;YACN,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC;SAC7B;IACF,CAAC,CAAC;IAEF,OAAO,CACN,6BAAK,GAAG,EAAE,UAAU,EAAE,SAAS,EAAC,0CAA0C;QACzE,6BAAK,SAAS,EAAC,gCAAgC;YAC9C,8BAAM,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,YAAY,IAC/C,WAAW,CACN;YACP,8BAAM,SAAS,EAAC,WAAW,GAAQ;YACnC,6BAAK,SAAS,EAAC,gBAAgB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC;gBACpE,8BAAM,SAAS,EAAC,OAAO,GAAQ,CAC1B,CACD;QACL,QAAQ,CAAC,CAAC,CAAC,6BAAK,SAAS,EAAC,wCAAwC,IAAE,OAAO,CAAO,CAAC,CAAC,CAAC,IAAI,CACrF,CACN,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import React, { useState, useRef } from \"react\";\r\nimport \"../../assets/css/button.css\";\r\nimport { useOutsideClickDetector } from \"../../hooks/useOutsideClickDetector\";\r\nimport { IFinsembleButtonProps } from \"../shared/Button\";\r\n\r\nexport interface IFinsembleDropdownActionButtonProps {\r\n\tbuttonLabel: string;\r\n\tbuttonOptions: Array<IFinsembleButtonProps>;\r\n\tmainAction: Function;\r\n}\r\n\r\nconst DropdownButton: React.FunctionComponent<IFinsembleDropdownActionButtonProps> = ({\r\n\tbuttonLabel = \"Label\",\r\n\tbuttonOptions = [],\r\n\tmainAction,\r\n}: IFinsembleDropdownActionButtonProps) => {\r\n\tconst wrapperRef = useRef<HTMLDivElement>(null);\r\n\tconst [expanded, setExpanded] = useState(false);\r\n\r\n\tuseOutsideClickDetector(wrapperRef, () => setExpanded(false));\r\n\r\n\tconst options = buttonOptions.map((option, index) => (\r\n\t\t<div\r\n\t\t\tkey={index}\r\n\t\t\tclassName=\"finsemble-dropdown-action__btn-option\"\r\n\t\t\tonClick={() => {\r\n\t\t\t\toption.clickHandler();\r\n\t\t\t\tsetExpanded(false);\r\n\t\t\t}}\r\n\t\t>\r\n\t\t\t{option.buttonLabel}\r\n\t\t</div>\r\n\t));\r\n\r\n\tconst buttonAction = () => {\r\n\t\tif (expanded) {\r\n\t\t\tsetExpanded(false);\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (mainAction) {\r\n\t\t\tmainAction();\r\n\t\t} else {\r\n\t\t\t() => setExpanded(!expanded);\r\n\t\t}\r\n\t};\r\n\r\n\treturn (\r\n\t\t<div ref={wrapperRef} className=\"finsemble-dropdown-action__btn-container\">\r\n\t\t\t<div className=\"finsemble-dropdown-action__btn\">\r\n\t\t\t\t<span className=\"btn-label\" onClick={buttonAction}>\r\n\t\t\t\t\t{buttonLabel}\r\n\t\t\t\t</span>\r\n\t\t\t\t<span className=\"separator\"></span>\r\n\t\t\t\t<div className=\"expand-options\" onClick={() => setExpanded(!expanded)}>\r\n\t\t\t\t\t<span className=\"caret\"></span>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t{expanded ? <div className=\"finsemble-dropdown-action__btn-options\">{options}</div> : null}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default DropdownButton;\r\n"]}
1	+ {"version":3,"file":"DropdownButton.js","sourceRoot":"","sources":["../../../src/components/common/DropdownButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,6BAA6B,CAAC;AACrC,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAS9E,MAAM,cAAc,GAAiE,CAAC,EACrF,WAAW,GAAG,OAAO,EACrB,aAAa,GAAG,EAAE,EAClB,UAAU,GAC2B,EAAE,EAAE;IACzC,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,uBAAuB,CAAC,UAAU,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;IAE9D,MAAM,OAAO,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CACpD,6BACC,GAAG,EAAE,KAAK,EACV,SAAS,EAAC,uCAAuC,EACjD,OAAO,EAAE,GAAG,EAAE;YACb,MAAM,CAAC,YAAY,EAAE,CAAC;YACtB,WAAW,CAAC,KAAK,CAAC,CAAC;QACpB,CAAC,IAEA,MAAM,CAAC,WAAW,CACd,CACN,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,GAAG,EAAE;QACzB,IAAI,QAAQ,EAAE;YACb,WAAW,CAAC,KAAK,CAAC,CAAC;YACnB,OAAO;SACP;QAED,IAAI,UAAU,EAAE;YACf,UAAU,EAAE,CAAC;SACb;aAAM;YACN,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC;SAC7B;IACF,CAAC,CAAC;IAEF,OAAO,CACN,6BAAK,GAAG,EAAE,UAAU,EAAE,SAAS,EAAC,0CAA0C;QACzE,6BAAK,SAAS,EAAC,gCAAgC;YAC9C,8BAAM,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,YAAY,IAC/C,WAAW,CACN;YACP,8BAAM,SAAS,EAAC,WAAW,GAAQ;YACnC,6BAAK,SAAS,EAAC,gBAAgB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC;gBACpE,8BAAM,SAAS,EAAC,OAAO,GAAQ,CAC1B,CACD;QACL,QAAQ,CAAC,CAAC,CAAC,6BAAK,SAAS,EAAC,wCAAwC,IAAE,OAAO,CAAO,CAAC,CAAC,CAAC,IAAI,CACrF,CACN,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import React, { useState, useRef } from \"react\";\nimport \"../../assets/css/button.css\";\nimport { useOutsideClickDetector } from \"../../hooks/useOutsideClickDetector\";\nimport { IFinsembleButtonProps } from \"../shared/Button\";\n\nexport interface IFinsembleDropdownActionButtonProps {\n\tbuttonLabel: string;\n\tbuttonOptions: Array<IFinsembleButtonProps>;\n\tmainAction: Function;\n}\n\nconst DropdownButton: React.FunctionComponent<IFinsembleDropdownActionButtonProps> = ({\n\tbuttonLabel = \"Label\",\n\tbuttonOptions = [],\n\tmainAction,\n}: IFinsembleDropdownActionButtonProps) => {\n\tconst wrapperRef = useRef<HTMLDivElement>(null);\n\tconst [expanded, setExpanded] = useState(false);\n\n\tuseOutsideClickDetector(wrapperRef, () => setExpanded(false));\n\n\tconst options = buttonOptions.map((option, index) => (\n\t\t<div\n\t\t\tkey={index}\n\t\t\tclassName=\"finsemble-dropdown-action__btn-option\"\n\t\t\tonClick={() => {\n\t\t\t\toption.clickHandler();\n\t\t\t\tsetExpanded(false);\n\t\t\t}}\n\t\t>\n\t\t\t{option.buttonLabel}\n\t\t</div>\n\t));\n\n\tconst buttonAction = () => {\n\t\tif (expanded) {\n\t\t\tsetExpanded(false);\n\t\t\treturn;\n\t\t}\n\n\t\tif (mainAction) {\n\t\t\tmainAction();\n\t\t} else {\n\t\t\t() => setExpanded(!expanded);\n\t\t}\n\t};\n\n\treturn (\n\t\t<div ref={wrapperRef} className=\"finsemble-dropdown-action__btn-container\">\n\t\t\t<div className=\"finsemble-dropdown-action__btn\">\n\t\t\t\t<span className=\"btn-label\" onClick={buttonAction}>\n\t\t\t\t\t{buttonLabel}\n\t\t\t\t</span>\n\t\t\t\t<span className=\"separator\"></span>\n\t\t\t\t<div className=\"expand-options\" onClick={() => setExpanded(!expanded)}>\n\t\t\t\t\t<span className=\"caret\"></span>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t{expanded ? <div className=\"finsemble-dropdown-action__btn-options\">{options}</div> : null}\n\t\t</div>\n\t);\n};\n\nexport default DropdownButton;\n"]}

package/react/components/common/FileInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileInput.js","sourceRoot":"","sources":["../../../src/components/common/FileInput.tsx"],"names":[],"mappings":"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","sourcesContent":["/!\r\n Copyright 2017 - 2020 by ChartIQ, Inc.\r\n * All rights reserved.\r\n /\r\n\r\nimport React, { useState, useRef, useEffect } from \"react\";\r\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\r\nimport { useDispatch } from \"../../store\";\r\nimport { ProjectError } from \"../../types/smartDesktopDesignerTypes\";\r\n\r\nimport { Button } from \"./Button\";\r\nimport \"./css/file-input.css\";\r\n\r\nimport { DropZone, FileWithPath } from \"./DropZone\";\r\nimport { validateFilename } from \"./file_helpers\";\r\n\r\nexport type FileInputUploadCb = (\r\n\tfileObject: File,\r\n\tcb?: (progress: number) => void\r\n) => Promise<{ err: string \| null; path: string }>;\r\n\r\nexport type FileInputProps = {\r\n\tacceptTypes: string[];\r\n\tvalue: string;\r\n\tid?: string;\r\n\tshouldUpload?: boolean;\r\n\tonSetValue?: (value: string) => void;\r\n\tuploadFunction?: FileInputUploadCb;\r\n\tpresetFile?: null \| File;\r\n\tsuppressDropzone?: boolean;\r\n};\r\n\r\nconst INVALID_FILE_TYPE_ERROR: ProjectError = {\r\n\tviewId: \"themes\",\r\n\tmessage: \"Your uploaded file is not in the correct format\",\r\n};\r\n\r\nconst defaultUploadFunction = async () => {\r\n\treturn { err: null, path: \"\" };\r\n};\r\n\r\n/\r\n A Browse button with a hidden file input to allow for a file select dialog and extraction of a path\r\n \r\n @param {FileInputProps} { acceptTypes, value, onSetValue, shouldUpload=true, uploadFunction = defaultUploadFunction}\r\n * @return {}\r\n /\r\nexport const FileInput = ({\r\n\tacceptTypes,\r\n\tvalue,\r\n\tonSetValue,\r\n\tid,\r\n\tshouldUpload = true,\r\n\tuploadFunction = defaultUploadFunction,\r\n\tpresetFile = null,\r\n\tsuppressDropzone = false,\r\n}: FileInputProps) => {\r\n\tconst dispatch = useDispatch();\r\n\tconst fileInputElement = useRef({} as HTMLInputElement);\r\n\tconst [isUploading, setIsUploading] = useState(false);\r\n\tconst [uploadProgress, setUploadProgress] = useState(0);\r\n\tconst [fileInput, setFileInput] = useState({} as HTMLInputElement); // cast to correct type so typescript doesn't complain\r\n\tconst [path, setPath] = useState(value \|\| \"\");\r\n\tconst [errorMessage, setErrorMessage] = useState(null as string \| null);\r\n\tconst [handedFile, setHandedFile] = useState<FileWithPath \| null>(presetFile);\r\n\r\n\tconst isInvalid = validateFilename(acceptTypes, path);\r\n\r\n\tconst uploadSuccess = ({ err, path: successPath }: { err: string \| null; path: string }) => {\r\n\t\tif (err) {\r\n\t\t\tdispatch(SmartDesktopDesignerActions.set_project_error(INVALID_FILE_TYPE_ERROR));\r\n\r\n\t\t\tsetErrorMessage(err);\r\n\t\t\tsetPath(\"\");\r\n\t\t} else {\r\n\t\t\tdispatch(SmartDesktopDesignerActions.delete_project_error(INVALID_FILE_TYPE_ERROR));\r\n\t\t\tsetErrorMessage(null);\r\n\t\t\tsetPath(successPath);\r\n\r\n\t\t\tonSetValue?.(successPath);\r\n\r\n\t\t\tfileInput.value = \"\";\r\n\t\t}\r\n\t};\r\n\r\n\tconst uploadError = (err: string) => {\r\n\t\tsetErrorMessage(err);\r\n\t};\r\n\r\n\tconst uploadFile = (fileObj: FileWithPath \| undefined) => {\r\n\t\t// If it's not a file, we can't do anything with it\r\n\t\tif (!(fileObj instanceof File)) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tsetIsUploading(true);\r\n\t\tuploadFunction?.(fileObj, (progress: number) => {\r\n\t\t\tsetUploadProgress(progress);\r\n\t\t})\r\n\t\t\t.then(uploadSuccess)\r\n\t\t\t.catch(uploadError)\r\n\t\t\t.finally(() => {\r\n\t\t\t\tsetIsUploading(false);\r\n\t\t\t\tsetUploadProgress(0);\r\n\t\t\t});\r\n\t};\r\n\r\n\tconst processFile = (fileObj: FileWithPath) => {\r\n\t\tif (shouldUpload) {\r\n\t\t\tuploadFile(fileObj);\r\n\t\t} else if (fileObj?.path) {\r\n\t\t\t// If the consumer doesn't want the file actually uploaded, just return the file name\r\n\t\t\tuploadSuccess({\r\n\t\t\t\terr: null,\r\n\t\t\t\tpath: fileObj.path,\r\n\t\t\t});\r\n\t\t}\r\n\t\tsetIsUploading(false);\r\n\t\tsetUploadProgress(0);\r\n\t\tsetErrorMessage(null);\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tsetPath(value \|\| \"\");\r\n\t}, [value]);\r\n\r\n\tconst onFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n\t\tconst fileObj = e.target.files?.[0] as FileWithPath \| undefined;\r\n\r\n\t\tif (fileObj !== undefined) {\r\n\t\t\tprocessFile(fileObj);\r\n\t\t}\r\n\r\n\t\tsetFileInput(e.target);\r\n\t};\r\n\r\n\t// Check if props updated\r\n\tif (handedFile !== presetFile) {\r\n\t\tsetHandedFile(presetFile);\r\n\t\tif (presetFile !== null) {\r\n\t\t\tuploadFile(presetFile);\r\n\t\t}\r\n\t}\r\n\r\n\treturn (\r\n\t\t<DropZone processFile={processFile} suppress={suppressDropzone}>\r\n\t\t\t<div className=\"file-input-container\">\r\n\t\t\t\t<div className=\"file-input-actions\">\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\tref={fileInputElement}\r\n\t\t\t\t\t\ttype=\"file\"\r\n\t\t\t\t\t\tonChange={onFileChange}\r\n\t\t\t\t\t\taccept={acceptTypes.join(\", \")}\r\n\t\t\t\t\t\ttabIndex={-1}\r\n\t\t\t\t\t\taria-hidden=\"true\"\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t<Button\r\n\t\t\t\t\t\tfashion=\"primary\"\r\n\t\t\t\t\t\ttext=\"Browse\"\r\n\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\tfileInputElement.current.click();\r\n\t\t\t\t\t\t}}\r\n\t\t\t\t\t/>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"file-input-value\">\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\tclassName=\"file-input-value-input\"\r\n\t\t\t\t\t\ttype=\"text\"\r\n\t\t\t\t\t\tdisabled\r\n\t\t\t\t\t\tvalue={path}\r\n\t\t\t\t\t\taria-invalid={isInvalid}\r\n\t\t\t\t\t\t{...{ id }}\r\n\t\t\t\t\t></input>\r\n\t\t\t\t\t{errorMessage && <div className=\"file-input-error\">{errorMessage}</div>}\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"file-input-status\">\r\n\t\t\t\t\t{isUploading ? (\r\n\t\t\t\t\t\t<div className=\"file-input-progress-container\">{uploadProgress}% uploaded</div>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t!errorMessage && <></>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</DropZone>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"FileInput.js","sourceRoot":"","sources":["../../../src/components/common/FileInput.tsx"],"names":[],"mappings":"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","sourcesContent":["/!\n Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n /\n\nimport React, { useState, useRef, useEffect } from \"react\";\nimport { SmartDesktopDesignerActions } from \"../../actions/smartDesktopDesignerActions\";\nimport { useDispatch } from \"../../store\";\nimport { ProjectError } from \"../../types/smartDesktopDesignerTypes\";\n\nimport { Button } from \"./Button\";\nimport \"./css/file-input.css\";\n\nimport { DropZone, FileWithPath } from \"./DropZone\";\nimport { validateFilename } from \"./file_helpers\";\n\nexport type FileInputUploadCb = (\n\tfileObject: File,\n\tcb?: (progress: number) => void\n) => Promise<{ err: string \| null; path: string }>;\n\nexport type FileInputProps = {\n\tacceptTypes: string[];\n\tvalue: string;\n\tid?: string;\n\tshouldUpload?: boolean;\n\tonSetValue?: (value: string) => void;\n\tuploadFunction?: FileInputUploadCb;\n\tpresetFile?: null \| File;\n\tsuppressDropzone?: boolean;\n};\n\nconst INVALID_FILE_TYPE_ERROR: ProjectError = {\n\tviewId: \"themes\",\n\tmessage: \"Your uploaded file is not in the correct format\",\n};\n\nconst defaultUploadFunction = async () => {\n\treturn { err: null, path: \"\" };\n};\n\n/\n A Browse button with a hidden file input to allow for a file select dialog and extraction of a path\n \n @param {FileInputProps} { acceptTypes, value, onSetValue, shouldUpload=true, uploadFunction = defaultUploadFunction}\n * @return {}\n /\nexport const FileInput = ({\n\tacceptTypes,\n\tvalue,\n\tonSetValue,\n\tid,\n\tshouldUpload = true,\n\tuploadFunction = defaultUploadFunction,\n\tpresetFile = null,\n\tsuppressDropzone = false,\n}: FileInputProps) => {\n\tconst dispatch = useDispatch();\n\tconst fileInputElement = useRef({} as HTMLInputElement);\n\tconst [isUploading, setIsUploading] = useState(false);\n\tconst [uploadProgress, setUploadProgress] = useState(0);\n\tconst [fileInput, setFileInput] = useState({} as HTMLInputElement); // cast to correct type so typescript doesn't complain\n\tconst [path, setPath] = useState(value \|\| \"\");\n\tconst [errorMessage, setErrorMessage] = useState(null as string \| null);\n\tconst [handedFile, setHandedFile] = useState<FileWithPath \| null>(presetFile);\n\n\tconst isInvalid = validateFilename(acceptTypes, path);\n\n\tconst uploadSuccess = ({ err, path: successPath }: { err: string \| null; path: string }) => {\n\t\tif (err) {\n\t\t\tdispatch(SmartDesktopDesignerActions.set_project_error(INVALID_FILE_TYPE_ERROR));\n\n\t\t\tsetErrorMessage(err);\n\t\t\tsetPath(\"\");\n\t\t} else {\n\t\t\tdispatch(SmartDesktopDesignerActions.delete_project_error(INVALID_FILE_TYPE_ERROR));\n\t\t\tsetErrorMessage(null);\n\t\t\tsetPath(successPath);\n\n\t\t\tonSetValue?.(successPath);\n\n\t\t\tfileInput.value = \"\";\n\t\t}\n\t};\n\n\tconst uploadError = (err: string) => {\n\t\tsetErrorMessage(err);\n\t};\n\n\tconst uploadFile = (fileObj: FileWithPath \| undefined) => {\n\t\t// If it's not a file, we can't do anything with it\n\t\tif (!(fileObj instanceof File)) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetIsUploading(true);\n\t\tuploadFunction?.(fileObj, (progress: number) => {\n\t\t\tsetUploadProgress(progress);\n\t\t})\n\t\t\t.then(uploadSuccess)\n\t\t\t.catch(uploadError)\n\t\t\t.finally(() => {\n\t\t\t\tsetIsUploading(false);\n\t\t\t\tsetUploadProgress(0);\n\t\t\t});\n\t};\n\n\tconst processFile = (fileObj: FileWithPath) => {\n\t\tif (shouldUpload) {\n\t\t\tuploadFile(fileObj);\n\t\t} else if (fileObj?.path) {\n\t\t\t// If the consumer doesn't want the file actually uploaded, just return the file name\n\t\t\tuploadSuccess({\n\t\t\t\terr: null,\n\t\t\t\tpath: fileObj.path,\n\t\t\t});\n\t\t}\n\t\tsetIsUploading(false);\n\t\tsetUploadProgress(0);\n\t\tsetErrorMessage(null);\n\t};\n\n\tuseEffect(() => {\n\t\tsetPath(value \|\| \"\");\n\t}, [value]);\n\n\tconst onFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n\t\tconst fileObj = e.target.files?.[0] as FileWithPath \| undefined;\n\n\t\tif (fileObj !== undefined) {\n\t\t\tprocessFile(fileObj);\n\t\t}\n\n\t\tsetFileInput(e.target);\n\t};\n\n\t// Check if props updated\n\tif (handedFile !== presetFile) {\n\t\tsetHandedFile(presetFile);\n\t\tif (presetFile !== null) {\n\t\t\tuploadFile(presetFile);\n\t\t}\n\t}\n\n\treturn (\n\t\t<DropZone processFile={processFile} suppress={suppressDropzone}>\n\t\t\t<div className=\"file-input-container\">\n\t\t\t\t<div className=\"file-input-actions\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={fileInputElement}\n\t\t\t\t\t\ttype=\"file\"\n\t\t\t\t\t\tonChange={onFileChange}\n\t\t\t\t\t\taccept={acceptTypes.join(\", \")}\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tfashion=\"primary\"\n\t\t\t\t\t\ttext=\"Browse\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tfileInputElement.current.click();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"file-input-value\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tclassName=\"file-input-value-input\"\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tdisabled\n\t\t\t\t\t\tvalue={path}\n\t\t\t\t\t\taria-invalid={isInvalid}\n\t\t\t\t\t\t{...{ id }}\n\t\t\t\t\t></input>\n\t\t\t\t\t{errorMessage && <div className=\"file-input-error\">{errorMessage}</div>}\n\t\t\t\t</div>\n\t\t\t\t<div className=\"file-input-status\">\n\t\t\t\t\t{isUploading ? (\n\t\t\t\t\t\t<div className=\"file-input-progress-container\">{uploadProgress}% uploaded</div>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t!errorMessage && <></>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</DropZone>\n\t);\n};\n"]}

package/react/components/common/FinsembleIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FinsembleIcon.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleIcon.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\r\nimport \"./css/icon.css\";\r\nimport { ReactComponent as CheckIcon } from \"../../assets/icons/check.svg\";\r\nimport { ReactComponent as CheckSquare } from \"../../assets/icons/check-square.svg\";\r\nimport { ReactComponent as ChevronLeftIcon } from \"../../assets/icons/chevron-left.svg\";\r\nimport { ReactComponent as ChevronRightIcon } from \"../../assets/icons/chevron-right.svg\";\r\nimport { ReactComponent as CopyIcon } from \"../../assets/icons/copy.svg\";\r\nimport { ReactComponent as ExclaimationCircleIcon } from \"../../assets/icons/exclamation-circle.svg\";\r\nimport { ReactComponent as ExternalLinkIcon } from \"../../assets/icons/external-link.svg\";\r\nimport { ReactComponent as FlagIcon } from \"../../assets/icons/flag.svg\";\r\nimport { ReactComponent as FolderIcon } from \"../../assets/icons/folder.svg\";\r\nimport { ReactComponent as FontIcon } from \"../../assets/icons/font.svg\";\r\nimport { ReactComponent as GlobeIcon } from \"../../assets/icons/globe.svg\";\r\nimport { ReactComponent as HDDIcon } from \"../../assets/icons/hdd.svg\";\r\nimport { ReactComponent as KeyIcon } from \"../../assets/icons/key.svg\";\r\nimport { ReactComponent as LifeRingIcon } from \"../../assets/icons/life-ring.svg\";\r\nimport { ReactComponent as LockIcon } from \"../../assets/icons/lock.svg\";\r\nimport { ReactComponent as MagicIcon } from \"../../assets/icons/magic.svg\";\r\nimport { ReactComponent as MoonIcon } from \"../../assets/icons/moon.svg\";\r\nimport { ReactComponent as PaintRollerIcon } from \"../../assets/icons/paint-roller.svg\";\r\nimport { ReactComponent as PencilIcon } from \"../../assets/icons/pencil.svg\";\r\nimport { ReactComponent as PlusIcon } from \"../../assets/icons/plus.svg\";\r\nimport { ReactComponent as QuestionCircleIcon } from \"../../assets/icons/question-circle.svg\";\r\nimport { ReactComponent as SearchIcon } from \"../../assets/icons/search.svg\";\r\nimport { ReactComponent as SunIcon } from \"../../assets/icons/sun.svg\";\r\nimport { ReactComponent as TimesIcon } from \"../../assets/icons/times.svg\";\r\nimport { ReactComponent as ToggleOffIcon } from \"../../assets/icons/toggle-off.svg\";\r\nimport { ReactComponent as ToggleOnIcon } from \"../../assets/icons/toggle-on.svg\";\r\nimport { ReactComponent as ToolsIcon } from \"../../assets/icons/tools.svg\";\r\nimport { ReactComponent as TrashIcon } from \"../../assets/icons/trash.svg\";\r\nimport { ReactComponent as UploadIcon } from \"../../assets/icons/upload.svg\";\r\nimport { ReactComponent as WindowIcon } from \"../../assets/icons/window.svg\";\r\n\r\nexport type FinsembleIconType =\r\n\t\| \"check\"\r\n\t\| \"check-square\"\r\n\t\| \"chevron-left\"\r\n\t\| \"chevron-right\"\r\n\t\| \"copy\"\r\n\t\| \"exclamation-circle\"\r\n\t\| \"external-link\"\r\n\t\| \"flag\"\r\n\t\| \"font\"\r\n\t\| \"folder\"\r\n\t\| \"globe\"\r\n\t\| \"hdd\"\r\n\t\| \"key\"\r\n\t\| \"life-ring\"\r\n\t\| \"lock\"\r\n\t\| \"magic\"\r\n\t\| \"moon\"\r\n\t\| \"paint-roller\"\r\n\t\| \"pencil\"\r\n\t\| \"plus\"\r\n\t\| \"question-circle\"\r\n\t\| \"search\"\r\n\t\| \"sun\"\r\n\t\| \"times\"\r\n\t\| \"toggle-off\"\r\n\t\| \"toggle-on\"\r\n\t\| \"tools\"\r\n\t\| \"trash\"\r\n\t\| \"upload\"\r\n\t\| \"window\";\r\n\r\ntype IconComponents = {\r\n\t[key in FinsembleIconType]: React.FunctionComponent<React.SVGProps<SVGSVGElement>>;\r\n};\r\n\r\nconst icons: IconComponents = {\r\n\tcheck: CheckIcon,\r\n\t\"check-square\": CheckSquare,\r\n\t\"chevron-left\": ChevronLeftIcon,\r\n\t\"chevron-right\": ChevronRightIcon,\r\n\tcopy: CopyIcon,\r\n\t\"exclamation-circle\": ExclaimationCircleIcon,\r\n\t\"external-link\": ExternalLinkIcon,\r\n\tflag: FlagIcon,\r\n\tfolder: FolderIcon,\r\n\tfont: FontIcon,\r\n\tglobe: GlobeIcon,\r\n\thdd: HDDIcon,\r\n\tkey: KeyIcon,\r\n\t\"life-ring\": LifeRingIcon,\r\n\tlock: LockIcon,\r\n\tmagic: MagicIcon,\r\n\tmoon: MoonIcon,\r\n\t\"paint-roller\": PaintRollerIcon,\r\n\tpencil: PencilIcon,\r\n\tplus: PlusIcon,\r\n\t\"question-circle\": QuestionCircleIcon,\r\n\tsearch: SearchIcon,\r\n\tsun: SunIcon,\r\n\ttimes: TimesIcon,\r\n\t\"toggle-off\": ToggleOffIcon,\r\n\t\"toggle-on\": ToggleOnIcon,\r\n\ttools: ToolsIcon,\r\n\ttrash: TrashIcon,\r\n\tupload: UploadIcon,\r\n\twindow: WindowIcon,\r\n};\r\n\r\nexport type FinsembleIconProps = {\r\n\ticon: FinsembleIconType;\r\n\tclassName?: string;\r\n\tonClick?: (e: React.MouseEvent) => void;\r\n};\r\n\r\nexport const FinsembleIcon = (props: FinsembleIconProps) => {\r\n\tconst Icon = icons[props.icon];\r\n\r\n\treturn (\r\n\t\t<span\r\n\t\t\tclassName={[\"finsemble-icon\", `finsemble-icon-${props.icon}`, props.className \|\| \"\"].join(\" \")}\r\n\t\t\trole=\"img\"\r\n\t\t\taria-label={`${props.icon} icon`}\r\n\t\t\tonClick={(e) => props.onClick && props.onClick(e)}\r\n\t\t>\r\n\t\t\t{Icon && <Icon></Icon>}\r\n\t\t</span>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"FinsembleIcon.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleIcon.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport \"./css/icon.css\";\nimport { ReactComponent as CheckIcon } from \"../../assets/icons/check.svg\";\nimport { ReactComponent as CheckSquare } from \"../../assets/icons/check-square.svg\";\nimport { ReactComponent as ChevronLeftIcon } from \"../../assets/icons/chevron-left.svg\";\nimport { ReactComponent as ChevronRightIcon } from \"../../assets/icons/chevron-right.svg\";\nimport { ReactComponent as CopyIcon } from \"../../assets/icons/copy.svg\";\nimport { ReactComponent as ExclaimationCircleIcon } from \"../../assets/icons/exclamation-circle.svg\";\nimport { ReactComponent as ExternalLinkIcon } from \"../../assets/icons/external-link.svg\";\nimport { ReactComponent as FlagIcon } from \"../../assets/icons/flag.svg\";\nimport { ReactComponent as FolderIcon } from \"../../assets/icons/folder.svg\";\nimport { ReactComponent as FontIcon } from \"../../assets/icons/font.svg\";\nimport { ReactComponent as GlobeIcon } from \"../../assets/icons/globe.svg\";\nimport { ReactComponent as HDDIcon } from \"../../assets/icons/hdd.svg\";\nimport { ReactComponent as KeyIcon } from \"../../assets/icons/key.svg\";\nimport { ReactComponent as LifeRingIcon } from \"../../assets/icons/life-ring.svg\";\nimport { ReactComponent as LockIcon } from \"../../assets/icons/lock.svg\";\nimport { ReactComponent as MagicIcon } from \"../../assets/icons/magic.svg\";\nimport { ReactComponent as MoonIcon } from \"../../assets/icons/moon.svg\";\nimport { ReactComponent as PaintRollerIcon } from \"../../assets/icons/paint-roller.svg\";\nimport { ReactComponent as PencilIcon } from \"../../assets/icons/pencil.svg\";\nimport { ReactComponent as PlusIcon } from \"../../assets/icons/plus.svg\";\nimport { ReactComponent as QuestionCircleIcon } from \"../../assets/icons/question-circle.svg\";\nimport { ReactComponent as SearchIcon } from \"../../assets/icons/search.svg\";\nimport { ReactComponent as SunIcon } from \"../../assets/icons/sun.svg\";\nimport { ReactComponent as TimesIcon } from \"../../assets/icons/times.svg\";\nimport { ReactComponent as ToggleOffIcon } from \"../../assets/icons/toggle-off.svg\";\nimport { ReactComponent as ToggleOnIcon } from \"../../assets/icons/toggle-on.svg\";\nimport { ReactComponent as ToolsIcon } from \"../../assets/icons/tools.svg\";\nimport { ReactComponent as TrashIcon } from \"../../assets/icons/trash.svg\";\nimport { ReactComponent as UploadIcon } from \"../../assets/icons/upload.svg\";\nimport { ReactComponent as WindowIcon } from \"../../assets/icons/window.svg\";\n\nexport type FinsembleIconType =\n\t\| \"check\"\n\t\| \"check-square\"\n\t\| \"chevron-left\"\n\t\| \"chevron-right\"\n\t\| \"copy\"\n\t\| \"exclamation-circle\"\n\t\| \"external-link\"\n\t\| \"flag\"\n\t\| \"font\"\n\t\| \"folder\"\n\t\| \"globe\"\n\t\| \"hdd\"\n\t\| \"key\"\n\t\| \"life-ring\"\n\t\| \"lock\"\n\t\| \"magic\"\n\t\| \"moon\"\n\t\| \"paint-roller\"\n\t\| \"pencil\"\n\t\| \"plus\"\n\t\| \"question-circle\"\n\t\| \"search\"\n\t\| \"sun\"\n\t\| \"times\"\n\t\| \"toggle-off\"\n\t\| \"toggle-on\"\n\t\| \"tools\"\n\t\| \"trash\"\n\t\| \"upload\"\n\t\| \"window\";\n\ntype IconComponents = {\n\t[key in FinsembleIconType]: React.FunctionComponent<React.SVGProps<SVGSVGElement>>;\n};\n\nconst icons: IconComponents = {\n\tcheck: CheckIcon,\n\t\"check-square\": CheckSquare,\n\t\"chevron-left\": ChevronLeftIcon,\n\t\"chevron-right\": ChevronRightIcon,\n\tcopy: CopyIcon,\n\t\"exclamation-circle\": ExclaimationCircleIcon,\n\t\"external-link\": ExternalLinkIcon,\n\tflag: FlagIcon,\n\tfolder: FolderIcon,\n\tfont: FontIcon,\n\tglobe: GlobeIcon,\n\thdd: HDDIcon,\n\tkey: KeyIcon,\n\t\"life-ring\": LifeRingIcon,\n\tlock: LockIcon,\n\tmagic: MagicIcon,\n\tmoon: MoonIcon,\n\t\"paint-roller\": PaintRollerIcon,\n\tpencil: PencilIcon,\n\tplus: PlusIcon,\n\t\"question-circle\": QuestionCircleIcon,\n\tsearch: SearchIcon,\n\tsun: SunIcon,\n\ttimes: TimesIcon,\n\t\"toggle-off\": ToggleOffIcon,\n\t\"toggle-on\": ToggleOnIcon,\n\ttools: ToolsIcon,\n\ttrash: TrashIcon,\n\tupload: UploadIcon,\n\twindow: WindowIcon,\n};\n\nexport type FinsembleIconProps = {\n\ticon: FinsembleIconType;\n\tclassName?: string;\n\tonClick?: (e: React.MouseEvent) => void;\n};\n\nexport const FinsembleIcon = (props: FinsembleIconProps) => {\n\tconst Icon = icons[props.icon];\n\n\treturn (\n\t\t<span\n\t\t\tclassName={[\"finsemble-icon\", `finsemble-icon-${props.icon}`, props.className \|\| \"\"].join(\" \")}\n\t\t\trole=\"img\"\n\t\t\taria-label={`${props.icon} icon`}\n\t\t\tonClick={(e) => props.onClick && props.onClick(e)}\n\t\t>\n\t\t\t{Icon && <Icon></Icon>}\n\t\t</span>\n\t);\n};\n"]}

package/react/components/common/FinsembleSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FinsembleSelect.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleSelect.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, ReactNode } from \"react\";\r\nimport \"./css/selector.css\";\r\nimport { FinsembleIcon } from \"./FinsembleIcon\";\r\nimport { FinsembleToggle } from \"./FinsembleToggle\";\r\n\r\nconst heightMultiplier = 40; // It works in storybook, but we will probably want a better way of detecting this soon.\r\n\r\nconst removeItem = (startingArray: string[], removableItem: string) => {\r\n\tconst removableIndex = startingArray.indexOf(removableItem);\r\n\tif (removableIndex < 0) {\r\n\t\treturn startingArray;\r\n\t}\r\n\treturn startingArray.slice(0, removableIndex).concat(startingArray.slice(removableIndex + 1));\r\n};\r\n\r\nexport interface FinsembleSelectProps {\r\n\toptions: string[];\r\n\toptionComponents?: ReactNode[];\r\n\tvalues?: string[];\r\n\tselected?: string[];\r\n\tsize?: number;\r\n\tupdateCallback: (selectedValues: string[]) => void;\r\n\tshowSearch?: boolean;\r\n\tlimit?: number;\r\n}\r\n\r\nexport const FinsembleSelect = ({\r\n\toptions,\r\n\toptionComponents,\r\n\tupdateCallback,\r\n\tselected = [],\r\n\tsize,\r\n\tvalues = options,\r\n\tshowSearch = false,\r\n\tlimit = Infinity,\r\n}: FinsembleSelectProps) => {\r\n\tconst mappedOptions = options.map((option, index) => {\r\n\t\treturn { option, value: values[index] };\r\n\t});\r\n\tconst [selectedOptions, setSelectedOptions] = useState<string[]>(selected);\r\n\tconst [displayOptions, setDisplayOptions] = useState(mappedOptions);\r\n\r\n\t// Magic numbers\r\n\tconst height = size ? heightMultiplier * size : \"\";\r\n\r\n\t// Updating consumer\r\n\tconst doSetSelectedOptions = (opts: string[]) => {\r\n\t\tif (opts.length > limit) {\r\n\t\t\topts = opts.slice(limit * -1);\r\n\t\t}\r\n\r\n\t\tif (JSON.stringify(opts) !== JSON.stringify(selectedOptions)) {\r\n\t\t\tupdateCallback(opts);\r\n\t\t}\r\n\t\tsetSelectedOptions(opts);\r\n\t};\r\n\r\n\t// Event handlers\r\n\tconst changeHandler = (e: any) => {\r\n\t\tdoSetSelectedOptions(Array.from(e.target.selectedOptions).map((option: any) => option.value));\r\n\t};\r\n\r\n\tconst updateSearch = (e: React.KeyboardEvent<HTMLInputElement>) => {\r\n\t\t// TS doesn't complain if I use .currentTarget, but then I can't use Enzyme to test it, so here we are\r\n\t\tconst searchString = (e.target as HTMLInputElement).value;\r\n\t\tsetDisplayOptions(\r\n\t\t\tmappedOptions\r\n\t\t\t\t.filter((optionMap) => optionMap.option.toUpperCase().includes(searchString.toUpperCase()))\r\n\t\t\t\t.map((combination) => {\r\n\t\t\t\t\treturn {\r\n\t\t\t\t\t\t...combination,\r\n\t\t\t\t\t\toption: combination.option.replace(\r\n\t\t\t\t\t\t\tnew RegExp(`(${searchString})`, \"i\"),\r\n\t\t\t\t\t\t\t`<span class=\"highlight\">$1</span>`\r\n\t\t\t\t\t\t),\r\n\t\t\t\t\t};\r\n\t\t\t\t})\r\n\t\t);\r\n\t};\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t<div className=\"emperorSelectContainer\">\r\n\t\t\t\t{showSearch && (\r\n\t\t\t\t\t<>\r\n\t\t\t\t\t\t<FinsembleIcon className=\"searchIcon\" icon=\"search\"></FinsembleIcon>\r\n\t\t\t\t\t\t<input type=\"text\" placeholder=\"Search\" aria-label=\"search\" className=\"search\" onInput={updateSearch} />\r\n\t\t\t\t\t</>\r\n\t\t\t\t)}\r\n\t\t\t\t<select className=\"shogunSelect\" multiple onChange={changeHandler}>\r\n\t\t\t\t\t{displayOptions.map(({ option, value }, index: number) => (\r\n\t\t\t\t\t\t<option key={`shogun-option-${index}`} value={value}>\r\n\t\t\t\t\t\t\t{option}\r\n\t\t\t\t\t\t</option>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</select>\r\n\t\t\t\t<div className=\"emperorSelect\" style={height === \"\" ? {} : { height }}>\r\n\t\t\t\t\t{displayOptions.map(({ option, value }, index: number) => (\r\n\t\t\t\t\t\t<div className=\"emperorOption\" key={`emperor-option-${index}`}>\r\n\t\t\t\t\t\t\t<label>\r\n\t\t\t\t\t\t\t\t<FinsembleToggle\r\n\t\t\t\t\t\t\t\t\tchecked={selectedOptions.includes(value) \|\| selected.includes(value)}\r\n\t\t\t\t\t\t\t\t\tonChange={() => {\r\n\t\t\t\t\t\t\t\t\t\tif (selectedOptions.includes(value) \|\| selected.includes(value)) {\r\n\t\t\t\t\t\t\t\t\t\t\tdoSetSelectedOptions(removeItem(selectedOptions, value));\r\n\t\t\t\t\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\t\t\t\t\tdoSetSelectedOptions(selectedOptions.concat([value]));\r\n\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t></FinsembleToggle>\r\n\t\t\t\t\t\t\t\t{optionComponents?.[index] ? (\r\n\t\t\t\t\t\t\t\t\toptionComponents?.[index]\r\n\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t<span dangerouslySetInnerHTML={{ __html: option }}></span>\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t</label>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"FinsembleSelect.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleSelect.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, ReactNode } from \"react\";\nimport \"./css/selector.css\";\nimport { FinsembleIcon } from \"./FinsembleIcon\";\nimport { FinsembleToggle } from \"./FinsembleToggle\";\n\nconst heightMultiplier = 40; // It works in storybook, but we will probably want a better way of detecting this soon.\n\nconst removeItem = (startingArray: string[], removableItem: string) => {\n\tconst removableIndex = startingArray.indexOf(removableItem);\n\tif (removableIndex < 0) {\n\t\treturn startingArray;\n\t}\n\treturn startingArray.slice(0, removableIndex).concat(startingArray.slice(removableIndex + 1));\n};\n\nexport interface FinsembleSelectProps {\n\toptions: string[];\n\toptionComponents?: ReactNode[];\n\tvalues?: string[];\n\tselected?: string[];\n\tsize?: number;\n\tupdateCallback: (selectedValues: string[]) => void;\n\tshowSearch?: boolean;\n\tlimit?: number;\n}\n\nexport const FinsembleSelect = ({\n\toptions,\n\toptionComponents,\n\tupdateCallback,\n\tselected = [],\n\tsize,\n\tvalues = options,\n\tshowSearch = false,\n\tlimit = Infinity,\n}: FinsembleSelectProps) => {\n\tconst mappedOptions = options.map((option, index) => {\n\t\treturn { option, value: values[index] };\n\t});\n\tconst [selectedOptions, setSelectedOptions] = useState<string[]>(selected);\n\tconst [displayOptions, setDisplayOptions] = useState(mappedOptions);\n\n\t// Magic numbers\n\tconst height = size ? heightMultiplier * size : \"\";\n\n\t// Updating consumer\n\tconst doSetSelectedOptions = (opts: string[]) => {\n\t\tif (opts.length > limit) {\n\t\t\topts = opts.slice(limit * -1);\n\t\t}\n\n\t\tif (JSON.stringify(opts) !== JSON.stringify(selectedOptions)) {\n\t\t\tupdateCallback(opts);\n\t\t}\n\t\tsetSelectedOptions(opts);\n\t};\n\n\t// Event handlers\n\tconst changeHandler = (e: any) => {\n\t\tdoSetSelectedOptions(Array.from(e.target.selectedOptions).map((option: any) => option.value));\n\t};\n\n\tconst updateSearch = (e: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t// TS doesn't complain if I use .currentTarget, but then I can't use Enzyme to test it, so here we are\n\t\tconst searchString = (e.target as HTMLInputElement).value;\n\t\tsetDisplayOptions(\n\t\t\tmappedOptions\n\t\t\t\t.filter((optionMap) => optionMap.option.toUpperCase().includes(searchString.toUpperCase()))\n\t\t\t\t.map((combination) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...combination,\n\t\t\t\t\t\toption: combination.option.replace(\n\t\t\t\t\t\t\tnew RegExp(`(${searchString})`, \"i\"),\n\t\t\t\t\t\t\t`<span class=\"highlight\">$1</span>`\n\t\t\t\t\t\t),\n\t\t\t\t\t};\n\t\t\t\t})\n\t\t);\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<div className=\"emperorSelectContainer\">\n\t\t\t\t{showSearch && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<FinsembleIcon className=\"searchIcon\" icon=\"search\"></FinsembleIcon>\n\t\t\t\t\t\t<input type=\"text\" placeholder=\"Search\" aria-label=\"search\" className=\"search\" onInput={updateSearch} />\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t<select className=\"shogunSelect\" multiple onChange={changeHandler}>\n\t\t\t\t\t{displayOptions.map(({ option, value }, index: number) => (\n\t\t\t\t\t\t<option key={`shogun-option-${index}`} value={value}>\n\t\t\t\t\t\t\t{option}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t))}\n\t\t\t\t</select>\n\t\t\t\t<div className=\"emperorSelect\" style={height === \"\" ? {} : { height }}>\n\t\t\t\t\t{displayOptions.map(({ option, value }, index: number) => (\n\t\t\t\t\t\t<div className=\"emperorOption\" key={`emperor-option-${index}`}>\n\t\t\t\t\t\t\t<label>\n\t\t\t\t\t\t\t\t<FinsembleToggle\n\t\t\t\t\t\t\t\t\tchecked={selectedOptions.includes(value) \|\| selected.includes(value)}\n\t\t\t\t\t\t\t\t\tonChange={() => {\n\t\t\t\t\t\t\t\t\t\tif (selectedOptions.includes(value) \|\| selected.includes(value)) {\n\t\t\t\t\t\t\t\t\t\t\tdoSetSelectedOptions(removeItem(selectedOptions, value));\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tdoSetSelectedOptions(selectedOptions.concat([value]));\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t></FinsembleToggle>\n\t\t\t\t\t\t\t\t{optionComponents?.[index] ? (\n\t\t\t\t\t\t\t\t\toptionComponents?.[index]\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<span dangerouslySetInnerHTML={{ __html: option }}></span>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"]}

package/react/components/common/FinsembleToggle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FinsembleToggle.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,kBAAkB,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAQhD,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAwB,EAAE,EAAE;IACrF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;IAElD,SAAS,aAAa,CAAC,QAAiB;QACvC,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACnB,WAAW,CAAC,QAAQ,CAAC,CAAC;IACvB,CAAC;IAED,SAAS,CAAC,GAAG,EAAE;QACd,WAAW,CAAC,OAAO,CAAC,CAAC;IACtB,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACN,8BAAM,SAAS,EAAE,CAAC,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QACtG,oBAAC,aAAa,IAAC,SAAS,EAAC,sBAAsB,EAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,GAAkB;QAC7G,6CACC,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACf,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;YACjC,CAAC,EACD,OAAO,EAAE,QAAQ,IACb,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACzC,CACI,CACP,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useEffect, useState } from \"react\";\r\nimport \"./css/toggle.css\";\r\nimport { FinsembleIcon } from \"./FinsembleIcon\";\r\n\r\nexport interface FinsembleToggleProps {\r\n\tlabel?: string;\r\n\tchecked: boolean;\r\n\tonChange: (selected: boolean) => void;\r\n}\r\n\r\nexport const FinsembleToggle = ({ checked, onChange, label }: FinsembleToggleProps) => {\r\n\tconst [selected, setSelected] = useState(checked);\r\n\r\n\tfunction doSetSelected(newValue: boolean) {\r\n\t\tonChange(newValue);\r\n\t\tsetSelected(newValue);\r\n\t}\r\n\r\n\tuseEffect(() => {\r\n\t\tsetSelected(checked);\r\n\t}, [checked]);\r\n\r\n\treturn (\r\n\t\t<span className={[\"finsembleToggle\", selected ? \"finsembleToggle-on\" : \"finsembleToggle-off\"].join(\" \")}>\r\n\t\t\t<FinsembleIcon className=\"finsembleToggle-icon\" icon={selected ? \"toggle-on\" : \"toggle-off\"}></FinsembleIcon>\r\n\t\t\t<input\r\n\t\t\t\ttype=\"checkbox\"\r\n\t\t\t\tonChange={(e) => {\r\n\t\t\t\t\tdoSetSelected(e.target.checked);\r\n\t\t\t\t}}\r\n\t\t\t\tchecked={selected}\r\n\t\t\t\t{...(label ? { \"aria-label\": label } : \"\")}\r\n\t\t\t/>\r\n\t\t</span>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"FinsembleToggle.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,kBAAkB,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAQhD,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAwB,EAAE,EAAE;IACrF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;IAElD,SAAS,aAAa,CAAC,QAAiB;QACvC,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACnB,WAAW,CAAC,QAAQ,CAAC,CAAC;IACvB,CAAC;IAED,SAAS,CAAC,GAAG,EAAE;QACd,WAAW,CAAC,OAAO,CAAC,CAAC;IACtB,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACN,8BAAM,SAAS,EAAE,CAAC,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QACtG,oBAAC,aAAa,IAAC,SAAS,EAAC,sBAAsB,EAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,GAAkB;QAC7G,6CACC,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACf,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;YACjC,CAAC,EACD,OAAO,EAAE,QAAQ,IACb,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACzC,CACI,CACP,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport \"./css/toggle.css\";\nimport { FinsembleIcon } from \"./FinsembleIcon\";\n\nexport interface FinsembleToggleProps {\n\tlabel?: string;\n\tchecked: boolean;\n\tonChange: (selected: boolean) => void;\n}\n\nexport const FinsembleToggle = ({ checked, onChange, label }: FinsembleToggleProps) => {\n\tconst [selected, setSelected] = useState(checked);\n\n\tfunction doSetSelected(newValue: boolean) {\n\t\tonChange(newValue);\n\t\tsetSelected(newValue);\n\t}\n\n\tuseEffect(() => {\n\t\tsetSelected(checked);\n\t}, [checked]);\n\n\treturn (\n\t\t<span className={[\"finsembleToggle\", selected ? \"finsembleToggle-on\" : \"finsembleToggle-off\"].join(\" \")}>\n\t\t\t<FinsembleIcon className=\"finsembleToggle-icon\" icon={selected ? \"toggle-on\" : \"toggle-off\"}></FinsembleIcon>\n\t\t\t<input\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tonChange={(e) => {\n\t\t\t\t\tdoSetSelected(e.target.checked);\n\t\t\t\t}}\n\t\t\t\tchecked={selected}\n\t\t\t\t{...(label ? { \"aria-label\": label } : \"\")}\n\t\t\t/>\n\t\t</span>\n\t);\n};\n"]}

package/react/components/common/FontSizeSelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FontSizeSelector.js","sourceRoot":"","sources":["../../../src/components/common/FontSizeSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAe,QAAQ,EAAE,MAAM,OAAO,CAAC;AAErD,MAAM,cAAc,GAAG;IACtB,UAAU;IACV,SAAS;IACT,OAAO;IACP,QAAQ;IACR,OAAO;IACP,SAAS;IACT,UAAU;IACV,WAAW;IACX,SAAS;IACT,QAAQ;IACR,KAAK;IACL,MAAM;IACN,MAAM;IACN,MAAM;IACN,MAAM;IACN,KAAK;IACL,MAAM;IACN,MAAM;IACN,MAAM;IACN,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,KAAK;IACL,KAAK;IACL,MAAM;IACN,MAAM;IACN,SAAS;IACT,SAAS;IACT,OAAO;CACP,CAAC;AAaF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAiB,EAAE,EAAE;IACxE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACN,6BAAK,SAAS,EAAC,kBAAkB;QAChC,gDACK,EAAE,EAAE,EAAE,IACV,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAiC,EAAE,EAAE;gBAC/C,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBACxB,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC5B,CAAC,KAEA,cAAc,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAClC,gCAAQ,GAAG,EAAE,SAAS,IAAG,SAAS,CAAU,CAC5C,CAAC,CACM,CACJ,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { ChangeEvent, useState } from \"react\";\r\n\r\nconst FONT_SIZE_LIST = [\r\n\t\"xx-small\",\r\n\t\"x-small\",\r\n\t\"small\",\r\n\t\"medium\",\r\n\t\"large\",\r\n\t\"x-large\",\r\n\t\"xx-large\",\r\n\t\"xxx-large\",\r\n\t\"smaller\",\r\n\t\"larger\",\r\n\t\"8px\",\r\n\t\"10px\",\r\n\t\"12px\",\r\n\t\"14px\",\r\n\t\"16px\",\r\n\t\"8pt\",\r\n\t\"10pt\",\r\n\t\"12pt\",\r\n\t\"14pt\",\r\n\t\"0.6em\",\r\n\t\"0.8em\",\r\n\t\"1.2em\",\r\n\t\"1.4em\",\r\n\t\"60%\",\r\n\t\"80%\",\r\n\t\"120%\",\r\n\t\"140%\",\r\n\t\"inherit\",\r\n\t\"initial\",\r\n\t\"unset\",\r\n];\r\n\r\nexport interface FontSizeProps {\r\n\tid?: string;\r\n\tstartSize: string;\r\n\tupdateSize: (newSize: string) => void;\r\n}\r\n\r\n/*\r\n FontSize component to update theme variables. Text input that validates against browser.\r\n \r\n @param {{ id?: string; startSize: string; updateSize: (newSize: string) => void }} { startSize, updateSize }\r\n */\r\nexport const FontSize = ({ id, startSize, updateSize }: FontSizeProps) => {\r\n\tconst [size, setSize] = useState(startSize);\r\n\r\n\treturn (\r\n\t\t<div className=\"font-size-picker\">\r\n\t\t\t<select\r\n\t\t\t\t{...{ id }}\r\n\t\t\t\tvalue={size}\r\n\t\t\t\tonChange={(e: ChangeEvent<HTMLSelectElement>) => {\r\n\t\t\t\t\tsetSize(e.target.value);\r\n\t\t\t\t\tupdateSize(e.target.value);\r\n\t\t\t\t}}\r\n\t\t\t>\r\n\t\t\t\t{FONT_SIZE_LIST.map((font_size) => (\r\n\t\t\t\t\t<option key={font_size}>{font_size}</option>\r\n\t\t\t\t))}\r\n\t\t\t</select>\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"FontSizeSelector.js","sourceRoot":"","sources":["../../../src/components/common/FontSizeSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAe,QAAQ,EAAE,MAAM,OAAO,CAAC;AAErD,MAAM,cAAc,GAAG;IACtB,UAAU;IACV,SAAS;IACT,OAAO;IACP,QAAQ;IACR,OAAO;IACP,SAAS;IACT,UAAU;IACV,WAAW;IACX,SAAS;IACT,QAAQ;IACR,KAAK;IACL,MAAM;IACN,MAAM;IACN,MAAM;IACN,MAAM;IACN,KAAK;IACL,MAAM;IACN,MAAM;IACN,MAAM;IACN,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,KAAK;IACL,KAAK;IACL,MAAM;IACN,MAAM;IACN,SAAS;IACT,SAAS;IACT,OAAO;CACP,CAAC;AAaF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAiB,EAAE,EAAE;IACxE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACN,6BAAK,SAAS,EAAC,kBAAkB;QAChC,gDACK,EAAE,EAAE,EAAE,IACV,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAiC,EAAE,EAAE;gBAC/C,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBACxB,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC5B,CAAC,KAEA,cAAc,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAClC,gCAAQ,GAAG,EAAE,SAAS,IAAG,SAAS,CAAU,CAC5C,CAAC,CACM,CACJ,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { ChangeEvent, useState } from \"react\";\n\nconst FONT_SIZE_LIST = [\n\t\"xx-small\",\n\t\"x-small\",\n\t\"small\",\n\t\"medium\",\n\t\"large\",\n\t\"x-large\",\n\t\"xx-large\",\n\t\"xxx-large\",\n\t\"smaller\",\n\t\"larger\",\n\t\"8px\",\n\t\"10px\",\n\t\"12px\",\n\t\"14px\",\n\t\"16px\",\n\t\"8pt\",\n\t\"10pt\",\n\t\"12pt\",\n\t\"14pt\",\n\t\"0.6em\",\n\t\"0.8em\",\n\t\"1.2em\",\n\t\"1.4em\",\n\t\"60%\",\n\t\"80%\",\n\t\"120%\",\n\t\"140%\",\n\t\"inherit\",\n\t\"initial\",\n\t\"unset\",\n];\n\nexport interface FontSizeProps {\n\tid?: string;\n\tstartSize: string;\n\tupdateSize: (newSize: string) => void;\n}\n\n/*\n FontSize component to update theme variables. Text input that validates against browser.\n \n @param {{ id?: string; startSize: string; updateSize: (newSize: string) => void }} { startSize, updateSize }\n */\nexport const FontSize = ({ id, startSize, updateSize }: FontSizeProps) => {\n\tconst [size, setSize] = useState(startSize);\n\n\treturn (\n\t\t<div className=\"font-size-picker\">\n\t\t\t<select\n\t\t\t\t{...{ id }}\n\t\t\t\tvalue={size}\n\t\t\t\tonChange={(e: ChangeEvent<HTMLSelectElement>) => {\n\t\t\t\t\tsetSize(e.target.value);\n\t\t\t\t\tupdateSize(e.target.value);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{FONT_SIZE_LIST.map((font_size) => (\n\t\t\t\t\t<option key={font_size}>{font_size}</option>\n\t\t\t\t))}\n\t\t\t</select>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/common/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/common/Header.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,kBAAkB,CAAC;AAQ1B,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,CAC7C,6BAAK,SAAS,EAAC,aAAa;IAC3B,4BAAI,SAAS,EAAC,YAAY;QACzB,6BAAK,SAAS,EAAC,UAAU;YACvB,KAAK,CAAC,YAAY,IAAI,CACtB,oBAAC,MAAM,IACN,OAAO,EAAC,SAAS,EACjB,UAAU,EAAC,cAAc,EACzB,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,CAAC,CAAsC,EAAE,EAAE;oBACnD,IAAI,KAAK,CAAC,YAAY,EAAE;wBACvB,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;qBACtB;gBACF,CAAC,GACA,CACF;YAEA,KAAK,CAAC,QAAQ,CACV;QACL,KAAK,CAAC,YAAY,IAAI,oBAAC,UAAU,IAAC,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,KAAK,CAAC,YAAY,GAAI,CAC3F,CACA,CACN,CAAC","sourcesContent":["/!\r\n Copyright 2017 - 2020 by ChartIQ, Inc.\r\n * All rights reserved.\r\n */\r\n\r\nimport React from \"react\";\r\nimport { Button } from \"./Button\";\r\nimport { ButtonIcon } from \"./ButtonIcon\";\r\nimport \"./css/header.css\";\r\n\r\nexport interface HeaderProps {\r\n\tchildren: string;\r\n\tbackFunction?: (e: React.MouseEvent<HTMLButtonElement>) => void;\r\n\thelpFunction?: (e: React.MouseEvent<HTMLButtonElement>) => void;\r\n}\r\n\r\nexport const Header = (props: HeaderProps) => (\r\n\t<div className=\"view-header\">\r\n\t\t<h1 className=\"view-title\">\r\n\t\t\t<div className=\"leftSide\">\r\n\t\t\t\t{props.backFunction && (\r\n\t\t\t\t\t<Button\r\n\t\t\t\t\t\tfashion=\"primary\"\r\n\t\t\t\t\t\ticonBefore=\"chevron-left\"\r\n\t\t\t\t\t\ttext=\"Back\"\r\n\t\t\t\t\t\tonClick={(e: React.MouseEvent<HTMLButtonElement>) => {\r\n\t\t\t\t\t\t\tif (props.backFunction) {\r\n\t\t\t\t\t\t\t\tprops.backFunction(e);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t}}\r\n\t\t\t\t\t/>\r\n\t\t\t\t)}\r\n\r\n\t\t\t\t{props.children}\r\n\t\t\t</div>\r\n\t\t\t{props.helpFunction && <ButtonIcon icon=\"life-ring\" text=\"Help\" onClick={props.helpFunction} />}\r\n\t\t</h1>\r\n\t</div>\r\n);\r\n"]}
1	+ {"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/common/Header.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,kBAAkB,CAAC;AAQ1B,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,CAC7C,6BAAK,SAAS,EAAC,aAAa;IAC3B,4BAAI,SAAS,EAAC,YAAY;QACzB,6BAAK,SAAS,EAAC,UAAU;YACvB,KAAK,CAAC,YAAY,IAAI,CACtB,oBAAC,MAAM,IACN,OAAO,EAAC,SAAS,EACjB,UAAU,EAAC,cAAc,EACzB,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,CAAC,CAAsC,EAAE,EAAE;oBACnD,IAAI,KAAK,CAAC,YAAY,EAAE;wBACvB,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;qBACtB;gBACF,CAAC,GACA,CACF;YAEA,KAAK,CAAC,QAAQ,CACV;QACL,KAAK,CAAC,YAAY,IAAI,oBAAC,UAAU,IAAC,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,KAAK,CAAC,YAAY,GAAI,CAC3F,CACA,CACN,CAAC","sourcesContent":["/!\n Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React from \"react\";\nimport { Button } from \"./Button\";\nimport { ButtonIcon } from \"./ButtonIcon\";\nimport \"./css/header.css\";\n\nexport interface HeaderProps {\n\tchildren: string;\n\tbackFunction?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n\thelpFunction?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const Header = (props: HeaderProps) => (\n\t<div className=\"view-header\">\n\t\t<h1 className=\"view-title\">\n\t\t\t<div className=\"leftSide\">\n\t\t\t\t{props.backFunction && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tfashion=\"primary\"\n\t\t\t\t\t\ticonBefore=\"chevron-left\"\n\t\t\t\t\t\ttext=\"Back\"\n\t\t\t\t\t\tonClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n\t\t\t\t\t\t\tif (props.backFunction) {\n\t\t\t\t\t\t\t\tprops.backFunction(e);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{props.children}\n\t\t\t</div>\n\t\t\t{props.helpFunction && <ButtonIcon icon=\"life-ring\" text=\"Help\" onClick={props.helpFunction} />}\n\t\t</h1>\n\t</div>\n);\n"]}

package/react/components/common/ImagePreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImagePreview.js","sourceRoot":"","sources":["../../../src/components/common/ImagePreview.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,SAAS,EAAqB,MAAM,aAAa,CAAC;AAC3D,OAAO,yBAAyB,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAgB,MAAM,YAAY,CAAC;AAEpD,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IAC3B,mCAAe,CAAA;IACf,mCAAe,CAAA;AAChB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAYD,IAAI,gBAAgB,GAAG,CAAC,CAAC;AAEzB,MAAM,SAAS,GAAG,CAAC,IAAY,EAAE,OAAe,EAAE,EAAE,CACnD,IAAI;KACF,OAAO,CAAC,IAAI,MAAM,CAAC,IAAI,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC;KACtC,OAAO,CAAC,SAAS,EAAE,GAAG,CAAC;KACvB,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;AAEtB,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAE,EAAE;IACxD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,gBAAgB,CAAC,CAAC;IACjE,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,gBAAgB,CAAC,KAAK,CAAC;IAChE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAsB,IAAI,CAAC,CAAC;IAE1E,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAElF,SAAS,CAAC,GAAG,EAAE;QACd,IAAI,KAAK,CAAC,UAAU,EAAE;YACrB,KAAK,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC;SAC5B;IACF,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,SAAS,CAAC,GAAG,EAAE;QACd,YAAY,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IACrD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACN,oBAAC,QAAQ,IACR,WAAW,EAAE,CAAC,IAAU,EAAE,EAAE;YAC3B,cAAc,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;QAED,6BAAK,SAAS,EAAE,CAAC,yBAAyB,EAAE,sBAAsB,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;YACzF,oBAAC,SAAS,kBACT,KAAK,EAAE,SAAS,EAChB,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,UAAU,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC7B,YAAY,CAAC,KAAK,CAAC,CAAC;oBACpB,aAAa,CAAC,EAAE,gBAAgB,CAAC,CAAC;gBACnC,CAAC,EACD,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,UAAU,EAAE,WAAW,EACvB,gBAAgB,EAAE,IAAI,IAClB,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAC1B;YAEZ,CAAC,SAAS,CAAC,CAAC,CAAC,CACb,6BAAK,SAAS,EAAC,eAAe,GAAO,CACrC,CAAC,CAAC,CAAC,CACH,6BAAK,SAAS,EAAC,gBAAgB;gBAC9B,6BAAK,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO,IAAI,SAAS,IAAI,UAAU,EAAE,GAAI,CACtD,CACN,CACI,CACI,CACX,CAAC;AACH,CAAC,CAAC","sourcesContent":["/!\r\n Copyright 2017 - 2020 by ChartIQ, Inc.\r\n * All rights reserved.\r\n */\r\n\r\nimport React, { useState, useEffect } from \"react\";\r\n\r\nimport { FileInput, FileInputUploadCb } from \"./FileInput\";\r\nimport \"./css/image-preview.css\";\r\nimport { DropZone, FileWithPath } from \"./DropZone\";\r\n\r\nexport enum ImagePreviewSize {\r\n\tSMALL = \"small\",\r\n\tLARGE = \"large\",\r\n}\r\n\r\nexport type ImagePreviewProps = {\r\n\tid?: string;\r\n\tvalue: string;\r\n\tbaseURL: string;\r\n\tonSetValue?: (value: string) => void;\r\n\tuploadFunction: FileInputUploadCb;\r\n\tacceptTypes: string[];\r\n\tpreviewSize?: ImagePreviewSize;\r\n};\r\n\r\nlet globalCacheIndex = 0;\r\n\r\nconst cleanPath = (path: string, baseURL: string) =>\r\n\tpath\r\n\t\t.replace(new RegExp(`^${baseURL}`), \"\")\r\n\t\t.replace(/\\/{1,}/g, \"/\")\r\n\t\t.replace(/^\\//, \"\");\r\n\r\nexport const ImagePreview = (props: ImagePreviewProps) => {\r\n\tconst [cacheIndex, setCacheIndex] = useState(++globalCacheIndex);\r\n\tconst previewSize = props.previewSize \|\| ImagePreviewSize.SMALL;\r\n\tconst [droppedFile, setDroppedFile] = useState<FileWithPath \| null>(null);\r\n\r\n\tconst [imagePath, setImagePath] = useState(cleanPath(props.value, props.baseURL));\r\n\r\n\tuseEffect(() => {\r\n\t\tif (props.onSetValue) {\r\n\t\t\tprops.onSetValue(imagePath);\r\n\t\t}\r\n\t}, [imagePath]);\r\n\r\n\tuseEffect(() => {\r\n\t\tsetImagePath(cleanPath(props.value, props.baseURL));\r\n\t}, [props]);\r\n\r\n\treturn (\r\n\t\t<DropZone\r\n\t\t\tprocessFile={(file: File) => {\r\n\t\t\t\tsetDroppedFile(file);\r\n\t\t\t}}\r\n\t\t>\r\n\t\t\t<div className={[\"image-preview-container\", `image-preview-size-${previewSize}`].join(\" \")}>\r\n\t\t\t\t<FileInput\r\n\t\t\t\t\tvalue={imagePath}\r\n\t\t\t\t\tuploadFunction={props.uploadFunction}\r\n\t\t\t\t\tonSetValue={(value: string) => {\r\n\t\t\t\t\t\tsetImagePath(value);\r\n\t\t\t\t\t\tsetCacheIndex(++globalCacheIndex);\r\n\t\t\t\t\t}}\r\n\t\t\t\t\tacceptTypes={props.acceptTypes}\r\n\t\t\t\t\tpresetFile={droppedFile}\r\n\t\t\t\t\tsuppressDropzone={true}\r\n\t\t\t\t\t{...(props.id ? { id: props.id } : {})}\r\n\t\t\t\t></FileInput>\r\n\r\n\t\t\t\t{!imagePath ? (\r\n\t\t\t\t\t<div className=\"empty-preview\"></div>\r\n\t\t\t\t) : (\r\n\t\t\t\t\t<div className=\"filled-preview\">\r\n\t\t\t\t\t\t<img src={`${props.baseURL}/${imagePath}?${cacheIndex}`} />\r\n\t\t\t\t\t</div>\r\n\t\t\t\t)}\r\n\t\t\t</div>\r\n\t\t</DropZone>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"ImagePreview.js","sourceRoot":"","sources":["../../../src/components/common/ImagePreview.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,SAAS,EAAqB,MAAM,aAAa,CAAC;AAC3D,OAAO,yBAAyB,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAgB,MAAM,YAAY,CAAC;AAEpD,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IAC3B,mCAAe,CAAA;IACf,mCAAe,CAAA;AAChB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAYD,IAAI,gBAAgB,GAAG,CAAC,CAAC;AAEzB,MAAM,SAAS,GAAG,CAAC,IAAY,EAAE,OAAe,EAAE,EAAE,CACnD,IAAI;KACF,OAAO,CAAC,IAAI,MAAM,CAAC,IAAI,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC;KACtC,OAAO,CAAC,SAAS,EAAE,GAAG,CAAC;KACvB,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;AAEtB,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAE,EAAE;IACxD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,gBAAgB,CAAC,CAAC;IACjE,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,gBAAgB,CAAC,KAAK,CAAC;IAChE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAsB,IAAI,CAAC,CAAC;IAE1E,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAElF,SAAS,CAAC,GAAG,EAAE;QACd,IAAI,KAAK,CAAC,UAAU,EAAE;YACrB,KAAK,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC;SAC5B;IACF,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,SAAS,CAAC,GAAG,EAAE;QACd,YAAY,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IACrD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACN,oBAAC,QAAQ,IACR,WAAW,EAAE,CAAC,IAAU,EAAE,EAAE;YAC3B,cAAc,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;QAED,6BAAK,SAAS,EAAE,CAAC,yBAAyB,EAAE,sBAAsB,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;YACzF,oBAAC,SAAS,kBACT,KAAK,EAAE,SAAS,EAChB,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,UAAU,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC7B,YAAY,CAAC,KAAK,CAAC,CAAC;oBACpB,aAAa,CAAC,EAAE,gBAAgB,CAAC,CAAC;gBACnC,CAAC,EACD,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,UAAU,EAAE,WAAW,EACvB,gBAAgB,EAAE,IAAI,IAClB,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAC1B;YAEZ,CAAC,SAAS,CAAC,CAAC,CAAC,CACb,6BAAK,SAAS,EAAC,eAAe,GAAO,CACrC,CAAC,CAAC,CAAC,CACH,6BAAK,SAAS,EAAC,gBAAgB;gBAC9B,6BAAK,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO,IAAI,SAAS,IAAI,UAAU,EAAE,GAAI,CACtD,CACN,CACI,CACI,CACX,CAAC;AACH,CAAC,CAAC","sourcesContent":["/!\n Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useState, useEffect } from \"react\";\n\nimport { FileInput, FileInputUploadCb } from \"./FileInput\";\nimport \"./css/image-preview.css\";\nimport { DropZone, FileWithPath } from \"./DropZone\";\n\nexport enum ImagePreviewSize {\n\tSMALL = \"small\",\n\tLARGE = \"large\",\n}\n\nexport type ImagePreviewProps = {\n\tid?: string;\n\tvalue: string;\n\tbaseURL: string;\n\tonSetValue?: (value: string) => void;\n\tuploadFunction: FileInputUploadCb;\n\tacceptTypes: string[];\n\tpreviewSize?: ImagePreviewSize;\n};\n\nlet globalCacheIndex = 0;\n\nconst cleanPath = (path: string, baseURL: string) =>\n\tpath\n\t\t.replace(new RegExp(`^${baseURL}`), \"\")\n\t\t.replace(/\\/{1,}/g, \"/\")\n\t\t.replace(/^\\//, \"\");\n\nexport const ImagePreview = (props: ImagePreviewProps) => {\n\tconst [cacheIndex, setCacheIndex] = useState(++globalCacheIndex);\n\tconst previewSize = props.previewSize \|\| ImagePreviewSize.SMALL;\n\tconst [droppedFile, setDroppedFile] = useState<FileWithPath \| null>(null);\n\n\tconst [imagePath, setImagePath] = useState(cleanPath(props.value, props.baseURL));\n\n\tuseEffect(() => {\n\t\tif (props.onSetValue) {\n\t\t\tprops.onSetValue(imagePath);\n\t\t}\n\t}, [imagePath]);\n\n\tuseEffect(() => {\n\t\tsetImagePath(cleanPath(props.value, props.baseURL));\n\t}, [props]);\n\n\treturn (\n\t\t<DropZone\n\t\t\tprocessFile={(file: File) => {\n\t\t\t\tsetDroppedFile(file);\n\t\t\t}}\n\t\t>\n\t\t\t<div className={[\"image-preview-container\", `image-preview-size-${previewSize}`].join(\" \")}>\n\t\t\t\t<FileInput\n\t\t\t\t\tvalue={imagePath}\n\t\t\t\t\tuploadFunction={props.uploadFunction}\n\t\t\t\t\tonSetValue={(value: string) => {\n\t\t\t\t\t\tsetImagePath(value);\n\t\t\t\t\t\tsetCacheIndex(++globalCacheIndex);\n\t\t\t\t\t}}\n\t\t\t\t\tacceptTypes={props.acceptTypes}\n\t\t\t\t\tpresetFile={droppedFile}\n\t\t\t\t\tsuppressDropzone={true}\n\t\t\t\t\t{...(props.id ? { id: props.id } : {})}\n\t\t\t\t></FileInput>\n\n\t\t\t\t{!imagePath ? (\n\t\t\t\t\t<div className=\"empty-preview\"></div>\n\t\t\t\t) : (\n\t\t\t\t\t<div className=\"filled-preview\">\n\t\t\t\t\t\t<img src={`${props.baseURL}/${imagePath}?${cacheIndex}`} />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</DropZone>\n\t);\n};\n"]}

package/react/components/common/LoadingSpinner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../src/components/common/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,2BAA2B,CAAC;AAEnC,MAAM,UAAU,sBAAsB;IACrC,OAAO,CACN,6BAAK,SAAS,EAAC,iBAAiB;QAC/B,6BAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,iBAAiB;YAChE,2BAAG,EAAE,EAAC,SAAS,eAAW,SAAS;gBAClC,2BAAG,EAAE,EAAC,WAAW,EAAC,SAAS,EAAC,eAAe,eAAW,SAAS;oBAC9D,gCAAQ,SAAS,EAAC,OAAO,EAAC,EAAE,EAAC,OAAO,EAAC,EAAE,EAAC,OAAO,EAAC,CAAC,EAAC,MAAM,GAAG;oBAC3D,8BAAM,SAAS,EAAC,OAAO,EAAC,CAAC,EAAC,wCAAwC,GAAG,CAClE,CACD,CACC,CACD,CACN,CAAC;AACH,CAAC","sourcesContent":["import React from \"react\";\r\nimport \"./css/loading-spinner.css\";\r\n\r\nexport function CircularLoadingSpinner() {\r\n\treturn (\r\n\t\t<div className=\"modal same-spin\">\r\n\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 43.83 43.83\">\r\n\t\t\t\t<g id=\"Layer_2\" data-name=\"Layer 2\">\r\n\t\t\t\t\t<g id=\"Layer_1-2\" className=\"circle_rotate\" data-name=\"Layer 1\">\r\n\t\t\t\t\t\t<circle className=\"cls-1\" cx=\"21.92\" cy=\"21.92\" r=\"20.2\" />\r\n\t\t\t\t\t\t<path className=\"cls-2\" d=\"M42.11,21.92a20.2,20.2,0,0,0-20.2-20.2\" />\r\n\t\t\t\t\t</g>\r\n\t\t\t\t</g>\r\n\t\t\t</svg>\r\n\t\t</div>\r\n\t);\r\n}\r\n"]}
1	+ {"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../src/components/common/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,2BAA2B,CAAC;AAEnC,MAAM,UAAU,sBAAsB;IACrC,OAAO,CACN,6BAAK,SAAS,EAAC,iBAAiB;QAC/B,6BAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,iBAAiB;YAChE,2BAAG,EAAE,EAAC,SAAS,eAAW,SAAS;gBAClC,2BAAG,EAAE,EAAC,WAAW,EAAC,SAAS,EAAC,eAAe,eAAW,SAAS;oBAC9D,gCAAQ,SAAS,EAAC,OAAO,EAAC,EAAE,EAAC,OAAO,EAAC,EAAE,EAAC,OAAO,EAAC,CAAC,EAAC,MAAM,GAAG;oBAC3D,8BAAM,SAAS,EAAC,OAAO,EAAC,CAAC,EAAC,wCAAwC,GAAG,CAClE,CACD,CACC,CACD,CACN,CAAC;AACH,CAAC","sourcesContent":["import React from \"react\";\nimport \"./css/loading-spinner.css\";\n\nexport function CircularLoadingSpinner() {\n\treturn (\n\t\t<div className=\"modal same-spin\">\n\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 43.83 43.83\">\n\t\t\t\t<g id=\"Layer_2\" data-name=\"Layer 2\">\n\t\t\t\t\t<g id=\"Layer_1-2\" className=\"circle_rotate\" data-name=\"Layer 1\">\n\t\t\t\t\t\t<circle className=\"cls-1\" cx=\"21.92\" cy=\"21.92\" r=\"20.2\" />\n\t\t\t\t\t\t<path className=\"cls-2\" d=\"M42.11,21.92a20.2,20.2,0,0,0-20.2-20.2\" />\n\t\t\t\t\t</g>\n\t\t\t\t</g>\n\t\t\t</svg>\n\t\t</div>\n\t);\n}\n"]}

package/react/components/common/Tab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../../src/components/common/Tab.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,eAAe,EAAmC,MAAM,OAAO,CAAC;AAClG,OAAO,eAAe,CAAC;AAOvB,MAAM,CAAC,MAAM,GAAG,GAAgC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,EAAE;IAC3E,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC;IAC/D,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEzC,eAAe,CAAC,GAAG,EAAE;;QAIpB,IAAI,GAAG,CAAC,OAAO,KAAK,IAAI,EAAE;YACzB,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,MAAM,CAAC,WAAW,GAAG,CAAC,CAAA,MAAA,GAAG,CAAC,OAAO,CAAC,qBAAqB,EAAE,0CAAE,GAAG,KAAI,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC;SAC5G;IACF,CAAC,CAAC,CAAC;IAEH,OAAO,CACN;QACC,6BAAK,IAAI,EAAC,SAAS,IACjB,KAAK,CAAC,QAAQ,CAAC,GAAG,CAClB,QAAQ,EACR,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CACZ,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,CAC5B,6BACC,GAAG,EAAE,OAAO,GAAG,EAAE,EACjB,IAAI,EAAC,KAAK,mBACK,WAAW,KAAK,GAAG,mBACnB,YAAY,GAAG,EAAE,EAChC,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;gBAChB,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;oBACvC,cAAc,CAAC,GAAG,CAAC,CAAC;oBACpB,CAAC,CAAC,cAAc,EAAE,CAAC;iBACnB;YACF,CAAC,EACD,OAAO,EAAE,GAAG,EAAE;gBACb,cAAc,CAAC,GAAG,CAAC,CAAC;YACrB,CAAC,IAEC,GAAoB,CAAC,KAAK,CAAC,YAAY,CAAC,CACrC,CACN,CACF,CACI;QAEN,6BAAK,EAAE,EAAC,mBAAmB,EAAC,GAAG,EAAE,GAAG,IAClC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC,CAC3C,6BACC,GAAG,EAAE,YAAY,GAAG,EAAE,EACtB,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,YAAY,GAAG,EAAE,EACrB,SAAS,EAAE,WAAW,KAAK,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAE9C,GAAG,CACC,CACN,CAAC,CACG,CACJ,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["/!\r\n Copyright 2017 - 2020 by ChartIQ, Inc.\r\n * All rights reserved.\r\n */\r\n\r\nimport React, { useState, useRef, useLayoutEffect, FunctionComponent, ReactElement } from \"react\";\r\nimport \"./css/tab.css\";\r\n\r\nexport type TabProps = {\r\n\tchildren?: React.ReactNode;\r\n\tautofocus?: number;\r\n};\r\n\r\nexport const Tab: FunctionComponent<TabProps> = ({ children, autofocus }) => {\r\n\tconst [selectedTab, setSelectedTab] = useState(autofocus \|\| 0);\r\n\tconst ref = useRef<HTMLDivElement>(null);\r\n\r\n\tuseLayoutEffect(() => {\r\n\t\t// Allow for the tab panel content to look nice with its own scrollbar,\r\n\t\t// which also keeps the heading/tab group at the top of the page.\r\n\t\t// It feels like css flex should do this, but I could never get it to work.\r\n\t\tif (ref.current !== null) {\r\n\t\t\tref.current.style.height = `${window.innerHeight - (ref.current.getBoundingClientRect()?.top \|\| 0) - 10}px`;\r\n\t\t}\r\n\t});\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t<div role=\"tablist\">\r\n\t\t\t\t{React.Children.map(\r\n\t\t\t\t\tchildren,\r\n\t\t\t\t\t(tab, key) =>\r\n\t\t\t\t\t\tReact.isValidElement(tab) && (\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\tkey={`tab-${key}`}\r\n\t\t\t\t\t\t\t\trole=\"tab\"\r\n\t\t\t\t\t\t\t\taria-selected={selectedTab === key}\r\n\t\t\t\t\t\t\t\taria-controls={`tabpanel-${key}`}\r\n\t\t\t\t\t\t\t\ttabIndex={0}\r\n\t\t\t\t\t\t\t\tonKeyDown={(e) => {\r\n\t\t\t\t\t\t\t\t\tif (e.key === \" \" \|\| e.key === \"Enter\") {\r\n\t\t\t\t\t\t\t\t\t\tsetSelectedTab(key);\r\n\t\t\t\t\t\t\t\t\t\te.preventDefault();\r\n\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\t\tsetSelectedTab(key);\r\n\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t{(tab as ReactElement).props[\"data-label\"]}\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t)\r\n\t\t\t\t)}\r\n\t\t\t</div>\r\n\r\n\t\t\t<div id=\"tabpanelContainer\" ref={ref}>\r\n\t\t\t\t{React.Children.map(children, (tab, key) => (\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\tkey={`tabpanel-${key}`}\r\n\t\t\t\t\t\trole=\"tabpanel\"\r\n\t\t\t\t\t\tid={`tabpanel-${key}`}\r\n\t\t\t\t\t\tclassName={selectedTab === key ? \"visible\" : \"\"}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{tab}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t))}\r\n\t\t\t</div>\r\n\t\t</>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../../src/components/common/Tab.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,eAAe,EAAmC,MAAM,OAAO,CAAC;AAClG,OAAO,eAAe,CAAC;AAOvB,MAAM,CAAC,MAAM,GAAG,GAAgC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,EAAE;IAC3E,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC;IAC/D,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEzC,eAAe,CAAC,GAAG,EAAE;;QAIpB,IAAI,GAAG,CAAC,OAAO,KAAK,IAAI,EAAE;YACzB,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,MAAM,CAAC,WAAW,GAAG,CAAC,CAAA,MAAA,GAAG,CAAC,OAAO,CAAC,qBAAqB,EAAE,0CAAE,GAAG,KAAI,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC;SAC5G;IACF,CAAC,CAAC,CAAC;IAEH,OAAO,CACN;QACC,6BAAK,IAAI,EAAC,SAAS,IACjB,KAAK,CAAC,QAAQ,CAAC,GAAG,CAClB,QAAQ,EACR,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CACZ,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,CAC5B,6BACC,GAAG,EAAE,OAAO,GAAG,EAAE,EACjB,IAAI,EAAC,KAAK,mBACK,WAAW,KAAK,GAAG,mBACnB,YAAY,GAAG,EAAE,EAChC,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;gBAChB,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;oBACvC,cAAc,CAAC,GAAG,CAAC,CAAC;oBACpB,CAAC,CAAC,cAAc,EAAE,CAAC;iBACnB;YACF,CAAC,EACD,OAAO,EAAE,GAAG,EAAE;gBACb,cAAc,CAAC,GAAG,CAAC,CAAC;YACrB,CAAC,IAEC,GAAoB,CAAC,KAAK,CAAC,YAAY,CAAC,CACrC,CACN,CACF,CACI;QAEN,6BAAK,EAAE,EAAC,mBAAmB,EAAC,GAAG,EAAE,GAAG,IAClC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC,CAC3C,6BACC,GAAG,EAAE,YAAY,GAAG,EAAE,EACtB,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,YAAY,GAAG,EAAE,EACrB,SAAS,EAAE,WAAW,KAAK,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAE9C,GAAG,CACC,CACN,CAAC,CACG,CACJ,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["/!\n Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useState, useRef, useLayoutEffect, FunctionComponent, ReactElement } from \"react\";\nimport \"./css/tab.css\";\n\nexport type TabProps = {\n\tchildren?: React.ReactNode;\n\tautofocus?: number;\n};\n\nexport const Tab: FunctionComponent<TabProps> = ({ children, autofocus }) => {\n\tconst [selectedTab, setSelectedTab] = useState(autofocus \|\| 0);\n\tconst ref = useRef<HTMLDivElement>(null);\n\n\tuseLayoutEffect(() => {\n\t\t// Allow for the tab panel content to look nice with its own scrollbar,\n\t\t// which also keeps the heading/tab group at the top of the page.\n\t\t// It feels like css flex should do this, but I could never get it to work.\n\t\tif (ref.current !== null) {\n\t\t\tref.current.style.height = `${window.innerHeight - (ref.current.getBoundingClientRect()?.top \|\| 0) - 10}px`;\n\t\t}\n\t});\n\n\treturn (\n\t\t<>\n\t\t\t<div role=\"tablist\">\n\t\t\t\t{React.Children.map(\n\t\t\t\t\tchildren,\n\t\t\t\t\t(tab, key) =>\n\t\t\t\t\t\tReact.isValidElement(tab) && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tkey={`tab-${key}`}\n\t\t\t\t\t\t\t\trole=\"tab\"\n\t\t\t\t\t\t\t\taria-selected={selectedTab === key}\n\t\t\t\t\t\t\t\taria-controls={`tabpanel-${key}`}\n\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\tif (e.key === \" \" \|\| e.key === \"Enter\") {\n\t\t\t\t\t\t\t\t\t\tsetSelectedTab(key);\n\t\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tsetSelectedTab(key);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{(tab as ReactElement).props[\"data-label\"]}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t<div id=\"tabpanelContainer\" ref={ref}>\n\t\t\t\t{React.Children.map(children, (tab, key) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={`tabpanel-${key}`}\n\t\t\t\t\t\trole=\"tabpanel\"\n\t\t\t\t\t\tid={`tabpanel-${key}`}\n\t\t\t\t\t\tclassName={selectedTab === key ? \"visible\" : \"\"}\n\t\t\t\t\t>\n\t\t\t\t\t\t{tab}\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"]}

package/react/components/common/Tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/common/Tooltip.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAUhD,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACvB,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,OAAO,EAClB,QAAQ,GAAG,EAAE,EACb,YAAY,EACZ,OAAO,GAAG,GAAG,EAAE,GAAE,CAAC,GACJ,EAAE,EAAE;IAClB,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAItD,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACvD,MAAM,GAAG,GACR,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK,GAAG,MAAM,CAAC,UAAU;QACvG,CAAC,CAAC,MAAM;QACR,CAAC,CAAC,QAAQ,CAAC;IAEb,OAAO,CACN,6BACC,SAAS,EAAE,CAAC,SAAS,EAAE,4BAA4B,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EACnE,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,SAAS,gBACF,QAAQ,EACpB,WAAW,EAAE,GAAG,EAAE;YACjB,cAAc,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC,EACD,OAAO,EAAE,GAAG,EAAE;YACb,cAAc,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;YAClB,cAAc,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;YACZ,cAAc,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,EACD,OAAO,EAAE,OAAO;QAEf,YAAY,CAAC,CAAC,CAAC,CACf,6BAAK,SAAS,EAAE,YAAY,GAAQ,CACpC,CAAC,CAAC,CAAC,CACH,6BAAK,SAAS,EAAE,CAAC,cAAc,EAAE,gBAAgB,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IAChE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,CACtC,oBAAC,aAAa,IAAC,IAAI,EAAC,oBAAoB,GAAiB,CACzD,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,CACrB,oBAAC,aAAa,IAAC,IAAI,EAAC,MAAM,GAAiB,CAC3C,CAAC,CAAC,CAAC,CACH,oBAAC,aAAa,IAAC,IAAI,EAAC,iBAAiB,GAAiB,CACtD,CACI,CACN;QACD,6BAAK,GAAG,EAAE,iBAAiB,EAAE,SAAS,EAAE,CAAC,iBAAiB,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IACjG,QAAQ,CACJ,CACD,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["/!\r\n Copyright 2017 - 2020 by ChartIQ, Inc.\r\n * All rights reserved.\r\n */\r\n\r\nimport React, { useState, useRef } from \"react\";\r\nimport \"./css/tooltip.css\";\r\nimport { FinsembleIcon } from \"./FinsembleIcon\";\r\n\r\nexport type TooltipProps = {\r\n\ttype?: \"info\" \| \"error\" \| \"warn\" \| \"lock\";\r\n\taltClassName?: string;\r\n\tposition?: string;\r\n\tchildren?: string;\r\n\tonClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\r\n};\r\n\r\nexport const Tooltip = ({\r\n\ttype = \"info\",\r\n\tposition = \"right\",\r\n\tchildren = \"\",\r\n\taltClassName,\r\n\tonClick = () => {},\r\n}: TooltipProps) => {\r\n\tconst [tooltipOpen, setTooltipOpen] = useState(false);\r\n\r\n\t// If the tooltip content is floating so far to the right that it flows offscreen, switch the position to the left.\r\n\t// This only works for right-sided tooltips. Left-sided tooltips that float offscreen are not addressed.\r\n\tconst tooltipContentRef = useRef<HTMLDivElement>(null);\r\n\tconst pos =\r\n\t\ttooltipContentRef.current && tooltipContentRef.current.getBoundingClientRect().right > window.innerWidth\r\n\t\t\t? \"left\"\r\n\t\t\t: position;\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={[\"tooltip\", `tooltip-position-content-${pos}`].join(\" \")}\r\n\t\t\ttabIndex={0}\r\n\t\t\trole=\"tooltip\"\r\n\t\t\taria-label={children}\r\n\t\t\tonMouseOver={() => {\r\n\t\t\t\tsetTooltipOpen(true);\r\n\t\t\t}}\r\n\t\t\tonFocus={() => {\r\n\t\t\t\tsetTooltipOpen(true);\r\n\t\t\t}}\r\n\t\t\tonMouseLeave={() => {\r\n\t\t\t\tsetTooltipOpen(false);\r\n\t\t\t}}\r\n\t\t\tonBlur={() => {\r\n\t\t\t\tsetTooltipOpen(false);\r\n\t\t\t}}\r\n\t\t\tonClick={onClick}\r\n\t\t>\r\n\t\t\t{altClassName ? (\r\n\t\t\t\t<div className={altClassName}></div>\r\n\t\t\t) : (\r\n\t\t\t\t<div className={[\"tooltip-icon\", `tooltip-icon-${type}`].join(\" \")}>\r\n\t\t\t\t\t{type === \"error\" \|\| type === \"warn\" ? (\r\n\t\t\t\t\t\t<FinsembleIcon icon=\"exclamation-circle\"></FinsembleIcon>\r\n\t\t\t\t\t) : type === \"lock\" ? (\r\n\t\t\t\t\t\t<FinsembleIcon icon=\"lock\"></FinsembleIcon>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<FinsembleIcon icon=\"question-circle\"></FinsembleIcon>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</div>\r\n\t\t\t)}\r\n\t\t\t<div ref={tooltipContentRef} className={[\"tooltip-content\", tooltipOpen ? \"visible\" : \"\"].join(\" \")}>\r\n\t\t\t\t{children}\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
1	+ {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/common/Tooltip.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAUhD,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACvB,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,OAAO,EAClB,QAAQ,GAAG,EAAE,EACb,YAAY,EACZ,OAAO,GAAG,GAAG,EAAE,GAAE,CAAC,GACJ,EAAE,EAAE;IAClB,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAItD,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACvD,MAAM,GAAG,GACR,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK,GAAG,MAAM,CAAC,UAAU;QACvG,CAAC,CAAC,MAAM;QACR,CAAC,CAAC,QAAQ,CAAC;IAEb,OAAO,CACN,6BACC,SAAS,EAAE,CAAC,SAAS,EAAE,4BAA4B,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EACnE,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,SAAS,gBACF,QAAQ,EACpB,WAAW,EAAE,GAAG,EAAE;YACjB,cAAc,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC,EACD,OAAO,EAAE,GAAG,EAAE;YACb,cAAc,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;YAClB,cAAc,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;YACZ,cAAc,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC,EACD,OAAO,EAAE,OAAO;QAEf,YAAY,CAAC,CAAC,CAAC,CACf,6BAAK,SAAS,EAAE,YAAY,GAAQ,CACpC,CAAC,CAAC,CAAC,CACH,6BAAK,SAAS,EAAE,CAAC,cAAc,EAAE,gBAAgB,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IAChE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,CACtC,oBAAC,aAAa,IAAC,IAAI,EAAC,oBAAoB,GAAiB,CACzD,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,CACrB,oBAAC,aAAa,IAAC,IAAI,EAAC,MAAM,GAAiB,CAC3C,CAAC,CAAC,CAAC,CACH,oBAAC,aAAa,IAAC,IAAI,EAAC,iBAAiB,GAAiB,CACtD,CACI,CACN;QACD,6BAAK,GAAG,EAAE,iBAAiB,EAAE,SAAS,EAAE,CAAC,iBAAiB,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IACjG,QAAQ,CACJ,CACD,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["/!\n Copyright 2017 - 2020 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport React, { useState, useRef } from \"react\";\nimport \"./css/tooltip.css\";\nimport { FinsembleIcon } from \"./FinsembleIcon\";\n\nexport type TooltipProps = {\n\ttype?: \"info\" \| \"error\" \| \"warn\" \| \"lock\";\n\taltClassName?: string;\n\tposition?: string;\n\tchildren?: string;\n\tonClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\nexport const Tooltip = ({\n\ttype = \"info\",\n\tposition = \"right\",\n\tchildren = \"\",\n\taltClassName,\n\tonClick = () => {},\n}: TooltipProps) => {\n\tconst [tooltipOpen, setTooltipOpen] = useState(false);\n\n\t// If the tooltip content is floating so far to the right that it flows offscreen, switch the position to the left.\n\t// This only works for right-sided tooltips. Left-sided tooltips that float offscreen are not addressed.\n\tconst tooltipContentRef = useRef<HTMLDivElement>(null);\n\tconst pos =\n\t\ttooltipContentRef.current && tooltipContentRef.current.getBoundingClientRect().right > window.innerWidth\n\t\t\t? \"left\"\n\t\t\t: position;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={[\"tooltip\", `tooltip-position-content-${pos}`].join(\" \")}\n\t\t\ttabIndex={0}\n\t\t\trole=\"tooltip\"\n\t\t\taria-label={children}\n\t\t\tonMouseOver={() => {\n\t\t\t\tsetTooltipOpen(true);\n\t\t\t}}\n\t\t\tonFocus={() => {\n\t\t\t\tsetTooltipOpen(true);\n\t\t\t}}\n\t\t\tonMouseLeave={() => {\n\t\t\t\tsetTooltipOpen(false);\n\t\t\t}}\n\t\t\tonBlur={() => {\n\t\t\t\tsetTooltipOpen(false);\n\t\t\t}}\n\t\t\tonClick={onClick}\n\t\t>\n\t\t\t{altClassName ? (\n\t\t\t\t<div className={altClassName}></div>\n\t\t\t) : (\n\t\t\t\t<div className={[\"tooltip-icon\", `tooltip-icon-${type}`].join(\" \")}>\n\t\t\t\t\t{type === \"error\" \|\| type === \"warn\" ? (\n\t\t\t\t\t\t<FinsembleIcon icon=\"exclamation-circle\"></FinsembleIcon>\n\t\t\t\t\t) : type === \"lock\" ? (\n\t\t\t\t\t\t<FinsembleIcon icon=\"lock\"></FinsembleIcon>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<FinsembleIcon icon=\"question-circle\"></FinsembleIcon>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div ref={tooltipContentRef} className={[\"tooltip-content\", tooltipOpen ? \"visible\" : \"\"].join(\" \")}>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}

package/react/components/common/css/application-edit-page.css CHANGED Viewed

@@ -1,117 +1,117 @@
-.app-edit {
-	position: absolute;
-	top: 0px;
-	left: 0px;
-	bottom: 0px;
-	right: 0px;
-	width: 100%;
-	height: 100%;
-	background-color: #171a20;
-}
-.app-edit-actions {
-	display: flex;
-	justify-content: space-between;
-	margin: 0.65em 3em;
-}
-.app-actions-right-wrapper {
-	width: 125px;
-	display: flex;
-	justify-content: space-between;
-}
-.app-edit-fieldset {
-	border: 0px;
-	padding: 0px;
-}
-.app-edit-fieldset legend {
-	font-size: 1.1em;
-	user-select: none;
-	font-weight: normal;
-	width: 100%;
-}
-.app-edit-fieldset label {
-	font-size: 1em;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	user-select: none;
-	font-weight: 600;
-	opacity: 75%;
-}
-.app-edit-field {
-	display: flex;
-	align-items: center;
-	margin: 0.9em 3em;
-}
-.app-edit-field > label {
-	width: 10em;
-	flex-grow: 0;
-	opacity: 75%;
-}
-.app-edit-field .emperorSelectContainer,
-.app-edit-field .emperorSelectContainer .search,
-.app-edit-field input {
-	flex-grow: 1;
-	max-width: 25rem;
-}
-.app-edit-field textarea {
-	flex-grow: 1;
-	min-height: 6rem;
-	max-width: 25rem;
-}
-.app-size-input {
-	margin: 0em 0.5em;
-}
-.app-size-fieldset legend {
-	float: left;
-	margin-right: 2em;
-	font-weight: 600;
-}
-.app-size-fieldset {
-	padding-top: 2px;
-	margin-left: 3em;
-}
-.app-size-field {
-	position: relative;
-	padding-right: 1.5em;
-	float: left;
-	clear: right;
-}
-.app-size-field input {
-	max-width: 2.9em;
-}
-.app-edit-field.description {
-	align-items: flex-start;
-}
-.app-edit-field.app-size label {
-	margin-top: 0.6em;
-}
-span.unit {
-	opacity: 75%;
-}
-.app-edit-field .emperorSelect {
-	max-height: 250px;
-}
-.app-type-container {
-	display: inline-flex;
-	margin-right: 1.5em;
-	justify-content: center;
-	align-items: center;
-}
+.app-edit {
+	position: absolute;
+	top: 0px;
+	left: 0px;
+	bottom: 0px;
+	right: 0px;
+	width: 100%;
+	height: 100%;
+	background-color: #171a20;
+}
+.app-edit-actions {
+	display: flex;
+	justify-content: space-between;
+	margin: 0.65em 3em;
+}
+.app-actions-right-wrapper {
+	width: 125px;
+	display: flex;
+	justify-content: space-between;
+}
+.app-edit-fieldset {
+	border: 0px;
+	padding: 0px;
+}
+.app-edit-fieldset legend {
+	font-size: 1.1em;
+	user-select: none;
+	font-weight: normal;
+	width: 100%;
+}
+.app-edit-fieldset label {
+	font-size: 1em;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	user-select: none;
+	font-weight: 600;
+	opacity: 75%;
+}
+.app-edit-field {
+	display: flex;
+	align-items: center;
+	margin: 0.9em 3em;
+}
+.app-edit-field > label {
+	width: 10em;
+	flex-grow: 0;
+	opacity: 75%;
+}
+.app-edit-field .emperorSelectContainer,
+.app-edit-field .emperorSelectContainer .search,
+.app-edit-field input {
+	flex-grow: 1;
+	max-width: 25rem;
+}
+.app-edit-field textarea {
+	flex-grow: 1;
+	min-height: 6rem;
+	max-width: 25rem;
+}
+.app-size-input {
+	margin: 0em 0.5em;
+}
+.app-size-fieldset legend {
+	float: left;
+	margin-right: 2em;
+	font-weight: 600;
+}
+.app-size-fieldset {
+	padding-top: 2px;
+	margin-left: 3em;
+}
+.app-size-field {
+	position: relative;
+	padding-right: 1.5em;
+	float: left;
+	clear: right;
+}
+.app-size-field input {
+	max-width: 2.9em;
+}
+.app-edit-field.description {
+	align-items: flex-start;
+}
+.app-edit-field.app-size label {
+	margin-top: 0.6em;
+}
+span.unit {
+	opacity: 75%;
+}
+.app-edit-field .emperorSelect {
+	max-height: 250px;
+}
+.app-type-container {
+	display: inline-flex;
+	margin-right: 1.5em;
+	justify-content: center;
+	align-items: center;
+}