{"version":3,"file":"EducationElementTable.chunk.a5971d32ee4ba024f421.js","mappings":"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","sources":["webpack://Kristiania.Web/./Features/Partials/Accordion/Events/AccordionOpened.ts","webpack://Kristiania.Web/./Features/Partials/Controls/Utils/asHtmlString.ts","webpack://Kristiania.Web/./Features/Partials/Link/AsyncLink/AsyncLink.tsx","webpack://Kristiania.Web/./Features/Partials/Link/AsyncLink/AsyncLink.module.css?813d","webpack://Kristiania.Web/./Features/Partials/Table/TableElementWrapper.tsx","webpack://Kristiania.Web/./Features/Partials/Table/EducationElement/EducationElementTable.tsx","webpack://Kristiania.Web/./Features/Partials/Table/EducationElement/EducationElementTable.module.css?7c75","webpack://Kristiania.Web/./Features/Utils/Hooks/useDebounce.ts","webpack://Kristiania.Web/./Features/Utils/Hooks/useVariableWithStableRef.ts"],"sourcesContent":["import { Event } from '~/Features/Messaging/types';\n\nexport class AccordionOpened extends Event {\n    public static readonly id = 'AccordionOpened';\n\n    constructor(public accordionId: string) {\n        super(AccordionOpened.id);\n    }\n}\n","import type { HtmlString } from '~/Features/Types/HtmlString.csharp';\n\nexport const asHtmlString = (content: string): HtmlString => ({ value: content });\n","import * as React from 'react';\nimport { ActivityIndicator } from '../../ActivityIndicator/ActivityIndicator';\nimport { Link } from '../Link';\nimport { useFetchData } from '~/Partials/FetchData/useFetchData';\nimport styles from './AsyncLink.module.css';\nimport type { AsyncLinkResponse } from './AsyncLinkResponse.csharp';\nimport type { AsyncLinkViewModel } from './AsyncLinkViewModel.csharp';\n\nexport interface AsyncLinkProps extends AsyncLinkViewModel {\n    timeout?: number;\n    className?: string;\n}\n\nexport const AsyncLink: React.FC<React.PropsWithChildren<AsyncLinkProps>> = ({\n    getUrl,\n    errorMessage,\n    noUrlMessage,\n    className,\n    timeout,\n    loadingMessage,\n    ...linkProps\n}) => {\n    const { loading, error, data } = useFetchData<AsyncLinkResponse[]>({\n        url: getUrl,\n        timeout,\n    });\n\n    const renderContent = () => {\n        if (loading) {\n            return (\n                <>\n                    <ActivityIndicator active={loading} modal={false} />\n                    <span>{loadingMessage}</span>\n                </>\n            );\n        }\n\n        if (error) {\n            return <span className={styles.Error}>{errorMessage}</span>;\n        }\n\n        if (data && data.length > 0) {\n            return (\n                <ul className={styles.List}>\n                    {data.map(link => (\n                        <li key={link.url}>\n                            <Link {...linkProps} href={link.url} label={link.label} />\n                        </li>\n                    ))}\n                </ul>\n            );\n        }\n\n        return <span>{noUrlMessage}</span>;\n    };\n\n    return <div className={className}>{renderContent()}</div>;\n};\n","// extracted by mini-css-extract-plugin\nexport default {\"List\":\"LdU5cSEh0bG36a1akKP9\",\"Error\":\"GCiDCn2ld9VAJBDvVLnv\"};","import * as React from 'react';\n\nexport interface TableElementWrapperViewModel {\n    description: React.ReactChild;\n    value: React.ReactChild | React.ReactChild[];\n}\n\nexport const TableElementWrapper: React.FC<React.PropsWithChildren<TableElementWrapperViewModel>> = props => {\n    const { description, value } = props;\n\n    return (\n        <tr>\n            <th>\n                <div>{description}</div>\n            </th>\n            <td>{value}</td>\n        </tr>\n    );\n};\n","import * as React from 'react';\nimport { Button } from '../../Button/Button';\nimport { ButtonType } from '../../Button/ButtonType.csharp';\nimport { HtmlDiv } from '../../Controls/HtmlDiv';\nimport { AsyncLink } from '../../Link/AsyncLink/AsyncLink';\nimport { Link } from '../../Link/Link';\nimport type { IconName } from '../../SvgIcon/SvgIcon';\nimport { SvgIcon } from '../../SvgIcon/SvgIcon';\nimport { smoothScrollToSectionById } from '../../Utils/utils';\nimport { Table } from '../Table';\nimport { TableElementWrapper } from '../TableElementWrapper';\nimport { MessageBroker } from '~/Features/Messaging/MessageBroker';\nimport { AccordionOpened } from '~/Partials/Accordion/Events/AccordionOpened';\nimport { asHtmlString } from '~/Partials/Controls/Utils/asHtmlString';\nimport styles from './EducationElementTable.module.css';\nimport type { EducationElementTableItemValueViewModel } from './EducationElementTableItemValueViewModel.csharp';\nimport type { EducationElementTableViewModel } from './EducationElementTableViewModel.csharp';\n\nexport const EducationElementTable: React.FC<React.PropsWithChildren<EducationElementTableViewModel>> = props => {\n    const { tableItems, educationElementInfoUrlLink, translations } = props;\n\n    const handleAnchorClick = (anchorId: string) => {\n        smoothScrollToSectionById(anchorId);\n        MessageBroker.publish(new AccordionOpened(anchorId));\n    };\n\n    const renderTableItemValue = (item: EducationElementTableItemValueViewModel) => {\n        if (item.link) {\n            return item.isAnchor ? (\n                <Button\n                    onClick={() => !!item.link && handleAnchorClick(item.link.href)}\n                    className={styles.AnchorButton}\n                    type={ButtonType.Clear}\n                >\n                    {item.link.label}\n                </Button>\n            ) : (\n                <Link href={item.link.href} label={item.link.label} external={item.link.external} />\n            );\n        }\n\n        return <HtmlDiv html={item.value || asHtmlString('')} className={styles.TextValue} />;\n    };\n\n    const renderDescription = (iconName: IconName, label: string) => (\n        <div>\n            <SvgIcon iconName={iconName} />\n            <span>{label}</span>\n        </div>\n    );\n\n    return (\n        <Table\n            className={styles.EducationElementTable}\n            footer={\n                <>\n                    {translations && translations.footerText && (\n                        <tr>\n                            <td className={styles.Footer} colSpan={2}>\n                                {translations.footerText}\n                            </td>\n                        </tr>\n                    )}\n                </>\n            }\n        >\n            <>\n                {!!tableItems &&\n                    tableItems.map(item => (\n                        <TableElementWrapper\n                            key={item.label}\n                            description={renderDescription(item.icon, item.label)}\n                            value={item.values.map((tableValue, key) => (\n                                <React.Fragment key={`${tableValue.value}-${key}`}>\n                                    {!!tableValue.image && (\n                                        <img src={tableValue.image.url} alt={tableValue.image.alt} />\n                                    )}\n                                    {renderTableItemValue(tableValue)}\n                                </React.Fragment>\n                            ))}\n                        />\n                    ))}\n                {!!educationElementInfoUrlLink && (\n                    <TableElementWrapper\n                        description={renderDescription('text', translations.educationElementDescription)}\n                        value={<AsyncLink {...educationElementInfoUrlLink} />}\n                    />\n                )}\n            </>\n        </Table>\n    );\n};\n","// extracted by mini-css-extract-plugin\nexport default {\"EducationElementTable\":\"nWIPSJlVRmxAXAoCQOEo\",\"TextValue\":\"NszytxQg88Mzv7VZw5OA\",\"AnchorButton\":\"ssTpj2oSoQlkfXlg6HtB\",\"Footer\":\"U4AtThq0g2HLbzoHET2Q\"};","import debounce from 'lodash/debounce';\nimport * as React from 'react';\nimport { useVariableWithStableRef } from './useVariableWithStableRef';\n\nexport function useDebounce(callback: () => void, debounceTime: number) {\n    const handlerRef = useVariableWithStableRef(callback);\n\n    return React.useCallback(\n        debounce(() => handlerRef.current?.(), debounceTime),\n        [handlerRef]\n    );\n}\n","import { useEffect, useRef } from 'react';\n\nexport function useVariableWithStableRef<T>(variable: T) {\n    const variableRef = useRef<T>(variable);\n\n    useEffect(() => {\n        variableRef.current = variable;\n    }, [variable]);\n\n    return variableRef;\n}\n"],"names":["AccordionOpened","Event","constructor","accordionId","super","id","asHtmlString","content","value","AsyncLink","_ref","getUrl","errorMessage","noUrlMessage","className","timeout","loadingMessage","linkProps","_objectWithoutProperties","_excluded","loading","error","data","useFetchData","url","React","ActivityIndicator","active","modal","length","map","link","key","Link","_extends","href","label","TableElementWrapper","props","description","EducationElementTable","tableItems","educationElementInfoUrlLink","translations","renderDescription","iconName","SvgIcon","Table","footer","footerText","colSpan","item","icon","values","tableValue","concat","image","src","alt","isAnchor","Button","onClick","anchorId","smoothScrollToSectionById","MessageBroker","publish","type","ButtonType","Clear","external","HtmlDiv","html","renderTableItemValue","educationElementDescription","useDebounce","callback","debounceTime","handlerRef","useVariableWithStableRef","debounce","_handlerRef$current","current","call","variable","variableRef","useRef","useEffect"],"sourceRoot":""}