@scottish-government/designsystem-react 0.5.1 → 0.7.0

package/dist/components/SummaryList/SummaryList.jsx

@@ -0,0 +1,75 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Item = exports.Action = exports.Answer = void 0;
+const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWrapper"));
+const WrapperTag_1 = __importDefault(require("../../common/WrapperTag"));
+function escapedNewLineToLineBreakTag(string) {
+    if (typeof string === 'string') {
+        // @ts-ignore
+        return string.split('\n').map((item, index) => {
+            return (index === 0) ? item : [<br key={index}/>, item];
+        });
+    }
+}
+function convertToSlug(string) {
+    return string.toLowerCase()
+        .replace(/[^\w ]+/g, "")
+        .replace(/ +/g, "-");
+}
+const Answer = ({ value }) => {
+    const processedValue = escapedNewLineToLineBreakTag(value.toString());
+    return (<q className="ds_summary-list__answer">{processedValue}</q>);
+};
+exports.Answer = Answer;
+const Action = ({ describedby, href, onclick, title, }) => {
+    let tagName = 'button';
+    if (href) {
+        tagName = 'a';
+    }
+    return (<WrapperTag_1.default aria-describedby={describedby} className="ds_link" href={href} onClick={onclick} tagName={tagName} type={tagName === 'button' ? 'button' : undefined}>
+            {title}
+        </WrapperTag_1.default>);
+};
+exports.Action = Action;
+const Item = ({ actions, index = 1, title, value }) => {
+    let values = [];
+    if (Array.isArray(value)) {
+        values = value;
+    }
+    else {
+        values = [value || ''];
+    }
+    const describedById = `q${index + 1}-${convertToSlug(title)}`;
+    return (<li className="ds_summary-list__item">
+            <span className="ds_summary-list__key" id={describedById}>{title}</span>
+            <span className="ds_summary-list__value">
+                <ConditionalWrapper_1.default condition={values.length > 1} wrapper={(children) => <ul className="ds_no-bullets">{children}</ul>}>
+                    {values && values.map((value, index) => (<ConditionalWrapper_1.default condition={values.length > 1} wrapper={(children) => <li>{children}</li>} key={'answer' + index}>
+                            <exports.Answer value={value}/>
+                        </ConditionalWrapper_1.default>))}
+                </ConditionalWrapper_1.default>
+            </span>
+            {actions &&
+            <div className="ds_summary-list__actions">
+                    {actions && actions.map((action, index) => (<exports.Action describedby={describedById} href={action.href} onclick={action.onclick} title={action.title} key={'summarylistaction' + index}/>))}
+                </div>}
+        </li>);
+};
+exports.Item = Item;
+const SummaryList = ({ className, items, noBorder, ...props }) => {
+    return (<ol className={[
+            'ds_summary-list',
+            noBorder && 'ds_summary-list--no-border',
+            className
+        ].join(' ')} {...props}>
+            {items && items.map((item, index) => (<exports.Item actions={item.actions} title={item.title} value={item.value} index={index} key={'summarylistitem' + index}/>))}
+        </ol>);
+};
+SummaryList.displayName = 'SummaryList';
+exports.Action.displayName = 'SummaryListAction';
+exports.Answer.displayName = 'SumaryListAnswer';
+exports.Item.displayName = 'SummaryListItem';
+exports.default = SummaryList;

package/dist/components/Table/Table.jsx

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+// @ts-ignore
+const table_1 = __importDefault(require("@scottish-government/design-system/src/components/table/table"));
+const Table = ({ children, className, smallscreen, ...props }) => {
+    const ref = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (ref.current) {
+            new table_1.default().init();
+        }
+    }, [ref]);
+    return (<table className={[
+            'ds_table',
+            className
+        ].join(' ')} data-smallscreen={smallscreen} ref={ref} {...props}>
+            {children}
+        </table>);
+};
+Table.displayName = 'Table';
+exports.default = Table;

