@telia-ace/knowledge-widget-components-notification-row 1.0.17 → 1.0.20

package/dist/index.js

@@ -15,7 +15,7 @@ import { DataType as D } from "@telia-ace/knowledge-widget-types-grid";
 import { createReactComponent as O } from "@telia-ace/knowledge-widget-ui";
 const S = (t) => {
   const { events: e } = t.get("$widget"), [i, u] = x(e);
-  return O(t, "notification-row", import("./notification-row.061d717b.js"), (r) => {
+  return O(t, "notification-row", import("./notification-row.41523207.js"), (r) => {
     const c = (a) => {
       r.writeProperties(d(h({}, r.properties()), {
         loading: !0,

package/dist/{notification-row.061d717b.js → notification-row.41523207.js}

@@ -131,10 +131,7 @@ const z = "closed-notifications", se = {
   }));
 }, j = c.div`
     ${ae}
-    padding: ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.normal;
-}} ${(e) => {
+    padding: ${(e) => e.theme.sizes.normal} ${(e) => {
   var t;
   return ((t = e.theme.sizes) == null ? void 0 : t.cardinal) * 12;
 }}px;
@@ -270,8 +267,7 @@ const z = "closed-notifications", se = {
     padding: ${(e) => {
   var t, a;
   return `calc(${(t = e.theme.sizes) == null ? void 0 : t.small}/2) ${(a = e.theme.sizes) == null ? void 0 : a.small}`;
-}};
-    svg {
+}} svg {
         vertical-align: middle;
         line,
         path {
@@ -292,4 +288,4 @@ c.div`
 export {
   ue as default
 };
-//# sourceMappingURL=notification-row.061d717b.js.map
+//# sourceMappingURL=notification-row.41523207.js.map

package/dist/notification-row.41523207.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-row.41523207.js","sources":["../src/notification-row.tsx"],"sourcesContent":["import {\r\n    borderTabStyle,\r\n    Button,\r\n    createEmptyComponent,\r\n    genericHtml,\r\n    Html,\r\n    linkTabStyle,\r\n    SymbolBadge,\r\n    useContainer,\r\n    useProperties,\r\n} from '@telia-ace/knowledge-widget-ui';\r\nimport {\r\n    createStorageWriter,\r\n    readStorage,\r\n    StorageCategory,\r\n    StorageMedium,\r\n    StorageWriter,\r\n} from '@telia-ace/widget-services';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React, { useEffect, useState } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { NotificationRowComponentProps } from './notification-row-component';\r\n\r\ntype Props = {\r\n    className: string;\r\n};\r\n\r\nconst STORAGE_KEY = 'closed-notifications';\r\n\r\nconst infocusableHtml = {\r\n    transform: {\r\n        a: ({ children, ...props }: React.ComponentProps<'a'>) => (\r\n            <a {...props} tabIndex={-1}>\r\n                {children}\r\n            </a>\r\n        ),\r\n    },\r\n};\r\n\r\nconst NotificationRow: React.SFC<Props> = ({ className, ...other }) => {\r\n    const {\r\n        types = [],\r\n        allowPaging = true,\r\n        notifications = [],\r\n        expandable = false,\r\n        closeAriaLabel = '',\r\n        pageNextAriaLabel = '',\r\n        pagePreviousAriaLabel = '',\r\n        expandAriaLabel = '',\r\n    } = useProperties<NotificationRowComponentProps>();\r\n    const [expanded, setExpanded] = useState(false);\r\n    const [closed, setClosed] = useState<string[]>([]);\r\n    const [index, setIndex] = useState(0);\r\n\r\n    const container = useContainer();\r\n    const [write, setWriter] = useState<StorageWriter | undefined>();\r\n\r\n    useEffect(() => {\r\n        if (container) {\r\n            readStorage<string[]>(container, STORAGE_KEY, StorageMedium.Session).then(\r\n                (closed = []) => setClosed(closed)\r\n            );\r\n\r\n            createStorageWriter(container, STORAGE_KEY, StorageCategory.Functional).then((writer) =>\r\n                setWriter(() => writer)\r\n            );\r\n        }\r\n    }, [container]);\r\n\r\n    useEffect(() => {\r\n        if (container) {\r\n            readStorage<string[]>(container, STORAGE_KEY, StorageMedium.Session).then(\r\n                (storedClosed = []) => {\r\n                    closed.forEach(\r\n                        (id) => storedClosed.indexOf(id) === -1 && storedClosed.push(id)\r\n                    );\r\n                    if (write) {\r\n                        write(storedClosed);\r\n                    }\r\n                }\r\n            );\r\n        }\r\n    }, [closed, container, write]);\r\n\r\n    const filtered = notifications.filter(({ id }) => closed.indexOf(id) === -1);\r\n\r\n    const { length } = filtered;\r\n\r\n    if (!filtered.length) {\r\n        return createEmptyComponent(container, {\r\n            ...other,\r\n            className: appendClassNames(className, 'humany-notification-row'),\r\n        });\r\n    }\r\n\r\n    if (allowPaging) {\r\n        const notification = filtered[index] || filtered[index + 1] || filtered[index - 1];\r\n\r\n        if (!notification) {\r\n            return createEmptyComponent(container, {\r\n                ...other,\r\n                className: appendClassNames(className, 'humany-notification-row'),\r\n            });\r\n        }\r\n\r\n        const { id, body } = notification || {};\r\n        const toggleExpand = () => setExpanded(!expanded);\r\n\r\n        return (\r\n            <Wrapper\r\n                {...other}\r\n                aria-expanded={expandable ? expanded : true}\r\n                aria-label={expandAriaLabel}\r\n                tabIndex={expandable ? 0 : -1}\r\n                className={appendClassNames(className, 'humany-notification-row')}\r\n                data-pageable={length > 1}\r\n                data-types={types}\r\n                data-allow-paging={allowPaging}\r\n                data-expandable={expandable}\r\n                onKeyDown={(e: React.KeyboardEvent) => {\r\n                    if (e.key === 'Enter') {\r\n                        toggleExpand();\r\n                    }\r\n                }}\r\n                onClick={toggleExpand}\r\n            >\r\n                <CloseButton\r\n                    aria-label={closeAriaLabel}\r\n                    onClick={() => {\r\n                        setIndex(filtered.indexOf(notification));\r\n                        setClosed([...closed, id]);\r\n                    }}\r\n                >\r\n                    <SymbolBadge symbol={{ type: 'Svg', content: 'close' }} />\r\n                </CloseButton>\r\n                <StyledHtml\r\n                    htmlParseInstruction={!expandable || expanded ? undefined : infocusableHtml}\r\n                    data-pageable={length > 1}\r\n                    data-notification={id}\r\n                    data-expandable={expandable}\r\n                    data-expanded={expanded}\r\n                    html={body}\r\n                />\r\n                {length > 1 && (\r\n                    <Pager>\r\n                        <StyledButton\r\n                            aria-label={pagePreviousAriaLabel}\r\n                            data-disabled={index === 0}\r\n                            onClick={(e) => {\r\n                                e.stopPropagation();\r\n                                if (index > 0) {\r\n                                    setIndex(index - 1);\r\n                                }\r\n                            }}\r\n                        >\r\n                            <StyledSymbolBadge\r\n                                size={10}\r\n                                symbol={{ type: 'Svg', content: 'caret-left' }}\r\n                            />\r\n                        </StyledButton>\r\n                        <span>\r\n                            {index + 1}/{length}\r\n                        </span>\r\n                        <StyledButton\r\n                            aria-label={pageNextAriaLabel}\r\n                            data-disabled={index + 1 >= length}\r\n                            onClick={(e) => {\r\n                                e.stopPropagation();\r\n                                if (index < length - 1) {\r\n                                    setIndex(index + 1);\r\n                                }\r\n                            }}\r\n                        >\r\n                            <StyledSymbolBadge\r\n                                size={10}\r\n                                symbol={{ type: 'Svg', content: 'caret-right' }}\r\n                            />\r\n                        </StyledButton>\r\n                    </Pager>\r\n                )}\r\n            </Wrapper>\r\n        );\r\n    }\r\n\r\n    return (\r\n        <Wrapper\r\n            {...other}\r\n            className={appendClassNames(className, 'humany-notification-row')}\r\n            data-pageable={false}\r\n            data-types={types}\r\n            data-allow-paging={false}\r\n        >\r\n            {filtered.map((notification) => {\r\n                if (!notification) {\r\n                    return null;\r\n                }\r\n\r\n                const { id, body } = notification;\r\n\r\n                return (\r\n                    <StyledHtml\r\n                        key={id}\r\n                        data-pageable={false}\r\n                        data-expandable={expandable}\r\n                        data-expanded={expanded}\r\n                        data-notification={id}\r\n                        html={body}\r\n                    />\r\n                );\r\n            })}\r\n        </Wrapper>\r\n    );\r\n};\r\n\r\nconst Wrapper = styled.div<{ 'data-types': string[]; 'data-allow-paging': boolean } & any>`\r\n    ${genericHtml}\r\n    padding: ${(p) => p.theme.sizes.normal} ${(p) => p.theme.sizes?.cardinal * 12}px;\r\n    background-color: ${(p) => {\r\n        if (p['data-types'].length) {\r\n            if (p['data-types'].indexOf('top') > -1) {\r\n                return p.theme.colors?.warning;\r\n            }\r\n            if (p['data-types'].indexOf('bottom') > -1) {\r\n                return 'transparent';\r\n            }\r\n\r\n            return p.theme.colors?.primary;\r\n        }\r\n        return p.theme.colors?.warning;\r\n    }};\r\n    color: ${(p) => p.theme.colors?.text};\r\n    border-radius: ${(p) => p.theme.borderRadius};\r\n    text-align: center;\r\n    display: flex;\r\n    flex-direction: column;\r\n    position: relative;\r\n    cursor: ${(p) => (p['data-expandable'] ? 'pointer' : 'default')};\r\n    overflow: hidden;\r\n\r\n    i {\r\n        color: ${(p) => p.theme.colors?.text};\r\n    }\r\n\r\n    a {\r\n        color: ${(p) => p.theme.colors?.link};\r\n        &:focus {\r\n            ${(p) => p.theme.accessibility?.isTabbing && linkTabStyle}\r\n        }\r\n    }\r\n\r\n    ${(p) =>\r\n        !p['data-allow-paging'] &&\r\n        css`\r\n            flex-wrap: wrap;\r\n\r\n            > div {\r\n                min-width: 100%;\r\n                margin: ${p.theme.sizes?.cardinal * 2}px;\r\n            }\r\n        `};\r\n\r\n    ${(p) =>\r\n        p.theme.accessibility?.isTabbing &&\r\n        css`\r\n            &:focus {\r\n                ${StyledHtml} {\r\n                    ${borderTabStyle}\r\n                }\r\n            }\r\n        `}\r\n`;\r\n\r\nconst StyledHtml = styled(Html)<{\r\n    'data-pageable': boolean;\r\n    'data-expandable': boolean;\r\n    'data-expanded': boolean;\r\n}>`\r\n    flex: 1;\r\n    font-size: ${(p) => p.theme.fonts?.normal};\r\n    line-height: 1.6em;\r\n    font-weight: 300;\r\n\r\n    ${(p) =>\r\n        p['data-expandable'] &&\r\n        !p['data-expanded'] &&\r\n        css`\r\n            max-width: 100%;\r\n\r\n            p {\r\n                display: none;\r\n                &:first-child {\r\n                    display: block;\r\n                    margin-bottom: 0;\r\n                    white-space: nowrap;\r\n                    overflow: hidden;\r\n                    text-overflow: ellipsis;\r\n                }\r\n            }\r\n        `}\r\n`;\r\n\r\nconst Pager = styled.div`\r\n    text-align: center;\r\n    width: 100%;\r\n    span {\r\n        font-size: ${(p) => p.theme.fonts?.small};\r\n        display: inline-block;\r\n        width: 30px;\r\n        text-align: center;\r\n    }\r\n`;\r\n\r\nconst StyledButton = styled(Button)<{ 'data-disabled'?: boolean }>`\r\n    background-color: transparent;\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: opacity 200ms ease-out;\r\n    justify-self: flex-end;\r\n    align-self: flex-start;\r\n    padding: ${(p) => p.theme.sizes?.small} svg {\r\n        display: block;\r\n    }\r\n\r\n    &:focus {\r\n        ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle}\r\n    }\r\n\r\n    ${(p) =>\r\n        p['data-disabled']\r\n            ? css`\r\n                  opacity: 0.8;\r\n              `\r\n            : css`\r\n                  @media (hover) {\r\n                      &:hover {\r\n                          opacity: 0.5;\r\n                      }\r\n                  }\r\n              `}\r\n`;\r\n\r\nconst CloseButton = styled(StyledButton)`\r\n    position: absolute;\r\n    top: 7.5px;\r\n    right: 7.5px;\r\n    width: 25px;\r\n    height: auto;\r\n    padding: ${(p) => `calc(${p.theme.sizes?.small}/2) ${p.theme.sizes?.small}`} svg {\r\n        vertical-align: middle;\r\n        line,\r\n        path {\r\n            stroke: ${(p) => p.theme.colors?.text};\r\n        }\r\n    }\r\n`;\r\n\r\nconst StyledSymbolBadge = styled(SymbolBadge)`\r\n    line {\r\n        stroke: #ffffff;\r\n    }\r\n`;\r\n\r\nconst Empty = styled.div`\r\n    display: none;\r\n`;\r\n\r\nexport default NotificationRow;\r\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,16 +1,13 @@
 {
     "name": "@telia-ace/knowledge-widget-components-notification-row",
-    "version": "1.0.17",
+    "version": "1.0.20",
     "description": "Notification row component for ACE Knowledge Widgets.",
     "license": "SEE LICENSE IN LICENSE.txt",
     "author": "Telia Company AB",
     "keywords": [
         "telia"
     ],
-    "exports": {
-        "development": "./src/index.ts",
-        "default": "./dist/index.js"
-    },
+    "main": "dist/index.js",
     "type": "module",
     "types": "dist/index.d.ts",
     "files": [
@@ -28,10 +25,10 @@
     },
     "sideEffects": false,
     "dependencies": {
-        "@telia-ace/knowledge-widget-core": "^1.0.14",
-        "@telia-ace/knowledge-widget-types-grid": "^1.0.23",
-        "@telia-ace/knowledge-widget-ui": "^1.0.20",
-        "@telia-ace/widget-services": "^1.0.11",
+        "@telia-ace/knowledge-widget-core": "^1.0.17",
+        "@telia-ace/knowledge-widget-types-grid": "^1.0.27",
+        "@telia-ace/knowledge-widget-ui": "^1.0.23",
+        "@telia-ace/widget-services": "^1.0.13",
         "@telia-ace/widget-utilities": "^1.0.2",
         "@webprovisions/platform": "^1.1.2"
     },
@@ -45,5 +42,5 @@
         "@types/react-dom": "^16.8.0",
         "@types/styled-components": "^5.1.7"
     },
-    "gitHead": "ccf2f3c55b373a7e23227e155d7573259abfacb1"
+    "gitHead": "438c6508c4df3f8ec161e2246fe0888e7f4c5fe0"
 }

package/dist/notification-row.061d717b.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"notification-row.061d717b.js","sources":["../src/notification-row.tsx"],"sourcesContent":["import {\r\n    borderTabStyle,\r\n    Button,\r\n    createEmptyComponent,\r\n    genericHtml,\r\n    Html,\r\n    linkTabStyle,\r\n    SymbolBadge,\r\n    useContainer,\r\n    useProperties,\r\n} from '@telia-ace/knowledge-widget-ui';\r\nimport {\r\n    createStorageWriter,\r\n    readStorage,\r\n    StorageCategory,\r\n    StorageMedium,\r\n    StorageWriter,\r\n} from '@telia-ace/widget-services';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React, { useEffect, useState } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { NotificationRowComponentProps } from './notification-row-component';\r\n\r\ntype Props = {\r\n    className: string;\r\n};\r\n\r\nconst STORAGE_KEY = 'closed-notifications';\r\n\r\nconst infocusableHtml = {\r\n    transform: {\r\n        a: ({ children, ...props }: React.ComponentProps<'a'>) => (\r\n            <a {...props} tabIndex={-1}>\r\n                {children}\r\n            </a>\r\n        ),\r\n    },\r\n};\r\n\r\nconst NotificationRow: React.SFC<Props> = ({ className, ...other }) => {\r\n    const {\r\n        types = [],\r\n        allowPaging = true,\r\n        notifications = [],\r\n        expandable = false,\r\n        closeAriaLabel = '',\r\n        pageNextAriaLabel = '',\r\n        pagePreviousAriaLabel = '',\r\n        expandAriaLabel = '',\r\n    } = useProperties<NotificationRowComponentProps>();\r\n    const [expanded, setExpanded] = useState(false);\r\n    const [closed, setClosed] = useState<string[]>([]);\r\n    const [index, setIndex] = useState(0);\r\n\r\n    const container = useContainer();\r\n    const [write, setWriter] = useState<StorageWriter | undefined>();\r\n\r\n    useEffect(() => {\r\n        if (container) {\r\n            readStorage<string[]>(container, STORAGE_KEY, StorageMedium.Session).then(\r\n                (closed = []) => setClosed(closed)\r\n            );\r\n\r\n            createStorageWriter(container, STORAGE_KEY, StorageCategory.Functional).then((writer) =>\r\n                setWriter(() => writer)\r\n            );\r\n        }\r\n    }, [container]);\r\n\r\n    useEffect(() => {\r\n        if (container) {\r\n            readStorage<string[]>(container, STORAGE_KEY, StorageMedium.Session).then(\r\n                (storedClosed = []) => {\r\n                    closed.forEach(\r\n                        (id) => storedClosed.indexOf(id) === -1 && storedClosed.push(id)\r\n                    );\r\n                    if (write) {\r\n                        write(storedClosed);\r\n                    }\r\n                }\r\n            );\r\n        }\r\n    }, [closed, container, write]);\r\n\r\n    const filtered = notifications.filter(({ id }) => closed.indexOf(id) === -1);\r\n\r\n    const { length } = filtered;\r\n\r\n    if (!filtered.length) {\r\n        return createEmptyComponent(container, {\r\n            ...other,\r\n            className: appendClassNames(className, 'humany-notification-row'),\r\n        });\r\n    }\r\n\r\n    if (allowPaging) {\r\n        const notification = filtered[index] || filtered[index + 1] || filtered[index - 1];\r\n\r\n        if (!notification) {\r\n            return createEmptyComponent(container, {\r\n                ...other,\r\n                className: appendClassNames(className, 'humany-notification-row'),\r\n            });\r\n        }\r\n\r\n        const { id, body } = notification || {};\r\n        const toggleExpand = () => setExpanded(!expanded);\r\n\r\n        return (\r\n            <Wrapper\r\n                {...other}\r\n                aria-expanded={expandable ? expanded : true}\r\n                aria-label={expandAriaLabel}\r\n                tabIndex={expandable ? 0 : -1}\r\n                className={appendClassNames(className, 'humany-notification-row')}\r\n                data-pageable={length > 1}\r\n                data-types={types}\r\n                data-allow-paging={allowPaging}\r\n                data-expandable={expandable}\r\n                onKeyDown={(e: React.KeyboardEvent) => {\r\n                    if (e.key === 'Enter') {\r\n                        toggleExpand();\r\n                    }\r\n                }}\r\n                onClick={toggleExpand}\r\n            >\r\n                <CloseButton\r\n                    aria-label={closeAriaLabel}\r\n                    onClick={() => {\r\n                        setIndex(filtered.indexOf(notification));\r\n                        setClosed([...closed, id]);\r\n                    }}\r\n                >\r\n                    <SymbolBadge symbol={{ type: 'Svg', content: 'close' }} />\r\n                </CloseButton>\r\n                <StyledHtml\r\n                    htmlParseInstruction={!expandable || expanded ? undefined : infocusableHtml}\r\n                    data-pageable={length > 1}\r\n                    data-notification={id}\r\n                    data-expandable={expandable}\r\n                    data-expanded={expanded}\r\n                    html={body}\r\n                />\r\n                {length > 1 && (\r\n                    <Pager>\r\n                        <StyledButton\r\n                            aria-label={pagePreviousAriaLabel}\r\n                            data-disabled={index === 0}\r\n                            onClick={(e) => {\r\n                                e.stopPropagation();\r\n                                if (index > 0) {\r\n                                    setIndex(index - 1);\r\n                                }\r\n                            }}\r\n                        >\r\n                            <StyledSymbolBadge\r\n                                size={10}\r\n                                symbol={{ type: 'Svg', content: 'caret-left' }}\r\n                            />\r\n                        </StyledButton>\r\n                        <span>\r\n                            {index + 1}/{length}\r\n                        </span>\r\n                        <StyledButton\r\n                            aria-label={pageNextAriaLabel}\r\n                            data-disabled={index + 1 >= length}\r\n                            onClick={(e) => {\r\n                                e.stopPropagation();\r\n                                if (index < length - 1) {\r\n                                    setIndex(index + 1);\r\n                                }\r\n                            }}\r\n                        >\r\n                            <StyledSymbolBadge\r\n                                size={10}\r\n                                symbol={{ type: 'Svg', content: 'caret-right' }}\r\n                            />\r\n                        </StyledButton>\r\n                    </Pager>\r\n                )}\r\n            </Wrapper>\r\n        );\r\n    }\r\n\r\n    return (\r\n        <Wrapper\r\n            {...other}\r\n            className={appendClassNames(className, 'humany-notification-row')}\r\n            data-pageable={false}\r\n            data-types={types}\r\n            data-allow-paging={false}\r\n        >\r\n            {filtered.map((notification) => {\r\n                if (!notification) {\r\n                    return null;\r\n                }\r\n\r\n                const { id, body } = notification;\r\n\r\n                return (\r\n                    <StyledHtml\r\n                        key={id}\r\n                        data-pageable={false}\r\n                        data-expandable={expandable}\r\n                        data-expanded={expanded}\r\n                        data-notification={id}\r\n                        html={body}\r\n                    />\r\n                );\r\n            })}\r\n        </Wrapper>\r\n    );\r\n};\r\n\r\nconst Wrapper = styled.div<{ 'data-types': string[]; 'data-allow-paging': boolean } & any>`\r\n    ${genericHtml}\r\n    padding: ${(p) => p.theme.sizes?.normal} ${(p) => p.theme.sizes?.cardinal * 12}px;\r\n    background-color: ${(p) => {\r\n        if (p['data-types'].length) {\r\n            if (p['data-types'].indexOf('top') > -1) {\r\n                return p.theme.colors?.warning;\r\n            }\r\n            if (p['data-types'].indexOf('bottom') > -1) {\r\n                return 'transparent';\r\n            }\r\n\r\n            return p.theme.colors?.primary;\r\n        }\r\n        return p.theme.colors?.warning;\r\n    }};\r\n    color: ${(p) => p.theme.colors?.text};\r\n    border-radius: ${(p) => p.theme.borderRadius};\r\n    text-align: center;\r\n    display: flex;\r\n    flex-direction: column;\r\n    position: relative;\r\n    cursor: ${(p) => (p['data-expandable'] ? 'pointer' : 'default')};\r\n    overflow: hidden;\r\n\r\n    i {\r\n        color: ${(p) => p.theme.colors?.text};\r\n    }\r\n\r\n    a {\r\n        color: ${(p) => p.theme.colors?.link};\r\n        &:focus {\r\n            ${(p) => p.theme.accessibility?.isTabbing && linkTabStyle}\r\n        }\r\n    }\r\n\r\n    ${(p) =>\r\n        !p['data-allow-paging'] &&\r\n        css`\r\n            flex-wrap: wrap;\r\n\r\n            > div {\r\n                min-width: 100%;\r\n                margin: ${p.theme.sizes?.cardinal * 2}px;\r\n            }\r\n        `};\r\n\r\n    ${(p) =>\r\n        p.theme.accessibility?.isTabbing &&\r\n        css`\r\n            &:focus {\r\n                ${StyledHtml} {\r\n                    ${borderTabStyle}\r\n                }\r\n            }\r\n        `}\r\n`;\r\n\r\nconst StyledHtml = styled(Html)<{\r\n    'data-pageable': boolean;\r\n    'data-expandable': boolean;\r\n    'data-expanded': boolean;\r\n}>`\r\n    flex: 1;\r\n    font-size: ${(p) => p.theme.fonts?.normal};\r\n    line-height: 1.6em;\r\n    font-weight: 300;\r\n\r\n    ${(p) =>\r\n        p['data-expandable'] &&\r\n        !p['data-expanded'] &&\r\n        css`\r\n            max-width: 100%;\r\n\r\n            p {\r\n                display: none;\r\n                &:first-child {\r\n                    display: block;\r\n                    margin-bottom: 0;\r\n                    white-space: nowrap;\r\n                    overflow: hidden;\r\n                    text-overflow: ellipsis;\r\n                }\r\n            }\r\n        `}\r\n`;\r\n\r\nconst Pager = styled.div`\r\n    text-align: center;\r\n    width: 100%;\r\n    span {\r\n        font-size: ${(p) => p.theme.fonts?.small};\r\n        display: inline-block;\r\n        width: 30px;\r\n        text-align: center;\r\n    }\r\n`;\r\n\r\nconst StyledButton = styled(Button)<{ 'data-disabled'?: boolean }>`\r\n    background-color: transparent;\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: opacity 200ms ease-out;\r\n    justify-self: flex-end;\r\n    align-self: flex-start;\r\n    padding: ${(p) => p.theme.sizes?.small} svg {\r\n        display: block;\r\n    }\r\n\r\n    &:focus {\r\n        ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle}\r\n    }\r\n\r\n    ${(p) =>\r\n        p['data-disabled']\r\n            ? css`\r\n                  opacity: 0.8;\r\n              `\r\n            : css`\r\n                  @media (hover) {\r\n                      &:hover {\r\n                          opacity: 0.5;\r\n                      }\r\n                  }\r\n              `}\r\n`;\r\n\r\nconst CloseButton = styled(StyledButton)`\r\n    position: absolute;\r\n    top: 7.5px;\r\n    right: 7.5px;\r\n    width: 25px;\r\n    height: auto;\r\n    padding: ${(p) => `calc(${p.theme.sizes?.small}/2) ${p.theme.sizes?.small}`};\r\n    svg {\r\n        vertical-align: middle;\r\n        line,\r\n        path {\r\n            stroke: ${(p) => p.theme.colors?.text};\r\n        }\r\n    }\r\n`;\r\n\r\nconst StyledSymbolBadge = styled(SymbolBadge)`\r\n    line {\r\n        stroke: #ffffff;\r\n    }\r\n`;\r\n\r\nconst Empty = styled.div`\r\n    display: none;\r\n`;\r\n\r\nexport default NotificationRow;\r\n"],"names":[],"mappings":"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"}