,\n * \ttokens: typeof multi\n * }} ParserInit\n */\n\n/**\n * @typedef {(arg: { scanner: ScannerInit }) => void} TokenPlugin\n */\n\n/**\n * @typedef {(arg: { scanner: ScannerInit, parser: ParserInit }) => void} Plugin\n */\n\n/**\n * De-register all plugins and reset the internal state-machine. Used for\n * testing; not required in practice.\n * @private\n */\nfunction reset() {\n State.groups = {};\n INIT.scanner = null;\n INIT.parser = null;\n INIT.tokenQueue = [];\n INIT.pluginQueue = [];\n INIT.customSchemes = [];\n INIT.initialized = false;\n}\n\n/**\n * Register a token plugin to allow the scanner to recognize additional token\n * types before the parser state machine is constructed from the results.\n * @param {string} name of plugin to register\n * @param {TokenPlugin} plugin function that accepts the scanner state machine\n * and available scanner tokens and collections and extends the state machine to\n * recognize additional tokens or groups.\n */\nfunction registerTokenPlugin(name, plugin) {\n if (typeof plugin !== 'function') {\n throw new Error(`linkifyjs: Invalid token plugin ${plugin} (expects function)`);\n }\n for (let i = 0; i < INIT.tokenQueue.length; i++) {\n if (name === INIT.tokenQueue[i][0]) {\n warn(`linkifyjs: token plugin \"${name}\" already registered - will be overwritten`);\n INIT.tokenQueue[i] = [name, plugin];\n return;\n }\n }\n INIT.tokenQueue.push([name, plugin]);\n if (INIT.initialized) {\n warn(`linkifyjs: already initialized - will not register token plugin \"${name}\" ${warnAdvice}`);\n }\n}\n\n/**\n * Register a linkify plugin\n * @param {string} name of plugin to register\n * @param {Plugin} plugin function that accepts the parser state machine and\n * extends the parser to recognize additional link types\n */\nfunction registerPlugin(name, plugin) {\n if (typeof plugin !== 'function') {\n throw new Error(`linkifyjs: Invalid plugin ${plugin} (expects function)`);\n }\n for (let i = 0; i < INIT.pluginQueue.length; i++) {\n if (name === INIT.pluginQueue[i][0]) {\n warn(`linkifyjs: plugin \"${name}\" already registered - will be overwritten`);\n INIT.pluginQueue[i] = [name, plugin];\n return;\n }\n }\n INIT.pluginQueue.push([name, plugin]);\n if (INIT.initialized) {\n warn(`linkifyjs: already initialized - will not register plugin \"${name}\" ${warnAdvice}`);\n }\n}\n\n/**\n * Detect URLs with the following additional protocol. Anything with format\n * \"protocol://...\" will be considered a link. If `optionalSlashSlash` is set to\n * `true`, anything with format \"protocol:...\" will be considered a link.\n * @param {string} protocol\n * @param {boolean} [optionalSlashSlash]\n */\nfunction registerCustomProtocol(scheme, optionalSlashSlash) {\n if (optionalSlashSlash === void 0) {\n optionalSlashSlash = false;\n }\n if (INIT.initialized) {\n warn(`linkifyjs: already initialized - will not register custom scheme \"${scheme}\" ${warnAdvice}`);\n }\n if (!/^[0-9a-z]+(-[0-9a-z]+)*$/.test(scheme)) {\n throw new Error(`linkifyjs: incorrect scheme format.\n1. Must only contain digits, lowercase ASCII letters or \"-\"\n2. Cannot start or end with \"-\"\n3. \"-\" cannot repeat`);\n }\n INIT.customSchemes.push([scheme, optionalSlashSlash]);\n}\n\n/**\n * Initialize the linkify state machine. Called automatically the first time\n * linkify is called on a string, but may be called manually as well.\n */\nfunction init() {\n // Initialize scanner state machine and plugins\n INIT.scanner = init$2(INIT.customSchemes);\n for (let i = 0; i < INIT.tokenQueue.length; i++) {\n INIT.tokenQueue[i][1]({\n scanner: INIT.scanner\n });\n }\n\n // Initialize parser state machine and plugins\n INIT.parser = init$1(INIT.scanner.tokens);\n for (let i = 0; i < INIT.pluginQueue.length; i++) {\n INIT.pluginQueue[i][1]({\n scanner: INIT.scanner,\n parser: INIT.parser\n });\n }\n INIT.initialized = true;\n}\n\n/**\n * Parse a string into tokens that represent linkable and non-linkable sub-components\n * @param {string} str\n * @return {MultiToken[]} tokens\n */\nfunction tokenize(str) {\n if (!INIT.initialized) {\n init();\n }\n return run(INIT.parser.start, str, run$1(INIT.scanner.start, str));\n}\n\n/**\n * Find a list of linkable items in the given string.\n * @param {string} str string to find links in\n * @param {string | Opts} [type] either formatting options or specific type of\n * links to find, e.g., 'url' or 'email'\n * @param {Opts} [opts] formatting options for final output. Cannot be specified\n * if opts already provided in `type` argument\n */\nfunction find(str, type, opts) {\n if (type === void 0) {\n type = null;\n }\n if (opts === void 0) {\n opts = null;\n }\n if (type && typeof type === 'object') {\n if (opts) {\n throw Error(`linkifyjs: Invalid link type ${type}; must be a string`);\n }\n opts = type;\n type = null;\n }\n const options = new Options(opts);\n const tokens = tokenize(str);\n const filtered = [];\n for (let i = 0; i < tokens.length; i++) {\n const token = tokens[i];\n if (token.isLink && (!type || token.t === type) && options.check(token)) {\n filtered.push(token.toFormattedObject(options));\n }\n }\n return filtered;\n}\n\n/**\n * Is the given string valid linkable text of some sort. Note that this does not\n * trim the text for you.\n *\n * Optionally pass in a second `type` param, which is the type of link to test\n * for.\n *\n * For example,\n *\n * linkify.test(str, 'email');\n *\n * Returns `true` if str is a valid email.\n * @param {string} str string to test for links\n * @param {string} [type] optional specific link type to look for\n * @returns boolean true/false\n */\nfunction test(str, type) {\n if (type === void 0) {\n type = null;\n }\n const tokens = tokenize(str);\n return tokens.length === 1 && tokens[0].isLink && (!type || tokens[0].t === type);\n}\n\nexport { MultiToken, Options, State, createTokenClass, find, init, multi, options, regexp, registerCustomProtocol, registerPlugin, registerTokenPlugin, reset, stringToArray, test, tokenize };\n","import * as React from 'react';\nimport { Options, options, tokenize } from 'linkifyjs';\n\n/**\n * Given a string, converts to an array of valid React components\n * (which may include strings)\n * @param {string} str\n * @param {Options} opts\n * @param {{ [elementId: string]: number }} meta\n * @returns {React.ReactNodeArray}\n */\nfunction stringToElements(str, opts, meta) {\n const tokens = tokenize(str);\n const elements = [];\n for (let i = 0; i < tokens.length; i++) {\n const token = tokens[i];\n if (token.t === 'nl' && opts.get('nl2br')) {\n const key = `__linkify-el-${meta.elementId++}`;\n elements.push(React.createElement('br', {\n key\n }));\n } else if (!token.isLink || !opts.check(token)) {\n // Regular text\n elements.push(token.toString());\n } else {\n let rendered = opts.render(token);\n if (!('key' in rendered.props)) {\n // Ensure generated element has unique key\n const key = `__linkify-el-${meta.elementId++}`;\n const props = options.assign({\n key\n }, rendered.props);\n rendered = React.cloneElement(rendered, props);\n }\n elements.push(rendered);\n }\n }\n return elements;\n}\n\n// Recursively linkify the contents of the given React Element instance\n/**\n * @template P\n * @template {string | React.JSXElementConstructor} T\n * @param {React.ReactElement} element\n * @param {Options} opts\n * @param {{ [elementId: string]: number }} meta\n * @returns {React.ReactElement}\n */\nfunction linkifyReactElement(element, opts, meta) {\n if (React.Children.count(element.props.children) === 0) {\n // No need to clone if the element had no children\n return element;\n }\n const children = [];\n React.Children.forEach(element.props.children, child => {\n if (typeof child === 'string') {\n // ensure that we always generate unique element IDs for keys\n children.push.apply(children, stringToElements(child, opts, meta));\n } else if (React.isValidElement(child)) {\n if (typeof child.type === 'string' && opts.ignoreTags.indexOf(child.type.toUpperCase()) >= 0) {\n // Don't linkify this element\n children.push(child);\n } else {\n children.push(linkifyReactElement(child, opts, meta));\n }\n } else {\n // Unknown element type, just push\n children.push(child);\n }\n });\n\n // Set a default unique key, copy over remaining props\n const key = `__linkify-el-${meta.elementId++}`;\n const newProps = options.assign({\n key\n }, element.props);\n return React.cloneElement(element, newProps, children);\n}\n\n/**\n * @template P\n * @template {string | React.JSXElementConstructor} T\n * @param {P & { as?: T, tagName?: T, options?: import('linkifyjs').Opts, children?: React.ReactNode}} props\n * @returns {React.ReactElement}\n */\nconst Linkify = props => {\n // Copy over all non-linkify-specific props\n let linkId = 0;\n const defaultLinkRender = _ref => {\n let {\n tagName,\n attributes,\n content\n } = _ref;\n attributes.key = `__linkify-lnk-${linkId++}`;\n if (attributes.class) {\n attributes.className = attributes.class;\n delete attributes.class;\n }\n return React.createElement(tagName, attributes, content);\n };\n const newProps = {\n key: '__linkify-wrapper'\n };\n for (const prop in props) {\n if (prop !== 'options' && prop !== 'as' && prop !== 'tagName' && prop !== 'children') {\n newProps[prop] = props[prop];\n }\n }\n const opts = new Options(props.options, defaultLinkRender);\n const as = props.as || props.tagName || React.Fragment || 'span';\n const children = props.children;\n const element = React.createElement(as, newProps, children);\n return linkifyReactElement(element, opts, {\n elementId: 0\n });\n};\n\nexport { Linkify as default };\n","import React, { Component } from \"react\";\nimport { useParams } from \"react-router-dom\";\nimport {\n Button,\n Container,\n Image,\n Form,\n InputGroup,\n Spinner,\n Modal,\n} from \"react-bootstrap\";\nimport Linkify from \"linkify-react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\nimport axios from \"axios\";\nimport Common from \"../../common\";\nimport Functions from \"../../functions\";\nimport lang from \"../../lang/lang\";\nconst langSet = Common.langSet;\nconst lang_data = lang(langSet);\nconst user_id_authen = Common.token;\nconst user_type_authen = Common.user_type;\nconst admin_id = Common.admin_id;\nconst CardStyle = styled.div`\n // https://freefrontend.com/bootstrap-chats/\n .card {\n background: #fff;\n transition: 0.5s;\n border: 0;\n margin-bottom: 30px;\n border-radius: 0.55rem;\n position: relative;\n width: 100%;\n box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%);\n }\n .chat-app .people-list {\n width: 280px;\n position: absolute;\n left: 0;\n top: 0;\n padding: 20px;\n z-index: 7;\n }\n\n .chat-app .chat {\n margin-left: 280px;\n border-left: 1px solid #eaeaea;\n }\n\n .people-list {\n -moz-transition: 0.5s;\n -o-transition: 0.5s;\n -webkit-transition: 0.5s;\n transition: 0.5s;\n }\n\n .people-list .chat-list li {\n padding: 10px 15px;\n list-style: none;\n border-radius: 3px;\n }\n\n .people-list .chat-list li:hover {\n background: #efefef;\n cursor: pointer;\n }\n\n .people-list .chat-list li.active {\n background: #efefef;\n }\n\n .people-list .chat-list li .name {\n font-size: 15px;\n }\n\n .people-list .chat-list img {\n width: 45px;\n border-radius: 50%;\n }\n\n .people-list img {\n float: left;\n border-radius: 50%;\n }\n\n .people-list .about {\n float: left;\n padding-left: 8px;\n }\n\n .people-list .status {\n color: #999;\n font-size: 13px;\n }\n\n .chat .chat-header {\n padding: 15px 20px;\n border-bottom: 2px solid #f4f7f6;\n }\n\n .chat .chat-header img {\n float: left;\n border-radius: 40px;\n width: 40px;\n }\n\n .chat .chat-header .chat-about {\n float: left;\n padding-left: 10px;\n }\n\n .chat .chat-history {\n padding: 20px;\n border-bottom: 2px solid #fff;\n }\n\n .chat .chat-history ul {\n padding: 0;\n }\n\n .chat .chat-history ul li {\n list-style: none;\n margin-bottom: 30px;\n }\n\n .chat .chat-history ul li:last-child {\n margin-bottom: 0px;\n }\n\n .chat .chat-history .message-data {\n margin-bottom: 15px;\n }\n\n .chat .chat-history .message-data img {\n border-radius: 40px;\n width: 40px;\n }\n\n .chat .chat-history .message-data-time {\n color: #434651;\n padding-left: 6px;\n }\n\n .chat .chat-history .message {\n color: #444;\n padding: 18px 20px;\n line-height: 26px;\n font-size: 16px;\n border-radius: 7px;\n display: inline-block;\n position: relative;\n }\n\n .chat .chat-history .message:after {\n bottom: 100%;\n left: 7%;\n border: solid transparent;\n content: \" \";\n height: 0;\n width: 0;\n position: absolute;\n pointer-events: none;\n border-bottom-color: #fff;\n border-width: 10px;\n margin-left: -10px;\n }\n\n .chat .chat-history .my-message {\n background: #efefef;\n }\n\n .chat .chat-history .my-message:after {\n bottom: 100%;\n left: 30px;\n border: solid transparent;\n content: \" \";\n height: 0;\n width: 0;\n position: absolute;\n pointer-events: none;\n border-bottom-color: #efefef;\n border-width: 10px;\n margin-left: -10px;\n }\n\n .chat .chat-history .other-message {\n background: #e8f1f3;\n text-align: right;\n }\n\n .chat .chat-history .other-message:after {\n border-bottom-color: #e8f1f3;\n left: 93%;\n }\n\n .chat .chat-message {\n padding: 20px;\n }\n\n .online,\n .offline,\n .me {\n margin-right: 2px;\n font-size: 8px;\n vertical-align: middle;\n }\n\n .online {\n color: #86c541;\n }\n\n .offline {\n color: #e47297;\n }\n\n .me {\n color: #1d8ecd;\n }\n\n .float-right {\n float: right;\n }\n\n .clearfix:after {\n visibility: hidden;\n display: block;\n font-size: 0;\n content: \" \";\n clear: both;\n height: 0;\n }\n\n @media only screen and (max-width: 767px) {\n .chat-app .people-list {\n height: 465px;\n width: 100%;\n overflow-x: auto;\n background: #fff;\n left: -400px;\n display: none;\n }\n .chat-app .people-list.open {\n left: 0;\n }\n .chat-app .chat {\n margin: 0;\n }\n .chat-app .chat .chat-header {\n border-radius: 0.55rem 0.55rem 0 0;\n }\n .chat-app .chat-history {\n height: 300px;\n overflow-x: auto;\n }\n }\n\n @media only screen and (min-width: 768px) and (max-width: 992px) {\n .chat-app .chat-list {\n height: 650px;\n overflow-x: auto;\n }\n .chat-app .chat-history {\n height: 600px;\n overflow-x: auto;\n }\n }\n\n @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {\n .chat-app .chat-list {\n height: 480px;\n overflow-x: auto;\n }\n .chat-app .chat-history {\n height: calc(100vh - 350px);\n overflow-x: auto;\n }\n }\n`;\nconst ScrollbarStyle = styled.div`\n /* ===== Scrollbar CSS ===== */\n /* Firefox */\n * {\n scrollbar-width: auto;\n scrollbar-color: #88c141 #ffffff;\n }\n\n /* Chrome, Edge, and Safari */\n *::-webkit-scrollbar {\n width: 12px;\n }\n\n *::-webkit-scrollbar-track {\n // background: #ffffff;\n }\n\n *::-webkit-scrollbar-thumb {\n background-color: #88c141;\n border-radius: 10px;\n border: 3px solid #ffffff;\n }\n`;\n\nconst socket = new WebSocket(Common.BASE_SOCKET + user_id_authen);\nconst GetDataForm = () => {\n const { user_id } = useParams();\n\n return \n
\n \n
\n \n \n
\n
\n
\n
\n
\n [\n this.setState({\n search_value: e.target.value,\n }),\n this.getHistoryChat(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n search_value: e.target.value,\n }),\n this.getHistoryChat(),\n ]}\n />\n \n\n
\n {historys?.map((rs, index) => (\n \n this.targetUser(rs.user_recipient_history)\n }\n >\n \n {Functions.check_empty_value(\n rs.history_user_recipient?.user_main_detail\n ?.ud_image_profile\n ) === false ? (\n \n
\n {rs.history_user_recipient?.firstname}{\" \"}\n {rs.history_user_recipient?.lastname}\n
\n
\n {\" \"}\n {Functions.format_date_time(\n rs.update_date\n )}{\" \"}\n
\n
\n \n {lang_data?.connect_admin}\n \n
\n )}\n\n \n
\n \n \n {\" \"}\n {lang_data?.page}\n \n [\n this.setState({\n page: e.target.value,\n }),\n this.getHistoryChat(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.getHistoryChat(),\n ]}\n onClick={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.getHistoryChat(),\n ]}\n style={{ textAlign: \"center\" }}\n />\n \n {lang_data?.total_page} : {param.total_page}{\" \"}\n \n \n
\n
\n {loading_cover === true && (\n
\n
\n )}\n {user_recipient === \"list\" &&\n loading_cover === false && (\n
\n \n Chat \n \n
\n )}\n {firstname !== \"\" && loading_cover === false && (\n
\n
\n
\n
\n {Functions.check_empty_value(\n this.state.ud_image_profile\n ) === false ? (\n
\n ) : (\n
\n )}\n\n
\n
\n {this.state.firstname}{\" \"}\n {this.state.lastname}{\" \"}\n {this.state.uc_company_name !== \"\" && (\n \n : {this.state.uc_company_name}\n \n )}\n \n {this.state.ud_code} \n \n
\n
\n {/* ปุ่ม */}\n \n
\n
\n
\n \n {data_sort?.map((rs, index) => (\n \n \n {rs.user_sender === user_id_authen ? (\n \n {\" \"}\n
\n this.setState({\n openModalForm: true,\n chat_id: rs.chat_id,\n chat_msg: rs.chat_msg,\n })\n }\n >\n \n \n {Functions.format_date_time(\n rs.create_date\n )}\n {\" \"}\n {Functions.check_empty_value(\n rs.chat_user_sender\n ?.user_main_detail\n ?.ud_image_profile\n ) === false ? (\n \n {Functions.check_empty_value(\n rs.chat_user_sender\n ?.user_main_detail\n ?.ud_image_profile\n ) === false ? (\n \n {Functions.format_date_time(\n rs.create_date\n )}\n {\" \"}\n
\n )}\n \n
\n \n {rs.chat_msg}\n \n \n \n ))}\n
\n \n {status_readed === true && data.length > 0 && (\n
\n {lang_data?.read_it}\n \n )}\n
\n {typing === true && (\n
\n
\n )}\n\n
\n \n \n \n this.setState({ chat_msg: e.target.value })\n }\n onKeyDown={(e) => [\n this.sendEventEnter(e),\n this.sendEventTyping(),\n ]}\n id=\"chat_msg\"\n />\n \n
this.setState({ openModalForm: false })}\n >\n \n {lang_data?.text_editing} \n \n \n \n \n this.setState({ chat_msg: e.target.value })\n }\n />\n \n \n \n this.setState({ openModalForm: false })}\n >\n {lang_data?.close}\n \n \n {lang_data?.delete}\n \n \n {lang_data?.editing}\n \n \n \n \n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Button, Col, Form, InputGroup, Row, Table } from \"react-bootstrap\";\nimport axios from \"axios\";\nimport Common from \"../../common\";\nimport Functions from \"../../functions\";\nimport lang from \"../../lang/lang\";\nconst langSet = Common.langSet;\nconst lang_data = lang(langSet);\nconst user_id_authen = Common.token;\nexport default class AlertList extends Component {\n state = {\n search_value: \"\",\n page: 1,\n per_page: 25,\n data: [],\n param: [],\n };\n getAlert = async () => {\n try {\n await axios\n .post(\n Common.API_URL + `general/alert/list/${user_id_authen}?accept=3`,\n {\n page: this.state.page,\n per_page: this.state.per_page,\n search_value: this.state.search_value,\n },\n Common.options\n )\n .then((response) => {\n let res = response.data;\n\n this.setState({ data: res.data, param: res });\n });\n } catch (error) {\n console.log(error);\n }\n };\n setAlertAccept = (alert_id, page) => {\n try {\n axios\n .get(Common.API_URL + `general/alert/set/${alert_id}`, Common.options)\n .then((res) => {\n window.location.href = page;\n });\n } catch (error) {\n console.log(error);\n }\n };\n\n componentDidMount() {\n this.getAlert();\n }\n\n render() {\n const { data, page, param } = this.state;\n return (\n \n
\n [\n this.setState({\n search_value: e.target.value,\n }),\n this.getAlert(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n search_value: e.target.value,\n }),\n this.getAlert(),\n ]}\n />\n \n
\n
\n \n \n {lang_data?.date_label} \n {lang_data?.alet_message} \n {lang_data?.target_list} \n \n \n \n {data?.map((rs, index) => (\n \n {Functions.format_date_time(rs.create_date)} \n {rs?.alert_description} \n \n {\" \"}\n \n this.setAlertAccept(rs?.alert_id, rs?.alert_route_page)\n }\n >\n Click\n \n \n \n ))}\n \n
\n
\n
\n \n {lang_data?.page} \n [\n this.setState({\n page: e.target.value,\n }),\n this.getAlert(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.getAlert(),\n ]}\n onClick={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.getAlert(),\n ]}\n style={{ textAlign: \"center\" }}\n />\n \n {lang_data?.total_page} : {param.total_page}{\" \"}\n \n \n
\n
\n
\n
\n แจ้งเตือน \n \n \n หน้าหลัก \n\n แจ้งเตือน \n \n \n
\n
\n \n \n \n \n \n
\n
\n \n \n {/*
*/}\n\n {Functions.check_empty_value(\n data?.user_main_detail?.ud_image_cover\n ) === false ? (\n
\n ) : (\n
\n )}\n\n
\n {Functions.check_empty_value(\n data?.user_main_company?.uc_company_cover\n ) === false ? (\n
\n
\n
\n {data?.user_main_company?.uc_company_name}{\" \"}\n {data?.user_main_detail?.ud_verify === 1 && (\n \n \n
\n
\n
\n {lang_data?.send_message}{\" \"}\n \n \n
\n {lang_data?.business_type_label} :{\" \"}\n {data?.user_main_company?.company_business?.bt_name}\n
\n
\n Tax ID :{\" \"}\n {data?.user_main_detail?.ud_personal}\n
\n
\n {lang_data?.address_label} :{\" \"}\n {data?.user_main_detail?.ud_address}{\" \"}\n {data?.user_main_detail?.user_tambon?.tambon_eng} /{\" \"}\n {data?.user_main_detail?.user_tambon?.tambon_thai} -{\" \"}\n {data?.user_main_detail?.user_tambon?.district_eng} /{\" \"}\n {data?.user_main_detail?.user_tambon?.district_thai} -{\" \"}\n {data?.user_main_detail?.user_tambon?.province_eng} /{\" \"}\n {data?.user_main_detail?.user_tambon?.province_thai}{\" \"}\n {data?.user_main_detail?.user_tambon?.postcode}\n
\n
\n {lang_data?.country_label} :{\" \"}\n {data?.user_main_detail?.user_country?.country_name_eng} /{\" \"}\n {data?.user_main_detail?.user_country?.capital_name_th}\n
\n
\n {lang_data?.business_opeation_title} \n {detail_data\n ?.filter((r) => r.ucd_type === 1)\n .map((rs, i) => (\n
{rs.ucd_value} \n ))}\n \n
\n {lang_data?.welfare_benefits_title} \n {detail_data\n ?.filter((r) => r.ucd_type === 2)\n .map((rs, i) => (\n
{rs.ucd_value} \n ))}\n \n
\n
{lang_data?.contact_name} :{\" \"}\n {data?.firstname} {data?.lastname}\n
\n
\n \n {\" \"}\n
\n \n \n
\n
\n
\n {lang_data?.video_presentation_company} \n
\n
\n
\n
\n \n
\n
\n ธนาคาร \n \n \n หน้าหลัก \n\n ธนาคาร \n \n \n
\n
\n \n \n \n
[\n this.setState({ isOpenModal: true }),\n this.clearState(),\n ]}\n >\n \n
\n \n \n \n \n \n ลำดับ \n ธนาคาร \n รายละเอียด \n วันทีสร้าง \n # \n \n \n \n {data?.map((rs, index) => (\n \n {index + 1} \n {rs.bank_name} \n {rs.bank_description} \n {Functions.format_date_time(rs.create_date)} \n \n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleClickEdit(rs),\n ]}\n >\n \n this.handleDeleteSubmit(rs.bank_id)}\n >\n \n \n \n \n ))}\n \n
\n \n \n {/* Main */}\n
this.setState({ isOpenModal: false })}\n >\n \n ธนาคาร \n \n \n {msg !== \"\" && {msg} }\n \n ชื่อธนาคาร \n * \n this.setState({ bank_name: e.target.value })}\n defaultValue={this.state.bank_name}\n />\n \n \n รายละเอียด \n\n \n this.setState({ bank_description: e.target.value })\n }\n defaultValue={this.state.bank_description}\n />\n \n \n \n this.setState({ isOpenModal: false })}\n >\n ปิด\n \n \n บันทึก\n \n \n \n \n
\n ประเภทงาน \n \n \n หน้าหลัก \n ประเภทงาน \n \n \n
\n
\n \n \n \n
[\n this.setState({ isOpenModal: true }),\n this.clearState(),\n ]}\n >\n \n
\n \n \n \n \n \n ลำดับ \n กลุ่มงาน \n งาน \n วันทีสร้าง \n # \n \n \n \n {data?.map((rs, index) => (\n \n {index + 1} \n {rs.jbp_name} \n \n \n {rs.jbp_jbc?.map((r, i) => (\n \n {r.jbc_name}{\" \"}\n [\n this.setState({\n isOpenModalSub: true,\n jbp_name: rs.jbp_name,\n }),\n this.handleClickEdit2(r),\n ]}\n >\n \n this.handleDelete2(r.jbc_id)}\n >\n \n \n ))}\n \n \n
\n this.setState({\n isOpenModalSub: true,\n jbp_id: rs.jbp_id,\n jbp_name: rs.jbp_name,\n })\n }\n >\n \n \n\n {Functions.format_date_time(rs.create_date)} \n \n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleClickEdit(rs),\n ]}\n >\n \n this.handleDelete(rs.jbp_id)}\n >\n \n \n \n \n ))}\n \n
\n \n \n {/* Main */}\n
this.setState({ isOpenModal: false })}\n >\n \n กลุ่ม \n \n \n {msg !== \"\" && {msg} }\n \n ชื่อกลุ่มงาน \n * \n this.setState({ jbp_name: e.target.value })}\n defaultValue={this.state.jbp_name}\n />\n \n \n \n \n this.setState({\n isOpenModal: false,\n })\n }\n >\n ปิด\n \n \n บันทึก\n \n \n \n\n {/* Sub */}\n this.setState({ isOpenModalSub: false })}\n >\n \n {this.state.jbp_name} \n \n \n {msg !== \"\" && {msg} }\n \n งาน \n * \n this.setState({ jbc_name: e.target.value })}\n defaultValue={this.state.jbc_name}\n />\n \n \n \n [\n this.setState({\n isOpenModalSub: false,\n }),\n this.clearState(),\n ]}\n >\n ปิด\n \n \n บันทึก\n \n \n \n \n
\n เวลาการทำงาน \n \n \n หน้าหลัก \n\n เวลาการทำงาน \n \n \n
\n
\n \n \n \n
this.setState({ isOpenModal: true })}>\n \n \n
\n \n \n \n \n \n ลำดับ \n เวลาการทำงาน \n วันที่สร้าง \n # \n \n \n \n {data?.map((rs, index) => (\n \n {index + 1} \n {rs.jt_name} \n\n {Functions.format_date_time(rs.create_date)} \n \n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleClickEdit(rs),\n ]}\n >\n \n this.handleDeleteSubmit(rs.jt_id)}\n >\n \n \n \n \n ))}\n \n
\n \n \n {/* Main */}\n
this.setState({ isOpenModal: false })}\n >\n \n เวลาการทำงาน \n \n \n {msg !== \"\" && {msg} }\n \n เวลาการทำงาน \n * \n this.setState({ jt_name: e.target.value })}\n defaultValue={this.state.jt_name}\n />\n \n \n \n \n ปิด\n \n \n บันทึก\n \n \n \n \n
\n รูปแบบการทำงาน \n \n \n หน้าหลัก \n\n รูปแบบการทำงาน \n \n \n
\n
\n \n \n \n
this.setState({ isOpenModal: true })}>\n \n \n
\n \n \n \n \n \n ลำดับ \n รูปแบบการทำงาน \n วันที่สร้าง \n # \n \n \n \n {data?.map((rs, index) => (\n \n {index + 1} \n {rs.ws_name} \n\n {Functions.format_date_time(rs.create_date)} \n \n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleClickEdit(rs),\n ]}\n >\n \n this.handleDeleteSubmit(rs.ws_id)}\n >\n \n \n \n \n ))}\n \n
\n \n \n {/* Main */}\n
this.setState({ isOpenModal: false })}\n >\n \n รูปแบบการทำงาน \n \n \n {msg !== \"\" && {msg} }\n \n รูปแบบการทำงาน \n * \n this.setState({ ws_name: e.target.value })}\n defaultValue={this.state.ws_name}\n />\n \n \n \n \n ปิด\n \n \n บันทึก\n \n \n \n \n
\n ความสามารถ / ทักษะ \n \n \n หน้าหลัก \n\n ความสามารถ / ทักษะ \n \n \n
\n
\n \n \n \n
[\n this.setState({ isOpenModal: true }),\n this.clearState(),\n ]}\n >\n \n
\n \n \n \n \n \n ลำดับ \n ความสามารถ / ทักษะ \n ประเภท \n รายละเอียด \n วันทีสร้าง \n # \n \n \n \n {data?.map((rs, index) => (\n \n {index + 1} \n {rs.skill_name} \n {this.formatGropSkill(rs.skill_group_type)} \n {rs.description} \n {Functions.format_date_time(rs.create_date)} \n \n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleClickEdit(rs),\n ]}\n >\n \n this.handleDeleteSubmit(rs.skill_id)}\n >\n \n \n \n \n ))}\n \n
\n \n \n {/* Main */}\n
this.setState({ isOpenModal: false })}\n >\n \n ความสามารถ / ทักษะ \n \n \n {msg !== \"\" && {msg} }\n \n ประเภท \n * \n \n this.setState({ skill_group_type: e.target.value })\n }\n defaultValue={this.state.skill_group_type}\n >\n --เลือก-- \n Computer Skills \n Competency Skills \n General \n \n \n \n ความสามารถ / ทักษะ \n * \n this.setState({ skill_name: e.target.value })}\n defaultValue={this.state.skill_name}\n />\n \n \n รายละเอียด \n\n this.setState({ description: e.target.value })}\n defaultValue={this.state.description}\n />\n \n \n \n this.setState({ isOpenModal: false })}\n >\n ปิด\n \n \n บันทึก\n \n \n \n \n
\n ประเภทธุรกิจ \n \n \n หน้าหลัก \n\n ประเภทธุรกิจ \n \n \n
\n
\n \n \n \n
this.setState({ isOpenModal: true })}>\n \n \n
\n \n \n \n \n \n ลำดับ \n ประเภทธุรกิจ \n วันทีสร้าง \n # \n \n \n \n {data?.map((rs, index) => (\n \n {index + 1} \n {rs.bt_name} \n\n {Functions.format_date_time(rs.create_date)} \n \n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleClickEdit(rs),\n ]}\n >\n \n this.handleDeleteSubmit(rs.bt_id)}\n >\n \n \n \n \n ))}\n \n
\n \n \n {/* Main */}\n
this.setState({ isOpenModal: false })}\n >\n \n ประเภทธุรกิจ \n \n \n {msg !== \"\" && {msg} }\n \n ประเภทธุรกิจ \n * \n this.setState({ bt_name: e.target.value })}\n defaultValue={this.state.bt_name}\n />\n \n \n \n \n ปิด\n \n \n บันทึก\n \n \n \n \n
\n สถาบันศึกษา \n \n \n หน้าหลัก \n\n สถาบันศึกษา \n \n \n
\n
\n \n \n \n
this.setState({ isOpenModal: true })}>\n \n \n
\n \n \n \n [\n this.setState({\n search_value: e.target.value,\n }),\n this.onChangeFilter(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n search_value: e.target.value,\n }),\n this.onChangeFilter(),\n ]}\n />\n \n
\n\n \n \n \n ลำดับ \n สถาบันศึกษา \n สร้างโดย \n แก้ไขโดย \n # \n \n \n \n {data?.map((rs, index) => (\n \n \n {per_page * page - (per_page - 1) + index}\n \n {rs.institution_name} \n \n {rs?.institution_user_crt?.firstname}{\" \"}\n {rs?.institution_user_crt?.lastname} |{\" \"}\n {Functions.format_date_time(rs.create_date)}\n \n\n \n {rs?.institution_user_udp?.firstname}{\" \"}\n {rs?.institution_user_udp?.lastname} |{\" \"}\n {Functions.format_date_time(rs.update_date)}\n \n \n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleClickEdit(rs),\n ]}\n >\n \n \n this.handleDeleteSubmit(rs.institution_id)\n }\n >\n \n \n \n \n ))}\n \n
\n\n \n
\n \n หน้า \n [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onClick={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n style={{ textAlign: \"center\" }}\n />\n \n จำนวนหน้า : {param.total_page}{\" \"}\n \n \n
\n
\n \n {/* Main */}\n
this.setState({ isOpenModal: false })}\n >\n \n สถาบันศึกษา \n \n \n {msg !== \"\" && {msg} }\n \n ชื่อสถาบัน \n * \n \n this.setState({ institution_name: e.target.value })\n }\n defaultValue={this.state.institution_name}\n />\n \n \n \n \n ปิด\n \n \n บันทึก\n \n \n \n \n
\n \n \n \n {app_name} Admin\n \n \n \n ผู้สมัคร \n ฝ่ายบุคคล \n คำสั่งซื้อ \n \n แพ็กเกจ \n \n โปรโมชัน\n \n \n\n \n \n ประเภทงาน\n \n \n เวลาการทำงาน\n \n \n รูปแบบการทำงาน\n \n \n ความสามารถ / ทักษะ\n \n \n ประเภทธุรกิจ\n \n \n สถาบันศึกษา\n \n ธนาคาร \n \n \n this.blankFun()}>\n จัดการเว็บไซต์\n \n \n \n\n \n \n \n \n \n {total_chat <= 99 ? total_chat : \"99+\"}\n \n
\n \n\n \n {historys?.map((rs, index) => (\n \n this.setReaded(rs.user_recipient_history)\n }\n >\n {Functions.check_empty_value(\n rs.history_user_recipient?.user_main_detail\n ?.ud_image_profile\n ) === false ? (\n \n {Functions.format_date_time(rs.update_date)}\n \n ข้อความทั้งหมด
\n \n \n \n \n \n \n \n \n \n {total_alert <= 99 ? total_alert : \"99+\"}\n \n
\n \n\n \n \n {alerts?.map((rs, index) => (\n \n this.setAlertAccept(\n rs?.alert_id,\n rs?.alert_route_page\n )\n }\n style={{\n backgroundColor:\n rs?.alert_accept === 0 ? \"#dadde3\" : \"\",\n }}\n >\n {rs?.alert_description}\n\n \n {Functions.format_date_time(rs.create_date)}\n \n \n ))}\n \n \n แจ้งเตือนทั้งหมด
\n \n \n \n \n\n \n \n \n ออกจากระบบ\n \n \n \n \n \n \n \n {/* Content */}\n\n \n \n \n \n \n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport {\n Form,\n Nav,\n Button,\n ButtonGroup,\n Offcanvas,\n OverlayTrigger,\n Popover,\n Image,\n} from \"react-bootstrap\";\nimport { Link } from \"react-router-dom\";\nimport axios from \"axios\";\nimport Slider from \"rc-slider\";\nimport \"rc-slider/assets/index.css\";\nimport Common from \"../../common\";\nimport Functions from \"../../functions\";\nimport lang from \"../../lang/lang\";\nconst user_id = Common.token;\nconst langSet = Common.langSet;\nconst lang_data = lang(langSet);\nconst style = (React.CSSProperties = {\n height: 400,\n marginBottom: 20,\n marginLeft: 5,\n});\nconst parentStyle = { overflow: \"hidden\" };\nconst present_day = new Date().toISOString().split(\"T\")[0];\nexport default class ProfileMain extends Component {\n state = {\n filecore: \"\",\n filecore_cover: \"\",\n slide_number: 0,\n coverObjectPosition: \"100% 0%\",\n\n openOffcanvas: false,\n\n ud_image_profile: \"\",\n ud_image_cover: \"\",\n ud_image_cover_position: \"\",\n ud_verify: 0,\n ud_bio: \"\",\n ud_birhday: present_day,\n ud_gender: 0,\n ud_address: \"\",\n ud_code: \"\",\n tambon_id: 1,\n country_id: 19,\n loading_cover: true,\n };\n\n refreshData = async () => {\n try {\n this.setState({\n loading_cover: true,\n });\n await axios\n .get(Common.API_URL + `user/${user_id}`, Common.options)\n .then((response) => {\n let res = response.data;\n let user_detail = res?.user_main_detail;\n if (user_detail !== undefined) {\n this.setState({\n ud_image_profile: user_detail?.ud_image_profile,\n ud_image_cover: user_detail?.ud_image_cover,\n ud_image_cover_position: user_detail?.ud_image_cover_position,\n ud_verify: user_detail?.ud_verify,\n ud_bio: user_detail?.ud_bio,\n ud_birhday: user_detail?.ud_birhday,\n ud_gender: user_detail?.ud_gender,\n ud_address: user_detail?.ud_address,\n ud_code: user_detail?.ud_code,\n tambon_id: user_detail?.tambon_id,\n country_id: user_detail?.country_id,\n\n // set ตำแหน่งปก\n slide_number: user_detail?.ud_image_cover_position,\n coverObjectPosition: `100% ${user_detail?.ud_image_cover_position}%`,\n });\n }\n });\n } catch (error) {\n console.log(error);\n } finally {\n this.setState({\n loading_cover: false,\n });\n }\n };\n\n handleOffcanvasClose = () => {\n this.setState({\n openOffcanvas: false,\n });\n };\n readURL = (event) => {\n if (event.target.files && event.target.files[0]) {\n var output = document.getElementById(\"imgcover\");\n output.src = URL.createObjectURL(event.target.files[0]);\n output.onload = function () {\n URL.revokeObjectURL(output.src); // free memory\n };\n this.setState({\n filecore_cover: event,\n slide_number: 0,\n coverObjectPosition: \"100% 0%\",\n });\n }\n };\n uploadImageCover = async (event) => {\n let file = event.target.files[0];\n const formdata = new FormData();\n formdata.append(\"file\", file);\n try {\n await axios\n .post(Common.API_FILE + \"file/upload\", formdata, Common.options2)\n .then((res) => {\n const r = res?.data;\n const path = r?.path;\n this.handleSubmit(this.state.ud_image_profile, path);\n });\n } catch (error) {\n console.log(error);\n }\n };\n\n DeleteImage = async (image) => {\n if (image === \"\" || image === null) {\n return false;\n }\n const url = new URL(image);\n const searchParams = url.searchParams;\n const path = searchParams.get(\"path\");\n try {\n await axios.delete(\n Common.API_FILE + `file/delete?path=${path}`,\n Common.options2\n );\n } catch (error) {\n console.log(error);\n }\n };\n handleSubmit = async (new_image_prifile, new_image_cover) => {\n if (this.state.filecore_cover !== \"\") {\n this.DeleteImage(this.state.ud_image_cover);\n }\n try {\n await axios\n .put(\n Common.API_URL + `user/detail/${user_id}`,\n {\n ud_image_profile: new_image_prifile,\n ud_image_cover: new_image_cover,\n ud_image_cover_position: this.state.slide_number,\n ud_verify: this.state.ud_verify,\n ud_bio: this.state.ud_bio,\n ud_birhday: this.state.ud_birhday,\n ud_gender: this.state.ud_gender,\n ud_address: this.state.ud_address,\n tambon_id: this.state.tambon_id,\n country_id: this.state.country_id,\n },\n Common.options\n )\n .then((res) => {\n window.location.reload();\n });\n } catch (error) {\n console.log(error);\n }\n };\n\n onClickUploadCover = () => {\n document.getElementById(\"coverupload\").click();\n };\n\n onSubmit = () => {\n this.uploadImageCover(this.state.filecore_cover);\n };\n\n setCoverPosition = (e) => {\n // console.log(e);\n this.setState({\n slide_number: e,\n coverObjectPosition: `100% ${e}%`,\n });\n };\n saveCoverPosition = (e) => {\n this.handleSubmit(this.state.ud_image_profile, this.state.ud_image_cover);\n };\n cancle = () => {\n document.getElementById(\"imgcover\").src = this.state.ud_image_cover;\n this.setState({\n coverObjectPosition: `100% ${this.state.ud_image_cover_position}%`,\n filecore_cover: \"\",\n slide_number: 0,\n });\n };\n\n componentDidMount() {\n this.refreshData();\n }\n\n render() {\n const { slide_number, coverObjectPosition, loading_cover } = this.state;\n\n const popover = (\n \n \n \n {slide_number} %\n \n \n );\n\n return (\n \n {/* Cover */}\n\n {loading_cover === true ? (\n
\n
\n ) : Functions.check_empty_value(this.state.ud_image_cover) === false ? (\n
\n ) : (\n
\n )}\n {/* End Cover */}\n {/* Nav Menu */}\n
\n \n \n \n \n \n \n \n \n\n \n \n\n \n \n \n {lang_data?.viewAs}\n \n \n\n \n this.setState({ openOffcanvas: true })}\n >\n \n \n \n {lang_data?.changeCover} \n \n \n this.readURL(e)}\n id=\"coverupload\"\n style={{ display: \"none\" }}\n />\n\n \n
\n \n \n \n \n \n \n
\n {(this.state.filecore_cover !== \"\" ||\n this.state.ud_image_cover_position !==\n this.state.coverObjectPosition) && (\n
\n \n {lang_data?.cancelled}\n {\" \"}\n {this.state.ud_image_cover_position !== 0 &&\n this.state.filecore_cover === \"\" && (\n \n {lang_data?.save}\n \n )}\n {this.state.filecore_cover !== \"\" && (\n \n {lang_data?.save}\n \n )}\n
\n )}\n
\n
\n \n {/*End Form edit cover photo */}\n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Card, Container, Table } from \"react-bootstrap\";\nimport axios from \"axios\";\nimport ReactPlayer from \"react-player\";\nimport Common from \"../../common\";\nimport Functions from \"../../functions\";\nimport lang from \"../../lang/lang\";\nconst langSet = Common.langSet;\nconst lang_data = lang(langSet);\nconst user_id = Common.token;\nexport default class HistoryVideo extends Component {\n state = {\n data: [],\n };\n refreshData = async () => {\n try {\n await axios\n .get(Common.API_URL + `j/job_position/video/${user_id}`, Common.options)\n .then((response) => {\n const res = response.data;\n this.setState({\n data: res,\n });\n });\n } catch (error) {\n console.log(error);\n }\n };\n componentDidMount() {\n this.refreshData();\n }\n render() {\n const { data } = this.state;\n return (\n \n
{lang_data?.history_video} \n
\n \n \n \n \n \n # \n {lang_data?.video_label} \n \n {lang_data?.first_name}-{lang_data?.last_name}\n \n {lang_data?.date_label} \n \n \n \n {data.map((rs, i) => (\n \n {i + 1} \n \n \n \n {rs?.firstname} {rs?.lastname}\n \n {Functions.format_date_time(rs.create_date)} \n \n ))}\n \n
\n \n \n \n
\n
{lang_data?.company_form_head} \n {detail_data3?.length >= 2 && ud_verify === 0 && (\n
\n
{lang_data?.staff_check_msg} \n
\n )}\n\n
\n \n \n \n \n \n {lang_data?.company_name_label} {\" \"}\n * {\" \"}\n \n this.setState({ uc_company_name: e.target.value })\n }\n isInvalid={\n validateForm === true &&\n this.state.uc_company_name === \"\"\n ? true\n : false\n }\n />\n \n \n \n {lang_data?.business_type_label} {\" \"}\n * \n \n \n\n \n Tax ID {\" \"}\n * \n \n this.setState({ ud_personal: e.target.value })\n }\n isInvalid={\n validateForm === true && this.state.ud_personal === \"\"\n ? true\n : false\n }\n />\n \n \n\n \n {lang_data?.web_site_label} \n \n this.setState({ uc_company_website: e.target.value })\n }\n />\n \n \n\n \n {lang_data?.country_label} {\" \"}\n * \n \n \n \n {lang_data?.address_label} {\" \"}\n * \n \n this.setState({ ud_address: e.target.value })\n }\n />\n \n \n \n {lang_data?.city_label} {\" \"}\n * \n \n \n\n \n \n {/* Company Profile and Business Operation */}\n {lang_data?.business_opeation_title}\n \n\n \n
\n \n {detail_data?.map((rs, i) => (\n \n \n \n {rs.ucd_value}\n
\n \n \n \n \n \n \n this.closeFormDetail(rs.ucd_id, 1)\n }\n >\n \n \n this.UpdateDetail(rs.ucd_id, 1)\n }\n >\n \n \n \n ))}\n \n \n \n \n \n \n = 12\n ? true\n : false\n }\n onClick={() => this.CreateDetail(1)}\n >\n \n \n \n \n
\n
\n \n \n \n {/* Welfare and Benefits */}\n {lang_data?.welfare_benefits_title}\n \n \n
\n \n {detail_data2?.map((rs, i) => (\n \n \n \n {rs.ucd_value}\n
\n \n \n \n \n \n \n this.closeFormDetail(rs.ucd_id, 2)\n }\n >\n \n \n this.UpdateDetail(rs.ucd_id, 2)\n }\n >\n \n \n \n ))}\n \n \n \n \n \n \n = 12\n ? true\n : false\n }\n onClick={() => this.CreateDetail(2)}\n >\n \n \n \n \n
\n
\n \n \n {lang_data?.contact_name} {\" \"}\n * \n \n \n this.setState({ firstname: e.target.value })\n }\n isInvalid={\n validateForm === true && this.state.firstname === \"\"\n ? true\n : false\n }\n />\n \n this.setState({ lastname: e.target.value })\n }\n isInvalid={\n validateForm === true && this.state.lastname === \"\"\n ? true\n : false\n }\n />\n \n \n \n \n {lang_data?.email_label} {\" \"}\n * \n \n this.setState({ email: e.target.value })\n }\n isInvalid={\n validateForm === true && this.state.email === \"\"\n ? true\n : false\n }\n />\n \n \n \n {lang_data?.phone_number_label} {\" \"}\n * \n \n this.setState({ phone: e.target.value })\n }\n isInvalid={\n validateForm === true && this.state.phone === \"\"\n ? true\n : false\n }\n />\n \n \n
\n\n {lang_data?.video_presentation_company} \n \n \n \n URL Youtube\n \n \n this.setState({ youtube_path: e.target.value })\n }\n />\n \n \n
\n \n {youtube_path !== \"\" && (\n
\n\n \n
\n \n {lang_data?.save}\n \n
\n
\n \n \n this.readURL(e)}\n id=\"logoUpload\"\n style={{ display: \"none\" }}\n />\n
\n \n
\n \n \n
\n \n {lang_data?.save}\n \n
\n
\n \n \n {detail_data3?.length < 2 && (\n
\n \n \n {lang_data?.document_upload_title} \n \n \n \n {lang_data?.document_upload_text1} \n\n this.uploadFile(e, \"หนังสือรับรองบริษัท\")}\n onChange={(e) => {\n let file = e.target.files[0];\n if (file.type !== \"application/pdf\") {\n Swal.fire({\n title: \"Fail\",\n text: \"Only PDFs are valid.\",\n icon: \"error\",\n confirmButtonText: \"OK\",\n });\n return false;\n }\n new Promise((accept) => {\n setTimeout(() => {\n this.setState(\n {\n file_tmp1: e,\n file_name1: lang_data?.document_upload_text1,\n },\n accept\n );\n }, 1000);\n });\n }}\n accept=\"application/pdf\"\n />\n \n \n {lang_data?.document_upload_text2} \n\n this.uploadFile(e, \"ภ.พ 20\")}\n onChange={(e) => {\n let file = e.target.files[0];\n if (file.type !== \"application/pdf\") {\n Swal.fire({\n title: \"Fail\",\n text: \"Only PDFs are valid.\",\n icon: \"error\",\n confirmButtonText: \"OK\",\n });\n return false;\n }\n new Promise((accept) => {\n setTimeout(() => {\n this.setState(\n {\n file_tmp2: e,\n file_name2: lang_data?.document_upload_text2,\n },\n accept\n );\n }, 1000);\n });\n }}\n accept=\"application/pdf\"\n />\n \n \n \n {/* this.setState({ openFormVerify: false })}\n disabled={detail_data3?.length > 0 ? true : false}\n >\n ปิด\n */}\n\n this.setState({ openFormVerify: false })}\n disabled={\n this.state.file_tmp1 !== \"\" || this.state.file_tmp2 !== \"\"\n ? true\n : false\n }\n >\n {lang_data?.close}\n \n [\n this.uploadFile(\n this.state.file_tmp1,\n this.state.file_name1\n ),\n this.uploadFile(\n this.state.file_tmp2,\n this.state.file_name2\n ),\n Swal.fire({\n title: lang_data?.notify_title_success,\n text: lang_data?.notify_text_success,\n icon: \"success\",\n confirmButtonText: lang_data?.notify_confirm_success,\n }),\n this.setState({\n file_tmp1: \"\",\n file_name1: \"\",\n file_tmp2: \"\",\n file_name2: \"\",\n }),\n ]}\n disabled={\n this.state.file_tmp1 === \"\" || this.state.file_tmp2 === \"\"\n ? true\n : false\n }\n >\n {lang_data?.save}\n \n \n \n
\n )}\n
\n
\n\n
\n \n {/* User Profile Card */}\n \n \n this.readURL(e)}\n id=\"image_profile_upload\"\n style={{ display: \"none\" }}\n />\n \n
\n {Functions.check_empty_value(\n this.state.ud_image_profile\n ) === false ? (\n \n \n \n
\n {uc_company_name}{\" \"}\n {ud_verify === 1 && (\n
\n this.readURL(e, \"imgprofile\")}\n id=\"imageupload\"\n style={{ display: \"none\" }}\n />\n {this.state.filecore !== \"\" && (\n \n {lang_data?.save}\n \n )}\n \n {/* Quota Information */}\n \n
\n {lang_data?.position}
\n \n \n {this.state.used_position} {\" / \"}{\" \"}\n {this.state.quota_position}\n
\n \n
\n
\n {lang_data?.video}
\n \n \n {this.state.used_video} {\" / \"} {this.state.quota_video}\n
\n \n
\n
\n {this.state.exire_date && (\n \n {lang_data?.expiration_date} :{\" \"}\n \n {Functions.IsoDatetoShortDate(this.state.exire_date)}\n \n \n )}\n
\n
\n \n this.setState({ profilePageControl: \"profile\" })\n }\n style={{ cursor: \"pointer\" }}\n >\n \n \n this.setState({ profilePageControl: \"video_hitory\" })\n }\n style={{ cursor: \"pointer\" }}\n >\n \n (window.location.href = \"/dashboard\")}\n style={{ cursor: \"pointer\" }}\n >\n \n \n {/*End Menu */}\n \n \n {/* End User Profile Card */}\n {/*Show Content */}\n \n Loading... \n \n {profilePageControl === \"profile\" &&
}\n {profilePageControl === \"video_hitory\" &&
}\n
\n
\n \n {jpd_data?.map((rs, i) => (\n \n \n \n {rs.jpd_name}\n
\n \n \n \n \n \n \n this.DetailFormClose(rs.jpd_id + page_code)\n }\n >\n \n this.handleUpdateSubmitDetail(rs.jpd_id)}\n >\n \n \n \n ))}\n \n \n = 3 && jpd_type === 1 ? true : false\n }\n maxLength={128}\n />\n \n \n = 3 && jpd_type === 1 ? true : false\n }\n >\n \n \n \n \n
\n
\n
\n\n
\n \n
\n
\n \n
\n {lang_data?.jobPost} [{used_position} {\" / \"}{\" \"}\n {quota_position}]\n \n \n \n \n
this.setState({ isOpenModal: true })}\n >\n \n
\n
\n\n
\n \n \n \n [\n this.setState({\n search_value: e.target.value,\n }),\n this.refreshData(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n search_value: e.target.value,\n }),\n this.refreshData(),\n ]}\n />\n \n \n \n
\n\n
\n \n {data?.map((rs, index) => (\n \n
{rs.jp_code}
\n
\n \n \n \n
\n
{rs.jp_position} \n \n
\n
\n \n
\n
\n \n
\n
\n {lang_data?.main_job} \n {rs?.job_detail\n .filter((e) => e.jpd_type === \"1\")\n .map((rd, i) => (\n {rd.jpd_name} \n ))}\n \n\n
\n {rs.active !== 2 ? (\n [\n await Promise.resolve(this.handleEditClick(rs)),\n this.handleUpdateSwitch(rs.active),\n ]}\n />\n ) : (\n \n {lang_data?.confirm_candidate}\n \n )}\n
\n
\n
\n {\" \"}\n Create : {Functions.format_date_time(rs.create_date)} ,\n Update : {Functions.format_date_time(rs.update_date)}\n
\n
\n \n [\n this.setState({\n isOpenModal: true,\n }),\n this.handleEditClick(rs),\n ]}\n >\n \n \n \n this.confirmDelete(rs.jp_id)}\n >\n \n
\n \n\n
\n \n \n {lang_data?.page} \n [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onClick={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n style={{ textAlign: \"center\" }}\n />\n \n {lang_data?.total_page} : {param.total_page}\n \n \n
\n \n \n {lang_data?.jobPost} \n \n \n \n \n \n \n * \n option.label}\n formatGroupLabel={(data) => (\n \n {data.label}\n
\n )}\n onChange={\n (e) => this.setState({ jbc_id: e.value })\n // console.log(e)\n }\n defaultValue={defaultJobFunction}\n />\n \n \n \n {lang_data?.position} {\" \"}\n * \n \n this.setState({ jp_position: e.target.value })\n }\n isInvalid={\n validateForm === true &&\n this.state.jp_position === \"\"\n ? true\n : false\n }\n value={this.state.jp_position}\n maxLength={48}\n />\n \n \n \n {lang_data?.applicants_quota} {\" \"}\n * \n \n this.setState({ jp_quota: e.target.value })\n }\n isInvalid={\n validateForm === true && this.state.jp_quota === 0\n ? true\n : false\n }\n value={this.state.jp_quota}\n />\n \n \n \n {lang_data?.salary_label} {\" \"}\n * \n \n \n this.setState({\n jp_salary_start: e.target.value,\n })\n }\n isInvalid={\n validateForm === true &&\n this.state.jp_salary_start === 0\n ? true\n : false\n }\n value={this.state.jp_salary_start}\n />\n \n this.setState({ jp_salary_end: e.target.value })\n }\n isInvalid={\n validateForm === true &&\n this.state.jp_salary_end === 0\n ? true\n : false\n }\n value={this.state.jp_salary_end}\n />\n \n \n \n\n \n {lang_data?.working_style} {\" \"}\n * \n \n working_style_post.length >= 2\n }\n />\n \n \n \n {lang_data?.job_type_time} {\" \"}\n * \n job_type_post.length >= 2}\n />\n \n \n \n {lang_data?.country_label} {\" \"}\n * \n option.label}\n value={defaultCountry}\n onChange={(e) =>\n this.setState({ country_id: e.value })\n }\n />\n {/* \n \n \n {lang_data?.province_label} {\" \"}\n * \n \n \n \n Competency Skills {\" \"}\n * \n \n this.setState({ skill_id: e.target.value })\n }\n isInvalid={\n validateForm === true && this.state.skill_id === 0\n ? true\n : false\n }\n value={this.state.skill_id}\n >\n -- \n\n {cs_data?.map((r, x) => (\n \n {r.skill_name}\n \n ))}\n \n \n \n \n {lang_data?.posting_date} {\" \"}\n * \n \n \n \n {lang_data?.expired_date} {\" \"}\n * \n \n \n
\n \n
\n {lang_data?.save_step}{\" \"}\n \n \n \n
this.setState({ defauleTab: \"step1\" })}\n variant=\"success\"\n >\n \n this.setState({ defauleTab: \"step3\" })}\n variant=\"success\"\n >\n {lang_data?.next}{\" \"}\n \n \n \n
this.setState({ defauleTab: \"step2\" })}\n variant=\"success\"\n >\n \n this.setState({ defauleTab: \"step4\" })}\n variant=\"success\"\n >\n {lang_data?.next}{\" \"}\n \n \n \n
this.setState({ defauleTab: \"step3\" })}\n variant=\"success\"\n >\n \n [\n this.setState({ isOpenModal: false }),\n this.clearState(),\n this.refreshData(),\n ]}\n variant=\"primary\"\n >\n {lang_data?.finish}\n \n \n \n \n [\n this.setState({ isOpenModal: false }),\n this.clearState(),\n this.refreshData(),\n ]}\n variant=\"info\"\n >\n {lang_data?.cancelled}\n \n \n \n \n
\n\n
\n \n
\n
\n \n
{lang_data?.favorite} \n \n \n
\n \n
\n
\n\n
\n \n \n \n [\n this.setState({\n search_value: e.target.value,\n }),\n this.refreshData(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n search_value: e.target.value,\n }),\n this.refreshData(),\n ]}\n />\n \n \n \n
\n\n
\n \n {data?.map((rs, index) => (\n \n
\n\n
\n\n
\n {rs?.favorite_user?.firstname}{\" \"}\n {rs?.favorite_user?.lastname}\n \n
\n
\n {\n rs?.favorite_user?.user_main_detail?.user_tambon\n ?.province_thai\n }{\" \"}\n {\" / \"}{\" \"}\n {\n rs?.favorite_user?.user_main_detail?.user_tambon\n ?.province_eng\n }\n
\n
\n
\n
\n \n \n \n {\" \"}\n this.favoritDelete(rs?.favorite_id)}\n title=\"Favorite\"\n >\n \n \n
\n \n\n
\n
\n \n {lang_data?.page} \n [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onClick={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n style={{ textAlign: \"center\" }}\n />\n \n {lang_data?.total_page} : {param.total_page}\n \n \n
\n
\n
\n
(type: string) {\n // eslint-disable-next-line valid-typeof\n return (value: unknown): value is T => typeof value === type;\n}\n\n/**\n * Checks if the value is a JavaScript function.\n */\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const isFunction = isOfType('function');\n\n/**\n * Check if the value is null.\n */\nexport const isNull = (value: unknown): value is null => {\n return value === null;\n};\n\n/**\n * Checks if the input is a regular expression.\n */\nexport const isRegex = (value: unknown): value is RegExp => {\n return Object.prototype.toString.call(value).slice(8, -1) === 'RegExp';\n};\n\n/**\n * Checks if the value is an object.\n */\nexport const isObject = (value: unknown): value is AnyObject => {\n return !isUndefined(value) && !isNull(value) && (isFunction(value) || typeof value === 'object');\n};\n\n/**\n * Checks if the value is undefined.\n */\nexport const isUndefined = isOfType('undefined');\n","import { isObject, isRegex } from './helpers';\n\n/**\n * Check if arrays are equal.\n */\nfunction equalArray(left: unknown[], right: unknown[]) {\n const { length } = left;\n\n if (length !== right.length) {\n return false;\n }\n\n for (let index = length; index-- !== 0; ) {\n if (!equal(left[index], right[index])) {\n return false;\n }\n }\n\n return true;\n}\n\n/**\n * Check if array buffers are equal.\n */\nfunction equalArrayBuffer(left: ArrayBufferView, right: ArrayBufferView) {\n if (left.byteLength !== right.byteLength) {\n return false;\n }\n\n const view1 = new DataView(left.buffer);\n const view2 = new DataView(right.buffer);\n\n let index = left.byteLength;\n\n while (index--) {\n if (view1.getUint8(index) !== view2.getUint8(index)) {\n return false;\n }\n }\n\n return true;\n}\n\n/**\n * Check if maps are equal.\n */\nfunction equalMap(left: Map, right: Map) {\n if (left.size !== right.size) {\n return false;\n }\n\n for (const index of left.entries()) {\n if (!right.has(index[0])) {\n return false;\n }\n }\n\n for (const index of left.entries()) {\n if (!equal(index[1], right.get(index[0]))) {\n return false;\n }\n }\n\n return true;\n}\n\n/**\n * Check if sets are equal.\n */\nfunction equalSet(left: Set, right: Set) {\n if (left.size !== right.size) {\n return false;\n }\n\n for (const index of left.entries()) {\n if (!right.has(index[0])) {\n return false;\n }\n }\n\n return true;\n}\n\n/**\n * Checks if two values are equal.\n */\nexport default function equal(left: unknown, right: unknown) {\n if (left === right) {\n return true;\n }\n\n if (left && isObject(left) && right && isObject(right)) {\n if (left.constructor !== right.constructor) {\n return false;\n }\n\n if (Array.isArray(left) && Array.isArray(right)) {\n return equalArray(left, right);\n }\n\n if (left instanceof Map && right instanceof Map) {\n return equalMap(left, right);\n }\n\n if (left instanceof Set && right instanceof Set) {\n return equalSet(left, right);\n }\n\n if (ArrayBuffer.isView(left) && ArrayBuffer.isView(right)) {\n return equalArrayBuffer(left, right);\n }\n\n if (isRegex(left) && isRegex(right)) {\n return left.source === right.source && left.flags === right.flags;\n }\n\n if (left.valueOf !== Object.prototype.valueOf) {\n return left.valueOf() === right.valueOf();\n }\n\n if (left.toString !== Object.prototype.toString) {\n return left.toString() === right.toString();\n }\n\n const leftKeys = Object.keys(left);\n const rightKeys = Object.keys(right);\n\n if (leftKeys.length !== rightKeys.length) {\n return false;\n }\n\n for (let index = leftKeys.length; index-- !== 0; ) {\n if (!Object.prototype.hasOwnProperty.call(right, leftKeys[index])) {\n return false;\n }\n }\n\n for (let index = leftKeys.length; index-- !== 0; ) {\n const key = leftKeys[index];\n\n if (key === '_owner' && left.$$typeof) {\n // React-specific: avoid traversing React elements' _owner.\n // _owner contains circular references\n // and is not needed when comparing the actual elements (and not their owners)\n // eslint-disable-next-line no-continue\n continue;\n }\n\n if (!equal(left[key], right[key])) {\n return false;\n }\n }\n\n return true;\n }\n\n if (Number.isNaN(left) && Number.isNaN(right)) {\n return true;\n }\n\n return left === right;\n}\n","/* eslint-disable @typescript-eslint/ban-types */\nimport type { ObjectTypes, Primitive, PrimitiveTypes } from './types';\n\nexport const objectTypes = [\n 'Array',\n 'ArrayBuffer',\n 'AsyncFunction',\n 'AsyncGenerator',\n 'AsyncGeneratorFunction',\n 'Date',\n 'Error',\n 'Function',\n 'Generator',\n 'GeneratorFunction',\n 'HTMLElement',\n 'Map',\n 'Object',\n 'Promise',\n 'RegExp',\n 'Set',\n 'WeakMap',\n 'WeakSet',\n] as const;\n\nexport const primitiveTypes = [\n 'bigint',\n 'boolean',\n 'null',\n 'number',\n 'string',\n 'symbol',\n 'undefined',\n] as const;\n\nexport function getObjectType(value: unknown): ObjectTypes | undefined {\n const objectTypeName = Object.prototype.toString.call(value).slice(8, -1);\n\n if (/HTML\\w+Element/.test(objectTypeName)) {\n return 'HTMLElement';\n }\n\n if (isObjectType(objectTypeName)) {\n return objectTypeName;\n }\n\n return undefined;\n}\n\nexport function isObjectOfType(type: string) {\n return (value: unknown): value is T => getObjectType(value) === type;\n}\n\nexport function isObjectType(name: unknown): name is ObjectTypes {\n return objectTypes.includes(name as ObjectTypes);\n}\n\nexport function isOfType(type: string) {\n // eslint-disable-next-line valid-typeof\n return (value: unknown): value is T => typeof value === type;\n}\n\nexport function isPrimitiveType(name: unknown): name is PrimitiveTypes {\n return primitiveTypes.includes(name as PrimitiveTypes);\n}\n","/* eslint-disable @typescript-eslint/ban-types */\nimport { getObjectType, isObjectOfType, isOfType, isPrimitiveType } from './helpers';\nimport type { Class, PlainObject, Primitive, TypeName } from './types';\n\nconst DOM_PROPERTIES_TO_CHECK: Array = [\n 'innerHTML',\n 'ownerDocument',\n 'style',\n 'attributes',\n 'nodeValue',\n];\n\nfunction is(value: unknown): TypeName {\n if (value === null) {\n return 'null';\n }\n\n switch (typeof value) {\n case 'bigint':\n return 'bigint';\n case 'boolean':\n return 'boolean';\n case 'number':\n return 'number';\n case 'string':\n return 'string';\n case 'symbol':\n return 'symbol';\n case 'undefined':\n return 'undefined';\n default:\n }\n\n if (is.array(value)) {\n return 'Array';\n }\n\n if (is.plainFunction(value)) {\n return 'Function';\n }\n\n const tagType = getObjectType(value);\n\n if (tagType) {\n return tagType;\n }\n /* c8 ignore next 3 */\n\n return 'Object';\n}\n\nis.array = Array.isArray;\n\nis.arrayOf = (target: unknown[], predicate: (v: unknown) => boolean): boolean => {\n if (!is.array(target) && !is.function(predicate)) {\n return false;\n }\n\n return target.every(d => predicate(d));\n};\n\nis.asyncGeneratorFunction = (value: unknown): value is (...arguments_: any[]) => Promise =>\n getObjectType(value) === 'AsyncGeneratorFunction';\n\nis.asyncFunction = isObjectOfType('AsyncFunction');\n\nis.bigint = isOfType('bigint');\n\nis.boolean = (value: unknown): value is boolean => {\n return value === true || value === false;\n};\n\nis.date = isObjectOfType('Date');\n\nis.defined = (value: unknown): boolean => !is.undefined(value);\n\nis.domElement = (value: unknown): value is HTMLElement => {\n return (\n is.object(value) &&\n !is.plainObject(value) &&\n (value as HTMLElement).nodeType === 1 &&\n is.string((value as HTMLElement).nodeName) &&\n DOM_PROPERTIES_TO_CHECK.every(property => property in (value as HTMLElement))\n );\n};\n\nis.empty = (value: unknown): boolean => {\n return (\n (is.string(value) && value.length === 0) ||\n (is.array(value) && value.length === 0) ||\n (is.object(value) && !is.map(value) && !is.set(value) && Object.keys(value).length === 0) ||\n (is.set(value) && value.size === 0) ||\n (is.map(value) && value.size === 0)\n );\n};\n\nis.error = isObjectOfType('Error');\n\nis.function = isOfType('function');\n\nis.generator = (value: unknown): value is Generator => {\n return (\n is.iterable(value) &&\n is.function((value as IterableIterator).next) &&\n is.function((value as IterableIterator).throw)\n );\n};\n\nis.generatorFunction = isObjectOfType('GeneratorFunction');\n\nis.instanceOf = (instance: unknown, class_: Class): instance is T => {\n if (!instance || !(class_ as Class)) {\n return false;\n }\n\n return Object.getPrototypeOf(instance) === class_.prototype;\n};\n\nis.iterable = (value: unknown): value is IterableIterator => {\n return (\n !is.nullOrUndefined(value) && is.function((value as IterableIterator)[Symbol.iterator])\n );\n};\n\nis.map = isObjectOfType>('Map');\n\nis.nan = (value: unknown): boolean => {\n return Number.isNaN(value as number);\n};\n\nis.null = (value: unknown): value is null => {\n return value === null;\n};\n\nis.nullOrUndefined = (value: unknown): value is null | undefined => {\n return is.null(value) || is.undefined(value);\n};\n\nis.number = (value: unknown): value is number => {\n return isOfType('number')(value) && !is.nan(value);\n};\n\nis.numericString = (value: unknown): value is string => {\n return is.string(value) && (value as string).length > 0 && !Number.isNaN(Number(value));\n};\n\nis.object = (value: unknown): value is object => {\n return !is.nullOrUndefined(value) && (is.function(value) || typeof value === 'object');\n};\n\nis.oneOf = (target: unknown[], value: any): boolean => {\n if (!is.array(target)) {\n return false;\n }\n\n // eslint-disable-next-line unicorn/prefer-includes\n return target.indexOf(value) > -1;\n};\n\nis.plainFunction = isObjectOfType('Function');\n\nis.plainObject = (value: unknown): value is PlainObject => {\n if (getObjectType(value) !== 'Object') {\n return false;\n }\n\n const prototype = Object.getPrototypeOf(value);\n\n return prototype === null || prototype === Object.getPrototypeOf({});\n};\n\nis.primitive = (value: unknown): value is Primitive =>\n is.null(value) || isPrimitiveType(typeof value);\n\nis.promise = isObjectOfType>('Promise');\n\nis.propertyOf = (\n target: PlainObject,\n key: string,\n predicate?: (v: unknown) => boolean,\n): boolean => {\n if (!is.object(target) || !key) {\n return false;\n }\n\n const value = target[key];\n\n if (is.function(predicate)) {\n return predicate(value);\n }\n\n return is.defined(value);\n};\n\nis.regexp = isObjectOfType('RegExp');\n\nis.set = isObjectOfType>('Set');\n\nis.string = isOfType('string');\n\nis.symbol = isOfType('symbol');\n\nis.undefined = isOfType('undefined');\n\nis.weakMap = isObjectOfType>('WeakMap');\n\nis.weakSet = isObjectOfType>('WeakSet');\n\nexport default is;\n","import equal from '@gilbarbara/deep-equal';\nimport is from 'is-lite';\n\nimport { CompareValuesOptions, Data, Key, Options, ValidTypes, Value } from './types';\n\nexport function canHaveLength(...arguments_: any): boolean {\n return arguments_.every((d: unknown) => is.string(d) || is.array(d) || is.plainObject(d));\n}\n\nexport function checkEquality(left: Data, right: Data, value: Value) {\n if (!isSameType(left, right)) {\n return false;\n }\n\n if ([left, right].every(is.array)) {\n return !left.some(hasValue(value)) && right.some(hasValue(value));\n }\n\n /* istanbul ignore else */\n if ([left, right].every(is.plainObject)) {\n return (\n !Object.entries(left).some(hasEntry(value)) && Object.entries(right).some(hasEntry(value))\n );\n }\n\n return right === value;\n}\n\nexport function compareNumbers(\n previousData: Data,\n data: Data,\n options: Options,\n): boolean {\n const { actual, key, previous, type } = options;\n const left = nested(previousData, key);\n const right = nested(data, key);\n\n let changed =\n [left, right].every(is.number) && (type === 'increased' ? left < right : left > right);\n\n if (!is.undefined(actual)) {\n changed = changed && right === actual;\n }\n\n if (!is.undefined(previous)) {\n changed = changed && left === previous;\n }\n\n return changed;\n}\n\nexport function compareValues(\n previousData: Data,\n data: Data,\n options: CompareValuesOptions,\n) {\n const { key, type, value } = options;\n\n const left = nested(previousData, key);\n const right = nested(data, key);\n const primary = type === 'added' ? left : right;\n const secondary = type === 'added' ? right : left;\n\n if (!is.nullOrUndefined(value)) {\n if (is.defined(primary)) {\n // check if nested data matches\n if (is.array(primary) || is.plainObject(primary)) {\n return checkEquality(primary, secondary, value);\n }\n } else {\n return equal(secondary, value);\n }\n\n return false;\n }\n\n if ([left, right].every(is.array)) {\n return !secondary.every(isEqualPredicate(primary));\n }\n\n if ([left, right].every(is.plainObject)) {\n return hasExtraKeys(Object.keys(primary), Object.keys(secondary));\n }\n\n return (\n ![left, right].every(d => is.primitive(d) && is.defined(d)) &&\n (type === 'added'\n ? !is.defined(left) && is.defined(right)\n : is.defined(left) && !is.defined(right))\n );\n}\n\nexport function getIterables(previousData: Data, data: Data, { key }: Options = {}) {\n let left = nested(previousData, key);\n let right = nested(data, key);\n\n if (!isSameType(left, right)) {\n throw new TypeError('Inputs have different types');\n }\n\n if (!canHaveLength(left, right)) {\n throw new TypeError(\"Inputs don't have length\");\n }\n\n if ([left, right].every(is.plainObject)) {\n left = Object.keys(left);\n right = Object.keys(right);\n }\n\n return [left, right];\n}\n\nexport function hasEntry(input: Value) {\n return ([key, value]: [string, Value]) => {\n if (is.array(input)) {\n return (\n equal(input, value) ||\n input.some(d => equal(d, value) || (is.array(value) && isEqualPredicate(value)(d)))\n );\n }\n\n /* istanbul ignore else */\n if (is.plainObject(input) && input[key]) {\n return !!input[key] && equal(input[key], value);\n }\n\n return equal(input, value);\n };\n}\n\nexport function hasExtraKeys(left: string[], right: string[]): boolean {\n return right.some(d => !left.includes(d));\n}\n\nexport function hasValue(input: Value) {\n return (value: Value) => {\n if (is.array(input)) {\n return input.some(d => equal(d, value) || (is.array(value) && isEqualPredicate(value)(d)));\n }\n\n return equal(input, value);\n };\n}\n\nexport function includesOrEqualsTo(previousValue: T | T[], value: T): boolean {\n return is.array(previousValue)\n ? previousValue.some(d => equal(d, value))\n : equal(previousValue, value);\n}\n\nexport function isEqualPredicate(data: unknown[]) {\n return (value: unknown) => data.some(d => equal(d, value));\n}\n\nexport function isSameType(...arguments_: ValidTypes[]): boolean {\n return (\n arguments_.every(is.array) ||\n arguments_.every(is.number) ||\n arguments_.every(is.plainObject) ||\n arguments_.every(is.string)\n );\n}\n\nexport function nested(data: T, property?: K) {\n /* istanbul ignore else */\n if (is.plainObject(data) || is.array(data)) {\n /* istanbul ignore else */\n if (is.string(property)) {\n const props: Array = property.split('.');\n\n return props.reduce((acc, d) => acc && acc[d], data);\n }\n\n /* istanbul ignore else */\n if (is.number(property)) {\n return data[property];\n }\n\n return data;\n }\n\n return data;\n}\n","import equal from '@gilbarbara/deep-equal';\nimport is from 'is-lite';\n\nimport { compareNumbers, compareValues, getIterables, includesOrEqualsTo, nested } from './helpers';\nimport { Data, KeyType, TreeChanges, Value } from './types';\n\nexport default function treeChanges>(\n previousData: P,\n data: D,\n): TreeChanges {\n if ([previousData, data].some(is.nullOrUndefined)) {\n throw new Error('Missing required parameters');\n }\n\n if (![previousData, data].every(d => is.plainObject(d) || is.array(d))) {\n throw new Error('Expected plain objects or array');\n }\n\n const added = (key?: K, value?: Value): boolean => {\n try {\n return compareValues(previousData, data, { key, type: 'added', value });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const changed = (key?: K | string, actual?: Value, previous?: Value): boolean => {\n try {\n const left = nested(previousData, key);\n const right = nested(data, key);\n const hasActual = is.defined(actual);\n const hasPrevious = is.defined(previous);\n\n if (hasActual || hasPrevious) {\n const leftComparator = hasPrevious\n ? includesOrEqualsTo(previous, left)\n : !includesOrEqualsTo(actual, left);\n const rightComparator = includesOrEqualsTo(actual, right);\n\n return leftComparator && rightComparator;\n }\n\n if ([left, right].every(is.array) || [left, right].every(is.plainObject)) {\n return !equal(left, right);\n }\n\n return left !== right;\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const changedFrom = (key: K | string, previous: Value, actual?: Value): boolean => {\n if (!is.defined(key)) {\n return false;\n }\n\n try {\n const left = nested(previousData, key);\n const right = nested(data, key);\n const hasActual = is.defined(actual);\n\n return (\n includesOrEqualsTo(previous, left) &&\n (hasActual ? includesOrEqualsTo(actual, right) : !hasActual)\n );\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const decreased = (key: K, actual?: Value, previous?: Value): boolean => {\n if (!is.defined(key)) {\n return false;\n }\n\n try {\n return compareNumbers(previousData, data, { key, actual, previous, type: 'decreased' });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const emptied = (key?: K): boolean => {\n try {\n const [left, right] = getIterables(previousData, data, { key });\n\n return !!left.length && !right.length;\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const filled = (key?: K): boolean => {\n try {\n const [left, right] = getIterables(previousData, data, { key });\n\n return !left.length && !!right.length;\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const increased = (key: K, actual?: Value, previous?: Value): boolean => {\n if (!is.defined(key)) {\n return false;\n }\n\n try {\n return compareNumbers(previousData, data, { key, actual, previous, type: 'increased' });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const removed = (key?: K, value?: Value): boolean => {\n try {\n return compareValues(previousData, data, { key, type: 'removed', value });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n return { added, changed, changedFrom, decreased, emptied, filled, increased, removed };\n}\n\nexport type { Data, KeyType, TreeChanges, Value } from './types';\n","import { NarrowPlainObject, PlainObject, RemoveType, Simplify } from '@gilbarbara/types';\nimport is from 'is-lite';\n\nimport { InvertKeyValue, QueryStringFormatOptions } from './types';\n\n/**\n * Remove properties with undefined value from an object\n */\nexport function cleanUpObject(input: T) {\n const output: Record = {};\n\n for (const key in input) {\n if (input[key] !== undefined) {\n output[key] = input[key];\n }\n }\n\n return output as RemoveType;\n}\n\n/**\n * Get a nested property inside an object or array\n */\nexport function getNestedProperty>(input: T, path: string): any {\n if ((!is.plainObject(input) && !is.array(input)) || !path) {\n return input;\n }\n\n const segments = path.split('.');\n const { length } = segments;\n let output = input;\n\n for (let index = 0; index < length; index++) {\n const currentSegment = segments[index];\n const remainingSegments = segments.slice(index + 1);\n\n if (currentSegment === '+' && is.array(output) && remainingSegments.length === 1) {\n return output.map(d => d[remainingSegments.join('.')]);\n }\n\n try {\n output = output[currentSegment];\n } catch {\n // skip\n }\n }\n\n return output;\n}\n\n/**\n * Invert object key and value\n */\nexport function invertKeys>(input: T) {\n if (!is.plainObject(input)) {\n throw new TypeError('Expected an object');\n }\n\n const result: Record = {};\n\n for (const [key, value] of Object.entries(input)) {\n result[value] = key;\n }\n\n return result as InvertKeyValue;\n}\n\n/**\n * Set the key as the value\n */\nexport function keyMirror(input: T): { [K in keyof T]: K } {\n if (!is.plainObject(input)) {\n throw new TypeError('Expected an object');\n }\n\n const output: any = {};\n\n for (const key in input) {\n /* istanbul ignore else */\n if (!Object.prototype.hasOwnProperty.call(output, key)) {\n output[key] = key;\n }\n }\n\n return output;\n}\n\n/**\n * Merges the defaultProps with literal values with the incoming props, removing undefined values from it that would override the defaultProps.\n * The result is a type-safe object with the defaultProps as required properties.\n */\nexport function mergeProps, TProps extends PlainObject>(\n defaultProps: TDefaultProps,\n props: TProps,\n) {\n const cleanProps = cleanUpObject(props);\n\n return { ...defaultProps, ...cleanProps } as unknown as Simplify<\n TProps & Required>\n >;\n}\n\n/**\n * Type-safe Object.entries()\n */\nexport function objectEntries>(input: T) {\n return Object.entries(input) as Array<{ [K in keyof T]-?: [K, T[K]] }[keyof T]>;\n}\n\n/**\n * Type-safe Object.keys()\n */\nexport function objectKeys>(input: T) {\n return Object.keys(input) as Array;\n}\n\n/**\n * Convert an object to an array of objects\n */\nexport function objectToArray(input: T, includeOnly?: string) {\n if (!is.plainObject(input)) {\n throw new TypeError('Expected an object');\n }\n\n return Object.entries(input)\n .filter(([, value]) => (includeOnly ? typeof value === `${includeOnly}` : true)) // eslint-disable-line valid-typeof\n .map(([key, value]) => ({ [key]: value }));\n}\n\n/**\n * Remove properties from an object\n */\nexport function omit, K extends keyof T>(\n input: NarrowPlainObject,\n ...filter: K[]\n) {\n if (!is.plainObject(input)) {\n throw new TypeError('Expected an object');\n }\n\n const output: any = {};\n\n for (const key in input) {\n /* istanbul ignore else */\n if ({}.hasOwnProperty.call(input, key)) {\n if (!filter.includes(key as unknown as K)) {\n output[key] = input[key];\n }\n }\n }\n\n return output as Omit;\n}\n\n/**\n * Select properties from an object\n */\nexport function pick, K extends keyof T>(\n input: NarrowPlainObject,\n ...filter: K[]\n) {\n if (!is.plainObject(input)) {\n throw new TypeError('Expected an object');\n }\n\n if (!filter.length) {\n return input;\n }\n\n const output: any = {};\n\n for (const key in input) {\n /* istanbul ignore else */\n if ({}.hasOwnProperty.call(input, key)) {\n if (filter.includes(key as unknown as K)) {\n output[key] = input[key];\n }\n }\n }\n\n return output as Pick;\n}\n\n/**\n * Stringify a shallow object into a query string\n */\nexport function queryStringFormat(\n input: T,\n options: QueryStringFormatOptions = {},\n) {\n const { addPrefix = false, encoder = encodeURIComponent, encodeValuesOnly = true } = options;\n\n if (!is.plainObject(input)) {\n throw new TypeError(\"input type isn't supported\");\n }\n\n const isValidInput = Object.values(input).every(item => {\n if (is.array(item)) {\n return item.every(d => is.string(d) || is.number(d));\n }\n\n return is.string(item);\n });\n\n if (!isValidInput) {\n throw new TypeError(\"input format isn't supported\");\n }\n\n const output = Object.entries(input)\n .map(([key, value]) => {\n const nextKey = encodeValuesOnly ? key : encoder(key);\n const nextValue = is.array(value) ? value.map(encoder).join(',') : encoder(`${value}`);\n\n return `${nextKey}=${nextValue}`;\n })\n .join('&');\n\n return `${addPrefix ? '?' : ''}${output}`;\n}\n\n/**\n * Parse a query string\n */\nexport function queryStringParse(input: string): PlainObject {\n let search = input;\n\n if (input.slice(0, 1) === '?') {\n search = input.slice(1);\n }\n\n return search.split('&').reduce>((acc, d) => {\n const [key, value] = d.split('=');\n\n acc[decodeURIComponent(key)] = decodeURIComponent(value);\n\n return acc;\n }, {});\n}\n\n/**\n * Sort object keys\n */\nexport function sortObjectKeys(input: T) {\n return objectKeys(input)\n .sort()\n .reduce((acc, key) => {\n acc[key] = input[key];\n\n return acc;\n }, {} as T);\n}\n","export default typeof window !== 'undefined' && typeof document !== 'undefined' && typeof navigator !== 'undefined';\n","import isBrowser from './isBrowser';\n\nconst timeoutDuration = (function(){\n const longerTimeoutBrowsers = ['Edge', 'Trident', 'Firefox'];\n for (let i = 0; i < longerTimeoutBrowsers.length; i += 1) {\n if (isBrowser && navigator.userAgent.indexOf(longerTimeoutBrowsers[i]) >= 0) {\n return 1;\n }\n }\n return 0;\n}());\n\nexport function microtaskDebounce(fn) {\n let called = false\n return () => {\n if (called) {\n return\n }\n called = true\n window.Promise.resolve().then(() => {\n called = false\n fn()\n })\n }\n}\n\nexport function taskDebounce(fn) {\n let scheduled = false;\n return () => {\n if (!scheduled) {\n scheduled = true;\n setTimeout(() => {\n scheduled = false;\n fn();\n }, timeoutDuration);\n }\n };\n}\n\nconst supportsMicroTasks = isBrowser && window.Promise\n\n\n/**\n* Create a debounced version of a method, that's asynchronously deferred\n* but called in the minimum time possible.\n*\n* @method\n* @memberof Popper.Utils\n* @argument {Function} fn\n* @returns {Function}\n*/\nexport default (supportsMicroTasks\n ? microtaskDebounce\n : taskDebounce);\n","/**\n * Check if the given variable is a function\n * @method\n * @memberof Popper.Utils\n * @argument {Any} functionToCheck - variable to check\n * @returns {Boolean} answer to: is a function?\n */\nexport default function isFunction(functionToCheck) {\n const getType = {};\n return (\n functionToCheck &&\n getType.toString.call(functionToCheck) === '[object Function]'\n );\n}\n","/**\n * Get CSS computed property of the given element\n * @method\n * @memberof Popper.Utils\n * @argument {Eement} element\n * @argument {String} property\n */\nexport default function getStyleComputedProperty(element, property) {\n if (element.nodeType !== 1) {\n return [];\n }\n // NOTE: 1 DOM access here\n const window = element.ownerDocument.defaultView;\n const css = window.getComputedStyle(element, null);\n return property ? css[property] : css;\n}\n","/**\n * Returns the parentNode or the host of the element\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element\n * @returns {Element} parent\n */\nexport default function getParentNode(element) {\n if (element.nodeName === 'HTML') {\n return element;\n }\n return element.parentNode || element.host;\n}\n","import getStyleComputedProperty from './getStyleComputedProperty';\nimport getParentNode from './getParentNode';\n\n/**\n * Returns the scrolling parent of the given element\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element\n * @returns {Element} scroll parent\n */\nexport default function getScrollParent(element) {\n // Return body, `getScroll` will take care to get the correct `scrollTop` from it\n if (!element) {\n return document.body\n }\n\n switch (element.nodeName) {\n case 'HTML':\n case 'BODY':\n return element.ownerDocument.body\n case '#document':\n return element.body\n }\n\n // Firefox want us to check `-x` and `-y` variations as well\n const { overflow, overflowX, overflowY } = getStyleComputedProperty(element);\n if (/(auto|scroll|overlay)/.test(overflow + overflowY + overflowX)) {\n return element;\n }\n\n return getScrollParent(getParentNode(element));\n}\n","/**\n * Returns the reference node of the reference object, or the reference object itself.\n * @method\n * @memberof Popper.Utils\n * @param {Element|Object} reference - the reference element (the popper will be relative to this)\n * @returns {Element} parent\n */\nexport default function getReferenceNode(reference) {\n return reference && reference.referenceNode ? reference.referenceNode : reference;\n}\n","import isBrowser from './isBrowser';\n\nconst isIE11 = isBrowser && !!(window.MSInputMethodContext && document.documentMode);\nconst isIE10 = isBrowser && /MSIE 10/.test(navigator.userAgent);\n\n/**\n * Determines if the browser is Internet Explorer\n * @method\n * @memberof Popper.Utils\n * @param {Number} version to check\n * @returns {Boolean} isIE\n */\nexport default function isIE(version) {\n if (version === 11) {\n return isIE11;\n }\n if (version === 10) {\n return isIE10;\n }\n return isIE11 || isIE10;\n}\n","import getStyleComputedProperty from './getStyleComputedProperty';\nimport isIE from './isIE';\n/**\n * Returns the offset parent of the given element\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element\n * @returns {Element} offset parent\n */\nexport default function getOffsetParent(element) {\n if (!element) {\n return document.documentElement;\n }\n\n const noOffsetParent = isIE(10) ? document.body : null;\n\n // NOTE: 1 DOM access here\n let offsetParent = element.offsetParent || null;\n // Skip hidden elements which don't have an offsetParent\n while (offsetParent === noOffsetParent && element.nextElementSibling) {\n offsetParent = (element = element.nextElementSibling).offsetParent;\n }\n\n const nodeName = offsetParent && offsetParent.nodeName;\n\n if (!nodeName || nodeName === 'BODY' || nodeName === 'HTML') {\n return element ? element.ownerDocument.documentElement : document.documentElement;\n }\n\n // .offsetParent will return the closest TH, TD or TABLE in case\n // no offsetParent is present, I hate this job...\n if (\n ['TH', 'TD', 'TABLE'].indexOf(offsetParent.nodeName) !== -1 &&\n getStyleComputedProperty(offsetParent, 'position') === 'static'\n ) {\n return getOffsetParent(offsetParent);\n }\n\n return offsetParent;\n}\n","/**\n * Finds the root node (document, shadowDOM root) of the given element\n * @method\n * @memberof Popper.Utils\n * @argument {Element} node\n * @returns {Element} root node\n */\nexport default function getRoot(node) {\n if (node.parentNode !== null) {\n return getRoot(node.parentNode);\n }\n\n return node;\n}\n","import isOffsetContainer from './isOffsetContainer';\nimport getRoot from './getRoot';\nimport getOffsetParent from './getOffsetParent';\n\n/**\n * Finds the offset parent common to the two provided nodes\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element1\n * @argument {Element} element2\n * @returns {Element} common offset parent\n */\nexport default function findCommonOffsetParent(element1, element2) {\n // This check is needed to avoid errors in case one of the elements isn't defined for any reason\n if (!element1 || !element1.nodeType || !element2 || !element2.nodeType) {\n return document.documentElement;\n }\n\n // Here we make sure to give as \"start\" the element that comes first in the DOM\n const order =\n element1.compareDocumentPosition(element2) &\n Node.DOCUMENT_POSITION_FOLLOWING;\n const start = order ? element1 : element2;\n const end = order ? element2 : element1;\n\n // Get common ancestor container\n const range = document.createRange();\n range.setStart(start, 0);\n range.setEnd(end, 0);\n const { commonAncestorContainer } = range;\n\n // Both nodes are inside #document\n if (\n (element1 !== commonAncestorContainer &&\n element2 !== commonAncestorContainer) ||\n start.contains(end)\n ) {\n if (isOffsetContainer(commonAncestorContainer)) {\n return commonAncestorContainer;\n }\n\n return getOffsetParent(commonAncestorContainer);\n }\n\n // one of the nodes is inside shadowDOM, find which one\n const element1root = getRoot(element1);\n if (element1root.host) {\n return findCommonOffsetParent(element1root.host, element2);\n } else {\n return findCommonOffsetParent(element1, getRoot(element2).host);\n }\n}\n","import getOffsetParent from './getOffsetParent';\n\nexport default function isOffsetContainer(element) {\n const { nodeName } = element;\n if (nodeName === 'BODY') {\n return false;\n }\n return (\n nodeName === 'HTML' || getOffsetParent(element.firstElementChild) === element\n );\n}\n","/**\n * Gets the scroll value of the given element in the given side (top and left)\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element\n * @argument {String} side `top` or `left`\n * @returns {number} amount of scrolled pixels\n */\nexport default function getScroll(element, side = 'top') {\n const upperSide = side === 'top' ? 'scrollTop' : 'scrollLeft';\n const nodeName = element.nodeName;\n\n if (nodeName === 'BODY' || nodeName === 'HTML') {\n const html = element.ownerDocument.documentElement;\n const scrollingElement = element.ownerDocument.scrollingElement || html;\n return scrollingElement[upperSide];\n }\n\n return element[upperSide];\n}\n","/*\n * Helper to detect borders of a given element\n * @method\n * @memberof Popper.Utils\n * @param {CSSStyleDeclaration} styles\n * Result of `getStyleComputedProperty` on the given element\n * @param {String} axis - `x` or `y`\n * @return {number} borders - The borders size of the given axis\n */\n\nexport default function getBordersSize(styles, axis) {\n const sideA = axis === 'x' ? 'Left' : 'Top';\n const sideB = sideA === 'Left' ? 'Right' : 'Bottom';\n\n return (\n parseFloat(styles[`border${sideA}Width`]) +\n parseFloat(styles[`border${sideB}Width`])\n );\n}\n","import isIE from './isIE';\n\nfunction getSize(axis, body, html, computedStyle) {\n return Math.max(\n body[`offset${axis}`],\n body[`scroll${axis}`],\n html[`client${axis}`],\n html[`offset${axis}`],\n html[`scroll${axis}`],\n isIE(10)\n ? (parseInt(html[`offset${axis}`]) + \n parseInt(computedStyle[`margin${axis === 'Height' ? 'Top' : 'Left'}`]) + \n parseInt(computedStyle[`margin${axis === 'Height' ? 'Bottom' : 'Right'}`]))\n : 0 \n );\n}\n\nexport default function getWindowSizes(document) {\n const body = document.body;\n const html = document.documentElement;\n const computedStyle = isIE(10) && getComputedStyle(html);\n\n return {\n height: getSize('Height', body, html, computedStyle),\n width: getSize('Width', body, html, computedStyle),\n };\n}\n","/**\n * Given element offsets, generate an output similar to getBoundingClientRect\n * @method\n * @memberof Popper.Utils\n * @argument {Object} offsets\n * @returns {Object} ClientRect like output\n */\nexport default function getClientRect(offsets) {\n return {\n ...offsets,\n right: offsets.left + offsets.width,\n bottom: offsets.top + offsets.height,\n };\n}\n","import getStyleComputedProperty from './getStyleComputedProperty';\nimport getBordersSize from './getBordersSize';\nimport getWindowSizes from './getWindowSizes';\nimport getScroll from './getScroll';\nimport getClientRect from './getClientRect';\nimport isIE from './isIE';\n\n/**\n * Get bounding client rect of given element\n * @method\n * @memberof Popper.Utils\n * @param {HTMLElement} element\n * @return {Object} client rect\n */\nexport default function getBoundingClientRect(element) {\n let rect = {};\n\n // IE10 10 FIX: Please, don't ask, the element isn't\n // considered in DOM in some circumstances...\n // This isn't reproducible in IE10 compatibility mode of IE11\n try {\n if (isIE(10)) {\n rect = element.getBoundingClientRect();\n const scrollTop = getScroll(element, 'top');\n const scrollLeft = getScroll(element, 'left');\n rect.top += scrollTop;\n rect.left += scrollLeft;\n rect.bottom += scrollTop;\n rect.right += scrollLeft;\n }\n else {\n rect = element.getBoundingClientRect();\n }\n }\n catch(e){}\n\n const result = {\n left: rect.left,\n top: rect.top,\n width: rect.right - rect.left,\n height: rect.bottom - rect.top,\n };\n\n // subtract scrollbar size from sizes\n const sizes = element.nodeName === 'HTML' ? getWindowSizes(element.ownerDocument) : {};\n const width =\n sizes.width || element.clientWidth || result.width;\n const height =\n sizes.height || element.clientHeight || result.height;\n\n let horizScrollbar = element.offsetWidth - width;\n let vertScrollbar = element.offsetHeight - height;\n\n // if an hypothetical scrollbar is detected, we must be sure it's not a `border`\n // we make this check conditional for performance reasons\n if (horizScrollbar || vertScrollbar) {\n const styles = getStyleComputedProperty(element);\n horizScrollbar -= getBordersSize(styles, 'x');\n vertScrollbar -= getBordersSize(styles, 'y');\n\n result.width -= horizScrollbar;\n result.height -= vertScrollbar;\n }\n\n return getClientRect(result);\n}\n","import getStyleComputedProperty from './getStyleComputedProperty';\nimport includeScroll from './includeScroll';\nimport getScrollParent from './getScrollParent';\nimport getBoundingClientRect from './getBoundingClientRect';\nimport runIsIE from './isIE';\nimport getClientRect from './getClientRect';\n\nexport default function getOffsetRectRelativeToArbitraryNode(children, parent, fixedPosition = false) {\n const isIE10 = runIsIE(10);\n const isHTML = parent.nodeName === 'HTML';\n const childrenRect = getBoundingClientRect(children);\n const parentRect = getBoundingClientRect(parent);\n const scrollParent = getScrollParent(children);\n\n const styles = getStyleComputedProperty(parent);\n const borderTopWidth = parseFloat(styles.borderTopWidth);\n const borderLeftWidth = parseFloat(styles.borderLeftWidth);\n\n // In cases where the parent is fixed, we must ignore negative scroll in offset calc\n if(fixedPosition && isHTML) {\n parentRect.top = Math.max(parentRect.top, 0);\n parentRect.left = Math.max(parentRect.left, 0);\n }\n let offsets = getClientRect({\n top: childrenRect.top - parentRect.top - borderTopWidth,\n left: childrenRect.left - parentRect.left - borderLeftWidth,\n width: childrenRect.width,\n height: childrenRect.height,\n });\n offsets.marginTop = 0;\n offsets.marginLeft = 0;\n\n // Subtract margins of documentElement in case it's being used as parent\n // we do this only on HTML because it's the only element that behaves\n // differently when margins are applied to it. The margins are included in\n // the box of the documentElement, in the other cases not.\n if (!isIE10 && isHTML) {\n const marginTop = parseFloat(styles.marginTop);\n const marginLeft = parseFloat(styles.marginLeft);\n\n offsets.top -= borderTopWidth - marginTop;\n offsets.bottom -= borderTopWidth - marginTop;\n offsets.left -= borderLeftWidth - marginLeft;\n offsets.right -= borderLeftWidth - marginLeft;\n\n // Attach marginTop and marginLeft because in some circumstances we may need them\n offsets.marginTop = marginTop;\n offsets.marginLeft = marginLeft;\n }\n\n if (\n isIE10 && !fixedPosition\n ? parent.contains(scrollParent)\n : parent === scrollParent && scrollParent.nodeName !== 'BODY'\n ) {\n offsets = includeScroll(offsets, parent);\n }\n\n return offsets;\n}\n","import getScroll from './getScroll';\n\n/*\n * Sum or subtract the element scroll values (left and top) from a given rect object\n * @method\n * @memberof Popper.Utils\n * @param {Object} rect - Rect object you want to change\n * @param {HTMLElement} element - The element from the function reads the scroll values\n * @param {Boolean} subtract - set to true if you want to subtract the scroll values\n * @return {Object} rect - The modifier rect object\n */\nexport default function includeScroll(rect, element, subtract = false) {\n const scrollTop = getScroll(element, 'top');\n const scrollLeft = getScroll(element, 'left');\n const modifier = subtract ? -1 : 1;\n rect.top += scrollTop * modifier;\n rect.bottom += scrollTop * modifier;\n rect.left += scrollLeft * modifier;\n rect.right += scrollLeft * modifier;\n return rect;\n}\n","import getStyleComputedProperty from './getStyleComputedProperty';\nimport getParentNode from './getParentNode';\n\n/**\n * Check if the given element is fixed or is inside a fixed parent\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element\n * @argument {Element} customContainer\n * @returns {Boolean} answer to \"isFixed?\"\n */\nexport default function isFixed(element) {\n const nodeName = element.nodeName;\n if (nodeName === 'BODY' || nodeName === 'HTML') {\n return false;\n }\n if (getStyleComputedProperty(element, 'position') === 'fixed') {\n return true;\n }\n const parentNode = getParentNode(element);\n if (!parentNode) {\n return false;\n }\n return isFixed(parentNode);\n}\n","import getStyleComputedProperty from './getStyleComputedProperty';\nimport isIE from './isIE';\n/**\n * Finds the first parent of an element that has a transformed property defined\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element\n * @returns {Element} first transformed parent or documentElement\n */\n\nexport default function getFixedPositionOffsetParent(element) {\n // This check is needed to avoid errors in case one of the elements isn't defined for any reason\n if (!element || !element.parentElement || isIE()) {\n return document.documentElement;\n }\n let el = element.parentElement;\n while (el && getStyleComputedProperty(el, 'transform') === 'none') {\n el = el.parentElement;\n }\n return el || document.documentElement;\n\n}\n","import getScrollParent from './getScrollParent';\nimport getParentNode from './getParentNode';\nimport getReferenceNode from './getReferenceNode';\nimport findCommonOffsetParent from './findCommonOffsetParent';\nimport getOffsetRectRelativeToArbitraryNode from './getOffsetRectRelativeToArbitraryNode';\nimport getViewportOffsetRectRelativeToArtbitraryNode from './getViewportOffsetRectRelativeToArtbitraryNode';\nimport getWindowSizes from './getWindowSizes';\nimport isFixed from './isFixed';\nimport getFixedPositionOffsetParent from './getFixedPositionOffsetParent';\n\n/**\n * Computed the boundaries limits and return them\n * @method\n * @memberof Popper.Utils\n * @param {HTMLElement} popper\n * @param {HTMLElement} reference\n * @param {number} padding\n * @param {HTMLElement} boundariesElement - Element used to define the boundaries\n * @param {Boolean} fixedPosition - Is in fixed position mode\n * @returns {Object} Coordinates of the boundaries\n */\nexport default function getBoundaries(\n popper,\n reference,\n padding,\n boundariesElement,\n fixedPosition = false\n) {\n // NOTE: 1 DOM access here\n\n let boundaries = { top: 0, left: 0 };\n const offsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, getReferenceNode(reference));\n\n // Handle viewport case\n if (boundariesElement === 'viewport' ) {\n boundaries = getViewportOffsetRectRelativeToArtbitraryNode(offsetParent, fixedPosition);\n }\n\n else {\n // Handle other cases based on DOM element used as boundaries\n let boundariesNode;\n if (boundariesElement === 'scrollParent') {\n boundariesNode = getScrollParent(getParentNode(reference));\n if (boundariesNode.nodeName === 'BODY') {\n boundariesNode = popper.ownerDocument.documentElement;\n }\n } else if (boundariesElement === 'window') {\n boundariesNode = popper.ownerDocument.documentElement;\n } else {\n boundariesNode = boundariesElement;\n }\n\n const offsets = getOffsetRectRelativeToArbitraryNode(\n boundariesNode,\n offsetParent,\n fixedPosition\n );\n\n // In case of HTML, we need a different computation\n if (boundariesNode.nodeName === 'HTML' && !isFixed(offsetParent)) {\n const { height, width } = getWindowSizes(popper.ownerDocument);\n boundaries.top += offsets.top - offsets.marginTop;\n boundaries.bottom = height + offsets.top;\n boundaries.left += offsets.left - offsets.marginLeft;\n boundaries.right = width + offsets.left;\n } else {\n // for all the other DOM elements, this one is good\n boundaries = offsets;\n }\n }\n\n // Add paddings\n padding = padding || 0;\n const isPaddingNumber = typeof padding === 'number';\n boundaries.left += isPaddingNumber ? padding : padding.left || 0; \n boundaries.top += isPaddingNumber ? padding : padding.top || 0; \n boundaries.right -= isPaddingNumber ? padding : padding.right || 0; \n boundaries.bottom -= isPaddingNumber ? padding : padding.bottom || 0; \n\n return boundaries;\n}\n","import getOffsetRectRelativeToArbitraryNode from './getOffsetRectRelativeToArbitraryNode';\nimport getScroll from './getScroll';\nimport getClientRect from './getClientRect';\n\nexport default function getViewportOffsetRectRelativeToArtbitraryNode(element, excludeScroll = false) {\n const html = element.ownerDocument.documentElement;\n const relativeOffset = getOffsetRectRelativeToArbitraryNode(element, html);\n const width = Math.max(html.clientWidth, window.innerWidth || 0);\n const height = Math.max(html.clientHeight, window.innerHeight || 0);\n\n const scrollTop = !excludeScroll ? getScroll(html) : 0;\n const scrollLeft = !excludeScroll ? getScroll(html, 'left') : 0;\n\n const offset = {\n top: scrollTop - relativeOffset.top + relativeOffset.marginTop,\n left: scrollLeft - relativeOffset.left + relativeOffset.marginLeft,\n width,\n height,\n };\n\n return getClientRect(offset);\n}\n","import getBoundaries from '../utils/getBoundaries';\n\nfunction getArea({ width, height }) {\n return width * height;\n}\n\n/**\n * Utility used to transform the `auto` placement to the placement with more\n * available space.\n * @method\n * @memberof Popper.Utils\n * @argument {Object} data - The data object generated by update method\n * @argument {Object} options - Modifiers configuration and options\n * @returns {Object} The data object, properly modified\n */\nexport default function computeAutoPlacement(\n placement,\n refRect,\n popper,\n reference,\n boundariesElement,\n padding = 0\n) {\n if (placement.indexOf('auto') === -1) {\n return placement;\n }\n\n const boundaries = getBoundaries(\n popper,\n reference,\n padding,\n boundariesElement\n );\n\n const rects = {\n top: {\n width: boundaries.width,\n height: refRect.top - boundaries.top,\n },\n right: {\n width: boundaries.right - refRect.right,\n height: boundaries.height,\n },\n bottom: {\n width: boundaries.width,\n height: boundaries.bottom - refRect.bottom,\n },\n left: {\n width: refRect.left - boundaries.left,\n height: boundaries.height,\n },\n };\n\n const sortedAreas = Object.keys(rects)\n .map(key => ({\n key,\n ...rects[key],\n area: getArea(rects[key]),\n }))\n .sort((a, b) => b.area - a.area);\n\n const filteredAreas = sortedAreas.filter(\n ({ width, height }) =>\n width >= popper.clientWidth && height >= popper.clientHeight\n );\n\n const computedPlacement = filteredAreas.length > 0\n ? filteredAreas[0].key\n : sortedAreas[0].key;\n\n const variation = placement.split('-')[1];\n\n return computedPlacement + (variation ? `-${variation}` : '');\n}\n","import findCommonOffsetParent from './findCommonOffsetParent';\nimport getOffsetRectRelativeToArbitraryNode from './getOffsetRectRelativeToArbitraryNode';\nimport getFixedPositionOffsetParent from './getFixedPositionOffsetParent';\nimport getReferenceNode from './getReferenceNode';\n\n/**\n * Get offsets to the reference element\n * @method\n * @memberof Popper.Utils\n * @param {Object} state\n * @param {Element} popper - the popper element\n * @param {Element} reference - the reference element (the popper will be relative to this)\n * @param {Element} fixedPosition - is in fixed position mode\n * @returns {Object} An object containing the offsets which will be applied to the popper\n */\nexport default function getReferenceOffsets(state, popper, reference, fixedPosition = null) {\n const commonOffsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, getReferenceNode(reference));\n return getOffsetRectRelativeToArbitraryNode(reference, commonOffsetParent, fixedPosition);\n}\n","/**\n * Get the outer sizes of the given element (offset size + margins)\n * @method\n * @memberof Popper.Utils\n * @argument {Element} element\n * @returns {Object} object containing width and height properties\n */\nexport default function getOuterSizes(element) {\n const window = element.ownerDocument.defaultView;\n const styles = window.getComputedStyle(element);\n const x = parseFloat(styles.marginTop || 0) + parseFloat(styles.marginBottom || 0);\n const y = parseFloat(styles.marginLeft || 0) + parseFloat(styles.marginRight || 0);\n const result = {\n width: element.offsetWidth + y,\n height: element.offsetHeight + x,\n };\n return result;\n}\n","/**\n * Get the opposite placement of the given one\n * @method\n * @memberof Popper.Utils\n * @argument {String} placement\n * @returns {String} flipped placement\n */\nexport default function getOppositePlacement(placement) {\n const hash = { left: 'right', right: 'left', bottom: 'top', top: 'bottom' };\n return placement.replace(/left|right|bottom|top/g, matched => hash[matched]);\n}\n","import getOuterSizes from './getOuterSizes';\nimport getOppositePlacement from './getOppositePlacement';\n\n/**\n * Get offsets to the popper\n * @method\n * @memberof Popper.Utils\n * @param {Object} position - CSS position the Popper will get applied\n * @param {HTMLElement} popper - the popper element\n * @param {Object} referenceOffsets - the reference offsets (the popper will be relative to this)\n * @param {String} placement - one of the valid placement options\n * @returns {Object} popperOffsets - An object containing the offsets which will be applied to the popper\n */\nexport default function getPopperOffsets(popper, referenceOffsets, placement) {\n placement = placement.split('-')[0];\n\n // Get popper node sizes\n const popperRect = getOuterSizes(popper);\n\n // Add position, width and height to our offsets object\n const popperOffsets = {\n width: popperRect.width,\n height: popperRect.height,\n };\n\n // depending by the popper placement we have to compute its offsets slightly differently\n const isHoriz = ['right', 'left'].indexOf(placement) !== -1;\n const mainSide = isHoriz ? 'top' : 'left';\n const secondarySide = isHoriz ? 'left' : 'top';\n const measurement = isHoriz ? 'height' : 'width';\n const secondaryMeasurement = !isHoriz ? 'height' : 'width';\n\n popperOffsets[mainSide] =\n referenceOffsets[mainSide] +\n referenceOffsets[measurement] / 2 -\n popperRect[measurement] / 2;\n if (placement === secondarySide) {\n popperOffsets[secondarySide] =\n referenceOffsets[secondarySide] - popperRect[secondaryMeasurement];\n } else {\n popperOffsets[secondarySide] =\n referenceOffsets[getOppositePlacement(secondarySide)];\n }\n\n return popperOffsets;\n}\n","/**\n * Mimics the `find` method of Array\n * @method\n * @memberof Popper.Utils\n * @argument {Array} arr\n * @argument prop\n * @argument value\n * @returns index or -1\n */\nexport default function find(arr, check) {\n // use native find if supported\n if (Array.prototype.find) {\n return arr.find(check);\n }\n\n // use `filter` to obtain the same behavior of `find`\n return arr.filter(check)[0];\n}\n","import isFunction from './isFunction';\nimport findIndex from './findIndex';\nimport getClientRect from '../utils/getClientRect';\n\n/**\n * Loop trough the list of modifiers and run them in order,\n * each of them will then edit the data object.\n * @method\n * @memberof Popper.Utils\n * @param {dataObject} data\n * @param {Array} modifiers\n * @param {String} ends - Optional modifier name used as stopper\n * @returns {dataObject}\n */\nexport default function runModifiers(modifiers, data, ends) {\n const modifiersToRun = ends === undefined\n ? modifiers\n : modifiers.slice(0, findIndex(modifiers, 'name', ends));\n\n modifiersToRun.forEach(modifier => {\n if (modifier['function']) { // eslint-disable-line dot-notation\n console.warn('`modifier.function` is deprecated, use `modifier.fn`!');\n }\n const fn = modifier['function'] || modifier.fn; // eslint-disable-line dot-notation\n if (modifier.enabled && isFunction(fn)) {\n // Add properties to offsets to make them a complete clientRect object\n // we do this before each modifier to make sure the previous one doesn't\n // mess with these values\n data.offsets.popper = getClientRect(data.offsets.popper);\n data.offsets.reference = getClientRect(data.offsets.reference);\n\n data = fn(data, modifier);\n }\n });\n\n return data;\n}\n","import find from './find';\n\n/**\n * Return the index of the matching object\n * @method\n * @memberof Popper.Utils\n * @argument {Array} arr\n * @argument prop\n * @argument value\n * @returns index or -1\n */\nexport default function findIndex(arr, prop, value) {\n // use native findIndex if supported\n if (Array.prototype.findIndex) {\n return arr.findIndex(cur => cur[prop] === value);\n }\n\n // use `find` + `indexOf` if `findIndex` isn't supported\n const match = find(arr, obj => obj[prop] === value);\n return arr.indexOf(match);\n}\n","import computeAutoPlacement from '../utils/computeAutoPlacement';\nimport getReferenceOffsets from '../utils/getReferenceOffsets';\nimport getPopperOffsets from '../utils/getPopperOffsets';\nimport runModifiers from '../utils/runModifiers';\n\n/**\n * Updates the position of the popper, computing the new offsets and applying\n * the new style. = [\n 'innerHTML',\n 'ownerDocument',\n 'style',\n 'attributes',\n 'nodeValue',\n];\n\nconst objectTypes = [\n 'Array',\n 'ArrayBuffer',\n 'AsyncFunction',\n 'AsyncGenerator',\n 'AsyncGeneratorFunction',\n 'Date',\n 'Error',\n 'Function',\n 'Generator',\n 'GeneratorFunction',\n 'HTMLElement',\n 'Map',\n 'Object',\n 'Promise',\n 'RegExp',\n 'Set',\n 'WeakMap',\n 'WeakSet',\n] as const;\n\nconst primitiveTypes = [\n 'bigint',\n 'boolean',\n 'null',\n 'number',\n 'string',\n 'symbol',\n 'undefined',\n] as const;\n\nexport type ObjectTypes = typeof objectTypes[number];\n\nexport type PrimitiveTypes = typeof primitiveTypes[number];\n\nexport type TypeName = ObjectTypes | PrimitiveTypes;\n\nexport function getObjectType(value: unknown): ObjectTypes | undefined {\n const objectTypeName = Object.prototype.toString.call(value).slice(8, -1);\n\n if (/HTML\\w+Element/.test(objectTypeName)) {\n return 'HTMLElement';\n }\n\n if (isObjectType(objectTypeName)) {\n return objectTypeName;\n }\n\n return undefined;\n}\n\nfunction isObjectOfType(type: string) {\n return (value: unknown): value is T => getObjectType(value) === type;\n}\n\nfunction isObjectType(name: unknown): name is ObjectTypes {\n return objectTypes.includes(name as ObjectTypes);\n}\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nfunction isOfType(type: string) {\n return (value: unknown): value is T => typeof value === type;\n}\n\nfunction isPrimitiveType(name: unknown): name is PrimitiveTypes {\n return primitiveTypes.includes(name as PrimitiveTypes);\n}\n\nfunction is(value: unknown): TypeName {\n if (value === null) {\n return 'null';\n }\n\n switch (typeof value) {\n case 'bigint':\n return 'bigint';\n case 'boolean':\n return 'boolean';\n case 'number':\n return 'number';\n case 'string':\n return 'string';\n case 'symbol':\n return 'symbol';\n case 'undefined':\n return 'undefined';\n default:\n }\n\n if (is.array(value)) {\n return 'Array';\n }\n\n if (is.plainFunction(value)) {\n return 'Function';\n }\n\n const tagType = getObjectType(value);\n\n /* istanbul ignore else */\n if (tagType) {\n return tagType;\n }\n\n /* istanbul ignore next */\n return 'Object';\n}\n\nis.array = Array.isArray;\n\nis.arrayOf = (target: unknown[], predicate: (v: unknown) => boolean): boolean => {\n if (!is.array(target) && !is.function(predicate)) {\n return false;\n }\n\n return target.every(d => predicate(d));\n};\n\nis.asyncGeneratorFunction = (value: unknown): value is (...arguments_: any[]) => Promise =>\n getObjectType(value) === 'AsyncGeneratorFunction';\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nis.asyncFunction = isObjectOfType('AsyncFunction');\n\nis.bigint = isOfType('bigint');\n\nis.boolean = (value: unknown): value is boolean => {\n return value === true || value === false;\n};\n\nis.date = isObjectOfType('Date');\n\nis.defined = (value: unknown): boolean => !is.undefined(value);\n\nis.domElement = (value: unknown): value is HTMLElement => {\n return (\n is.object(value) &&\n !is.plainObject(value) &&\n (value as HTMLElement).nodeType === 1 &&\n is.string((value as HTMLElement).nodeName) &&\n DOM_PROPERTIES_TO_CHECK.every(property => property in (value as HTMLElement))\n );\n};\n\nis.empty = (value: unknown): boolean => {\n return (\n (is.string(value) && value.length === 0) ||\n (is.array(value) && value.length === 0) ||\n (is.object(value) && !is.map(value) && !is.set(value) && Object.keys(value).length === 0) ||\n (is.set(value) && value.size === 0) ||\n (is.map(value) && value.size === 0)\n );\n};\n\nis.error = isObjectOfType('Error');\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nis.function = isOfType('function');\n\nis.generator = (value: unknown): value is Generator => {\n return (\n is.iterable(value) &&\n is.function((value as IterableIterator).next) &&\n is.function((value as IterableIterator).throw)\n );\n};\n\nis.generatorFunction = isObjectOfType('GeneratorFunction');\n\nis.instanceOf = (instance: unknown, class_: Class): instance is T => {\n if (!instance || !(class_ as Class)) {\n return false;\n }\n\n return Object.getPrototypeOf(instance) === class_.prototype;\n};\n\nis.iterable = (value: unknown): value is IterableIterator => {\n return (\n !is.nullOrUndefined(value) && is.function((value as IterableIterator)[Symbol.iterator])\n );\n};\n\nis.map = isObjectOfType>('Map');\n\nis.nan = (value: unknown): boolean => {\n return Number.isNaN(value as number);\n};\n\nis.null = (value: unknown): value is null => {\n return value === null;\n};\n\nis.nullOrUndefined = (value: unknown): value is null | undefined => {\n return is.null(value) || is.undefined(value);\n};\n\nis.number = (value: unknown): value is number => {\n return isOfType('number')(value) && !is.nan(value);\n};\n\nis.numericString = (value: unknown): value is string => {\n return is.string(value) && (value as string).length > 0 && !Number.isNaN(Number(value));\n};\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nis.object = (value: unknown): value is object => {\n return !is.nullOrUndefined(value) && (is.function(value) || typeof value === 'object');\n};\n\nis.oneOf = (target: unknown[], value: any): boolean => {\n if (!is.array(target)) {\n return false;\n }\n\n // eslint-disable-next-line unicorn/prefer-includes\n return target.indexOf(value) > -1;\n};\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nis.plainFunction = isObjectOfType('Function');\n\nis.plainObject = (value: unknown): value is PlainObject => {\n if (getObjectType(value) !== 'Object') {\n return false;\n }\n\n const prototype = Object.getPrototypeOf(value);\n\n return prototype === null || prototype === Object.getPrototypeOf({});\n};\n\nis.primitive = (value: unknown): value is Primitive =>\n is.null(value) || isPrimitiveType(typeof value);\n\nis.promise = isObjectOfType>('Promise');\n\nis.propertyOf = (\n target: PlainObject,\n key: string,\n predicate?: (v: unknown) => boolean,\n): boolean => {\n if (!is.object(target) || !key) {\n return false;\n }\n\n const value = target[key];\n\n if (is.function(predicate)) {\n return predicate(value);\n }\n\n return is.defined(value);\n};\n\nis.regexp = isObjectOfType('RegExp');\n\nis.set = isObjectOfType>('Set');\n\nis.string = isOfType('string');\n\nis.symbol = isOfType('symbol');\n\nis.undefined = isOfType('undefined');\n\nis.weakMap = isObjectOfType>('WeakMap');\n\nis.weakSet = isObjectOfType>('WeakSet');\n\nexport * from './types';\n\nexport default is;\n","import { AnyObject, Primitive } from './types';\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nfunction isOfType(type: string) {\n return (value: unknown): value is T => typeof value === type;\n}\n\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport const isFunction = isOfType('function');\n\nexport const isNull = (value: unknown): value is null => {\n return value === null;\n};\n\nexport const isRegex = (value: unknown): value is RegExp => {\n return Object.prototype.toString.call(value).slice(8, -1) === 'RegExp';\n};\n\nexport const isObject = (value: unknown): value is AnyObject => {\n return !isUndefined(value) && !isNull(value) && (isFunction(value) || typeof value === 'object');\n};\n\nexport const isUndefined = isOfType('undefined');\n","import { isObject, isRegex } from './helpers';\n\nfunction equalArray(left: unknown[], right: unknown[]) {\n const { length } = left;\n\n if (length !== right.length) {\n return false;\n }\n\n for (let index = length; index-- !== 0; ) {\n if (!equal(left[index], right[index])) {\n return false;\n }\n }\n\n return true;\n}\n\nfunction equalArrayBuffer(left: ArrayBufferView, right: ArrayBufferView) {\n if (left.byteLength !== right.byteLength) {\n return false;\n }\n\n const view1 = new DataView(left.buffer);\n const view2 = new DataView(right.buffer);\n\n let index = left.byteLength;\n\n while (index--) {\n if (view1.getUint8(index) !== view2.getUint8(index)) {\n return false;\n }\n }\n\n return true;\n}\n\nfunction equalMap(left: Map, right: Map) {\n if (left.size !== right.size) {\n return false;\n }\n\n for (const index of left.entries()) {\n if (!right.has(index[0])) {\n return false;\n }\n }\n\n for (const index of left.entries()) {\n if (!equal(index[1], right.get(index[0]))) {\n return false;\n }\n }\n\n return true;\n}\n\nfunction equalSet(left: Set, right: Set) {\n if (left.size !== right.size) {\n return false;\n }\n\n for (const index of left.entries()) {\n if (!right.has(index[0])) {\n return false;\n }\n }\n\n return true;\n}\n\nexport default function equal(left: unknown, right: unknown) {\n if (left === right) {\n return true;\n }\n\n if (left && isObject(left) && right && isObject(right)) {\n if (left.constructor !== right.constructor) {\n return false;\n }\n\n if (Array.isArray(left) && Array.isArray(right)) {\n return equalArray(left, right);\n }\n\n if (left instanceof Map && right instanceof Map) {\n return equalMap(left, right);\n }\n\n if (left instanceof Set && right instanceof Set) {\n return equalSet(left, right);\n }\n\n if (ArrayBuffer.isView(left) && ArrayBuffer.isView(right)) {\n return equalArrayBuffer(left, right);\n }\n\n if (isRegex(left) && isRegex(right)) {\n return left.source === right.source && left.flags === right.flags;\n }\n\n if (left.valueOf !== Object.prototype.valueOf) {\n return left.valueOf() === right.valueOf();\n }\n\n if (left.toString !== Object.prototype.toString) {\n return left.toString() === right.toString();\n }\n\n const leftKeys = Object.keys(left);\n const rightKeys = Object.keys(right);\n\n if (leftKeys.length !== rightKeys.length) {\n return false;\n }\n\n for (let index = leftKeys.length; index-- !== 0; ) {\n if (!Object.prototype.hasOwnProperty.call(right, leftKeys[index])) {\n return false;\n }\n }\n\n for (let index = leftKeys.length; index-- !== 0; ) {\n const key = leftKeys[index];\n\n if (key === '_owner' && left.$$typeof) {\n // React-specific: avoid traversing React elements' _owner.\n // _owner contains circular references\n // and is not needed when comparing the actual elements (and not their owners)\n // eslint-disable-next-line no-continue\n continue;\n }\n\n if (!equal(left[key], right[key])) {\n return false;\n }\n }\n\n return true;\n }\n\n if (Number.isNaN(left) && Number.isNaN(right)) {\n return true;\n }\n\n return left === right;\n}\n","import equal from '@gilbarbara/deep-equal';\nimport is from 'is-lite';\n\nimport { CompareValuesOptions, Data, Key, Options, ValidTypes, Value } from './types';\n\nexport function canHaveLength(...arguments_: any): boolean {\n return arguments_.every((d: unknown) => is.string(d) || is.array(d) || is.plainObject(d));\n}\n\nexport function checkEquality(left: Data, right: Data, value: Value) {\n if (!isSameType(left, right)) {\n return false;\n }\n\n if ([left, right].every(is.array)) {\n return !left.some(hasValue(value)) && right.some(hasValue(value));\n }\n\n /* istanbul ignore else */\n if ([left, right].every(is.plainObject)) {\n return (\n !Object.entries(left).some(hasEntry(value)) && Object.entries(right).some(hasEntry(value))\n );\n }\n\n return right === value;\n}\n\nexport function compareNumbers(\n previousData: Data,\n data: Data,\n options: Options,\n): boolean {\n const { actual, key, previous, type } = options;\n const left = nested(previousData, key);\n const right = nested(data, key);\n\n let changed =\n [left, right].every(is.number) && (type === 'increased' ? left < right : left > right);\n\n if (!is.undefined(actual)) {\n changed = changed && right === actual;\n }\n\n if (!is.undefined(previous)) {\n changed = changed && left === previous;\n }\n\n return changed;\n}\n\nexport function compareValues(\n previousData: Data,\n data: Data,\n options: CompareValuesOptions,\n) {\n const { key, type, value } = options;\n\n const left = nested(previousData, key);\n const right = nested(data, key);\n const primary = type === 'added' ? left : right;\n const secondary = type === 'added' ? right : left;\n\n // console.log({ primary, secondary });\n\n if (!is.nullOrUndefined(value)) {\n if (is.defined(primary)) {\n // check if nested data matches\n if (is.array(primary) || is.plainObject(primary)) {\n return checkEquality(primary, secondary, value);\n }\n } else {\n return equal(secondary, value);\n }\n\n return false;\n }\n\n if ([left, right].every(is.array)) {\n return !secondary.every(isEqualPredicate(primary));\n }\n\n if ([left, right].every(is.plainObject)) {\n return hasExtraKeys(Object.keys(primary), Object.keys(secondary));\n }\n\n return (\n ![left, right].every(d => is.primitive(d) && is.defined(d)) &&\n (type === 'added'\n ? !is.defined(left) && is.defined(right)\n : is.defined(left) && !is.defined(right))\n );\n}\n\nexport function getIterables(previousData: Data, data: Data, { key }: Options = {}) {\n let left = nested(previousData, key);\n let right = nested(data, key);\n\n if (!isSameType(left, right)) {\n throw new TypeError('Inputs have different types');\n }\n\n if (!canHaveLength(left, right)) {\n throw new TypeError(\"Inputs don't have length\");\n }\n\n if ([left, right].every(is.plainObject)) {\n left = Object.keys(left);\n right = Object.keys(right);\n }\n\n return [left, right];\n}\n\nexport function hasEntry(input: Value) {\n return ([key, value]: [string, Value]) => {\n if (is.array(input)) {\n return (\n equal(input, value) ||\n input.some(d => equal(d, value) || (is.array(value) && isEqualPredicate(value)(d)))\n );\n }\n\n /* istanbul ignore else */\n if (is.plainObject(input) && input[key]) {\n return !!input[key] && equal(input[key], value);\n }\n\n return equal(input, value);\n };\n}\n\nexport function hasExtraKeys(left: string[], right: string[]): boolean {\n return right.some(d => !left.includes(d));\n}\n\nexport function hasValue(input: Value) {\n return (value: Value) => {\n if (is.array(input)) {\n return input.some(d => equal(d, value) || (is.array(value) && isEqualPredicate(value)(d)));\n }\n\n return equal(input, value);\n };\n}\n\nexport function includesOrEqualsTo(previousValue: T | T[], value: T): boolean {\n return is.array(previousValue)\n ? previousValue.some(d => equal(d, value))\n : equal(previousValue, value);\n}\n\nexport function isEqualPredicate(data: unknown[]) {\n return (value: unknown) => data.some(d => equal(d, value));\n}\n\nexport function isSameType(...arguments_: ValidTypes[]): boolean {\n return (\n arguments_.every(is.array) ||\n arguments_.every(is.number) ||\n arguments_.every(is.plainObject) ||\n arguments_.every(is.string)\n );\n}\n\nexport function nested(data: T, property?: K) {\n /* istanbul ignore else */\n if (is.plainObject(data) || is.array(data)) {\n /* istanbul ignore else */\n if (is.string(property)) {\n const props: Array = property.split('.');\n\n return props.reduce((acc, d) => acc && acc[d], data);\n }\n\n /* istanbul ignore else */\n if (is.number(property)) {\n return data[property];\n }\n\n return data;\n }\n\n return data;\n}\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport Popper from 'popper.js';\nimport deepmerge from 'deepmerge';\nimport is from 'is-lite';\nimport treeChanges from 'tree-changes';\nimport ReactDOM from 'react-dom';\n\nfunction ownKeys(e, r) {\n var t = Object.keys(e);\n if (Object.getOwnPropertySymbols) {\n var o = Object.getOwnPropertySymbols(e);\n r && (o = o.filter(function (r) {\n return Object.getOwnPropertyDescriptor(e, r).enumerable;\n })), t.push.apply(t, o);\n }\n return t;\n}\nfunction _objectSpread2(e) {\n for (var r = 1; r < arguments.length; r++) {\n var t = null != arguments[r] ? arguments[r] : {};\n r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {\n _defineProperty(e, r, t[r]);\n }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {\n Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));\n });\n }\n return e;\n}\nfunction _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n}\nfunction _defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);\n }\n}\nfunction _createClass(Constructor, protoProps, staticProps) {\n if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n if (staticProps) _defineProperties(Constructor, staticProps);\n Object.defineProperty(Constructor, \"prototype\", {\n writable: false\n });\n return Constructor;\n}\nfunction _defineProperty(obj, key, value) {\n key = _toPropertyKey(key);\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n return obj;\n}\nfunction _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function\");\n }\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n writable: true,\n configurable: true\n }\n });\n Object.defineProperty(subClass, \"prototype\", {\n writable: false\n });\n if (superClass) _setPrototypeOf(subClass, superClass);\n}\nfunction _getPrototypeOf(o) {\n _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {\n return o.__proto__ || Object.getPrototypeOf(o);\n };\n return _getPrototypeOf(o);\n}\nfunction _setPrototypeOf(o, p) {\n _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n return _setPrototypeOf(o, p);\n}\nfunction _isNativeReflectConstruct() {\n if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n if (Reflect.construct.sham) return false;\n if (typeof Proxy === \"function\") return true;\n try {\n Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n return true;\n } catch (e) {\n return false;\n }\n}\nfunction _objectWithoutPropertiesLoose(source, excluded) {\n if (source == null) return {};\n var target = {};\n var sourceKeys = Object.keys(source);\n var key, i;\n for (i = 0; i < sourceKeys.length; i++) {\n key = sourceKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n target[key] = source[key];\n }\n return target;\n}\nfunction _objectWithoutProperties(source, excluded) {\n if (source == null) return {};\n var target = _objectWithoutPropertiesLoose(source, excluded);\n var key, i;\n if (Object.getOwnPropertySymbols) {\n var sourceSymbolKeys = Object.getOwnPropertySymbols(source);\n for (i = 0; i < sourceSymbolKeys.length; i++) {\n key = sourceSymbolKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;\n target[key] = source[key];\n }\n }\n return target;\n}\nfunction _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n return self;\n}\nfunction _possibleConstructorReturn(self, call) {\n if (call && (typeof call === \"object\" || typeof call === \"function\")) {\n return call;\n } else if (call !== void 0) {\n throw new TypeError(\"Derived constructors may only return object or undefined\");\n }\n return _assertThisInitialized(self);\n}\nfunction _createSuper(Derived) {\n var hasNativeReflectConstruct = _isNativeReflectConstruct();\n return function _createSuperInternal() {\n var Super = _getPrototypeOf(Derived),\n result;\n if (hasNativeReflectConstruct) {\n var NewTarget = _getPrototypeOf(this).constructor;\n result = Reflect.construct(Super, arguments, NewTarget);\n } else {\n result = Super.apply(this, arguments);\n }\n return _possibleConstructorReturn(this, result);\n };\n}\nfunction _toPrimitive(input, hint) {\n if (typeof input !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (typeof res !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}\nfunction _toPropertyKey(arg) {\n var key = _toPrimitive(arg, \"string\");\n return typeof key === \"symbol\" ? key : String(key);\n}\n\nvar DEFAULTS = {flip:{padding:20},preventOverflow:{padding:10}};\n\nvar VALIDATOR_ARG_ERROR_MESSAGE='The typeValidator argument must be a function '+'with the signature function(props, propName, componentName).';var MESSAGE_ARG_ERROR_MESSAGE='The error message is optional, but must be a string if provided.';function propIsRequired(condition,props,propName,componentName){if(typeof condition==='boolean'){return condition;}if(typeof condition==='function'){return condition(props,propName,componentName);}if(Boolean(condition)===true){return Boolean(condition);}return false;}function propExists(props,propName){return Object.hasOwnProperty.call(props,propName);}function missingPropError(props,propName,componentName,message){if(message){return new Error(message);}return new Error(\"Required \".concat(props[propName],\" `\").concat(propName,\"` was not specified in `\").concat(componentName,\"`.\"));}function guardAgainstInvalidArgTypes(typeValidator,message){if(typeof typeValidator!=='function'){throw new TypeError(VALIDATOR_ARG_ERROR_MESSAGE);}if(Boolean(message)&&typeof message!=='string'){throw new TypeError(MESSAGE_ARG_ERROR_MESSAGE);}}function isRequiredIf(typeValidator,condition,message){guardAgainstInvalidArgTypes(typeValidator,message);return function(props,propName,componentName){for(var _len=arguments.length,rest=new Array(_len>3?_len-3:0),_key=3;_key<_len;_key++){rest[_key-3]=arguments[_key];}if(propIsRequired(condition,props,propName,componentName)){if(propExists(props,propName)){return typeValidator.apply(void 0,[props,propName,componentName].concat(rest));}return missingPropError(props,propName,componentName,message);}// Is not required, so just run typeValidator.\nreturn typeValidator.apply(void 0,[props,propName,componentName].concat(rest));};}\n\nvar STATUS = {INIT:'init',IDLE:'idle',OPENING:'opening',OPEN:'open',CLOSING:'closing',ERROR:'error'};\n\nvar isReact16=ReactDOM.createPortal!==undefined;function canUseDOM(){return !!(typeof window!=='undefined'&&window.document&&window.document.createElement);}function isMobile(){return 'ontouchstart'in window&&/Mobi/.test(navigator.userAgent);}/**\n * Log method calls if debug is enabled\n *\n * @private\n * @param {Object} arg\n * @param {string} arg.title - The title the logger was called from\n * @param {Object|Array} [arg.data] - The data to be logged\n * @param {boolean} [arg.warn] - If true, the message will be a warning\n * @param {boolean} [arg.debug] - Nothing will be logged unless debug is true\n */function log(_ref){var title=_ref.title,data=_ref.data,_ref$warn=_ref.warn,warn=_ref$warn===void 0?false:_ref$warn,_ref$debug=_ref.debug,debug=_ref$debug===void 0?false:_ref$debug;/* eslint-disable no-console */var logFn=warn?console.warn||console.error:console.log;if(debug&&title&&data){console.groupCollapsed(\"%creact-floater: \".concat(title),'color: #9b00ff; font-weight: bold; font-size: 12px;');if(Array.isArray(data)){data.forEach(function(d){if(is.plainObject(d)&&d.key){logFn.apply(console,[d.key,d.value]);}else {logFn.apply(console,[d]);}});}else {logFn.apply(console,[data]);}console.groupEnd();}/* eslint-enable */}function on(element,event,cb){var capture=arguments.length>3&&arguments[3]!==undefined?arguments[3]:false;element.addEventListener(event,cb,capture);}function off(element,event,cb){var capture=arguments.length>3&&arguments[3]!==undefined?arguments[3]:false;element.removeEventListener(event,cb,capture);}function once(element,event,cb){var capture=arguments.length>3&&arguments[3]!==undefined?arguments[3]:false;var _nextCB;// eslint-disable-next-line prefer-const\n_nextCB=function nextCB(e){cb(e);off(element,event,_nextCB);};on(element,event,_nextCB,capture);}function noop(){}\n\nvar ReactFloaterPortal=/*#__PURE__*/function(_React$Component){_inherits(ReactFloaterPortal,_React$Component);var _super=_createSuper(ReactFloaterPortal);function ReactFloaterPortal(){_classCallCheck(this,ReactFloaterPortal);return _super.apply(this,arguments);}_createClass(ReactFloaterPortal,[{key:\"componentDidMount\",value:function componentDidMount(){if(!canUseDOM())return;if(!this.node){this.appendNode();}if(!isReact16){this.renderPortal();}}},{key:\"componentDidUpdate\",value:function componentDidUpdate(){if(!canUseDOM())return;if(!isReact16){this.renderPortal();}}},{key:\"componentWillUnmount\",value:function componentWillUnmount(){if(!canUseDOM()||!this.node)return;if(!isReact16){ReactDOM.unmountComponentAtNode(this.node);}if(this.node&&this.node.parentNode===document.body){document.body.removeChild(this.node);this.node=undefined;}}},{key:\"appendNode\",value:function appendNode(){var _this$props=this.props,id=_this$props.id,zIndex=_this$props.zIndex;if(!this.node){this.node=document.createElement('div');/* istanbul ignore else */if(id){this.node.id=id;}if(zIndex){this.node.style.zIndex=zIndex;}document.body.appendChild(this.node);}}},{key:\"renderPortal\",value:function renderPortal(){if(!canUseDOM())return null;var _this$props2=this.props,children=_this$props2.children,setRef=_this$props2.setRef;if(!this.node){this.appendNode();}/* istanbul ignore else */if(isReact16){return/*#__PURE__*/ReactDOM.createPortal(children,this.node);}var portal=ReactDOM.unstable_renderSubtreeIntoContainer(this,children.length>1?/*#__PURE__*/React.createElement(\"div\",null,children):children[0],this.node);setRef(portal);return null;}},{key:\"renderReact16\",value:function renderReact16(){var _this$props3=this.props,hasChildren=_this$props3.hasChildren,placement=_this$props3.placement,target=_this$props3.target;if(!hasChildren){if(target||placement==='center'){return this.renderPortal();}return null;}return this.renderPortal();}},{key:\"render\",value:function render(){if(!isReact16){return null;}return this.renderReact16();}}]);return ReactFloaterPortal;}(React.Component);_defineProperty(ReactFloaterPortal,\"propTypes\",{children:PropTypes.oneOfType([PropTypes.element,PropTypes.array]),hasChildren:PropTypes.bool,id:PropTypes.oneOfType([PropTypes.string,PropTypes.number]),placement:PropTypes.string,setRef:PropTypes.func.isRequired,target:PropTypes.oneOfType([PropTypes.object,PropTypes.string]),zIndex:PropTypes.number});\n\nvar FloaterArrow=/*#__PURE__*/function(_React$Component){_inherits(FloaterArrow,_React$Component);var _super=_createSuper(FloaterArrow);function FloaterArrow(){_classCallCheck(this,FloaterArrow);return _super.apply(this,arguments);}_createClass(FloaterArrow,[{key:\"parentStyle\",get:function get(){var _this$props=this.props,placement=_this$props.placement,styles=_this$props.styles;var length=styles.arrow.length;var arrow={pointerEvents:'none',position:'absolute',width:'100%'};/* istanbul ignore else */if(placement.startsWith('top')){arrow.bottom=0;arrow.left=0;arrow.right=0;arrow.height=length;}else if(placement.startsWith('bottom')){arrow.left=0;arrow.right=0;arrow.top=0;arrow.height=length;}else if(placement.startsWith('left')){arrow.right=0;arrow.top=0;arrow.bottom=0;}else if(placement.startsWith('right')){arrow.left=0;arrow.top=0;}return arrow;}},{key:\"render\",value:function render(){var _this$props2=this.props,placement=_this$props2.placement,setArrowRef=_this$props2.setArrowRef,styles=_this$props2.styles;var _styles$arrow=styles.arrow,color=_styles$arrow.color,display=_styles$arrow.display,length=_styles$arrow.length,margin=_styles$arrow.margin,position=_styles$arrow.position,spread=_styles$arrow.spread;var arrowStyles={display:display,position:position};var points;var x=spread;var y=length;/* istanbul ignore else */if(placement.startsWith('top')){points=\"0,0 \".concat(x/2,\",\").concat(y,\" \").concat(x,\",0\");arrowStyles.bottom=0;arrowStyles.marginLeft=margin;arrowStyles.marginRight=margin;}else if(placement.startsWith('bottom')){points=\"\".concat(x,\",\").concat(y,\" \").concat(x/2,\",0 0,\").concat(y);arrowStyles.top=0;arrowStyles.marginLeft=margin;arrowStyles.marginRight=margin;}else if(placement.startsWith('left')){y=spread;x=length;points=\"0,0 \".concat(x,\",\").concat(y/2,\" 0,\").concat(y);arrowStyles.right=0;arrowStyles.marginTop=margin;arrowStyles.marginBottom=margin;}else if(placement.startsWith('right')){y=spread;x=length;points=\"\".concat(x,\",\").concat(y,\" \").concat(x,\",0 0,\").concat(y/2);arrowStyles.left=0;arrowStyles.marginTop=margin;arrowStyles.marginBottom=margin;}return/*#__PURE__*/React.createElement(\"div\",{className:\"__floater__arrow\",style:this.parentStyle},/*#__PURE__*/React.createElement(\"span\",{ref:setArrowRef,style:arrowStyles},/*#__PURE__*/React.createElement(\"svg\",{width:x,height:y,version:\"1.1\",xmlns:\"http://www.w3.org/2000/svg\"},/*#__PURE__*/React.createElement(\"polygon\",{points:points,fill:color}))));}}]);return FloaterArrow;}(React.Component);_defineProperty(FloaterArrow,\"propTypes\",{placement:PropTypes.string.isRequired,setArrowRef:PropTypes.func.isRequired,styles:PropTypes.object.isRequired});\n\nvar _excluded$1=[\"color\",\"height\",\"width\"];function FloaterCloseBtn(_ref){var handleClick=_ref.handleClick,styles=_ref.styles;var color=styles.color,height=styles.height,width=styles.width,style=_objectWithoutProperties(styles,_excluded$1);return/*#__PURE__*/React.createElement(\"button\",{\"aria-label\":\"close\",onClick:handleClick,style:style,type:\"button\"},/*#__PURE__*/React.createElement(\"svg\",{width:\"\".concat(width,\"px\"),height:\"\".concat(height,\"px\"),viewBox:\"0 0 18 18\",version:\"1.1\",xmlns:\"http://www.w3.org/2000/svg\",preserveAspectRatio:\"xMidYMid\"},/*#__PURE__*/React.createElement(\"g\",null,/*#__PURE__*/React.createElement(\"path\",{d:\"M8.13911129,9.00268191 L0.171521827,17.0258467 C-0.0498027049,17.248715 -0.0498027049,17.6098394 0.171521827,17.8327545 C0.28204354,17.9443526 0.427188206,17.9998706 0.572051765,17.9998706 C0.71714958,17.9998706 0.862013139,17.9443526 0.972581703,17.8327545 L9.0000937,9.74924618 L17.0276057,17.8327545 C17.1384085,17.9443526 17.2832721,17.9998706 17.4281356,17.9998706 C17.5729992,17.9998706 17.718097,17.9443526 17.8286656,17.8327545 C18.0499901,17.6098862 18.0499901,17.2487618 17.8286656,17.0258467 L9.86135722,9.00268191 L17.8340066,0.973848225 C18.0553311,0.750979934 18.0553311,0.389855532 17.8340066,0.16694039 C17.6126821,-0.0556467968 17.254037,-0.0556467968 17.0329467,0.16694039 L9.00042166,8.25611765 L0.967006424,0.167268345 C0.745681892,-0.0553188426 0.387317931,-0.0553188426 0.165993399,0.167268345 C-0.0553311331,0.390136635 -0.0553311331,0.751261038 0.165993399,0.974176179 L8.13920499,9.00268191 L8.13911129,9.00268191 Z\",fill:color}))));}FloaterCloseBtn.propTypes={handleClick:PropTypes.func.isRequired,styles:PropTypes.object.isRequired};\n\nfunction FloaterContainer(_ref){var content=_ref.content,footer=_ref.footer,handleClick=_ref.handleClick,open=_ref.open,positionWrapper=_ref.positionWrapper,showCloseButton=_ref.showCloseButton,title=_ref.title,styles=_ref.styles;var output={content:/*#__PURE__*/React.isValidElement(content)?content:/*#__PURE__*/React.createElement(\"div\",{className:\"__floater__content\",style:styles.content},content)};if(title){output.title=/*#__PURE__*/React.isValidElement(title)?title:/*#__PURE__*/React.createElement(\"div\",{className:\"__floater__title\",style:styles.title},title);}if(footer){output.footer=/*#__PURE__*/React.isValidElement(footer)?footer:/*#__PURE__*/React.createElement(\"div\",{className:\"__floater__footer\",style:styles.footer},footer);}if((showCloseButton||positionWrapper)&&!is[\"boolean\"](open)){output.close=/*#__PURE__*/React.createElement(FloaterCloseBtn,{styles:styles.close,handleClick:handleClick});}return/*#__PURE__*/React.createElement(\"div\",{className:\"__floater__container\",style:styles.container},output.close,output.title,output.content,output.footer);}FloaterContainer.propTypes={content:PropTypes.node.isRequired,footer:PropTypes.node,handleClick:PropTypes.func.isRequired,open:PropTypes.bool,positionWrapper:PropTypes.bool.isRequired,showCloseButton:PropTypes.bool.isRequired,styles:PropTypes.object.isRequired,title:PropTypes.node};\n\nvar Floater=/*#__PURE__*/function(_React$Component){_inherits(Floater,_React$Component);var _super=_createSuper(Floater);function Floater(){_classCallCheck(this,Floater);return _super.apply(this,arguments);}_createClass(Floater,[{key:\"style\",get:function get(){var _this$props=this.props,disableAnimation=_this$props.disableAnimation,component=_this$props.component,placement=_this$props.placement,hideArrow=_this$props.hideArrow,status=_this$props.status,styles=_this$props.styles;var length=styles.arrow.length,floater=styles.floater,floaterCentered=styles.floaterCentered,floaterClosing=styles.floaterClosing,floaterOpening=styles.floaterOpening,floaterWithAnimation=styles.floaterWithAnimation,floaterWithComponent=styles.floaterWithComponent;var element={};if(!hideArrow){if(placement.startsWith('top')){element.padding=\"0 0 \".concat(length,\"px\");}else if(placement.startsWith('bottom')){element.padding=\"\".concat(length,\"px 0 0\");}else if(placement.startsWith('left')){element.padding=\"0 \".concat(length,\"px 0 0\");}else if(placement.startsWith('right')){element.padding=\"0 0 0 \".concat(length,\"px\");}}if([STATUS.OPENING,STATUS.OPEN].indexOf(status)!==-1){element=_objectSpread2(_objectSpread2({},element),floaterOpening);}if(status===STATUS.CLOSING){element=_objectSpread2(_objectSpread2({},element),floaterClosing);}if(status===STATUS.OPEN&&!disableAnimation){element=_objectSpread2(_objectSpread2({},element),floaterWithAnimation);}if(placement==='center'){element=_objectSpread2(_objectSpread2({},element),floaterCentered);}if(component){element=_objectSpread2(_objectSpread2({},element),floaterWithComponent);}return _objectSpread2(_objectSpread2({},floater),element);}},{key:\"render\",value:function render(){var _this$props2=this.props,component=_this$props2.component,closeFn=_this$props2.handleClick,hideArrow=_this$props2.hideArrow,setFloaterRef=_this$props2.setFloaterRef,status=_this$props2.status;var output={};var classes=['__floater'];if(component){if(/*#__PURE__*/React.isValidElement(component)){output.content=/*#__PURE__*/React.cloneElement(component,{closeFn:closeFn});}else {output.content=component({closeFn:closeFn});}}else {output.content=/*#__PURE__*/React.createElement(FloaterContainer,this.props);}if(status===STATUS.OPEN){classes.push('__floater__open');}if(!hideArrow){output.arrow=/*#__PURE__*/React.createElement(FloaterArrow,this.props);}return/*#__PURE__*/React.createElement(\"div\",{ref:setFloaterRef,className:classes.join(' '),style:this.style},/*#__PURE__*/React.createElement(\"div\",{className:\"__floater__body\"},output.content,output.arrow));}}]);return Floater;}(React.Component);_defineProperty(Floater,\"propTypes\",{component:PropTypes.oneOfType([PropTypes.func,PropTypes.element]),content:PropTypes.node,disableAnimation:PropTypes.bool.isRequired,footer:PropTypes.node,handleClick:PropTypes.func.isRequired,hideArrow:PropTypes.bool.isRequired,open:PropTypes.bool,placement:PropTypes.string.isRequired,positionWrapper:PropTypes.bool.isRequired,setArrowRef:PropTypes.func.isRequired,setFloaterRef:PropTypes.func.isRequired,showCloseButton:PropTypes.bool,status:PropTypes.string.isRequired,styles:PropTypes.object.isRequired,title:PropTypes.node});\n\nvar ReactFloaterWrapper=/*#__PURE__*/function(_React$Component){_inherits(ReactFloaterWrapper,_React$Component);var _super=_createSuper(ReactFloaterWrapper);function ReactFloaterWrapper(){_classCallCheck(this,ReactFloaterWrapper);return _super.apply(this,arguments);}_createClass(ReactFloaterWrapper,[{key:\"render\",value:function render(){var _this$props=this.props,children=_this$props.children,handleClick=_this$props.handleClick,handleMouseEnter=_this$props.handleMouseEnter,handleMouseLeave=_this$props.handleMouseLeave,setChildRef=_this$props.setChildRef,setWrapperRef=_this$props.setWrapperRef,style=_this$props.style,styles=_this$props.styles;var element;/* istanbul ignore else */if(children){if(React.Children.count(children)===1){if(!/*#__PURE__*/React.isValidElement(children)){element=/*#__PURE__*/React.createElement(\"span\",null,children);}else {var refProp=is[\"function\"](children.type)?'innerRef':'ref';element=/*#__PURE__*/React.cloneElement(React.Children.only(children),_defineProperty({},refProp,setChildRef));}}else {element=children;}}if(!element){return null;}return/*#__PURE__*/React.createElement(\"span\",{ref:setWrapperRef,style:_objectSpread2(_objectSpread2({},styles),style),onClick:handleClick,onMouseEnter:handleMouseEnter,onMouseLeave:handleMouseLeave},element);}}]);return ReactFloaterWrapper;}(React.Component);_defineProperty(ReactFloaterWrapper,\"propTypes\",{children:PropTypes.node,handleClick:PropTypes.func.isRequired,handleMouseEnter:PropTypes.func.isRequired,handleMouseLeave:PropTypes.func.isRequired,setChildRef:PropTypes.func.isRequired,setWrapperRef:PropTypes.func.isRequired,style:PropTypes.object,styles:PropTypes.object.isRequired});\n\nvar defaultOptions={zIndex:100};function getStyles(styles){var options=deepmerge(defaultOptions,styles.options||{});return {wrapper:{cursor:'help',display:'inline-flex',flexDirection:'column',zIndex:options.zIndex},wrapperPosition:{left:-1000,position:'absolute',top:-1000,visibility:'hidden'},floater:{display:'inline-block',filter:'drop-shadow(0 0 3px rgba(0, 0, 0, 0.3))',maxWidth:300,opacity:0,position:'relative',transition:'opacity 0.3s',visibility:'hidden',zIndex:options.zIndex},floaterOpening:{opacity:1,visibility:'visible'},floaterWithAnimation:{opacity:1,transition:'opacity 0.3s, transform 0.2s',visibility:'visible'},floaterWithComponent:{maxWidth:'100%'},floaterClosing:{opacity:0,visibility:'visible'},floaterCentered:{left:'50%',position:'fixed',top:'50%',transform:'translate(-50%, -50%)'},container:{backgroundColor:'#fff',color:'#666',minHeight:60,minWidth:200,padding:20,position:'relative',zIndex:10},title:{borderBottom:'1px solid #555',color:'#555',fontSize:18,marginBottom:5,paddingBottom:6,paddingRight:18},content:{fontSize:15},close:{backgroundColor:'transparent',border:0,borderRadius:0,color:'#555',fontSize:0,height:15,outline:'none',padding:10,position:'absolute',right:0,top:0,width:15,WebkitAppearance:'none'},footer:{borderTop:'1px solid #ccc',fontSize:13,marginTop:10,paddingTop:5},arrow:{color:'#fff',display:'inline-flex',length:16,margin:8,position:'absolute',spread:32},options:options};}\n\nvar _excluded=[\"arrow\",\"flip\",\"offset\"];var POSITIONING_PROPS=['position','top','right','bottom','left'];var ReactFloater=/*#__PURE__*/function(_React$Component){_inherits(ReactFloater,_React$Component);var _super=_createSuper(ReactFloater);function ReactFloater(props){var _this;_classCallCheck(this,ReactFloater);_this=_super.call(this,props);/* istanbul ignore else */_defineProperty(_assertThisInitialized(_this),\"setArrowRef\",function(ref){_this.arrowRef=ref;});_defineProperty(_assertThisInitialized(_this),\"setChildRef\",function(ref){_this.childRef=ref;});_defineProperty(_assertThisInitialized(_this),\"setFloaterRef\",function(ref){_this.floaterRef=ref;});_defineProperty(_assertThisInitialized(_this),\"setWrapperRef\",function(ref){_this.wrapperRef=ref;});_defineProperty(_assertThisInitialized(_this),\"handleTransitionEnd\",function(){var status=_this.state.status;var callback=_this.props.callback;/* istanbul ignore else */if(_this.wrapperPopper){_this.wrapperPopper.instance.update();}_this.setState({status:status===STATUS.OPENING?STATUS.OPEN:STATUS.IDLE},function(){var newStatus=_this.state.status;callback(newStatus===STATUS.OPEN?'open':'close',_this.props);});});_defineProperty(_assertThisInitialized(_this),\"handleClick\",function(){var _this$props=_this.props,event=_this$props.event,open=_this$props.open;if(is[\"boolean\"](open))return;var _this$state=_this.state,positionWrapper=_this$state.positionWrapper,status=_this$state.status;/* istanbul ignore else */if(_this.event==='click'||_this.event==='hover'&&positionWrapper){log({title:'click',data:[{event:event,status:status===STATUS.OPEN?'closing':'opening'}],debug:_this.debug});_this.toggle();}});_defineProperty(_assertThisInitialized(_this),\"handleMouseEnter\",function(){var _this$props2=_this.props,event=_this$props2.event,open=_this$props2.open;if(is[\"boolean\"](open)||isMobile())return;var status=_this.state.status;/* istanbul ignore else */if(_this.event==='hover'&&status===STATUS.IDLE){log({title:'mouseEnter',data:[{key:'originalEvent',value:event}],debug:_this.debug});clearTimeout(_this.eventDelayTimeout);_this.toggle();}});_defineProperty(_assertThisInitialized(_this),\"handleMouseLeave\",function(){var _this$props3=_this.props,event=_this$props3.event,eventDelay=_this$props3.eventDelay,open=_this$props3.open;if(is[\"boolean\"](open)||isMobile())return;var _this$state2=_this.state,status=_this$state2.status,positionWrapper=_this$state2.positionWrapper;/* istanbul ignore else */if(_this.event==='hover'){log({title:'mouseLeave',data:[{key:'originalEvent',value:event}],debug:_this.debug});if(!eventDelay){_this.toggle(STATUS.IDLE);}else if([STATUS.OPENING,STATUS.OPEN].indexOf(status)!==-1&&!positionWrapper&&!_this.eventDelayTimeout){_this.eventDelayTimeout=setTimeout(function(){delete _this.eventDelayTimeout;_this.toggle();},eventDelay*1000);}}});_this.state={currentPlacement:props.placement,needsUpdate:false,positionWrapper:props.wrapperOptions.position&&!!props.target,status:STATUS.INIT,statusWrapper:STATUS.INIT};_this._isMounted=false;_this.hasMounted=false;if(canUseDOM()){window.addEventListener('load',function(){if(_this.popper){_this.popper.instance.update();}if(_this.wrapperPopper){_this.wrapperPopper.instance.update();}});}return _this;}_createClass(ReactFloater,[{key:\"componentDidMount\",value:function componentDidMount(){if(!canUseDOM())return;var positionWrapper=this.state.positionWrapper;var _this$props5=this.props,children=_this$props5.children,open=_this$props5.open,target=_this$props5.target;this._isMounted=true;log({title:'init',data:{hasChildren:!!children,hasTarget:!!target,isControlled:is[\"boolean\"](open),positionWrapper:positionWrapper,target:this.target,floater:this.floaterRef},debug:this.debug});if(!this.hasMounted){this.initPopper();this.hasMounted=true;}if(!children&&target&&!is[\"boolean\"](open));}},{key:\"componentDidUpdate\",value:function componentDidUpdate(prevProps,prevState){if(!canUseDOM())return;var _this$props6=this.props,autoOpen=_this$props6.autoOpen,open=_this$props6.open,target=_this$props6.target,wrapperOptions=_this$props6.wrapperOptions;var _treeChanges=treeChanges(prevState,this.state),changedFrom=_treeChanges.changedFrom,changed=_treeChanges.changed;if(prevProps.open!==open){var forceStatus;// always follow `open` in controlled mode\nif(is[\"boolean\"](open)){forceStatus=open?STATUS.OPENING:STATUS.CLOSING;}this.toggle(forceStatus);}if(prevProps.wrapperOptions.position!==wrapperOptions.position||prevProps.target!==target){this.changeWrapperPosition(this.props);}if(changed('status',STATUS.IDLE)&&open){this.toggle(STATUS.OPEN);}else if(changedFrom('status',STATUS.INIT,STATUS.IDLE)&&autoOpen){this.toggle(STATUS.OPEN);}if(this.popper&&changed('status',STATUS.OPENING)){this.popper.instance.update();}if(this.floaterRef&&(changed('status',STATUS.OPENING)||changed('status',STATUS.CLOSING))){once(this.floaterRef,'transitionend',this.handleTransitionEnd);}if(changed('needsUpdate',true)){this.rebuildPopper();}}},{key:\"componentWillUnmount\",value:function componentWillUnmount(){if(!canUseDOM())return;this._isMounted=false;if(this.popper){this.popper.instance.destroy();}if(this.wrapperPopper){this.wrapperPopper.instance.destroy();}}},{key:\"initPopper\",value:function initPopper(){var _this2=this;var target=arguments.length>0&&arguments[0]!==undefined?arguments[0]:this.target;var positionWrapper=this.state.positionWrapper;var _this$props7=this.props,disableFlip=_this$props7.disableFlip,getPopper=_this$props7.getPopper,hideArrow=_this$props7.hideArrow,offset=_this$props7.offset,placement=_this$props7.placement,wrapperOptions=_this$props7.wrapperOptions;var flipBehavior=placement==='top'||placement==='bottom'?'flip':['right','bottom-end','top-end','left','top-start','bottom-start'];/* istanbul ignore else */if(placement==='center'){this.setState({status:STATUS.IDLE});}else if(target&&this.floaterRef){var _this$options=this.options,arrow=_this$options.arrow,flip=_this$options.flip,offsetOptions=_this$options.offset,rest=_objectWithoutProperties(_this$options,_excluded);new Popper(target,this.floaterRef,{placement:placement,modifiers:_objectSpread2({arrow:_objectSpread2({enabled:!hideArrow,element:this.arrowRef},arrow),flip:_objectSpread2({enabled:!disableFlip,behavior:flipBehavior},flip),offset:_objectSpread2({offset:\"0, \".concat(offset,\"px\")},offsetOptions)},rest),onCreate:function onCreate(data){var _this2$floaterRef;_this2.popper=data;if(!((_this2$floaterRef=_this2.floaterRef)!==null&&_this2$floaterRef!==void 0&&_this2$floaterRef.isConnected)){_this2.setState({needsUpdate:true});return;}getPopper(data,'floater');if(_this2._isMounted){_this2.setState({currentPlacement:data.placement,status:STATUS.IDLE});}if(placement!==data.placement){setTimeout(function(){data.instance.update();},1);}},onUpdate:function onUpdate(data){_this2.popper=data;var currentPlacement=_this2.state.currentPlacement;if(_this2._isMounted&&data.placement!==currentPlacement){_this2.setState({currentPlacement:data.placement});}}});}if(positionWrapper){var wrapperOffset=!is.undefined(wrapperOptions.offset)?wrapperOptions.offset:0;new Popper(this.target,this.wrapperRef,{placement:wrapperOptions.placement||placement,modifiers:{arrow:{enabled:false},offset:{offset:\"0, \".concat(wrapperOffset,\"px\")},flip:{enabled:false}},onCreate:function onCreate(data){_this2.wrapperPopper=data;if(_this2._isMounted){_this2.setState({statusWrapper:STATUS.IDLE});}getPopper(data,'wrapper');if(placement!==data.placement){setTimeout(function(){data.instance.update();},1);}}});}}},{key:\"rebuildPopper\",value:function rebuildPopper(){var _this3=this;this.floaterRefInterval=setInterval(function(){var _this3$floaterRef;if((_this3$floaterRef=_this3.floaterRef)!==null&&_this3$floaterRef!==void 0&&_this3$floaterRef.isConnected){clearInterval(_this3.floaterRefInterval);_this3.setState({needsUpdate:false});_this3.initPopper();}},50);}},{key:\"changeWrapperPosition\",value:function changeWrapperPosition(_ref){var target=_ref.target,wrapperOptions=_ref.wrapperOptions;this.setState({positionWrapper:wrapperOptions.position&&!!target});}},{key:\"toggle\",value:function toggle(forceStatus){var status=this.state.status;var nextStatus=status===STATUS.OPEN?STATUS.CLOSING:STATUS.OPENING;if(!is.undefined(forceStatus)){nextStatus=forceStatus;}this.setState({status:nextStatus});}},{key:\"debug\",get:function get(){var debug=this.props.debug;return debug||canUseDOM()&&'ReactFloaterDebug'in window&&!!window.ReactFloaterDebug;}},{key:\"event\",get:function get(){var _this$props8=this.props,disableHoverToClick=_this$props8.disableHoverToClick,event=_this$props8.event;if(event==='hover'&&isMobile()&&!disableHoverToClick){return 'click';}return event;}},{key:\"options\",get:function get(){var options=this.props.options;return deepmerge(DEFAULTS,options||{});}},{key:\"styles\",get:function get(){var _this4=this;var _this$state3=this.state,status=_this$state3.status,positionWrapper=_this$state3.positionWrapper,statusWrapper=_this$state3.statusWrapper;var styles=this.props.styles;var nextStyles=deepmerge(getStyles(styles),styles);if(positionWrapper){var wrapperStyles;if(!([STATUS.IDLE].indexOf(status)!==-1)||!([STATUS.IDLE].indexOf(statusWrapper)!==-1)){wrapperStyles=nextStyles.wrapperPosition;}else {wrapperStyles=this.wrapperPopper.styles;}nextStyles.wrapper=_objectSpread2(_objectSpread2({},nextStyles.wrapper),wrapperStyles);}/* istanbul ignore else */if(this.target){var targetStyles=window.getComputedStyle(this.target);/* istanbul ignore else */if(this.wrapperStyles){nextStyles.wrapper=_objectSpread2(_objectSpread2({},nextStyles.wrapper),this.wrapperStyles);}else if(!(['relative','static'].indexOf(targetStyles.position)!==-1)){this.wrapperStyles={};if(!positionWrapper){POSITIONING_PROPS.forEach(function(d){_this4.wrapperStyles[d]=targetStyles[d];});nextStyles.wrapper=_objectSpread2(_objectSpread2({},nextStyles.wrapper),this.wrapperStyles);this.target.style.position='relative';this.target.style.top='auto';this.target.style.right='auto';this.target.style.bottom='auto';this.target.style.left='auto';}}}return nextStyles;}},{key:\"target\",get:function get(){if(!canUseDOM())return null;var target=this.props.target;if(target){if(is.domElement(target)){return target;}return document.querySelector(target);}return this.childRef||this.wrapperRef;}},{key:\"render\",value:function render(){var _this$state4=this.state,currentPlacement=_this$state4.currentPlacement,positionWrapper=_this$state4.positionWrapper,status=_this$state4.status;var _this$props9=this.props,children=_this$props9.children,component=_this$props9.component,content=_this$props9.content,disableAnimation=_this$props9.disableAnimation,footer=_this$props9.footer,hideArrow=_this$props9.hideArrow,id=_this$props9.id,open=_this$props9.open,showCloseButton=_this$props9.showCloseButton,style=_this$props9.style,target=_this$props9.target,title=_this$props9.title;var wrapper=/*#__PURE__*/React.createElement(ReactFloaterWrapper,{handleClick:this.handleClick,handleMouseEnter:this.handleMouseEnter,handleMouseLeave:this.handleMouseLeave,setChildRef:this.setChildRef,setWrapperRef:this.setWrapperRef,style:style,styles:this.styles.wrapper},children);var output={};if(positionWrapper){output.wrapperInPortal=wrapper;}else {output.wrapperAsChildren=wrapper;}return/*#__PURE__*/React.createElement(\"span\",null,/*#__PURE__*/React.createElement(ReactFloaterPortal,{hasChildren:!!children,id:id,placement:currentPlacement,setRef:this.setFloaterRef,target:target,zIndex:this.styles.options.zIndex},/*#__PURE__*/React.createElement(Floater,{component:component,content:content,disableAnimation:disableAnimation,footer:footer,handleClick:this.handleClick,hideArrow:hideArrow||currentPlacement==='center',open:open,placement:currentPlacement,positionWrapper:positionWrapper,setArrowRef:this.setArrowRef,setFloaterRef:this.setFloaterRef,showCloseButton:showCloseButton,status:status,styles:this.styles,title:title}),output.wrapperInPortal),output.wrapperAsChildren);}}]);return ReactFloater;}(React.Component);_defineProperty(ReactFloater,\"propTypes\",{autoOpen:PropTypes.bool,callback:PropTypes.func,children:PropTypes.node,component:isRequiredIf(PropTypes.oneOfType([PropTypes.func,PropTypes.element]),function(props){return !props.content;}),content:isRequiredIf(PropTypes.node,function(props){return !props.component;}),debug:PropTypes.bool,disableAnimation:PropTypes.bool,disableFlip:PropTypes.bool,disableHoverToClick:PropTypes.bool,event:PropTypes.oneOf(['hover','click']),eventDelay:PropTypes.number,footer:PropTypes.node,getPopper:PropTypes.func,hideArrow:PropTypes.bool,id:PropTypes.oneOfType([PropTypes.string,PropTypes.number]),offset:PropTypes.number,open:PropTypes.bool,options:PropTypes.object,placement:PropTypes.oneOf(['top','top-start','top-end','bottom','bottom-start','bottom-end','left','left-start','left-end','right','right-start','right-end','auto','center']),showCloseButton:PropTypes.bool,style:PropTypes.object,styles:PropTypes.object,target:PropTypes.oneOfType([PropTypes.object,PropTypes.string]),title:PropTypes.node,wrapperOptions:PropTypes.shape({offset:PropTypes.number,placement:PropTypes.oneOf(['top','top-start','top-end','bottom','bottom-start','bottom-end','left','left-start','left-end','right','right-start','right-end','auto']),position:PropTypes.bool})});_defineProperty(ReactFloater,\"defaultProps\",{autoOpen:false,callback:noop,debug:false,disableAnimation:false,disableFlip:false,disableHoverToClick:false,event:'click',eventDelay:0.4,getPopper:noop,hideArrow:false,offset:15,placement:'bottom',showCloseButton:false,styles:{},target:null,wrapperOptions:{position:false}});\n\nexport { ReactFloater as default };\n","import equal from '@gilbarbara/deep-equal';\nimport is from 'is-lite';\n\nimport { compareNumbers, compareValues, getIterables, includesOrEqualsTo, nested } from './helpers';\nimport { Data, KeyType, TreeChanges, Value } from './types';\n\nexport default function treeChanges>(\n previousData: P,\n data: D,\n): TreeChanges {\n if ([previousData, data].some(is.nullOrUndefined)) {\n throw new Error('Missing required parameters');\n }\n\n if (![previousData, data].every(d => is.plainObject(d) || is.array(d))) {\n throw new Error('Expected plain objects or array');\n }\n\n const added = (key?: K, value?: Value): boolean => {\n try {\n return compareValues(previousData, data, { key, type: 'added', value });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const changed = (key?: K | string, actual?: Value, previous?: Value): boolean => {\n try {\n const left = nested(previousData, key);\n const right = nested(data, key);\n const hasActual = is.defined(actual);\n const hasPrevious = is.defined(previous);\n\n if (hasActual || hasPrevious) {\n const leftComparator = hasPrevious\n ? includesOrEqualsTo(previous, left)\n : !includesOrEqualsTo(actual, left);\n const rightComparator = includesOrEqualsTo(actual, right);\n\n return leftComparator && rightComparator;\n }\n\n if ([left, right].every(is.array) || [left, right].every(is.plainObject)) {\n return !equal(left, right);\n }\n\n return left !== right;\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const changedFrom = (key: K | string, previous: Value, actual?: Value): boolean => {\n if (!is.defined(key)) {\n return false;\n }\n\n try {\n const left = nested(previousData, key);\n const right = nested(data, key);\n const hasActual = is.defined(actual);\n\n return (\n includesOrEqualsTo(previous, left) &&\n (hasActual ? includesOrEqualsTo(actual, right) : !hasActual)\n );\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n /**\n * @deprecated\n * Use \"changed\" instead\n */\n const changedTo = (key: K | string, actual: Value): boolean => {\n if (!is.defined(key)) {\n return false;\n }\n\n /* istanbul ignore next */\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn('`changedTo` is deprecated! Replace it with `change`');\n }\n\n return changed(key, actual);\n };\n\n const decreased = (key: K, actual?: Value, previous?: Value): boolean => {\n if (!is.defined(key)) {\n return false;\n }\n\n try {\n return compareNumbers(previousData, data, { key, actual, previous, type: 'decreased' });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const emptied = (key?: K): boolean => {\n try {\n const [left, right] = getIterables(previousData, data, { key });\n\n return !!left.length && !right.length;\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const filled = (key?: K): boolean => {\n try {\n const [left, right] = getIterables(previousData, data, { key });\n\n return !left.length && !!right.length;\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const increased = (key: K, actual?: Value, previous?: Value): boolean => {\n if (!is.defined(key)) {\n return false;\n }\n\n try {\n return compareNumbers(previousData, data, { key, actual, previous, type: 'increased' });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n const removed = (key?: K, value?: Value): boolean => {\n try {\n return compareValues(previousData, data, { key, type: 'removed', value });\n } catch {\n /* istanbul ignore next */\n return false;\n }\n };\n\n return { added, changed, changedFrom, changedTo, decreased, emptied, filled, increased, removed };\n}\n\nexport * from './types';\n","export const ACTIONS = {\n INIT: 'init',\n START: 'start',\n STOP: 'stop',\n RESET: 'reset',\n PREV: 'prev',\n NEXT: 'next',\n GO: 'go',\n CLOSE: 'close',\n SKIP: 'skip',\n UPDATE: 'update',\n} as const;\n\nexport const EVENTS = {\n TOUR_START: 'tour:start',\n STEP_BEFORE: 'step:before',\n BEACON: 'beacon',\n TOOLTIP: 'tooltip',\n STEP_AFTER: 'step:after',\n TOUR_END: 'tour:end',\n TOUR_STATUS: 'tour:status',\n TARGET_NOT_FOUND: 'error:target_not_found',\n ERROR: 'error',\n} as const;\n\nexport const LIFECYCLE = {\n INIT: 'init',\n READY: 'ready',\n BEACON: 'beacon',\n TOOLTIP: 'tooltip',\n COMPLETE: 'complete',\n ERROR: 'error',\n} as const;\n\nexport const ORIGIN = {\n BUTTON_CLOSE: 'button_close',\n BUTTON_PRIMARY: 'button_primary',\n KEYBOARD: 'keyboard',\n OVERLAY: 'overlay',\n} as const;\n\nexport const STATUS = {\n IDLE: 'idle',\n READY: 'ready',\n WAITING: 'waiting',\n RUNNING: 'running',\n PAUSED: 'paused',\n SKIPPED: 'skipped',\n FINISHED: 'finished',\n ERROR: 'error',\n} as const;\n","import scroll from 'scroll';\nimport scrollParent from 'scrollparent';\n\nexport function canUseDOM() {\n return !!(typeof window !== 'undefined' && window.document && window.document.createElement);\n}\n\n/**\n * Find the bounding client rect\n */\nexport function getClientRect(element: HTMLElement | null) {\n if (!element) {\n return null;\n }\n\n return element.getBoundingClientRect();\n}\n\n/**\n * Helper function to get the browser-normalized \"document height\"\n */\nexport function getDocumentHeight(median = true): number {\n const { body, documentElement } = document;\n\n if (!body || !documentElement) {\n return 0;\n }\n\n if (median) {\n const heights = [\n body.scrollHeight,\n body.offsetHeight,\n documentElement.clientHeight,\n documentElement.scrollHeight,\n documentElement.offsetHeight,\n ].sort((a, b) => a - b);\n const middle = Math.floor(heights.length / 2);\n\n if (heights.length % 2 === 0) {\n return (heights[middle - 1] + heights[middle]) / 2;\n }\n\n return heights[middle];\n }\n\n return Math.max(\n body.scrollHeight,\n body.offsetHeight,\n documentElement.clientHeight,\n documentElement.scrollHeight,\n documentElement.offsetHeight,\n );\n}\n\n/**\n * Find and return the target DOM element based on a step's 'target'.\n */\nexport function getElement(element: string | HTMLElement): HTMLElement | null {\n if (typeof element === 'string') {\n return document.querySelector(element);\n }\n\n return element;\n}\n\n/**\n * Get computed style property\n */\nexport function getStyleComputedProperty(el: HTMLElement): CSSStyleDeclaration | null {\n if (!el || el.nodeType !== 1) {\n return null;\n }\n\n return getComputedStyle(el);\n}\n\n/**\n * Get scroll parent with fix\n */\nexport function getScrollParent(\n element: HTMLElement | null,\n skipFix: boolean,\n forListener?: boolean,\n) {\n if (!element) {\n return scrollDocument();\n }\n\n const parent = scrollParent(element) as HTMLElement;\n\n if (parent) {\n if (parent.isSameNode(scrollDocument())) {\n if (forListener) {\n return document;\n }\n\n return scrollDocument();\n }\n\n const hasScrolling = parent.scrollHeight > parent.offsetHeight;\n\n if (!hasScrolling && !skipFix) {\n parent.style.overflow = 'initial';\n\n return scrollDocument();\n }\n }\n\n return parent;\n}\n\n/**\n * Check if the element has custom scroll parent\n */\nexport function hasCustomScrollParent(element: HTMLElement | null, skipFix: boolean): boolean {\n if (!element) {\n return false;\n }\n\n const parent = getScrollParent(element, skipFix);\n\n return parent ? !parent.isSameNode(scrollDocument()) : false;\n}\n\n/**\n * Check if the element has custom offset parent\n */\nexport function hasCustomOffsetParent(element: HTMLElement): boolean {\n return element.offsetParent !== document.body;\n}\n\n/**\n * Check if an element has fixed/sticky position\n */\nexport function hasPosition(el: HTMLElement | Node | null, type: string = 'fixed'): boolean {\n if (!el || !(el instanceof HTMLElement)) {\n return false;\n }\n\n const { nodeName } = el;\n const styles = getStyleComputedProperty(el);\n\n if (nodeName === 'BODY' || nodeName === 'HTML') {\n return false;\n }\n\n if (styles && styles.position === type) {\n return true;\n }\n\n if (!el.parentNode) {\n return false;\n }\n\n return hasPosition(el.parentNode, type);\n}\n\n/**\n * Check if the element is visible\n */\nexport function isElementVisible(element: HTMLElement): element is HTMLElement {\n if (!element) {\n return false;\n }\n\n let parentElement: HTMLElement | null = element;\n\n while (parentElement) {\n if (parentElement === document.body) {\n break;\n }\n\n if (parentElement instanceof HTMLElement) {\n const { display, visibility } = getComputedStyle(parentElement);\n\n if (display === 'none' || visibility === 'hidden') {\n return false;\n }\n }\n\n parentElement = parentElement.parentElement ?? null;\n }\n\n return true;\n}\n\n/**\n * Find and return the target DOM element based on a step's 'target'.\n */\nexport function getElementPosition(\n element: HTMLElement | null,\n offset: number,\n skipFix: boolean,\n): number {\n const elementRect = getClientRect(element);\n const parent = getScrollParent(element, skipFix);\n const hasScrollParent = hasCustomScrollParent(element, skipFix);\n let parentTop = 0;\n let top = elementRect?.top ?? 0;\n\n if (parent instanceof HTMLElement) {\n parentTop = parent.scrollTop;\n\n if (!hasScrollParent && !hasPosition(element)) {\n top += parentTop;\n }\n\n if (!parent.isSameNode(scrollDocument())) {\n top += scrollDocument().scrollTop;\n }\n }\n\n return Math.floor(top - offset);\n}\n\n/**\n * Get the scrollTop position\n */\nexport function getScrollTo(element: HTMLElement | null, offset: number, skipFix: boolean): number {\n if (!element) {\n return 0;\n }\n\n const { offsetTop = 0, scrollTop = 0 } = scrollParent(element) ?? {};\n let top = element.getBoundingClientRect().top + scrollTop;\n\n if (!!offsetTop && (hasCustomScrollParent(element, skipFix) || hasCustomOffsetParent(element))) {\n top -= offsetTop;\n }\n\n const output = Math.floor(top - offset);\n\n return output < 0 ? 0 : output;\n}\n\nexport function scrollDocument(): Element | HTMLElement {\n return document.scrollingElement ?? document.documentElement;\n}\n\n/**\n * Scroll to position\n */\nexport function scrollTo(\n value: number,\n options: { duration?: number; element: Element | HTMLElement },\n): Promise {\n const { duration, element } = options;\n\n return new Promise((resolve, reject) => {\n const { scrollTop } = element;\n\n const limit = value > scrollTop ? value - scrollTop : scrollTop - value;\n\n scroll.top(element as HTMLElement, value, { duration: limit < 100 ? 50 : duration }, error => {\n if (error && error.message !== 'Element already at target scroll position') {\n return reject(error);\n }\n\n return resolve();\n });\n });\n}\n","import { isValidElement, ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport is from 'is-lite';\n\nimport { LIFECYCLE } from '~/literals';\n\nimport { Lifecycle, Step } from '~/types';\n\nimport { hasPosition } from './dom';\n\ninterface LogOptions {\n /** The data to be logged */\n data: any;\n /** display the log */\n debug?: boolean;\n /** The title the logger was called from */\n title: string;\n /** If true, the message will be a warning */\n warn?: boolean;\n}\n\ninterface ShouldScrollOptions {\n isFirstStep: boolean;\n lifecycle: Lifecycle;\n previousLifecycle: Lifecycle;\n scrollToFirstStep: boolean;\n step: Step;\n target: HTMLElement | null;\n}\n\nexport const isReact16 = createPortal !== undefined;\n\n/**\n * Get the current browser\n */\nexport function getBrowser(userAgent: string = navigator.userAgent): string {\n let browser = userAgent;\n\n if (typeof window === 'undefined') {\n browser = 'node';\n }\n // @ts-expect-error IE support\n else if (document.documentMode) {\n browser = 'ie';\n } else if (/Edge/.test(userAgent)) {\n browser = 'edge';\n }\n // @ts-expect-error Opera 8.0+\n else if (Boolean(window.opera) || userAgent.includes(' OPR/')) {\n browser = 'opera';\n }\n // @ts-expect-error Firefox 1.0+\n else if (typeof window.InstallTrigger !== 'undefined') {\n browser = 'firefox';\n }\n // @ts-expect-error Chrome 1+\n else if (window.chrome) {\n browser = 'chrome';\n }\n // Safari (and Chrome iOS, Firefox iOS)\n else if (/(Version\\/([\\d._]+).*Safari|CriOS|FxiOS| Mobile\\/)/.test(userAgent)) {\n browser = 'safari';\n }\n\n return browser;\n}\n\n/**\n * Get Object type\n */\nexport function getObjectType(value: unknown): string {\n return Object.prototype.toString.call(value).slice(8, -1).toLowerCase();\n}\n\n/**\n * Get text from React components\n */\nexport function getText(root: ReactNode): string {\n const content: Array = [];\n\n const recurse = (child: ReactNode) => {\n if (typeof child === 'string' || typeof child === 'number') {\n content.push(child);\n } else if (Array.isArray(child)) {\n child.forEach(c => recurse(c));\n } else if (isValidElement(child)) {\n const { children } = child.props;\n\n if (Array.isArray(children)) {\n children.forEach(c => recurse(c));\n } else {\n recurse(children);\n }\n }\n };\n\n recurse(root);\n\n return content.join(' ').trim();\n}\n\nexport function hasValidKeys(object: Record, keys?: Array): boolean {\n if (!is.plainObject(object) || !is.array(keys)) {\n return false;\n }\n\n return Object.keys(object).every(d => keys.includes(d));\n}\n\n/**\n * Convert hex to RGB\n */\nexport function hexToRGB(hex: string): Array {\n const shorthandRegex = /^#?([\\da-f])([\\da-f])([\\da-f])$/i;\n const properHex = hex.replace(shorthandRegex, (_m, r, g, b) => r + r + g + g + b + b);\n\n const result = /^#?([\\da-f]{2})([\\da-f]{2})([\\da-f]{2})$/i.exec(properHex);\n\n return result ? [parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)] : [];\n}\n\n/**\n * Decide if the step shouldn't skip the beacon\n * @param {Object} step\n *\n * @returns {boolean}\n */\nexport function hideBeacon(step: Step): boolean {\n return step.disableBeacon || step.placement === 'center';\n}\n\n/**\n * Detect legacy browsers\n *\n * @returns {boolean}\n */\nexport function isLegacy(): boolean {\n return !['chrome', 'safari', 'firefox', 'opera'].includes(getBrowser());\n}\n\n/**\n * Log method calls if debug is enabled\n */\nexport function log({ data, debug = false, title, warn = false }: LogOptions) {\n /* eslint-disable no-console */\n const logFn = warn ? console.warn || console.error : console.log;\n\n if (debug) {\n if (title && data) {\n console.groupCollapsed(\n `%creact-joyride: ${title}`,\n 'color: #ff0044; font-weight: bold; font-size: 12px;',\n );\n\n if (Array.isArray(data)) {\n data.forEach(d => {\n if (is.plainObject(d) && d.key) {\n logFn.apply(console, [d.key, d.value]);\n } else {\n logFn.apply(console, [d]);\n }\n });\n } else {\n logFn.apply(console, [data]);\n }\n\n console.groupEnd();\n } else {\n console.error('Missing title or data props');\n }\n }\n /* eslint-enable */\n}\n\nexport function shouldScroll(options: ShouldScrollOptions): boolean {\n const { isFirstStep, lifecycle, previousLifecycle, scrollToFirstStep, step, target } = options;\n\n return (\n !step.disableScrolling &&\n (!isFirstStep || scrollToFirstStep || lifecycle === LIFECYCLE.TOOLTIP) &&\n step.placement !== 'center' &&\n (!step.isFixed || !hasPosition(target)) && // fixed steps don't need to scroll\n previousLifecycle !== lifecycle &&\n ([LIFECYCLE.BEACON, LIFECYCLE.TOOLTIP] as Array).includes(lifecycle)\n );\n}\n","import { noop } from '@gilbarbara/helpers';\n\nexport const defaultFloaterProps = {\n options: {\n preventOverflow: {\n boundariesElement: 'scrollParent',\n },\n },\n wrapperOptions: {\n offset: -18,\n position: true,\n },\n};\n\nexport const defaultLocale = {\n back: 'Back',\n close: 'Close',\n last: 'Last',\n next: 'Next',\n open: 'Open the dialog',\n skip: 'Skip',\n};\n\nexport const defaultStep = {\n event: 'click',\n placement: 'bottom',\n offset: 10,\n disableBeacon: false,\n disableCloseOnEsc: false,\n disableOverlay: false,\n disableOverlayClose: false,\n disableScrollParentFix: false,\n disableScrolling: false,\n hideBackButton: false,\n hideCloseButton: false,\n hideFooter: false,\n isFixed: false,\n locale: defaultLocale,\n showProgress: false,\n showSkipButton: false,\n spotlightClicks: false,\n spotlightPadding: 10,\n};\n\nexport const defaultProps = {\n continuous: false,\n debug: false,\n disableCloseOnEsc: false,\n disableOverlay: false,\n disableOverlayClose: false,\n disableScrolling: false,\n disableScrollParentFix: false,\n getHelpers: noop(),\n hideBackButton: false,\n run: true,\n scrollOffset: 20,\n scrollDuration: 300,\n scrollToFirstStep: false,\n showSkipButton: false,\n showProgress: false,\n spotlightClicks: false,\n spotlightPadding: 10,\n steps: [],\n};\n","import deepmerge from 'deepmerge';\n\nimport { hexToRGB } from './modules/helpers';\nimport { Props, StepMerged, StylesOptions, StylesWithFloaterStyles } from './types';\n\nconst defaultOptions = {\n arrowColor: '#fff',\n backgroundColor: '#fff',\n beaconSize: 36,\n overlayColor: 'rgba(0, 0, 0, 0.5)',\n primaryColor: '#f04',\n spotlightShadow: '0 0 15px rgba(0, 0, 0, 0.5)',\n textColor: '#333',\n width: 380,\n zIndex: 100,\n} satisfies StylesOptions;\n\nconst buttonBase = {\n backgroundColor: 'transparent',\n border: 0,\n borderRadius: 0,\n color: '#555',\n cursor: 'pointer',\n fontSize: 16,\n lineHeight: 1,\n padding: 8,\n WebkitAppearance: 'none',\n};\n\nconst spotlight = {\n borderRadius: 4,\n position: 'absolute',\n};\n\nexport default function getStyles(props: Props, step: StepMerged) {\n const { floaterProps, styles } = props;\n const mergedFloaterProps = deepmerge(step?.floaterProps ?? {}, floaterProps ?? {});\n const mergedStyles = deepmerge(styles ?? {}, step?.styles ?? {});\n const options = deepmerge(defaultOptions, mergedStyles.options || {}) satisfies StylesOptions;\n let { width } = options;\n\n if (window.innerWidth > 480) {\n width = 380;\n }\n\n if ('width' in options) {\n width =\n typeof options.width === 'number' && window.innerWidth < options.width\n ? window.innerWidth - 30\n : options.width;\n }\n\n const overlay = {\n bottom: 0,\n left: 0,\n overflow: 'hidden',\n position: 'absolute',\n right: 0,\n top: 0,\n zIndex: options.zIndex,\n };\n\n const defaultStyles = {\n beacon: {\n ...buttonBase,\n display: 'inline-block',\n height: options.beaconSize,\n position: 'relative',\n width: options.beaconSize,\n zIndex: options.zIndex,\n },\n beaconInner: {\n animation: 'joyride-beacon-inner 1.2s infinite ease-in-out',\n backgroundColor: options.primaryColor,\n borderRadius: '50%',\n display: 'block',\n height: '50%',\n left: '50%',\n opacity: 0.7,\n position: 'absolute',\n top: '50%',\n transform: 'translate(-50%, -50%)',\n width: '50%',\n },\n beaconOuter: {\n animation: 'joyride-beacon-outer 1.2s infinite ease-in-out',\n backgroundColor: `rgba(${hexToRGB(options.primaryColor).join(',')}, 0.2)`,\n border: `2px solid ${options.primaryColor}`,\n borderRadius: '50%',\n boxSizing: 'border-box',\n display: 'block',\n height: '100%',\n left: 0,\n opacity: 0.9,\n position: 'absolute',\n top: 0,\n transformOrigin: 'center',\n width: '100%',\n },\n tooltip: {\n backgroundColor: options.backgroundColor,\n borderRadius: 5,\n boxSizing: 'border-box',\n color: options.textColor,\n fontSize: 16,\n maxWidth: '100%',\n padding: 15,\n position: 'relative',\n width,\n },\n tooltipContainer: {\n lineHeight: 1.4,\n textAlign: 'center',\n },\n tooltipTitle: {\n fontSize: 18,\n margin: 0,\n },\n tooltipContent: {\n padding: '20px 10px',\n },\n tooltipFooter: {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'flex-end',\n marginTop: 15,\n },\n tooltipFooterSpacer: {\n flex: 1,\n },\n buttonNext: {\n ...buttonBase,\n backgroundColor: options.primaryColor,\n borderRadius: 4,\n color: '#fff',\n },\n buttonBack: {\n ...buttonBase,\n color: options.primaryColor,\n marginLeft: 'auto',\n marginRight: 5,\n },\n buttonClose: {\n ...buttonBase,\n color: options.textColor,\n height: 14,\n padding: 15,\n position: 'absolute',\n right: 0,\n top: 0,\n width: 14,\n },\n buttonSkip: {\n ...buttonBase,\n color: options.textColor,\n fontSize: 14,\n },\n overlay: {\n ...overlay,\n backgroundColor: options.overlayColor,\n mixBlendMode: 'hard-light',\n },\n overlayLegacy: {\n ...overlay,\n },\n overlayLegacyCenter: {\n ...overlay,\n backgroundColor: options.overlayColor,\n },\n spotlight: {\n ...spotlight,\n backgroundColor: 'gray',\n },\n spotlightLegacy: {\n ...spotlight,\n boxShadow: `0 0 0 9999px ${options.overlayColor}, ${options.spotlightShadow}`,\n },\n floaterStyles: {\n arrow: {\n color: mergedFloaterProps?.styles?.arrow?.color ?? options.arrowColor,\n },\n options: {\n zIndex: options.zIndex + 100,\n },\n },\n options,\n };\n\n return deepmerge(defaultStyles, mergedStyles) as StylesWithFloaterStyles;\n}\n","import { Props as FloaterProps } from 'react-floater';\nimport { omit, pick } from '@gilbarbara/helpers';\nimport deepmerge from 'deepmerge';\nimport is from 'is-lite';\nimport { SetRequired } from 'type-fest';\n\nimport { defaultFloaterProps, defaultLocale, defaultStep } from '~/defaults';\nimport getStyles from '~/styles';\nimport { Props, Step, StepMerged } from '~/types';\n\nimport { getElement, hasCustomScrollParent } from './dom';\nimport { log } from './helpers';\n\nfunction getTourProps(props: Props) {\n return pick(\n props,\n 'beaconComponent',\n 'disableCloseOnEsc',\n 'disableOverlay',\n 'disableOverlayClose',\n 'disableScrolling',\n 'disableScrollParentFix',\n 'floaterProps',\n 'hideBackButton',\n 'hideCloseButton',\n 'locale',\n 'showProgress',\n 'showSkipButton',\n 'spotlightClicks',\n 'spotlightPadding',\n 'styles',\n 'tooltipComponent',\n );\n}\n\nexport function getMergedStep(props: Props, currentStep?: Step): StepMerged {\n const step = currentStep ?? {};\n const mergedStep = deepmerge.all([defaultStep, getTourProps(props), step], {\n isMergeableObject: is.plainObject,\n }) as StepMerged;\n\n const mergedStyles = getStyles(props, mergedStep);\n const scrollParent = hasCustomScrollParent(\n getElement(mergedStep.target),\n mergedStep.disableScrollParentFix,\n );\n const floaterProps = deepmerge.all([\n defaultFloaterProps,\n props.floaterProps ?? {},\n mergedStep.floaterProps ?? {},\n ]) as SetRequired;\n\n // Set react-floater props\n floaterProps.offset = mergedStep.offset;\n floaterProps.styles = deepmerge(floaterProps.styles ?? {}, mergedStyles.floaterStyles);\n\n floaterProps.offset += props.spotlightPadding ?? mergedStep.spotlightPadding ?? 0;\n\n if (mergedStep.placementBeacon && floaterProps.wrapperOptions) {\n floaterProps.wrapperOptions.placement = mergedStep.placementBeacon;\n }\n\n if (scrollParent && floaterProps.options.preventOverflow) {\n floaterProps.options.preventOverflow.boundariesElement = 'window';\n }\n\n return {\n ...mergedStep,\n locale: deepmerge.all([defaultLocale, props.locale ?? {}, mergedStep.locale || {}]),\n floaterProps,\n styles: omit(mergedStyles, 'floaterStyles'),\n };\n}\n\n/**\n * Validate if a step is valid\n */\nexport function validateStep(step: Step, debug: boolean = false): boolean {\n if (!is.plainObject(step)) {\n log({\n title: 'validateStep',\n data: 'step must be an object',\n warn: true,\n debug,\n });\n\n return false;\n }\n\n if (!step.target) {\n log({\n title: 'validateStep',\n data: 'target is missing from the step',\n warn: true,\n debug,\n });\n\n return false;\n }\n\n return true;\n}\n\n/**\n * Validate if steps are valid\n */\nexport function validateSteps(steps: Array, debug: boolean = false): boolean {\n if (!is.array(steps)) {\n log({\n title: 'validateSteps',\n data: 'steps must be an array',\n warn: true,\n debug,\n });\n\n return false;\n }\n\n return steps.every(d => validateStep(d, debug));\n}\n","import { Props as FloaterProps } from 'react-floater';\nimport { objectKeys, omit } from '@gilbarbara/helpers';\nimport is from 'is-lite';\n\nimport { ACTIONS, LIFECYCLE, STATUS } from '~/literals';\n\nimport { Origin, State, Status, Step, StoreHelpers, StoreOptions } from '~/types';\n\nimport { hasValidKeys } from './helpers';\n\ntype StateWithContinuous = State & { continuous: boolean };\ntype Listener = (state: State) => void;\ntype PopperData = Parameters>[0];\n\nconst defaultState: State = {\n action: 'init',\n controlled: false,\n index: 0,\n lifecycle: LIFECYCLE.INIT,\n origin: null,\n size: 0,\n status: STATUS.IDLE,\n};\nconst validKeys = objectKeys(omit(defaultState, 'controlled', 'size'));\n\nclass Store {\n private beaconPopper: PopperData | null;\n private tooltipPopper: PopperData | null;\n private data: Map = new Map();\n private listener: Listener | null;\n private store: Map = new Map();\n\n constructor(options?: StoreOptions) {\n const { continuous = false, stepIndex, steps = [] } = options ?? {};\n\n this.setState(\n {\n action: ACTIONS.INIT,\n controlled: is.number(stepIndex),\n continuous,\n index: is.number(stepIndex) ? stepIndex : 0,\n lifecycle: LIFECYCLE.INIT,\n origin: null,\n status: steps.length ? STATUS.READY : STATUS.IDLE,\n },\n true,\n );\n\n this.beaconPopper = null;\n this.tooltipPopper = null;\n this.listener = null;\n this.setSteps(steps);\n }\n\n public getState(): State {\n if (!this.store.size) {\n return { ...defaultState };\n }\n\n return {\n action: this.store.get('action') || '',\n controlled: this.store.get('controlled') || false,\n index: parseInt(this.store.get('index'), 10),\n lifecycle: this.store.get('lifecycle') || '',\n origin: this.store.get('origin') || null,\n size: this.store.get('size') || 0,\n status: (this.store.get('status') as Status) || '',\n };\n }\n\n private getNextState(state: Partial, force: boolean = false): State {\n const { action, controlled, index, size, status } = this.getState();\n const newIndex = is.number(state.index) ? state.index : index;\n const nextIndex = controlled && !force ? index : Math.min(Math.max(newIndex, 0), size);\n\n return {\n action: state.action ?? action,\n controlled,\n index: nextIndex,\n lifecycle: state.lifecycle ?? LIFECYCLE.INIT,\n origin: state.origin ?? null,\n size: state.size ?? size,\n status: nextIndex === size ? STATUS.FINISHED : state.status ?? status,\n };\n }\n\n private getSteps(): Array {\n const steps = this.data.get('steps');\n\n return Array.isArray(steps) ? steps : [];\n }\n\n private hasUpdatedState(oldState: State): boolean {\n const before = JSON.stringify(oldState);\n const after = JSON.stringify(this.getState());\n\n return before !== after;\n }\n\n private setState(nextState: Partial, initial: boolean = false) {\n const state = this.getState();\n\n const {\n action,\n index,\n lifecycle,\n origin = null,\n size,\n status,\n } = {\n ...state,\n ...nextState,\n };\n\n this.store.set('action', action);\n this.store.set('index', index);\n this.store.set('lifecycle', lifecycle);\n this.store.set('origin', origin);\n this.store.set('size', size);\n this.store.set('status', status);\n\n if (initial) {\n this.store.set('controlled', nextState.controlled);\n this.store.set('continuous', nextState.continuous);\n }\n\n if (this.listener && this.hasUpdatedState(state)) {\n this.listener(this.getState());\n }\n }\n\n public addListener = (listener: Listener) => {\n this.listener = listener;\n };\n\n public setSteps = (steps: Array) => {\n const { size, status } = this.getState();\n const state = {\n size: steps.length,\n status,\n };\n\n this.data.set('steps', steps);\n\n if (status === STATUS.WAITING && !size && steps.length) {\n state.status = STATUS.RUNNING;\n }\n\n this.setState(state);\n };\n\n public getHelpers(): StoreHelpers {\n return {\n close: this.close,\n go: this.go,\n info: this.info,\n next: this.next,\n open: this.open,\n prev: this.prev,\n reset: this.reset,\n skip: this.skip,\n };\n }\n\n public getPopper = (name: 'beacon' | 'tooltip'): PopperData | null => {\n if (name === 'beacon') {\n return this.beaconPopper;\n }\n\n return this.tooltipPopper;\n };\n\n public setPopper = (name: 'beacon' | 'tooltip', popper: PopperData) => {\n if (name === 'beacon') {\n this.beaconPopper = popper;\n } else {\n this.tooltipPopper = popper;\n }\n };\n\n public cleanupPoppers = () => {\n this.beaconPopper = null;\n this.tooltipPopper = null;\n };\n\n public close = (origin: Origin | null = null) => {\n const { index, status } = this.getState();\n\n if (status !== STATUS.RUNNING) {\n return;\n }\n\n this.setState({\n ...this.getNextState({ action: ACTIONS.CLOSE, index: index + 1, origin }),\n });\n };\n\n public go = (nextIndex: number) => {\n const { controlled, status } = this.getState();\n\n if (controlled || status !== STATUS.RUNNING) {\n return;\n }\n\n const step = this.getSteps()[nextIndex];\n\n this.setState({\n ...this.getNextState({ action: ACTIONS.GO, index: nextIndex }),\n status: step ? status : STATUS.FINISHED,\n });\n };\n\n public info = (): State => this.getState();\n\n public next = () => {\n const { index, status } = this.getState();\n\n if (status !== STATUS.RUNNING) {\n return;\n }\n\n this.setState(this.getNextState({ action: ACTIONS.NEXT, index: index + 1 }));\n };\n\n public open = () => {\n const { status } = this.getState();\n\n if (status !== STATUS.RUNNING) {\n return;\n }\n\n this.setState({\n ...this.getNextState({ action: ACTIONS.UPDATE, lifecycle: LIFECYCLE.TOOLTIP }),\n });\n };\n\n public prev = () => {\n const { index, status } = this.getState();\n\n if (status !== STATUS.RUNNING) {\n return;\n }\n\n this.setState({\n ...this.getNextState({ action: ACTIONS.PREV, index: index - 1 }),\n });\n };\n\n public reset = (restart = false) => {\n const { controlled } = this.getState();\n\n if (controlled) {\n return;\n }\n\n this.setState({\n ...this.getNextState({ action: ACTIONS.RESET, index: 0 }),\n status: restart ? STATUS.RUNNING : STATUS.READY,\n });\n };\n\n public skip = () => {\n const { status } = this.getState();\n\n if (status !== STATUS.RUNNING) {\n return;\n }\n\n this.setState({\n action: ACTIONS.SKIP,\n lifecycle: LIFECYCLE.INIT,\n status: STATUS.SKIPPED,\n });\n };\n\n public start = (nextIndex?: number) => {\n const { index, size } = this.getState();\n\n this.setState({\n ...this.getNextState(\n {\n action: ACTIONS.START,\n index: is.number(nextIndex) ? nextIndex : index,\n },\n true,\n ),\n status: size ? STATUS.RUNNING : STATUS.WAITING,\n });\n };\n\n public stop = (advance = false) => {\n const { index, status } = this.getState();\n\n if (([STATUS.FINISHED, STATUS.SKIPPED] as Array).includes(status)) {\n return;\n }\n\n this.setState({\n ...this.getNextState({ action: ACTIONS.STOP, index: index + (advance ? 1 : 0) }),\n status: STATUS.PAUSED,\n });\n };\n\n public update = (state: Partial) => {\n if (!hasValidKeys(state, validKeys)) {\n throw new Error(`State is not valid. Valid keys: ${validKeys.join(', ')}`);\n }\n\n this.setState({\n ...this.getNextState(\n {\n ...this.getState(),\n ...state,\n action: state.action ?? ACTIONS.UPDATE,\n origin: state.origin ?? null,\n },\n true,\n ),\n });\n };\n}\n\nexport type StoreInstance = ReturnType;\n\nexport default function createStore(options?: StoreOptions) {\n return new Store(options);\n}\n","import * as React from 'react';\n\ninterface Props {\n styles: React.CSSProperties;\n}\n\nfunction JoyrideSpotlight({ styles }: Props) {\n return (\n {\n isActive = false;\n resizeTimeout?: number;\n scrollTimeout?: number;\n scrollParent?: Document | Element;\n state = {\n isScrolling: false,\n mouseOverSpotlight: false,\n showSpotlight: true,\n };\n\n componentDidMount() {\n const { debug, disableScrolling, disableScrollParentFix = false, target } = this.props;\n const element = getElement(target);\n\n this.scrollParent = getScrollParent(element ?? document.body, disableScrollParentFix, true);\n this.isActive = true;\n\n if (process.env.NODE_ENV !== 'production') {\n if (!disableScrolling && hasCustomScrollParent(element, true)) {\n log({\n title: 'step has a custom scroll parent and can cause trouble with scrolling',\n data: [{ key: 'parent', value: this.scrollParent }],\n debug,\n });\n }\n }\n\n window.addEventListener('resize', this.handleResize);\n }\n\n componentDidUpdate(previousProps: OverlayProps) {\n const { lifecycle, spotlightClicks } = this.props;\n const { changed } = treeChanges(previousProps, this.props);\n\n if (changed('lifecycle', LIFECYCLE.TOOLTIP)) {\n this.scrollParent?.addEventListener('scroll', this.handleScroll, { passive: true });\n\n setTimeout(() => {\n const { isScrolling } = this.state;\n\n if (!isScrolling) {\n this.updateState({ showSpotlight: true });\n }\n }, 100);\n }\n\n if (changed('spotlightClicks') || changed('disableOverlay') || changed('lifecycle')) {\n if (spotlightClicks && lifecycle === LIFECYCLE.TOOLTIP) {\n window.addEventListener('mousemove', this.handleMouseMove, false);\n } else if (lifecycle !== LIFECYCLE.TOOLTIP) {\n window.removeEventListener('mousemove', this.handleMouseMove);\n }\n }\n }\n\n componentWillUnmount() {\n this.isActive = false;\n\n window.removeEventListener('mousemove', this.handleMouseMove);\n window.removeEventListener('resize', this.handleResize);\n\n clearTimeout(this.resizeTimeout);\n clearTimeout(this.scrollTimeout);\n this.scrollParent?.removeEventListener('scroll', this.handleScroll);\n }\n\n hideSpotlight = () => {\n const { continuous, disableOverlay, lifecycle } = this.props;\n const hiddenLifecycles = [LIFECYCLE.BEACON, LIFECYCLE.COMPLETE, LIFECYCLE.ERROR] as Lifecycle[];\n\n return (\n disableOverlay ||\n (continuous ? hiddenLifecycles.includes(lifecycle) : lifecycle !== LIFECYCLE.TOOLTIP)\n );\n };\n\n get overlayStyles() {\n const { mouseOverSpotlight } = this.state;\n const { disableOverlayClose, placement, styles } = this.props;\n\n let baseStyles = styles.overlay;\n\n if (isLegacy()) {\n baseStyles = placement === 'center' ? styles.overlayLegacyCenter : styles.overlayLegacy;\n }\n\n return {\n cursor: disableOverlayClose ? 'default' : 'pointer',\n height: getDocumentHeight(),\n pointerEvents: mouseOverSpotlight ? 'none' : 'auto',\n ...baseStyles,\n } as React.CSSProperties;\n }\n\n get spotlightStyles(): SpotlightStyles {\n const { showSpotlight } = this.state;\n const {\n disableScrollParentFix = false,\n spotlightClicks,\n spotlightPadding = 0,\n styles,\n target,\n } = this.props;\n const element = getElement(target);\n const elementRect = getClientRect(element);\n const isFixedTarget = hasPosition(element);\n const top = getElementPosition(element, spotlightPadding, disableScrollParentFix);\n\n return {\n ...(isLegacy() ? styles.spotlightLegacy : styles.spotlight),\n height: Math.round((elementRect?.height ?? 0) + spotlightPadding * 2),\n left: Math.round((elementRect?.left ?? 0) - spotlightPadding),\n opacity: showSpotlight ? 1 : 0,\n pointerEvents: spotlightClicks ? 'none' : 'auto',\n position: isFixedTarget ? 'fixed' : 'absolute',\n top,\n transition: 'opacity 0.2s',\n width: Math.round((elementRect?.width ?? 0) + spotlightPadding * 2),\n } satisfies React.CSSProperties;\n }\n\n handleMouseMove = (event: MouseEvent) => {\n const { mouseOverSpotlight } = this.state;\n const { height, left, position, top, width } = this.spotlightStyles;\n\n const offsetY = position === 'fixed' ? event.clientY : event.pageY;\n const offsetX = position === 'fixed' ? event.clientX : event.pageX;\n const inSpotlightHeight = offsetY >= top && offsetY <= top + height;\n const inSpotlightWidth = offsetX >= left && offsetX <= left + width;\n const inSpotlight = inSpotlightWidth && inSpotlightHeight;\n\n if (inSpotlight !== mouseOverSpotlight) {\n this.updateState({ mouseOverSpotlight: inSpotlight });\n }\n };\n\n handleScroll = () => {\n const { target } = this.props;\n const element = getElement(target);\n\n if (this.scrollParent !== document) {\n const { isScrolling } = this.state;\n\n if (!isScrolling) {\n this.updateState({ isScrolling: true, showSpotlight: false });\n }\n\n clearTimeout(this.scrollTimeout);\n\n this.scrollTimeout = window.setTimeout(() => {\n this.updateState({ isScrolling: false, showSpotlight: true });\n }, 50);\n } else if (hasPosition(element, 'sticky')) {\n this.updateState({});\n }\n };\n\n handleResize = () => {\n clearTimeout(this.resizeTimeout);\n\n this.resizeTimeout = window.setTimeout(() => {\n if (!this.isActive) {\n return;\n }\n\n this.forceUpdate();\n }, 100);\n };\n\n updateState(state: Partial) {\n if (!this.isActive) {\n return;\n }\n\n this.setState(previousState => ({ ...previousState, ...state }));\n }\n\n render() {\n const { showSpotlight } = this.state;\n const { onClickOverlay, placement } = this.props;\n const { hideSpotlight, overlayStyles, spotlightStyles } = this;\n\n if (hideSpotlight()) {\n return null;\n }\n\n let spotlight = placement !== 'center' && showSpotlight && (\n {spotlight}
;\n delete overlayStyles.backgroundColor;\n }\n\n return (\n \n {spotlight}\n \n );\n }\n}\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\n\nimport { canUseDOM } from '~/modules/dom';\nimport { isReact16 } from '~/modules/helpers';\n\ninterface Props {\n children: React.ReactElement;\n id: string;\n}\n\nexport default class JoyridePortal extends React.Component {\n node: HTMLElement | null = null;\n\n componentDidMount() {\n const { id } = this.props;\n\n if (!canUseDOM()) {\n return;\n }\n\n this.node = document.createElement('div');\n this.node.id = id;\n\n document.body.appendChild(this.node);\n\n if (!isReact16) {\n this.renderReact15();\n }\n }\n\n componentDidUpdate() {\n if (!canUseDOM()) {\n return;\n }\n\n if (!isReact16) {\n this.renderReact15();\n }\n }\n\n componentWillUnmount() {\n if (!canUseDOM() || !this.node) {\n return;\n }\n\n if (!isReact16) {\n // eslint-disable-next-line react/no-deprecated\n ReactDOM.unmountComponentAtNode(this.node);\n }\n\n if (this.node.parentNode === document.body) {\n document.body.removeChild(this.node);\n this.node = null;\n }\n }\n\n renderReact15() {\n if (!canUseDOM()) {\n return;\n }\n\n const { children } = this.props;\n\n if (this.node) {\n ReactDOM.unstable_renderSubtreeIntoContainer(this, children, this.node);\n }\n }\n\n renderReact16() {\n if (!canUseDOM() || !isReact16) {\n return null;\n }\n\n const { children } = this.props;\n\n if (!this.node) {\n return null;\n }\n\n return ReactDOM.createPortal(children, this.node);\n }\n\n render() {\n if (!isReact16) {\n return null;\n }\n\n return this.renderReact16();\n }\n}\n","interface ScopeOptions {\n code?: string;\n selector: string | null;\n}\n\nexport default class Scope {\n element: HTMLElement;\n options: ScopeOptions;\n\n constructor(element: HTMLElement, options: ScopeOptions) {\n if (!(element instanceof HTMLElement)) {\n throw new TypeError('Invalid parameter: element must be an HTMLElement');\n }\n\n this.element = element;\n this.options = options;\n\n window.addEventListener('keydown', this.handleKeyDown, false);\n\n this.setFocus();\n }\n\n canBeTabbed = (element: HTMLElement): boolean => {\n const { tabIndex } = element;\n\n if (tabIndex === null || tabIndex < 0) {\n return false;\n }\n\n return this.canHaveFocus(element);\n };\n\n canHaveFocus = (element: HTMLElement): boolean => {\n const validTabNodes = /input|select|textarea|button|object/;\n const nodeName = element.nodeName.toLowerCase();\n\n const isValid =\n (validTabNodes.test(nodeName) && !element.getAttribute('disabled')) ||\n (nodeName === 'a' && !!element.getAttribute('href'));\n\n return isValid && this.isVisible(element);\n };\n\n findValidTabElements = (): Array =>\n [].slice.call(this.element.querySelectorAll('*'), 0).filter(this.canBeTabbed);\n\n handleKeyDown = (event: KeyboardEvent) => {\n const { code = 'Tab' } = this.options;\n\n if (event.code === code) {\n this.interceptTab(event);\n }\n };\n\n interceptTab = (event: KeyboardEvent) => {\n event.preventDefault();\n const elements = this.findValidTabElements();\n const { shiftKey } = event;\n\n if (!elements.length) {\n return;\n }\n\n let x = document.activeElement ? elements.indexOf(document.activeElement as HTMLElement) : 0;\n\n if (x === -1 || (!shiftKey && x + 1 === elements.length)) {\n x = 0;\n } else if (shiftKey && x === 0) {\n x = elements.length - 1;\n } else {\n x += shiftKey ? -1 : 1;\n }\n\n elements[x].focus();\n };\n\n // eslint-disable-next-line class-methods-use-this\n isHidden = (element: HTMLElement) => {\n const noSize = element.offsetWidth <= 0 && element.offsetHeight <= 0;\n const style = window.getComputedStyle(element);\n\n if (noSize && !element.innerHTML) {\n return true;\n }\n\n return (\n (noSize && style.getPropertyValue('overflow') !== 'visible') ||\n style.getPropertyValue('display') === 'none'\n );\n };\n\n isVisible = (element: HTMLElement): boolean => {\n let parentElement: HTMLElement | null = element;\n\n while (parentElement) {\n if (parentElement instanceof HTMLElement) {\n if (parentElement === document.body) {\n break;\n }\n\n if (this.isHidden(parentElement)) {\n return false;\n }\n\n parentElement = parentElement.parentNode as HTMLElement;\n }\n }\n\n return true;\n };\n\n removeScope = () => {\n window.removeEventListener('keydown', this.handleKeyDown);\n };\n\n checkFocus = (target: HTMLElement) => {\n if (document.activeElement !== target) {\n target.focus();\n window.requestAnimationFrame(() => this.checkFocus(target));\n }\n };\n\n setFocus = () => {\n const { selector } = this.options;\n\n if (!selector) {\n return;\n }\n\n const target = this.element.querySelector(selector);\n\n if (target) {\n window.requestAnimationFrame(() => this.checkFocus(target as HTMLElement));\n }\n };\n}\n","import * as React from 'react';\nimport innerText from 'react-innertext';\nimport is from 'is-lite';\n\nimport { BeaconProps } from '~/types';\n\nexport default class JoyrideBeacon extends React.Component {\n private beacon: HTMLElement | null = null;\n\n constructor(props: BeaconProps) {\n super(props);\n\n if (props.beaconComponent) {\n return;\n }\n\n const head = document.head || document.getElementsByTagName('head')[0];\n const style = document.createElement('style');\n\n style.id = 'joyride-beacon-animation';\n\n if (props.nonce) {\n style.setAttribute('nonce', props.nonce);\n }\n\n const css = `\n @keyframes joyride-beacon-inner {\n 20% {\n opacity: 0.9;\n }\n \n 90% {\n opacity: 0.7;\n }\n }\n \n @keyframes joyride-beacon-outer {\n 0% {\n transform: scale(1);\n }\n \n 45% {\n opacity: 0.7;\n transform: scale(0.75);\n }\n \n 100% {\n opacity: 0.9;\n transform: scale(1);\n }\n }\n `;\n\n style.appendChild(document.createTextNode(css));\n\n head.appendChild(style);\n }\n\n componentDidMount() {\n const { shouldFocus } = this.props;\n\n if (process.env.NODE_ENV !== 'production') {\n if (!is.domElement(this.beacon)) {\n console.warn('beacon is not a valid DOM element'); // eslint-disable-line no-console\n }\n }\n\n setTimeout(() => {\n if (is.domElement(this.beacon) && shouldFocus) {\n this.beacon.focus();\n }\n }, 0);\n }\n\n componentWillUnmount() {\n const style = document.getElementById('joyride-beacon-animation');\n\n if (style?.parentNode) {\n style.parentNode.removeChild(style);\n }\n }\n\n setBeaconRef = (c: HTMLElement | null) => {\n this.beacon = c;\n };\n\n render() {\n const {\n beaconComponent,\n continuous,\n index,\n isLastStep,\n locale,\n onClickOrHover,\n size,\n step,\n styles,\n } = this.props;\n const title = is.string(locale.open) ? locale.open : innerText(locale.open);\n const sharedProps = {\n 'aria-label': title,\n onClick: onClickOrHover,\n onMouseEnter: onClickOrHover,\n ref: this.setBeaconRef,\n title,\n };\n let component;\n\n if (beaconComponent) {\n const BeaconComponent = beaconComponent;\n\n component = (\n \n \n \n \n \n \n \n );\n}\n\nexport default JoyrideTooltipCloseButton;\n","import * as React from 'react';\n\nimport { getText } from '~/modules/helpers';\n\nimport { TooltipRenderProps } from '~/types';\n\nimport CloseButton from './CloseButton';\n\nfunction JoyrideTooltipContainer(props: TooltipRenderProps) {\n const {\n backProps,\n closeProps,\n continuous,\n index,\n isLastStep,\n primaryProps,\n size,\n skipProps,\n step,\n tooltipProps,\n } = props;\n const {\n content,\n hideBackButton,\n hideCloseButton,\n hideFooter,\n locale,\n showProgress,\n showSkipButton,\n styles,\n title,\n } = step;\n const { back, close, last, next, skip } = locale;\n const output: Record = {\n primary: close,\n };\n\n if (continuous) {\n output.primary = isLastStep ? last : next;\n\n if (showProgress) {\n output.primary = (\n \n {output.primary} ({index + 1}/{size})\n \n );\n }\n }\n\n if (output.primary) {\n output.primary = (\n \n {output.primary}\n \n );\n }\n\n if (showSkipButton && !isLastStep) {\n output.skip = (\n \n {skip}\n \n );\n }\n\n if (!hideBackButton && index > 0) {\n output.back = (\n \n {back}\n \n );\n }\n\n output.close = !hideCloseButton && (\n \n \n {title && (\n
\n {title}\n \n )}\n
{content}
\n
\n
{output.skip}
\n {output.back}\n {output.primary}\n
{\n handleClickBack = (event: React.MouseEvent) => {\n event.preventDefault();\n const { helpers } = this.props;\n\n helpers.prev();\n };\n\n handleClickClose = (event: React.MouseEvent) => {\n event.preventDefault();\n const { helpers } = this.props;\n\n helpers.close('button_close');\n };\n\n handleClickPrimary = (event: React.MouseEvent) => {\n event.preventDefault();\n const { continuous, helpers } = this.props;\n\n if (!continuous) {\n helpers.close('button_primary');\n\n return;\n }\n\n helpers.next();\n };\n\n handleClickSkip = (event: React.MouseEvent) => {\n event.preventDefault();\n const { helpers } = this.props;\n\n helpers.skip();\n };\n\n getElementsProps = () => {\n const { continuous, isLastStep, setTooltipRef, step } = this.props;\n\n const back = getText(step.locale.back);\n const close = getText(step.locale.close);\n const last = getText(step.locale.last);\n const next = getText(step.locale.next);\n const skip = getText(step.locale.skip);\n\n let primaryText = continuous ? next : close;\n\n if (isLastStep) {\n primaryText = last;\n }\n\n return {\n backProps: {\n 'aria-label': back,\n 'data-action': 'back',\n onClick: this.handleClickBack,\n role: 'button',\n title: back,\n },\n closeProps: {\n 'aria-label': close,\n 'data-action': 'close',\n onClick: this.handleClickClose,\n role: 'button',\n title: close,\n },\n primaryProps: {\n 'aria-label': primaryText,\n 'data-action': 'primary',\n onClick: this.handleClickPrimary,\n role: 'button',\n title: primaryText,\n },\n skipProps: {\n 'aria-label': skip,\n 'data-action': 'skip',\n onClick: this.handleClickSkip,\n role: 'button',\n title: skip,\n },\n tooltipProps: {\n 'aria-modal': true,\n ref: setTooltipRef,\n role: 'alertdialog',\n },\n };\n };\n\n render() {\n const { continuous, index, isLastStep, setTooltipRef, size, step } = this.props;\n const { beaconComponent, tooltipComponent, ...cleanStep } = step;\n let component;\n\n if (tooltipComponent) {\n const renderProps = {\n ...this.getElementsProps(),\n continuous,\n index,\n isLastStep,\n size,\n step: cleanStep,\n setTooltipRef,\n };\n\n const TooltipComponent = tooltipComponent;\n\n component = {\n scope: Scope | null = null;\n tooltip: HTMLElement | null = null;\n\n componentDidMount() {\n const { debug, index } = this.props;\n\n log({\n title: `step:${index}`,\n data: [{ key: 'props', value: this.props }],\n debug,\n });\n }\n\n componentDidUpdate(previousProps: StepProps) {\n const {\n action,\n callback,\n continuous,\n controlled,\n debug,\n helpers,\n index,\n lifecycle,\n status,\n step,\n store,\n } = this.props;\n const { changed, changedFrom } = treeChanges(previousProps, this.props);\n const state = helpers.info();\n\n const skipBeacon =\n continuous && action !== ACTIONS.CLOSE && (index > 0 || action === ACTIONS.PREV);\n const hasStoreChanged =\n changed('action') || changed('index') || changed('lifecycle') || changed('status');\n const isInitial = changedFrom('lifecycle', [LIFECYCLE.TOOLTIP, LIFECYCLE.INIT], LIFECYCLE.INIT);\n const isAfterAction = changed('action', [\n ACTIONS.NEXT,\n ACTIONS.PREV,\n ACTIONS.SKIP,\n ACTIONS.CLOSE,\n ]);\n const isControlled = controlled && index === previousProps.index;\n\n if (isAfterAction && (isInitial || isControlled)) {\n callback({\n ...state,\n index: previousProps.index,\n lifecycle: LIFECYCLE.COMPLETE,\n step: previousProps.step,\n type: EVENTS.STEP_AFTER,\n });\n }\n\n if (\n step.placement === 'center' &&\n status === STATUS.RUNNING &&\n changed('index') &&\n action !== ACTIONS.START &&\n lifecycle === LIFECYCLE.INIT\n ) {\n store.update({ lifecycle: LIFECYCLE.READY });\n }\n\n if (hasStoreChanged) {\n const element = getElement(step.target);\n const elementExists = !!element;\n const hasRenderedTarget = elementExists && isElementVisible(element);\n\n if (hasRenderedTarget) {\n if (\n changedFrom('status', STATUS.READY, STATUS.RUNNING) ||\n changedFrom('lifecycle', LIFECYCLE.INIT, LIFECYCLE.READY)\n ) {\n callback({\n ...state,\n step,\n type: EVENTS.STEP_BEFORE,\n });\n }\n } else {\n // eslint-disable-next-line no-console\n console.warn(elementExists ? 'Target not visible' : 'Target not mounted', step);\n callback({\n ...state,\n type: EVENTS.TARGET_NOT_FOUND,\n step,\n });\n\n if (!controlled) {\n store.update({ index: index + (action === ACTIONS.PREV ? -1 : 1) });\n }\n }\n }\n\n if (changedFrom('lifecycle', LIFECYCLE.INIT, LIFECYCLE.READY)) {\n store.update({\n lifecycle: hideBeacon(step) || skipBeacon ? LIFECYCLE.TOOLTIP : LIFECYCLE.BEACON,\n });\n }\n\n if (changed('index')) {\n log({\n title: `step:${lifecycle}`,\n data: [{ key: 'props', value: this.props }],\n debug,\n });\n }\n\n if (changed('lifecycle', LIFECYCLE.BEACON)) {\n callback({\n ...state,\n step,\n type: EVENTS.BEACON,\n });\n }\n\n if (changed('lifecycle', LIFECYCLE.TOOLTIP)) {\n callback({\n ...state,\n step,\n type: EVENTS.TOOLTIP,\n });\n\n if (this.tooltip) {\n this.scope = new Scope(this.tooltip, { selector: '[data-action=primary]' });\n this.scope.setFocus();\n }\n }\n\n if (changedFrom('lifecycle', [LIFECYCLE.TOOLTIP, LIFECYCLE.INIT], LIFECYCLE.INIT)) {\n this.scope?.removeScope();\n store.cleanupPoppers();\n }\n }\n\n componentWillUnmount() {\n this.scope?.removeScope();\n }\n\n /**\n * Beacon click/hover event listener\n */\n handleClickHoverBeacon = (event: React.MouseEvent) => {\n const { step, store } = this.props;\n\n if (event.type === 'mouseenter' && step.event !== 'hover') {\n return;\n }\n\n store.update({ lifecycle: LIFECYCLE.TOOLTIP });\n };\n\n setTooltipRef = (element: HTMLElement) => {\n this.tooltip = element;\n };\n\n setPopper: FloaterProps['getPopper'] = (popper, type) => {\n const { action, lifecycle, step, store } = this.props;\n\n if (type === 'wrapper') {\n store.setPopper('beacon', popper);\n } else {\n store.setPopper('tooltip', popper);\n }\n\n if (store.getPopper('beacon') && store.getPopper('tooltip') && lifecycle === LIFECYCLE.INIT) {\n store.update({\n action,\n lifecycle: LIFECYCLE.READY,\n });\n }\n\n if (step.floaterProps?.getPopper) {\n step.floaterProps.getPopper(popper, type);\n }\n };\n\n get open() {\n const { lifecycle, step } = this.props;\n\n return hideBeacon(step) || lifecycle === LIFECYCLE.TOOLTIP;\n }\n\n renderTooltip = (renderProps: RenderProps) => {\n const { continuous, helpers, index, size, step } = this.props;\n\n return (\n \n \n
\n );\n }\n}\n","import * as React from 'react';\nimport { ReactNode } from 'react';\nimport isEqual from '@gilbarbara/deep-equal';\nimport is from 'is-lite';\nimport treeChanges from 'tree-changes';\n\nimport {\n canUseDOM,\n getElement,\n getScrollParent,\n getScrollTo,\n hasCustomScrollParent,\n scrollTo,\n} from '~/modules/dom';\nimport { log, shouldScroll } from '~/modules/helpers';\nimport { getMergedStep, validateSteps } from '~/modules/step';\nimport createStore from '~/modules/store';\n\nimport { ACTIONS, EVENTS, LIFECYCLE, STATUS } from '~/literals';\n\nimport Overlay from '~/components/Overlay';\nimport Portal from '~/components/Portal';\n\nimport { defaultProps } from '~/defaults';\nimport { Actions, CallBackProps, Props, State, Status, StoreHelpers } from '~/types';\n\nimport Step from './Step';\n\nclass Joyride extends React.Component {\n private readonly helpers: StoreHelpers;\n private readonly store: ReturnType;\n\n static defaultProps = defaultProps;\n\n constructor(props: Props) {\n super(props);\n\n const { debug, getHelpers, run, stepIndex } = props;\n\n this.store = createStore({\n ...props,\n controlled: run && is.number(stepIndex),\n });\n this.helpers = this.store.getHelpers();\n\n const { addListener } = this.store;\n\n log({\n title: 'init',\n data: [\n { key: 'props', value: this.props },\n { key: 'state', value: this.state },\n ],\n debug,\n });\n\n // Sync the store to this component's state.\n addListener(this.syncState);\n\n if (getHelpers) {\n getHelpers(this.helpers);\n }\n\n this.state = this.store.getState();\n }\n\n componentDidMount() {\n if (!canUseDOM()) {\n return;\n }\n\n const { debug, disableCloseOnEsc, run, steps } = this.props;\n const { start } = this.store;\n\n if (validateSteps(steps, debug) && run) {\n start();\n }\n\n if (!disableCloseOnEsc) {\n document.body.addEventListener('keydown', this.handleKeyboard, { passive: true });\n }\n }\n\n componentDidUpdate(previousProps: Props, previousState: State) {\n if (!canUseDOM()) {\n return;\n }\n\n const { action, controlled, index, lifecycle, status } = this.state;\n const { debug, run, stepIndex, steps } = this.props;\n const { stepIndex: previousStepIndex, steps: previousSteps } = previousProps;\n const { reset, setSteps, start, stop, update } = this.store;\n const { changed: changedProps } = treeChanges(previousProps, this.props);\n const { changed, changedFrom } = treeChanges(previousState, this.state);\n const step = getMergedStep(this.props, steps[index]);\n\n const stepsChanged = !isEqual(previousSteps, steps);\n const stepIndexChanged = is.number(stepIndex) && changedProps('stepIndex');\n const target = getElement(step.target);\n\n if (stepsChanged) {\n if (validateSteps(steps, debug)) {\n setSteps(steps);\n } else {\n // eslint-disable-next-line no-console\n console.warn('Steps are not valid', steps);\n }\n }\n\n if (changedProps('run')) {\n if (run) {\n start(stepIndex);\n } else {\n stop();\n }\n }\n\n if (stepIndexChanged) {\n let nextAction: Actions =\n is.number(previousStepIndex) && previousStepIndex < stepIndex ? ACTIONS.NEXT : ACTIONS.PREV;\n\n if (action === ACTIONS.STOP) {\n nextAction = ACTIONS.START;\n }\n\n if (!([STATUS.FINISHED, STATUS.SKIPPED] as Array).includes(status)) {\n update({\n action: action === ACTIONS.CLOSE ? ACTIONS.CLOSE : nextAction,\n index: stepIndex,\n lifecycle: LIFECYCLE.INIT,\n });\n }\n }\n\n // Update the index if the first step is not found\n if (!controlled && status === STATUS.RUNNING && index === 0 && !target) {\n this.store.update({ index: index + 1 });\n this.callback({\n ...this.state,\n type: EVENTS.TARGET_NOT_FOUND,\n step,\n });\n }\n\n const callbackData = {\n ...this.state,\n index,\n step,\n };\n const isAfterAction = changed('action', [\n ACTIONS.NEXT,\n ACTIONS.PREV,\n ACTIONS.SKIP,\n ACTIONS.CLOSE,\n ]);\n\n if (isAfterAction && changed('status', STATUS.PAUSED)) {\n const previousStep = getMergedStep(this.props, steps[previousState.index]);\n\n this.callback({\n ...callbackData,\n index: previousState.index,\n lifecycle: LIFECYCLE.COMPLETE,\n step: previousStep,\n type: EVENTS.STEP_AFTER,\n });\n }\n\n if (changed('status', [STATUS.FINISHED, STATUS.SKIPPED])) {\n const previousStep = getMergedStep(this.props, steps[previousState.index]);\n\n if (!controlled) {\n this.callback({\n ...callbackData,\n index: previousState.index,\n lifecycle: LIFECYCLE.COMPLETE,\n step: previousStep,\n type: EVENTS.STEP_AFTER,\n });\n }\n\n this.callback({\n ...callbackData,\n type: EVENTS.TOUR_END,\n // Return the last step when the tour is finished\n step: previousStep,\n index: previousState.index,\n });\n reset();\n } else if (changedFrom('status', [STATUS.IDLE, STATUS.READY], STATUS.RUNNING)) {\n this.callback({\n ...callbackData,\n type: EVENTS.TOUR_START,\n });\n } else if (changed('status') || changed('action', ACTIONS.RESET)) {\n this.callback({\n ...callbackData,\n type: EVENTS.TOUR_STATUS,\n });\n }\n\n this.scrollToStep(previousState);\n\n if (step.placement === 'center' && status === STATUS.RUNNING && lifecycle === LIFECYCLE.INIT) {\n this.store.update({ lifecycle: LIFECYCLE.READY });\n }\n }\n\n componentWillUnmount() {\n const { disableCloseOnEsc } = this.props;\n\n if (!disableCloseOnEsc) {\n document.body.removeEventListener('keydown', this.handleKeyboard);\n }\n }\n\n /**\n * Trigger the callback.\n */\n callback = (data: CallBackProps) => {\n const { callback } = this.props;\n\n if (is.function(callback)) {\n callback(data);\n }\n };\n\n /**\n * Keydown event listener\n */\n handleKeyboard = (event: KeyboardEvent) => {\n const { index, lifecycle } = this.state;\n const { steps } = this.props;\n const step = steps[index];\n\n if (lifecycle === LIFECYCLE.TOOLTIP) {\n if (event.code === 'Escape' && step && !step.disableCloseOnEsc) {\n this.store.close('keyboard');\n }\n }\n };\n\n handleClickOverlay = () => {\n const { index } = this.state;\n const { steps } = this.props;\n\n const step = getMergedStep(this.props, steps[index]);\n\n if (!step.disableOverlayClose) {\n this.helpers.close('overlay');\n }\n };\n\n /**\n * Sync the store with the component's state\n */\n syncState = (state: State) => {\n this.setState(state);\n };\n\n scrollToStep(previousState: State) {\n const { index, lifecycle, status } = this.state;\n const {\n debug,\n disableScrollParentFix = false,\n scrollDuration,\n scrollOffset = 20,\n scrollToFirstStep = false,\n steps,\n } = this.props;\n const step = getMergedStep(this.props, steps[index]);\n\n const target = getElement(step.target);\n const shouldScrollToStep = shouldScroll({\n isFirstStep: index === 0,\n lifecycle,\n previousLifecycle: previousState.lifecycle,\n scrollToFirstStep,\n step,\n target,\n });\n\n if (status === STATUS.RUNNING && shouldScrollToStep) {\n const hasCustomScroll = hasCustomScrollParent(target, disableScrollParentFix);\n const scrollParent = getScrollParent(target, disableScrollParentFix);\n let scrollY = Math.floor(getScrollTo(target, scrollOffset, disableScrollParentFix)) || 0;\n\n log({\n title: 'scrollToStep',\n data: [\n { key: 'index', value: index },\n { key: 'lifecycle', value: lifecycle },\n { key: 'status', value: status },\n ],\n debug,\n });\n\n const beaconPopper = this.store.getPopper('beacon');\n const tooltipPopper = this.store.getPopper('tooltip');\n\n if (lifecycle === LIFECYCLE.BEACON && beaconPopper) {\n const { offsets, placement } = beaconPopper;\n\n if (!['bottom'].includes(placement) && !hasCustomScroll) {\n scrollY = Math.floor(offsets.popper.top - scrollOffset);\n }\n } else if (lifecycle === LIFECYCLE.TOOLTIP && tooltipPopper) {\n const { flipped, offsets, placement } = tooltipPopper;\n\n if (['top', 'right', 'left'].includes(placement) && !flipped && !hasCustomScroll) {\n scrollY = Math.floor(offsets.popper.top - scrollOffset);\n } else {\n scrollY -= step.spotlightPadding;\n }\n }\n\n scrollY = scrollY >= 0 ? scrollY : 0;\n\n if (status === STATUS.RUNNING) {\n scrollTo(scrollY, { element: scrollParent as Element, duration: scrollDuration }).then(\n () => {\n setTimeout(() => {\n this.store.getPopper('tooltip')?.instance.update();\n }, 10);\n },\n );\n }\n }\n }\n\n render() {\n if (!canUseDOM()) {\n return null;\n }\n\n const { index, lifecycle, status } = this.state;\n const {\n continuous = false,\n debug = false,\n nonce,\n scrollToFirstStep = false,\n steps,\n } = this.props;\n const isRunning = status === STATUS.RUNNING;\n const content: Record = {};\n\n if (isRunning && steps[index]) {\n const step = getMergedStep(this.props, steps[index]);\n\n content.step = (\n \n \n );\n }\n\n return (\n \n {content.step}\n {content.overlay}\n
\n );\n }\n}\n\nexport default Joyride;\n","import React, { Component } from \"react\";\nimport { useParams } from \"react-router-dom\";\nimport {\n Badge,\n Button,\n ButtonGroup,\n Container,\n Image,\n Row,\n Col,\n Form,\n Modal,\n Card,\n InputGroup,\n Nav,\n Table,\n // OverlayTrigger,\n // Popover,\n} from \"react-bootstrap\";\nimport Joyride from \"react-joyride\";\nimport styled from \"styled-components\";\nimport Swal from \"sweetalert2\";\nimport axios from \"axios\";\nimport DatePicker from \"react-multi-date-picker\";\nimport TimePicker from \"react-multi-date-picker/plugins/time_picker\";\nimport ReactPlayer from \"react-player\";\nimport Common from \"../../common\";\nimport Functions from \"../../functions\";\nimport lang from \"../../lang/lang\";\nconst langSet = Common.langSet;\nconst lang_data = lang(langSet);\nconst base_voter = Common.Voter;\nconst user_id = Common.token;\nconst admin_id = Common.admin_id;\n// const host = window.location.protocol + \"//\" + window.location.host;\nlet tzoffset = new Date().getTimezoneOffset() * 60000; //offset in milliseconds\nlet localISOTime = new Date(Date.now() - tzoffset).toISOString().slice(0, -1);\nconst GetDataForm = () => {\n const { jp_id } = useParams();\n return \n
\n
\n \n \n \n
{main_data?.jp_position} \n \n\n \n \n
\n \n \n
this.updateStatusJobPost()}\n className=\"confirm_candidate_button\"\n >\n \n {total_final} \n {\" \"}\n \n vote_id !== \"\"\n ? this.setState({\n openModalVote: true,\n })\n : this.handleCreateVote()\n }\n className=\"vote_button\"\n >\n \n {total_select} \n \n
\n \n {lang_data?.interview_video} [{used_video} / {quota_video}]\n
\n \n \n\n \n \n this.FilterData(0)}\n >\n {lang_data?.apply_list}\n \n \n \n this.FilterData(1)}\n >\n {lang_data?.selected_interview}\n \n \n \n this.FilterData(2)}\n >\n {lang_data?.appointment_interview}\n \n \n \n this.FilterData(3)}\n >\n {lang_data?.final_result}\n \n \n \n\n \n \n \n [\n this.setState({\n search_value: e.target.value,\n }),\n this.refreshData(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n search_value: e.target.value,\n }),\n this.refreshData(),\n ]}\n />\n \n \n \n \n \n {data?.map((rs, index) => (\n \n \n
\n
\n
\n \n {rs?.main?.jpa_user?.firstname}{\" \"}\n {rs?.main?.jpa_user?.lastname}\n \n \n
\n
\n \n {rs?.candidate_job_function.map((ra, i) => (\n
\n \n {ra?.user_job_function?.jbc_name}\n
{\" \"}\n \n ))}\n
\n {rs?.candidate_job_type.map((rb, i) => (\n
\n \n {rb?.user_job_type?.jt_name}\n
{\" \"}\n \n ))}\n
\n
\n \n {lang_data?.expected_salary}{\" \"}\n {Functions.formatNumberWithComma(\n rs?.candidate_salary?.us_salary_start\n )}\n {\" - \"}\n {Functions.formatNumberWithComma(\n rs?.candidate_salary?.us_salary_end\n )}\n
\n \n
\n
\n
\n
\n this.GetVoteList(rs?.main?.jpa_id)}\n >\n \n {lang_data?.result_interview} : {rs?.total_voted}\n \n \n
\n\n {rs?.main?.jpa_step === 2 && (\n
\n {\" \"}\n {lang_data?.appointment} :{\" \"}\n {Functions.format_date_time_picker(\n rs?.main?.jpa_appointment\n )}{\" \"}\n
\n \n \n )}\n {/* jpa_type = 0 */}\n\n {rs?.main?.jpa_type === 0 && (\n
\n \n rs?.favorite_id === 0\n ? this.favoriteCreate(\n rs?.main?.jpa_user?.user_id\n )\n : this.favoritDelete(rs?.favorite_id)\n }\n >\n {lang_data?.liked}{\" \"}\n \n\n [\n this.refreshDataVideo(\n rs?.main?.jpa_user?.user_id\n ),\n this.setState({\n openModalVideo: true,\n video_path: \"\",\n user_select: rs?.main?.jpa_user?.user_id,\n fullName: `${rs?.main?.jpa_user?.firstname} ${rs?.main?.jpa_user?.lastname}`,\n }),\n ]}\n disabled={\n used_video >= quota_video && rs?.log_id === 0\n ? true\n : false\n }\n title=\"Video\"\n >\n {lang_data?.interview_video}{\" \"}\n \n \n rs?.main?.jpa_type === 0\n ? this.selectCandidate(rs?.main, 1)\n : this.selectCandidate(rs?.main, 0)\n }\n disabled={\n rs?.main?.jpa_step === 4 || vote_close === 1\n ? true\n : false\n }\n title=\"Selected\"\n >\n {lang_data?.accept_candidate}\n \n \n )}\n {/* jpa_type = 1 */}\n {rs?.main?.jpa_type === 1 && (\n
\n \n rs?.favorite_id === 0\n ? this.favoriteCreate(\n rs?.main?.jpa_user?.user_id\n )\n : this.favoritDelete(rs?.favorite_id)\n }\n >\n {lang_data?.liked}\n \n [\n this.refreshDataVideo(\n rs?.main?.jpa_user?.user_id\n ),\n this.setState({\n openModalVideo: true,\n video_path: \"\",\n user_select: rs?.main?.jpa_user?.user_id,\n fullName: `${rs?.main?.jpa_user?.firstname} ${rs?.main?.jpa_user?.lastname}`,\n }),\n ]}\n disabled={\n used_video >= quota_video && rs?.log_id === 0\n ? true\n : false\n }\n >\n {lang_data?.interview_video}\n \n \n rs?.main?.jpa_type === 0\n ? this.selectCandidate(rs?.main, 1)\n : this.selectCandidate(rs?.main, 0)\n }\n >\n {lang_data?.cancelled}\n \n \n )}\n {/* jpa_type = 2 */}\n {rs?.main?.jpa_type === 2 && (\n
\n \n rs?.favorite_id === 0\n ? this.favoriteCreate(\n rs?.main?.jpa_user?.user_id\n )\n : this.favoritDelete(rs?.favorite_id)\n }\n >\n {lang_data?.liked}\n \n [\n this.refreshDataVideo(\n rs?.main?.jpa_user?.user_id\n ),\n this.setState({\n openModalVideo: true,\n video_path: \"\",\n user_select: rs?.main?.jpa_user?.user_id,\n fullName: `${rs?.main?.jpa_user?.firstname} ${rs?.main?.jpa_user?.lastname}`,\n }),\n ]}\n disabled={\n used_video >= quota_video && rs?.log_id === 0\n ? true\n : false\n }\n >\n {lang_data?.interview_video}\n \n \n rs?.main?.jpa_status === 0\n ? this.completeCandidate(rs?.main, 1)\n : this.completeCandidate(rs?.main, 0)\n }\n disabled={job_active !== 1 ? true : false}\n >\n {rs?.main?.jpa_status === 1\n ? lang_data?.cancelled\n : lang_data?.select_candidate}\n \n \n this.setState({\n openModalAppointment: true,\n get_content_apply: rs?.main,\n jpa_appointment: rs?.main?.jpa_appointment,\n jpa_conf_url: rs?.main?.jpa_conf_url,\n })\n }\n >\n {lang_data?.appointment}\n \n \n )}\n
\n
\n \n\n \n
\n \n {lang_data?.page} \n [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onKeyUp={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n onClick={(e) => [\n this.setState({\n page: e.target.value,\n }),\n this.refreshData(),\n ]}\n style={{ textAlign: \"center\" }}\n />\n \n {lang_data?.total_page} : {param.total_page}{\" \"}\n \n \n
\n
\n this.setState({\n openModalVideo: false,\n })\n }\n size=\"lg\"\n >\n \n \n \n {Functions.check_empty_value(video_path) === true ? (\n \n [\n this.handleAlert(\n `คำขอให้เพิ่ม Video สัมภาษณ์ของคุณ ${this.state.fullName}`,\n 7,\n `/candidate/${this.state.user_select}/${this.state.fullName}`,\n admin_id\n ),\n this.setState({\n openModalVideo: false,\n }),\n Swal.fire({\n title: lang_data?.notify_title_success,\n text: lang_data?.notify_text_request_video,\n icon: \"success\",\n confirmButtonText: lang_data?.notify_confirm_success,\n }),\n ]}\n >\n {lang_data?.want_interview_video}\n \n
\n ) : (\n \n
\n )}\n \n \n \n this.setState({\n openModalVideo: false,\n })\n }\n >\n {lang_data?.close}\n \n \n \n \n this.setState({\n openModalVote: false,\n })\n }\n >\n \n {lang_data?.vote} \n \n \n \n Vote link \n \n this.copyTextToClipboard(link_vote)}\n >\n \n \n \n \n {lang_data?.password_label} \n \n \n this.setState({\n vote_password: e.target.value,\n })\n }\n value={vote_password}\n />\n\n this.handleCreateVote()}\n >\n {/* \n \n\n {this.state.vote_password === \"\" && (\n \n \n {lang_data?.warning_msg1}\n \n \n )}\n \n \n \n {/*
*/}\n
\n
\n \n Click\n \n
\n
\n \n \n \n this.setState({\n openModalVote: false,\n })\n }\n >\n {lang_data?.close}\n \n \n \n\n {/* Appointment */}\n \n this.setState({\n openModalAppointment: false,\n })\n }\n >\n \n {lang_data?.appointment} \n \n \n \n {lang_data?.date_label} \n \n \n this.setState({ appm_control: 0 })}\n checked={appm_control === 0 ? true : false}\n disabled={this.state.jpa_conf_url !== \"\" ? true : false}\n />\n this.setState({ appm_control: 1 })}\n checked={appm_control === 1 ? true : false}\n />\n \n\n {appm_control === 1 || this.state.jpa_conf_url !== \"\" ? (\n \n Conference URL \n \n this.setState({ jpa_conf_url: e.target.value })\n }\n value={this.state.jpa_conf_url}\n />\n \n ) : null}\n \n \n \n this.setState({\n openModalAppointment: false,\n })\n }\n >\n {lang_data?.close}\n \n \n {lang_data?.save}\n \n \n \n\n \n this.setState({\n openModalVotedList: false,\n })\n }\n >\n \n {lang_data?.vote_list} \n \n \n \n \n \n # \n {lang_data?.first_name} \n {lang_data?.day_and_time} \n \n \n \n {voted_list?.map((r, i) => (\n \n {i + 1} \n {r?.voted_fullname} \n {Functions.format_date_time(r.create_date)} \n \n ))}\n \n
\n \n \n \n this.setState({\n openModalVotedList: false,\n })\n }\n >\n {lang_data?.close}\n \n \n \n \n
\n
, // rename?\n ) {\n }\n\n remove() {\n this.context.dispatch({\n type: 'REMOVE_EVENT_SOURCE',\n sourceId: this.internalEventSource.sourceId,\n })\n }\n\n refetch() {\n this.context.dispatch({\n type: 'FETCH_EVENT_SOURCES',\n sourceIds: [this.internalEventSource.sourceId],\n isRefetch: true,\n })\n }\n\n get id(): string {\n return this.internalEventSource.publicId\n }\n\n get url(): string {\n return this.internalEventSource.meta.url\n }\n\n get format(): string {\n return this.internalEventSource.meta.format // TODO: bad. not guaranteed\n }\n}\n","import { Dictionary } from '../options'\n\nexport function removeElement(el: HTMLElement) { // removes nodes in addition to elements. bad name\n if (el.parentNode) {\n el.parentNode.removeChild(el)\n }\n}\n\n// Querying\n// ----------------------------------------------------------------------------------------------------------------\n\nexport function elementClosest(el: HTMLElement, selector: string): HTMLElement {\n if (el.closest) {\n return el.closest(selector)\n\n // really bad fallback for IE\n // from https://developer.mozilla.org/en-US/docs/Web/API/Element/closest\n }\n if (!document.documentElement.contains(el)) {\n return null\n }\n do {\n if (elementMatches(el, selector)) {\n return el\n }\n el = (el.parentElement || el.parentNode) as HTMLElement\n } while (el !== null && el.nodeType === 1)\n return null\n}\n\nexport function elementMatches(el: HTMLElement, selector: string): HTMLElement {\n let method = el.matches || (el as any).matchesSelector || (el as any).msMatchesSelector\n\n return method.call(el, selector)\n}\n\n// accepts multiple subject els\n// returns a real array. good for methods like forEach\n// TODO: accept the document\nexport function findElements(container: HTMLElement[] | HTMLElement | NodeListOf, selector: string): HTMLElement[] {\n let containers = container instanceof HTMLElement ? [container] : container\n let allMatches: HTMLElement[] = []\n\n for (let i = 0; i < containers.length; i += 1) {\n let matches = containers[i].querySelectorAll(selector)\n\n for (let j = 0; j < matches.length; j += 1) {\n allMatches.push(matches[j] as HTMLElement)\n }\n }\n\n return allMatches\n}\n\n// accepts multiple subject els\n// only queries direct child elements // TODO: rename to findDirectChildren!\nexport function findDirectChildren(parent: HTMLElement[] | HTMLElement, selector?: string): HTMLElement[] {\n let parents = parent instanceof HTMLElement ? [parent] : parent\n let allMatches = []\n\n for (let i = 0; i < parents.length; i += 1) {\n let childNodes = parents[i].children // only ever elements\n\n for (let j = 0; j < childNodes.length; j += 1) {\n let childNode = childNodes[j]\n\n if (!selector || elementMatches(childNode as HTMLElement, selector)) {\n allMatches.push(childNode)\n }\n }\n }\n\n return allMatches\n}\n\n// Style\n// ----------------------------------------------------------------------------------------------------------------\n\nconst PIXEL_PROP_RE = /(top|left|right|bottom|width|height)$/i\n\nexport function applyStyle(el: HTMLElement, props: Dictionary) {\n for (let propName in props) {\n applyStyleProp(el, propName, props[propName])\n }\n}\n\nexport function applyStyleProp(el: HTMLElement, name: string, val) {\n if (val == null) {\n el.style[name] = ''\n } else if (typeof val === 'number' && PIXEL_PROP_RE.test(name)) {\n el.style[name] = `${val}px`\n } else {\n el.style[name] = val\n }\n}\n\n// Event Handling\n// ----------------------------------------------------------------------------------------------------------------\n\n// if intercepting bubbled events at the document/window/body level,\n// and want to see originating element (the 'target'), use this util instead\n// of `ev.target` because it goes within web-component boundaries.\nexport function getEventTargetViaRoot(ev: Event) {\n return ev.composedPath?.()[0] ?? ev.target\n}\n\n// Shadow DOM consuderations\n// ----------------------------------------------------------------------------------------------------------------\n\nexport function getElRoot(el: HTMLElement): ShadowRoot | Document {\n return el.getRootNode ? el.getRootNode() as ShadowRoot : document\n}\n\n// Unique ID for DOM attribute\n\nlet guid = 0\n\nexport function getUniqueDomId() {\n guid += 1\n return 'fc-dom-' + guid\n}\n","import { elementClosest } from './dom-manip'\nimport { VUIEvent } from '../vdom'\n\n// Stops a mouse/touch event from doing it's native browser action\nexport function preventDefault(ev) {\n ev.preventDefault()\n}\n\n// Event Delegation\n// ----------------------------------------------------------------------------------------------------------------\n\nexport function buildDelegationHandler(\n selector: string,\n handler: (ev: EventType, matchedTarget: HTMLElement) => void,\n) {\n return (ev: EventType) => {\n let matchedChild = elementClosest(ev.target as HTMLElement, selector)\n\n if (matchedChild) {\n handler.call(matchedChild, ev, matchedChild)\n }\n }\n}\n\nexport function listenBySelector(\n container: HTMLElement,\n eventType: string,\n selector: string,\n handler: (ev: Event, matchedTarget: HTMLElement) => void,\n) {\n let attachedHandler = buildDelegationHandler(selector, handler)\n\n container.addEventListener(eventType, attachedHandler)\n\n return () => {\n container.removeEventListener(eventType, attachedHandler)\n }\n}\n\nexport function listenToHoverBySelector(\n container: HTMLElement,\n selector: string,\n onMouseEnter: (ev: Event, matchedTarget: HTMLElement) => void,\n onMouseLeave: (ev: Event, matchedTarget: HTMLElement) => void,\n) {\n let currentMatchedChild\n\n return listenBySelector(container, 'mouseover', selector, (mouseOverEv, matchedChild) => {\n if (matchedChild !== currentMatchedChild) {\n currentMatchedChild = matchedChild\n onMouseEnter(mouseOverEv, matchedChild)\n\n let realOnMouseLeave = (mouseLeaveEv) => {\n currentMatchedChild = null\n onMouseLeave(mouseLeaveEv, matchedChild)\n matchedChild.removeEventListener('mouseleave', realOnMouseLeave)\n }\n\n // listen to the next mouseleave, and then unattach\n matchedChild.addEventListener('mouseleave', realOnMouseLeave)\n }\n })\n}\n\n// Animation\n// ----------------------------------------------------------------------------------------------------------------\n\nconst transitionEventNames = [\n 'webkitTransitionEnd',\n 'otransitionend',\n 'oTransitionEnd',\n 'msTransitionEnd',\n 'transitionend',\n]\n\n// triggered only when the next single subsequent transition finishes\nexport function whenTransitionDone(el: HTMLElement, callback: (ev: Event) => void) {\n let realCallback = (ev) => {\n callback(ev)\n transitionEventNames.forEach((eventName) => {\n el.removeEventListener(eventName, realCallback)\n })\n }\n\n transitionEventNames.forEach((eventName) => {\n el.addEventListener(eventName, realCallback) // cross-browser way to determine when the transition finishes\n })\n}\n\n// ARIA workarounds\n// ----------------------------------------------------------------------------------------------------------------\n\nexport function createAriaClickAttrs(handler: ((ev: UIEvent) => void)) {\n return {\n onClick: handler,\n ...createAriaKeyboardAttrs(handler),\n }\n}\n\nexport function createAriaKeyboardAttrs(handler: ((ev: UIEvent) => void)) {\n return {\n tabIndex: 0,\n onKeyDown(ev: KeyboardEvent) {\n if (ev.key === 'Enter' || ev.key === ' ') {\n handler(ev)\n ev.preventDefault() // if space, don't scroll down page\n }\n },\n }\n}\n","import { preventDefault } from './dom-event'\n\nexport type GenericHash = { [key: string]: any } // already did this somewhere\n\nlet guidNumber = 0\n\nexport function guid() {\n guidNumber += 1\n return String(guidNumber)\n}\n\n/* FullCalendar-specific DOM Utilities\n----------------------------------------------------------------------------------------------------------------------*/\n\n// Make the mouse cursor express that an event is not allowed in the current area\nexport function disableCursor() {\n document.body.classList.add('fc-not-allowed')\n}\n\n// Returns the mouse cursor to its original look\nexport function enableCursor() {\n document.body.classList.remove('fc-not-allowed')\n}\n\n/* Selection\n----------------------------------------------------------------------------------------------------------------------*/\n\nexport function preventSelection(el: HTMLElement) {\n el.classList.add('fc-unselectable')\n el.addEventListener('selectstart', preventDefault)\n}\n\nexport function allowSelection(el: HTMLElement) {\n el.classList.remove('fc-unselectable')\n el.removeEventListener('selectstart', preventDefault)\n}\n\n/* Context Menu\n----------------------------------------------------------------------------------------------------------------------*/\n\nexport function preventContextMenu(el: HTMLElement) {\n el.addEventListener('contextmenu', preventDefault)\n}\n\nexport function allowContextMenu(el: HTMLElement) {\n el.removeEventListener('contextmenu', preventDefault)\n}\n\n/* Object Ordering by Field\n----------------------------------------------------------------------------------------------------------------------*/\n\nexport interface OrderSpec {\n field?: string\n order?: number\n func?: FieldSpecInputFunc\n}\n\nexport type FieldSpecInput = string | string[] | FieldSpecInputFunc | FieldSpecInputFunc[]\nexport type FieldSpecInputFunc = (a: Subject, b: Subject) => number\n\nexport function parseFieldSpecs(input: FieldSpecInput): OrderSpec[] {\n let specs: OrderSpec[] = []\n let tokens = []\n let i\n let token\n\n if (typeof input === 'string') {\n tokens = input.split(/\\s*,\\s*/)\n } else if (typeof input === 'function') {\n tokens = [input]\n } else if (Array.isArray(input)) {\n tokens = input\n }\n\n for (i = 0; i < tokens.length; i += 1) {\n token = tokens[i]\n\n if (typeof token === 'string') {\n specs.push(\n token.charAt(0) === '-' ?\n { field: token.substring(1), order: -1 } :\n { field: token, order: 1 },\n )\n } else if (typeof token === 'function') {\n specs.push({ func: token })\n }\n }\n\n return specs\n}\n\nexport function compareByFieldSpecs(obj0: Subject, obj1: Subject, fieldSpecs: OrderSpec[]): number {\n let i\n let cmp\n\n for (i = 0; i < fieldSpecs.length; i += 1) {\n cmp = compareByFieldSpec(obj0, obj1, fieldSpecs[i])\n if (cmp) {\n return cmp\n }\n }\n\n return 0\n}\n\nexport function compareByFieldSpec(obj0: Subject, obj1: Subject, fieldSpec: OrderSpec): number {\n if (fieldSpec.func) {\n return fieldSpec.func(obj0, obj1)\n }\n\n return flexibleCompare(obj0[fieldSpec.field], obj1[fieldSpec.field])\n * (fieldSpec.order || 1)\n}\n\nexport function flexibleCompare(a, b) {\n if (!a && !b) {\n return 0\n }\n if (b == null) {\n return -1\n }\n if (a == null) {\n return 1\n }\n if (typeof a === 'string' || typeof b === 'string') {\n return String(a).localeCompare(String(b))\n }\n return a - b\n}\n\n/* String Utilities\n----------------------------------------------------------------------------------------------------------------------*/\n\nexport function padStart(val, len) { // doesn't work with total length more than 3\n let s = String(val)\n return '000'.substr(0, len - s.length) + s\n}\n\nexport function formatWithOrdinals(\n formatter: string | ((...formatterArgs: Args) => string),\n args: Args,\n fallbackText: string,\n) {\n if (typeof formatter === 'function') {\n return formatter(...args)\n }\n if (typeof formatter === 'string') { // non-blank string\n return args.reduce((str, arg, index) => (\n str.replace('$' + index, arg || '')\n ), formatter)\n }\n return fallbackText\n}\n\n/* Number Utilities\n----------------------------------------------------------------------------------------------------------------------*/\n\nexport function compareNumbers(a, b) { // for .sort()\n return a - b\n}\n\nexport function isInt(n) {\n return n % 1 === 0\n}\n\n/* Weird Utilities\n----------------------------------------------------------------------------------------------------------------------*/\n\nexport function firstDefined(...args) {\n for (let i = 0; i < args.length; i += 1) {\n if (args[i] !== undefined) {\n return args[i]\n }\n }\n return undefined\n}\n\n/* FC-specific DOM dimension stuff\n----------------------------------------------------------------------------------------------------------------------*/\n\nexport function computeSmallestCellWidth(cellEl: HTMLElement) {\n let allWidthEl = cellEl.querySelector('.fc-scrollgrid-shrink-frame')\n let contentWidthEl = cellEl.querySelector('.fc-scrollgrid-shrink-cushion')\n\n if (!allWidthEl) {\n throw new Error('needs fc-scrollgrid-shrink-frame className') // TODO: use const\n }\n if (!contentWidthEl) {\n throw new Error('needs fc-scrollgrid-shrink-cushion className')\n }\n\n return cellEl.getBoundingClientRect().width - allWidthEl.getBoundingClientRect().width + // the cell padding+border\n contentWidthEl.getBoundingClientRect().width\n}\n","import { Duration } from './duration'\n\nexport type DateMarker = Date\n\nexport const DAY_IDS = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat']\n\n// Adding\n\nexport function addWeeks(m: DateMarker, n: number) {\n let a = dateToUtcArray(m)\n a[2] += n * 7\n return arrayToUtcDate(a)\n}\n\nexport function addDays(m: DateMarker, n: number) {\n let a = dateToUtcArray(m)\n a[2] += n\n return arrayToUtcDate(a)\n}\n\nexport function addMs(m: DateMarker, n: number) {\n let a = dateToUtcArray(m)\n a[6] += n\n return arrayToUtcDate(a)\n}\n\n// Diffing (all return floats)\n// TODO: why not use ranges?\n\nexport function diffWeeks(m0, m1) {\n return diffDays(m0, m1) / 7\n}\n\nexport function diffDays(m0, m1) {\n return (m1.valueOf() - m0.valueOf()) / (1000 * 60 * 60 * 24)\n}\n\nexport function diffHours(m0, m1) {\n return (m1.valueOf() - m0.valueOf()) / (1000 * 60 * 60)\n}\n\nexport function diffMinutes(m0, m1) {\n return (m1.valueOf() - m0.valueOf()) / (1000 * 60)\n}\n\nexport function diffSeconds(m0, m1) {\n return (m1.valueOf() - m0.valueOf()) / 1000\n}\n\nexport function diffDayAndTime(m0: DateMarker, m1: DateMarker): Duration {\n let m0day = startOfDay(m0)\n let m1day = startOfDay(m1)\n\n return {\n years: 0,\n months: 0,\n days: Math.round(diffDays(m0day, m1day)),\n milliseconds: (m1.valueOf() - m1day.valueOf()) - (m0.valueOf() - m0day.valueOf()),\n }\n}\n\n// Diffing Whole Units\n\nexport function diffWholeWeeks(m0: DateMarker, m1: DateMarker): number {\n let d = diffWholeDays(m0, m1)\n\n if (d !== null && d % 7 === 0) {\n return d / 7\n }\n\n return null\n}\n\nexport function diffWholeDays(m0: DateMarker, m1: DateMarker): number {\n if (timeAsMs(m0) === timeAsMs(m1)) {\n return Math.round(diffDays(m0, m1))\n }\n return null\n}\n\n// Start-Of\n\nexport function startOfDay(m: DateMarker): DateMarker {\n return arrayToUtcDate([\n m.getUTCFullYear(),\n m.getUTCMonth(),\n m.getUTCDate(),\n ])\n}\n\nexport function startOfHour(m: DateMarker) {\n return arrayToUtcDate([\n m.getUTCFullYear(),\n m.getUTCMonth(),\n m.getUTCDate(),\n m.getUTCHours(),\n ])\n}\n\nexport function startOfMinute(m: DateMarker) {\n return arrayToUtcDate([\n m.getUTCFullYear(),\n m.getUTCMonth(),\n m.getUTCDate(),\n m.getUTCHours(),\n m.getUTCMinutes(),\n ])\n}\n\nexport function startOfSecond(m: DateMarker) {\n return arrayToUtcDate([\n m.getUTCFullYear(),\n m.getUTCMonth(),\n m.getUTCDate(),\n m.getUTCHours(),\n m.getUTCMinutes(),\n m.getUTCSeconds(),\n ])\n}\n\n// Week Computation\n\nexport function weekOfYear(marker, dow, doy) {\n let y = marker.getUTCFullYear()\n let w = weekOfGivenYear(marker, y, dow, doy)\n\n if (w < 1) {\n return weekOfGivenYear(marker, y - 1, dow, doy)\n }\n\n let nextW = weekOfGivenYear(marker, y + 1, dow, doy)\n if (nextW >= 1) {\n return Math.min(w, nextW)\n }\n\n return w\n}\n\nfunction weekOfGivenYear(marker, year, dow, doy) {\n let firstWeekStart = arrayToUtcDate([year, 0, 1 + firstWeekOffset(year, dow, doy)])\n let dayStart = startOfDay(marker)\n let days = Math.round(diffDays(firstWeekStart, dayStart))\n\n return Math.floor(days / 7) + 1 // zero-indexed\n}\n\n// start-of-first-week - start-of-year\nfunction firstWeekOffset(year, dow, doy) {\n // first-week day -- which january is always in the first week (4 for iso, 1 for other)\n let fwd = 7 + dow - doy\n\n // first-week day local weekday -- which local weekday is fwd\n let fwdlw = (7 + arrayToUtcDate([year, 0, fwd]).getUTCDay() - dow) % 7\n\n return -fwdlw + fwd - 1\n}\n\n// Array Conversion\n\nexport function dateToLocalArray(date) {\n return [\n date.getFullYear(),\n date.getMonth(),\n date.getDate(),\n date.getHours(),\n date.getMinutes(),\n date.getSeconds(),\n date.getMilliseconds(),\n ]\n}\n\nexport function arrayToLocalDate(a) {\n return new Date(\n a[0],\n a[1] || 0,\n a[2] == null ? 1 : a[2], // day of month\n a[3] || 0,\n a[4] || 0,\n a[5] || 0,\n )\n}\n\nexport function dateToUtcArray(date) {\n return [\n date.getUTCFullYear(),\n date.getUTCMonth(),\n date.getUTCDate(),\n date.getUTCHours(),\n date.getUTCMinutes(),\n date.getUTCSeconds(),\n date.getUTCMilliseconds(),\n ]\n}\n\nexport function arrayToUtcDate(a) {\n // according to web standards (and Safari), a month index is required.\n // massage if only given a year.\n if (a.length === 1) {\n a = a.concat([0])\n }\n\n return new Date(Date.UTC(...(a as [any, any])))\n}\n\n// Other Utils\n\nexport function isValidDate(m: DateMarker) {\n return !isNaN(m.valueOf())\n}\n\nexport function timeAsMs(m: DateMarker) {\n return m.getUTCHours() * 1000 * 60 * 60 +\n m.getUTCMinutes() * 1000 * 60 +\n m.getUTCSeconds() * 1000 +\n m.getUTCMilliseconds()\n}\n","import { DateRange } from '../datelib/date-range'\nimport { guid } from '../util/misc'\n\nexport interface EventInstance {\n instanceId: string\n defId: string\n range: DateRange\n forcedStartTzo: number | null\n forcedEndTzo: number | null\n}\n\nexport type EventInstanceHash = { [instanceId: string]: EventInstance }\n\nexport function createEventInstance(\n defId: string,\n range: DateRange,\n forcedStartTzo?: number,\n forcedEndTzo?: number,\n): EventInstance {\n return {\n instanceId: guid(),\n defId,\n range,\n forcedStartTzo: forcedStartTzo == null ? null : forcedStartTzo,\n forcedEndTzo: forcedEndTzo == null ? null : forcedEndTzo,\n }\n}\n","const { hasOwnProperty } = Object.prototype\n\n// Merges an array of objects into a single object.\n// The second argument allows for an array of property names who's object values will be merged together.\nexport function mergeProps(propObjs, complexPropsMap?): any {\n let dest = {}\n\n if (complexPropsMap) {\n for (let name in complexPropsMap) {\n let complexObjs = []\n\n // collect the trailing object values, stopping when a non-object is discovered\n for (let i = propObjs.length - 1; i >= 0; i -= 1) {\n let val = propObjs[i][name]\n\n if (typeof val === 'object' && val) { // non-null object\n complexObjs.unshift(val)\n } else if (val !== undefined) {\n dest[name] = val // if there were no objects, this value will be used\n break\n }\n }\n\n // if the trailing values were objects, use the merged value\n if (complexObjs.length) {\n dest[name] = mergeProps(complexObjs)\n }\n }\n }\n\n // copy values into the destination, going from last to first\n for (let i = propObjs.length - 1; i >= 0; i -= 1) {\n let props = propObjs[i]\n\n for (let name in props) {\n if (!(name in dest)) { // if already assigned by previous props or complex props, don't reassign\n dest[name] = props[name]\n }\n }\n }\n\n return dest\n}\n\nexport function filterHash(hash, func) {\n let filtered = {}\n\n for (let key in hash) {\n if (func(hash[key], key)) {\n filtered[key] = hash[key]\n }\n }\n\n return filtered\n}\n\nexport function mapHash(\n hash: { [key: string]: InputItem },\n func: (input: InputItem, key: string) => OutputItem,\n): { [key: string]: OutputItem } {\n let newHash = {}\n\n for (let key in hash) {\n newHash[key] = func(hash[key], key)\n }\n\n return newHash\n}\n\nexport function arrayToHash(a): { [key: string]: true } { // TODO: rename to strinArrayToHash or something\n let hash = {}\n\n for (let item of a) {\n hash[item] = true\n }\n\n return hash\n}\n\nexport function buildHashFromArray(a: Item[], func: (item: Item, index: number) => [ string, ItemRes ]) {\n let hash: { [key: string]: ItemRes } = {}\n\n for (let i = 0; i < a.length; i += 1) {\n let tuple = func(a[i], i)\n\n hash[tuple[0]] = tuple[1]\n }\n\n return hash\n}\n\nexport function hashValuesToArray(obj) { // can't use Object.values yet because of no IE support\n let a = []\n\n for (let key in obj) {\n a.push(obj[key])\n }\n\n return a\n}\n\nexport function isPropsEqual(obj0, obj1) { // TODO: merge with compareObjs\n if (obj0 === obj1) {\n return true\n }\n\n for (let key in obj0) {\n if (hasOwnProperty.call(obj0, key)) {\n if (!(key in obj1)) {\n return false\n }\n }\n }\n\n for (let key in obj1) {\n if (hasOwnProperty.call(obj1, key)) {\n if (obj0[key] !== obj1[key]) {\n return false\n }\n }\n }\n\n return true\n}\n\nexport function getUnequalProps(obj0, obj1) {\n let keys: string[] = []\n\n for (let key in obj0) {\n if (hasOwnProperty.call(obj0, key)) {\n if (!(key in obj1)) {\n keys.push(key)\n }\n }\n }\n\n for (let key in obj1) {\n if (hasOwnProperty.call(obj1, key)) {\n if (obj0[key] !== obj1[key]) {\n keys.push(key)\n }\n }\n }\n\n return keys\n}\n\nexport type EqualityFunc = (a: T, b: T) => boolean\nexport type EqualityThing = EqualityFunc | true\n\nexport type EqualityFuncs = { // not really just a \"func\" anymore\n [K in keyof ObjType]?: EqualityThing