package/dist/components/Tabs/Tabs.jsx

@@ -0,0 +1,99 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const WrapperTag_1 = __importDefault(require("../../common/WrapperTag"));
+// @ts-ignore
+const tabs_1 = __importDefault(require("@scottish-government/design-system/src/components/tabs/tabs"));
+const slugify_1 = __importDefault(require("../../utils/slugify"));
+const TabItem = ({ bordered, children, className, id, tabLabel, ...props }) => {
+    return (<div className={[
+            'ds_tabs__content',
+            bordered && 'ds_tabs__content--bordered',
+            className
+        ].join(' ')} id={id} {...props}>
+            {children}
+        </div>);
+};
+const TabListItem = ({ title, href }) => {
+    return (<li className="ds_tabs__tab">
+            <a className="ds_tabs__tab-link" href={href}>{title}</a>
+        </li>);
+};
+const Tabs = ({ baseId = 'tabs', bordered = true, children, className, headingLevel = 'h2', manual = false, title = 'Contents', ...props }) => {
+    const ref = (0, react_1.useRef)(null);
+    const headingId = `${baseId}-heading`;
+    (0, react_1.useEffect)(() => {
+        if (ref.current) {
+            new tabs_1.default(ref.current).init();
+        }
+    }, [ref]);
+    const processedItems = react_1.Children.map(children, child => {
+        if ((0, react_1.isValidElement)(child) && child.type === TabItem) {
+            let thisChild = child;
+            return react_1.default.cloneElement(thisChild, {
+                bordered: bordered,
+                id: thisChild.props.id || `${baseId}-${(0, slugify_1.default)(thisChild.props.tabLabel)}`,
+            });
+        }
+    });
+    const tabListItems = react_1.Children.map(processedItems, child => {
+        if ((0, react_1.isValidElement)(child) && child.type === TabItem) {
+            return react_1.default.createElement(TabListItem, { title: child.props.tabLabel, href: `#${child.props.id}` });
+        }
+    });
+    return (<div className={[
+            'ds_tabs',
+            manual && 'ds_tabs--manual',
+            className
+        ].join(' ')} ref={ref} {...props}>
+            <WrapperTag_1.default id={headingId} className="ds_tabs__title" tagName={headingLevel}>
+                {title}
+            </WrapperTag_1.default>
+
+            <ul className="ds_tabs__list" aria-labelledby={headingId}>
+                {tabListItems}
+            </ul>
+
+            {processedItems}
+        </div>);
+};
+Tabs.displayName = 'Tabs';
+TabItem.displayName = 'Tabs.Item';
+Tabs.Item = TabItem;
+exports.default = Tabs;

package/dist/components/Tag/Tag.jsx

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Tag = ({ className, colour, title, ...props }) => {
+    return (<span className={[
+            'ds_tag',
+            className,
+            colour && `ds_tag--${colour}`,
+        ].join(' ')} {...props}>
+            {title}
+        </span>);
+};
+Tag.displayName = 'Tag';
+exports.default = Tag;

package/dist/components/TaskList/TaskList.jsx

@@ -0,0 +1,95 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWrapper"));
+const HintText_1 = __importDefault(require("../../common/HintText"));
+const ScreenReaderText_1 = __importDefault(require("../../common/ScreenReaderText"));
+const Tag_1 = __importDefault(require("../Tag/Tag"));
+const TaskItem = ({ children, className, href, id, isComplete = false, statusText, tagColour = 'grey', title, ...props }) => {
+    if (isComplete) {
+        tagColour = 'green';
+    }
+    return (<li className={[
+            'ds_task-list__task',
+            className
+        ].join(' ')} id={id} {...props}>
+            <div className="ds_task-list__task-details">
+                <h3 className="ds_task-list__task-heading">
+                <ConditionalWrapper_1.default condition={typeof href !== 'undefined'} wrapper={(children) => <a className="ds_task-list__task-link" href={href}>{children}</a>}>
+                    {title}
+                    {statusText && <ScreenReaderText_1.default>({statusText})</ScreenReaderText_1.default>}
+                </ConditionalWrapper_1.default>
+                </h3>
+                <HintText_1.default className="ds_task-list__task-summary">{children}</HintText_1.default>
+            </div>
+
+            {typeof statusText !== 'undefined' &&
+            <Tag_1.default aria-hidden="true" colour={tagColour} title={statusText}/>}
+        </li>);
+};
+/**
+ * @param {Object} props
+ * @param {string} props.intro - Intro text
+ * @param {string} props.title - The title of the task group
+ * @returns {JSX.Element} - The element
+ */
+const TaskGroup = ({ children, className, intro, title, ...props }) => {
+    return (<li className={[
+            'ds_task-list-group__section',
+            className
+        ].join(' ')} {...props}>
+            <h2 className="ds_task-list-heading">{title}</h2>
+            {intro && <p className="ds_task-list-intro">{intro}</p>}
+            <ul className="ds_task-list">
+                {children}
+            </ul>
+        </li>);
+};
+const TaskList = ({ children, className, headingId = 'task-list', title, ...props }) => {
+    let taskCount = 0;
+    let incompleteTaskIds = [];
+    let completedTasksCount = 0;
+    function processChild(item) {
+        if (item.type.displayName === 'TaskList.Item') {
+            taskCount = taskCount + 1;
+            if (item.props.isComplete) {
+                completedTasksCount = completedTasksCount + 1;
+            }
+            else {
+                incompleteTaskIds.push(item.props.id);
+            }
+        }
+        else if (item.type.displayName === 'TaskList.Group') {
+            react_1.Children.forEach(item.props.children, child => {
+                processChild(child);
+            });
+        }
+    }
+    function firstIncompleteTaskLink() {
+        if (incompleteTaskIds.length > 0) {
+            return (<p><a href={'#' + incompleteTaskIds[0]} className="js-task-list-skip-link">Skip to first incomplete section</a></p>);
+        }
+    }
+    react_1.Children.forEach(children, child => {
+        processChild(child);
+    });
+    return (<div className={className} {...props}>
+            <h2 id={`${headingId}-status`} className="ds_task-list-status-heading">{title}</h2>
+            <nav aria-labelledby={`${headingId}-status`} className="ds_task-list-status">
+                <p>You have completed {completedTasksCount} of {taskCount} sections.</p>
+                {firstIncompleteTaskLink()}
+            </nav>
+            <ul className="ds_task-list">
+                {children}
+            </ul>
+        </div>);
+};
+TaskList.displayName = 'TaskList';
+TaskItem.displayName = 'TaskList.Item';
+TaskGroup.displayName = 'TaskList.Group';
+TaskList.Item = TaskItem;
+TaskList.Group = TaskGroup;
+exports.default = TaskList;

package/dist/components/TextInput/TextInput.jsx

@@ -0,0 +1,58 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+// @ts-ignore
+const character_count_1 = __importDefault(require("@scottish-government/design-system/src/forms/character-count/character-count"));
+const Button_1 = __importDefault(require("../Button/Button"));
+const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWrapper"));
+const ErrorMessage_1 = __importDefault(require("../ErrorMessage/ErrorMessage"));
+const HintText_1 = __importDefault(require("../../common/HintText"));
+const TextInput = ({ buttonIcon, buttonText, children, className, countThreshold, width, currency, currencySymbol, error, errorMessage, hasButton = false, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, type = 'text', value, ...props }) => {
+    const errorMessageId = `error-message-${id}`;
+    const hintTextId = `hint-text-${id}`;
+    const ref = (0, react_1.useRef)(null);
+    const inputWrapperClasses = `${hasButton ? 'ds_input__wrapper  ds_input__wrapper--has-icon' : ''} ${currency ? 'ds_currency-wrapper' : ''}`;
+    const describedbys = [];
+    if (hintText) {
+        describedbys.push(hintTextId);
+    }
+    ;
+    if (errorMessage) {
+        describedbys.push(errorMessageId);
+    }
+    ;
+    (0, react_1.useEffect)(() => {
+        if (ref.current) {
+            new character_count_1.default(ref.current).init();
+        }
+    }, [ref]);
+    function handleBlur(event) {
+        if (typeof onBlur === 'function') {
+            onBlur(event);
+        }
+    }
+    function handleChange(event) {
+        if (typeof onChange === 'function') {
+            onChange(event);
+        }
+    }
+    return (<ConditionalWrapper_1.default condition={typeof maxlength !== 'undefined' && maxlength > 0} wrapper={(children) => <div ref={ref} data-threshold={countThreshold} data-module="ds-character-count">{children}</div>}>
+            <label className="ds_label" htmlFor={id}>{label}</label>
+            {hintText && <HintText_1.default id={hintTextId} text={hintText}/>}
+            {errorMessage && <ErrorMessage_1.default id={errorMessageId} text={errorMessage}/>}
+            <ConditionalWrapper_1.default condition={hasButton || typeof currency !== 'undefined' && currency} wrapper={(children) => <div className={inputWrapperClasses} data-symbol={currencySymbol}>{children}</div>}>
+                <input aria-describedby={describedbys.join(' ')} aria-invalid={error} className={[
+            'ds_input',
+            className,
+            error ? 'ds_input--error' : '',
+            width ? `ds_input--${width}` : '',
+        ].join(' ')} defaultValue={value} id={id} maxLength={maxlength} name={name || id} onBlur={handleBlur} onChange={handleChange} placeholder={placeholder} type={type} {...props}/>
+                {hasButton && (buttonText || buttonIcon) && <Button_1.default iconOnly icon={buttonIcon}>{buttonText}</Button_1.default>}
+            </ConditionalWrapper_1.default>
+        </ConditionalWrapper_1.default>);
+};
+TextInput.displayName = 'TextInput';
+exports.default = TextInput;

package/dist/components/Textarea/Textarea.jsx

@@ -0,0 +1,54 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+// @ts-ignore
+const character_count_1 = __importDefault(require("@scottish-government/design-system/src/forms/character-count/character-count"));
+const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWrapper"));
+const ErrorMessage_1 = __importDefault(require("../ErrorMessage/ErrorMessage"));
+const HintText_1 = __importDefault(require("../../common/HintText"));
+const Textarea = ({ className, countThreshold, error, errorMessage, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, rows = 4, value, ...props }) => {
+    const errorMessageId = `error-message-${id}`;
+    const hintTextId = `hint-text-${id}`;
+    const ref = (0, react_1.useRef)(null);
+    const describedbys = [];
+    if (hintText) {
+        describedbys.push(hintTextId);
+    }
+    ;
+    if (errorMessage) {
+        describedbys.push(errorMessageId);
+    }
+    ;
+    (0, react_1.useEffect)(() => {
+        if (ref.current) {
+            new character_count_1.default(ref.current).init();
+        }
+    }, [ref]);
+    function handleBlur(event) {
+        if (typeof onBlur === 'function') {
+            onBlur(event);
+        }
+    }
+    function handleChange(event) {
+        if (typeof onChange === 'function') {
+            onChange(event);
+        }
+    }
+    return (<ConditionalWrapper_1.default condition={typeof maxlength !== 'undefined' && maxlength > 0} wrapper={(children) => <div ref={ref} data-threshold={countThreshold} data-module="ds-character-count">{children}</div>}>
+            <label className="ds_label" htmlFor={id}>{label}</label>
+            {hintText && <HintText_1.default id={hintTextId} text={hintText}/>}
+            {errorMessage && <ErrorMessage_1.default id={errorMessageId} text={errorMessage}/>}
+
+            <textarea aria-describedby={describedbys.join(' ')} aria-invalid={error} className={[
+            'ds_input',
+            error && 'ds_input--error',
+            className
+        ].join(' ')} defaultValue={value} id={id} maxLength={maxlength} name={name || id} onBlur={handleBlur} onChange={handleChange} placeholder={placeholder} rows={rows} {...props}/>
+
+        </ConditionalWrapper_1.default>);
+};
+Textarea.displayName = 'Textarea';
+exports.default = Textarea;

package/dist/components/WarningText/WarningText.jsx

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const WarningText = ({ children, className, ...props }) => {
+    return (<div className={[
+            'ds_warning-text',
+            className
+        ].join(' ')} {...props}>
+            <strong className="ds_warning-text__icon" aria-hidden="true"></strong>
+            <strong className="visually-hidden">Warning</strong>
+            <div className="ds_warning-text__text">
+                {children}
+            </div>
+        </div>);
+};
+WarningText.displayName = 'WarningText';
+exports.default = WarningText;

package/dist/components/file-download/file-download.jsx

@@ -0,0 +1,50 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const file_icon_1 = __importDefault(require("../../common/file-icon"));
+const FileDownload = ({ className, cover, highlighted, icon = 'Generic', fileSize, fileType, fileUrl, title, ...props }) => {
+    const hasMetadata = !!fileType || !!fileSize;
+    const metaContainerId = `file-download-${(0, react_1.useId)()}`;
+    return (<div className={[
+            'ds_file-download',
+            highlighted && 'ds_file-download--highlighted',
+            className
+        ].join(' ')} {...props}>
+            <div className="ds_file-download__thumbnail">
+                <a className="ds_file-download__thumbnail-link" aria-hidden="true" tabIndex={-1} href={fileUrl}>
+                    {cover ?
+            <img alt="" className="ds_file-download__thumbnail-image" src={cover}/>
+            :
+                <file_icon_1.default ariaLabel="" className="ds_file-download__thumbnail-image" icon={icon}/>}
+                </a>
+            </div>
+
+            <div className="ds_file-download__content">
+                <a href={fileUrl} className="ds_file-download__title" aria-describedby={hasMetadata ? metaContainerId : undefined}>
+                    {title}
+                </a>
+
+                {hasMetadata &&
+            <div id={metaContainerId} className="ds_file-download__details">
+                        <dl className="ds_metadata  ds_metadata--inline">
+                            {fileType &&
+                    <div className="ds_metadata__item">
+                                    <dt className="ds_metadata__key  visually-hidden">File type</dt>
+                                    <dd className="ds_metadata__value">{fileType}<span className="visually-hidden">,</span></dd>
+                                </div>}
+
+                            {fileSize &&
+                    <div className="ds_metadata__item">
+                                    <dt className="ds_metadata__key  visually-hidden">File size</dt>
+                                    <dd className="ds_metadata__value">{fileSize}</dd>
+                                </div>}
+                        </dl>
+                    </div>}
+            </div>
+        </div>);
+};
+FileDownload.displayName = 'FileDownload';
+exports.default = FileDownload;

package/dist/images/documents/audio.jsx

@@ -0,0 +1,47 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const SvgAudio = (props) => (<svg fill="none" viewBox="0 0 80 120" xmlns="http://www.w3.org/2000/svg" role="img" {...props}>
+    <path d="m1 119v-118h58.5857l19.4142 19.4142v98.5858z" fill="#fff" stroke="#5e5e5e" strokeWidth={2}/>
+    <path d="m80 20-20-20v20z" fill="#5e5e5e"/>
+    <path d="m1 119v-118h58.5857l19.4142 19.4142v98.5858z" fill="#fff" stroke="#5e5e5e" strokeWidth={2}/>
+    <path d="m80 20-20-20v20z" fill="#5e5e5e"/>
+    <path d="m9.99951 27.5h59.9999v27.5h-59.9999z" fill="#5e5e5e"/>
+    <path d="m23.2514 37.1863-3.3837 10.3137h-2.7259l4.6228-12.4414h1.7346zm2.8113 10.3137-3.3923-10.3137-.2734-2.1277h1.7517l4.6484 12.4414zm-.1538-4.6313v2.008h-6.571v-2.008zm9.2542 2.4182v-7.0325h2.4609v9.2456h-2.3157zm.2734-1.897.7263-.0171c0 .6152-.0712 1.1878-.2136 1.7175-.1424.5241-.3561.9799-.6409 1.3672-.2848.3817-.6437.6808-1.0766.8972-.433.2108-.9428.3162-1.5296.3162-.45 0-.8659-.0627-1.2475-.188-.376-.131-.7007-.3332-.9742-.6067-.2677-.2791-.4785-.6352-.6323-1.0681-.1481-.4386-.2222-.9656-.2222-1.5808v-5.9729h2.461v5.99c0 .2734.0313.5041.094.6921.0683.188.1623.3418.282.4615.1196.1196.2592.205.4187.2563.1652.0513.3475.0769.5468.0769.507 0 .9058-.1025 1.1963-.3076.2962-.2051.5042-.4842.6238-.8374.1253-.3589.188-.7577.188-1.1963zm9.5276 2.0935v-11.1084h2.478v13.125h-2.2302zm-5.8448-2.4951v-.1795c0-.7063.0798-1.3472.2393-1.9226.1595-.581.3931-1.0795.7007-1.4953.3076-.4159.6864-.7377 1.1365-.9656.45-.2279.9627-.3418 1.538-.3418.5412 0 1.014.1139 1.4185.3418.4102.2279.7576.5526 1.0425.9741.2905.4159.5241.9086.7007 1.4783.1766.564.3047 1.182.3845 1.8542v.3931c-.0798.6437-.2079 1.2419-.3845 1.7944-.1766.5526-.4102 1.0368-.7007 1.4527-.2849.4101-.6323.7291-1.0425.957s-.8887.3418-1.4355.3418c-.5754 0-1.0881-.1168-1.5381-.3503-.4444-.2336-.8203-.5612-1.128-.9827-.3019-.4216-.5326-.9172-.6921-1.4868-.1595-.5697-.2393-1.1906-.2393-1.8628zm2.461-.1795v.1795c0 .3817.0285.7377.0854 1.0681.0627.3304.1624.6238.2991.8801.1424.2507.3247.4472.5469.5896.2278.1367.5041.2051.8288.2051.4216 0 .7691-.094 1.0425-.282.2734-.1937.4814-.4586.6238-.7947.1481-.3361.2335-.7234.2563-1.1621v-1.1193c-.0171-.3589-.0683-.6808-.1538-.9656-.0797-.2905-.1994-.5383-.3589-.7434-.1538-.2051-.3475-.3646-.581-.4785-.2279-.114-.4985-.1709-.8118-.1709-.319 0-.5924.074-.8203.2221-.2279.1424-.413.339-.5554.5896-.1367.2507-.2393.5469-.3076.8887-.0627.3361-.094.7007-.094 1.0937zm10.382-4.5544v9.2456h-2.4694v-9.2456zm-2.6232-2.4097c0-.3588.1253-.6551.3759-.8886.2507-.2336.5868-.3504 1.0083-.3504.4159 0 .7491.1168.9998.3504.2563.2335.3845.5298.3845.8886 0 .3589-.1282.6552-.3845.8887-.2507.2336-.5839.3504-.9998.3504-.4215 0-.7576-.1168-1.0083-.3504-.2506-.2335-.3759-.5298-.3759-.8887zm4.2639 7.1265v-.1794c0-.6779.0968-1.3017.2905-1.8714.1937-.5753.4757-1.0738.8459-1.4953.3703-.4216.826-.7491 1.3672-.9827.5412-.2393 1.1621-.3589 1.8628-.3589s1.3245.1196 1.8713.3589c.5469.2336 1.0055.5611 1.3758.9827.376.4215.6608.92.8545 1.4953.1937.5697.2905 1.1935.2905 1.8714v.1794c0 .6722-.0968 1.296-.2905 1.8713-.1937.5697-.4785 1.0681-.8545 1.4954-.3703.4215-.826.7491-1.3672.9827-.5412.2335-1.1621.3503-1.8628.3503s-1.3245-.1168-1.8713-.3503c-.5412-.2336-.9998-.5612-1.3758-.9827-.3702-.4273-.6522-.9257-.8459-1.4954-.1937-.5753-.2905-1.1991-.2905-1.8713zm2.4609-.1794v.1794c0 .3874.0342.7491.1025 1.0852.0684.3361.1766.6323.3247.8887.1539.2506.3532.4472.5982.5896.2449.1424.544.2136.8972.2136.3418 0 .6352-.0712.8801-.2136.245-.1424.4415-.339.5896-.5896.1481-.2564.2564-.5526.3247-.8887.0741-.3361.1111-.6978.1111-1.0852v-.1794c0-.376-.037-.7292-.1111-1.0596-.0683-.3361-.1794-.6323-.3332-.8887-.1481-.262-.3447-.4671-.5896-.6152-.245-.1481-.5412-.2222-.8887-.2222s-.6437.0741-.8887.2222c-.2392.1481-.4357.3532-.5896.6152-.1481.2564-.2563.5526-.3247.8887-.0683.3304-.1025.6836-.1025 1.0596z" fill="#fff"/>
+    <circle cx={38.9619} cy={84.5315} fill="#5e5e5e" r={19.857}/>
+    <path d="m51.0889 84.1858-18.6227 10.6068v-21.2137z" fill="#fff"/>
+  </svg>);
+exports.default = SvgAudio;

package/dist/images/documents/csv.jsx

@@ -0,0 +1,57 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const SvgCsv = (props) => (<svg fill="none" viewBox="0 0 80 120" xmlns="http://www.w3.org/2000/svg" role="img" {...props}>
+    <path d="m1 119v-118h58.5858l19.4142 19.4142v98.5858z" fill="#fff" stroke="#428542" strokeWidth={2}/>
+    <g fill="#428542">
+      <path d="m80 20-20-20v20z"/>
+      <path d="m10 65h12.5v5h-12.5z"/>
+      <path d="m25.833 64.9999h12.5v5h-12.5z"/>
+      <path d="m41.667 64.9999h12.5v5h-12.5z"/>
+      <path d="m57.5 64.9999h12.5v5h-12.5z"/>
+      <path d="m10 74.9999h12.5v5h-12.5z"/>
+      <path d="m25.833 74.9999h12.5v5h-12.5z"/>
+      <path d="m41.667 74.9999h12.5v5h-12.5z"/>
+      <path d="m57.5 74.9999h12.5v5h-12.5z"/>
+      <path d="m10 84.9999h12.5v5h-12.5z"/>
+      <path d="m25.833 84.9999h12.5v5h-12.5z"/>
+      <path d="m41.667 84.9999h12.5v5h-12.5z"/>
+      <path d="m57.5 84.9999h12.5v5h-12.5z"/>
+      <path d="m10 28h60v27h-60z"/>
+    </g>
+    <path d="m31.4893 43.8728h2.5549c-.0513.8374-.282 1.5808-.6921 2.2302-.4045.6494-.9713 1.1564-1.7005 1.521-.7235.3646-1.595.5469-2.6147.5469-.7976 0-1.5125-.1367-2.1448-.4102-.6323-.2791-1.1735-.6779-1.6235-1.1962-.4444-.5184-.7833-1.1451-1.0169-1.8799-.2336-.7349-.3503-1.5581-.3503-2.4695v-.863c0-.9115.1196-1.7347.3589-2.4695.2449-.7406.5924-1.3701 1.0424-1.8885.4558-.5184.9998-.9171 1.6321-1.1962.6323-.2792 1.3387-.4187 2.1192-.4187 1.0367 0 1.9112.1879 2.6232.5639.7178.376 1.2732.8944 1.6663 1.5552.3988.6608.638 1.4128.7178 2.2559h-2.5635c-.0285-.5014-.1282-.9257-.2991-1.2732-.1709-.3532-.4301-.6181-.7776-.7947-.3418-.1823-.7975-.2735-1.3671-.2735-.4273 0-.8004.0798-1.1194.2393s-.5868.4016-.8033.7263c-.2164.3247-.3788.7349-.487 1.2305-.1026.4899-.1538 1.0653-.1538 1.7261v.8801c0 .6437.0484 1.2105.1452 1.7004.0969.4842.245.8944.4444 1.2305.2051.3304.4671.5811.7861.7519.3247.1653.7149.2479 1.1707.2479.5354 0 .9769-.0855 1.3244-.2564s.6124-.4244.7947-.7605c.188-.3361.2991-.7548.3333-1.2561zm10.7153.8716c0-.2222-.0342-.4216-.1025-.5982-.0627-.1823-.1823-.3475-.3589-.4956-.1766-.1538-.4244-.3047-.7434-.4528-.3191-.1482-.7321-.302-1.2391-.4615-.5639-.1823-1.0994-.3873-1.6064-.6152-.5013-.2279-.9456-.4928-1.333-.7947-.3817-.3076-.6836-.6636-.9058-1.0681-.2164-.4045-.3247-.8744-.3247-1.4099 0-.5184.114-.9884.3418-1.4099.2279-.4273.5469-.7919.957-1.0938.4102-.3076.8944-.544 1.4527-.7092.5639-.1652 1.182-.2478 1.8542-.2478.9172 0 1.7176.1652 2.4012.4956.6835.3304 1.2133.7833 1.5893 1.3586.3817.5754.5725 1.2334.5725 1.9739h-2.5464c0-.3646-.0769-.6836-.2307-.957-.1481-.2791-.376-.4985-.6836-.658-.3019-.1595-.6836-.2392-1.145-.2392-.4443 0-.8146.0683-1.1108.2051-.2963.131-.5184.3104-.6665.5383-.1481.2221-.2222.4728-.2222.7519 0 .2108.0513.4016.1538.5725.1082.1709.2677.3304.4785.4786.2108.1481.47.2876.7776.4187.3076.131.6637.2592 1.0681.3845.6779.2051 1.2732.4358 1.7859.6921.5184.2564.9513.544 1.2988.8631.3475.319.6096.6807.7862 1.0852.1766.4044.2649.863.2649 1.3757 0 .5412-.1054 1.0254-.3162 1.4526-.2108.4273-.5155.789-.9143 1.0852-.3988.2963-.8744.5213-1.427.6751s-1.1707.2307-1.8543.2307c-.6152 0-1.2219-.0798-1.82-.2393-.5982-.1652-1.1422-.413-1.6321-.7434-.4842-.3304-.8716-.7519-1.1621-1.2646s-.4358-1.1194-.4358-1.8201h2.572c0 .3874.0598.7149.1795.9827.1196.2677.2876.4842.5041.6494.2222.1652.4842.2848.7861.3589.3077.074.6438.1111 1.0083.1111.4444 0 .809-.0627 1.0938-.188.2905-.1253.5041-.2991.6409-.5213.1424-.2221.2136-.4728.2136-.7519zm8.7927.6579 2.9309-9.8437h2.854l-4.3322 12.4414h-1.8799zm-2.7002-9.8437 2.9224 9.8437.4443 2.5977h-1.897l-4.3066-12.4414z" fill="#fff"/>
+  </svg>);
+exports.default = SvgCsv;