@scottish-government/designsystem-react 0.10.2 → 0.11.1

package/dist/components/NotificationPanel/NotificationPanel.d.ts

@@ -0,0 +1,5 @@
+declare const NotificationPanel: {
+    ({ ariaLive, children, className, headingLevel, title, ...props }: SGDS.Component.NotificationPanel): import("react").JSX.Element;
+    displayName: string;
+};
+export default NotificationPanel;

package/dist/components/NotificationPanel/index.d.ts

@@ -0,0 +1 @@
+export { default } from './NotificationPanel';

package/dist/components/NotificationPanel/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var NotificationPanel_1 = require("./NotificationPanel");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(NotificationPanel_1).default; } });

package/dist/components/PageHeader/PageHeader.d.ts

@@ -0,0 +1,5 @@
+declare const PageHeader: {
+    ({ children, className, label, title, titleId, ...props }: SGDS.Component.PageHeader): import("react").JSX.Element;
+    displayName: string;
+};
+export default PageHeader;

package/dist/components/PageHeader/PageHeader.jsx

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const PageHeader = ({ children, className, label, title, ...props }) => {
+const PageHeader = ({ children, className, label, title, titleId, ...props }) => {
     return (<header className={[
             'ds_page-header',
             className
         ].join(' ')} {...props}>
             {label && <span className="ds_page-header__label  ds_content-label">{label}</span>}
-            <h1 className="ds_page-header__title">{title}</h1>
+            <h1 id={titleId} className="ds_page-header__title">{title}</h1>
 
             {children}
         </header>);

package/dist/components/PageHeader/index.d.ts

@@ -0,0 +1 @@
+export { default } from './PageHeader';

package/dist/components/PageHeader/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var PageHeader_1 = require("./PageHeader");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(PageHeader_1).default; } });

package/dist/components/PageMetadata/PageMetadata.d.ts

@@ -0,0 +1,9 @@
+declare const Metadata: {
+    ({ children, className, isInline, ...props }: SGDS.Component.Metadata): import("react").JSX.Element;
+    displayName: string;
+    Item: {
+        ({ children, className, name, ...props }: SGDS.Component.Metadata.Item): import("react").JSX.Element;
+        displayName: string;
+    };
+};
+export default Metadata;

package/dist/components/PageMetadata/index.d.ts

@@ -0,0 +1 @@
+export { default } from './PageMetadata';

package/dist/components/PageMetadata/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var PageMetadata_1 = require("./PageMetadata");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(PageMetadata_1).default; } });

package/dist/components/Pagination/Pagination.d.ts

@@ -0,0 +1,7 @@
+export declare const Page: ({ ariaLabel, children, className, href, isCurrent, linkComponent, onClick }: SGDS.Component.Pagination.Page) => import("react").JSX.Element;
+export declare const Ellipsis: () => import("react").JSX.Element;
+declare const Pagination: {
+    ({ ariaLabel, className, onClick, padding, page, pattern, totalPages, linkComponent, ...props }: SGDS.Component.Pagination): import("react").JSX.Element;
+    displayName: string;
+};
+export default Pagination;

package/dist/components/Pagination/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Pagination';

package/dist/components/Pagination/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Pagination_1 = require("./Pagination");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Pagination_1).default; } });

package/dist/components/PhaseBanner/PhaseBanner.d.ts

@@ -0,0 +1,5 @@
+declare const PhaseBanner: {
+    ({ children, className, phaseName, ...props }: SGDS.Component.PhaseBanner): import("react").JSX.Element;
+    displayName: string;
+};
+export default PhaseBanner;

package/dist/components/PhaseBanner/index.d.ts

@@ -0,0 +1 @@
+export { default } from './PhaseBanner';

package/dist/components/PhaseBanner/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var PhaseBanner_1 = require("./PhaseBanner");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(PhaseBanner_1).default; } });

package/dist/components/Question/Question.d.ts

@@ -0,0 +1,5 @@
+declare const Question: {
+    ({ children, className, errorMessage, hasError, hintText, legend, tagName, ...props }: SGDS.Component.Question): import("react").JSX.Element;
+    displayName: string;
+};
+export default Question;

package/dist/components/Question/Question.jsx

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const ErrorMessage_1 = __importDefault(require("../ErrorMessage/ErrorMessage"));
+const ErrorMessage_1 = __importDefault(require("../ErrorMessage"));
 const HintText_1 = __importDefault(require("../../common/HintText"));
 const WrapperTag_1 = __importDefault(require("../../common/WrapperTag"));
 const Question = function ({ children, className, errorMessage, hasError, hintText, legend, tagName = 'div', ...props }) {

package/dist/components/Question/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Question';

package/dist/components/Question/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Question_1 = require("./Question");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Question_1).default; } });

package/dist/components/RadioButton/RadioButton.d.ts

@@ -0,0 +1,5 @@
+declare const RadioButton: {
+    ({ checked, hintText, id, isSmall, label, name, onBlur, onChange }: SGDS.Component.RadioButton): import("react").JSX.Element;
+    displayName: string;
+};
+export default RadioButton;

package/dist/components/RadioButton/RadioGroup.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare const RadioGroup: {
+    ({ children, className, isInline, isSmall, name, ...props }: SGDS.Component.RadioButton.Group): React.JSX.Element;
+    displayName: string;
+};
+export default RadioGroup;

package/dist/components/RadioButton/RadioGroup.jsx

@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const context_1 = require("../../utils/context");
-const RadioGroup = ({ children, className, isInline, isSmall, name, ...props }) => {
+const RadioGroup = ({ children, className, isInline, isSmall, name = '', ...props }) => {
     return (<div className={[
             'ds_radios',
             'ds_field-group',

package/dist/components/RadioButton/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './RadioButton';
+export { default as RadioGroup } from './RadioGroup';

package/dist/components/RadioButton/index.js

@@ -0,0 +1,10 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RadioGroup = exports.default = void 0;
+var RadioButton_1 = require("./RadioButton");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(RadioButton_1).default; } });
+var RadioGroup_1 = require("./RadioGroup");
+Object.defineProperty(exports, "RadioGroup", { enumerable: true, get: function () { return __importDefault(RadioGroup_1).default; } });

package/dist/components/SearchFacets/SearchFacets.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+declare const Facets: {
+    ({ children, className, ...props }: SGDS.Component.SearchFacets): React.JSX.Element;
+    displayName: string;
+    Item: {
+        ({ accessibleName, joinContent, onClick, title, ...props }: SGDS.Component.SearchFacets.Item): React.JSX.Element;
+        displayName: string;
+    };
+    Group: {
+        ({ children, joinContent, title, ...props }: SGDS.Component.SearchFacets.Group): React.JSX.Element;
+        displayName: string;
+    };
+};
+export default Facets;

package/dist/components/SearchFacets/SearchFacets.jsx

@@ -0,0 +1,101 @@
+"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 Icon_1 = __importDefault(require("../../common/Icon"));
+const icons_1 = require("../../../src/images/icons");
+const FacetsItem = ({ accessibleName, joinContent, onClick, title, ...props }) => {
+    accessibleName = accessibleName ? accessibleName : title;
+    return (<dd className="ds_facet-wrapper" {...props}>
+            {joinContent &&
+            <span aria-hidden="true">{joinContent}</span>}
+            <span className="ds_facet">
+                {title}
+                <button type="button" onClick={onClick} aria-label={`Remove '${accessibleName}' filter`} className="ds_facet__button">
+                    <Icon_1.default className="ds_facet__button-icon" aria-hidden="true" role="img" icon="Cancel"/>
+                </button>
+            </span>
+        </dd>);
+};
+const FacetsGroup = ({ children, joinContent = 'or', title, ...props }) => {
+    return (<div className="ds_facet-group" {...props}>
+            <dt className="ds_facet__group-title">
+                {title.trim()}:
+            </dt>
+            {react_1.Children.map(children, (child, index) => {
+            const thisChild = child;
+            return react_1.default.cloneElement(thisChild, { joinContent: index > 0 ? joinContent : undefined, key: 'facet' + index });
+        })}
+        </div>);
+};
+const Facets = ({ children, className, ...props }) => {
+    let facetCount = 0;
+    function processChild(item) {
+        if (item.type.displayName === 'Facets.Item') {
+            facetCount = facetCount + 1;
+        }
+        else if (item.type.displayName === 'Facets.Group') {
+            react_1.Children.forEach(item.props.children, child => {
+                processChild(child);
+            });
+        }
+    }
+    react_1.Children.forEach(children, child => {
+        processChild(child);
+    });
+    return (<div className={[
+            "ds_facets",
+            className
+        ].join(' ')} {...props}>
+            <p className="visually-hidden">There {facetCount === 1 ? 'is' : 'are'} {facetCount} search {facetCount === 1 ? 'filter' : 'filters'} applied</p>
+            <dl className="ds_facets__list">
+                {children}
+            </dl>
+            {facetCount > 0 &&
+            <button className="ds_button  ds_button--secondary  ds_button--has-icon  ds_facets__clear-button" type="button">
+                    Clear all filters
+                    <icons_1.Cancel className="ds_facet__button-icon"/>
+                </button>}
+        </div>);
+};
+Facets.displayName = 'Facets';
+FacetsItem.displayName = 'Facets.Item';
+FacetsGroup.displayName = 'Facets.Group';
+Facets.Item = FacetsItem;
+Facets.Group = FacetsGroup;
+exports.default = Facets;

package/dist/components/SearchFacets/index.d.ts

@@ -0,0 +1 @@
+export { default } from './SearchFacets';

package/dist/components/SearchFacets/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var SearchFacets_1 = require("./SearchFacets");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(SearchFacets_1).default; } });

package/dist/components/SearchFilters/SearchFilters.d.ts

@@ -0,0 +1,16 @@
+export declare const FilterPanel: {
+    ({ activeFilterCount, children, isScrollable, legend, heading, ...props }: SGDS.Component.SearchFilters.Panel): import("react").JSX.Element;
+    displayName: string;
+};
+declare const Filters: {
+    ({ children, searchResultsContainerId, ...props }: SGDS.Component.SearchFilters): import("react").JSX.Element;
+    Panel: {
+        ({ activeFilterCount, children, isScrollable, legend, heading, ...props }: SGDS.Component.SearchFilters.Panel): import("react").JSX.Element;
+        displayName: string;
+    };
+    CheckboxGroup: {
+        ({ children, ...props }: any): import("react").JSX.Element;
+        displayName: string;
+    };
+};
+export default Filters;

package/dist/components/SearchFilters/SearchFilters.jsx

@@ -0,0 +1,63 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FilterPanel = void 0;
+const Accordion_1 = __importDefault(require("../Accordion"));
+const Button_1 = __importDefault(require("../Button"));
+const SkipLinks_1 = __importDefault(require("../SkipLinks"));
+const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWrapper"));
+const Checkbox_1 = require("../Checkbox");
+const FilterPanel = ({ activeFilterCount = 0, children, isScrollable = false, legend, heading = 'Filter', ...props }) => {
+    const headingWithCount = <>
+        {heading}
+        {activeFilterCount > 0 && <div className="ds_search-filters__filter-count">({activeFilterCount} selected)</div>}
+    </>;
+    return (<Accordion_1.default.Item heading={headingWithCount} {...props}>
+            <fieldset>
+                <legend className="visually-hidden">{legend}</legend>
+
+                <ConditionalWrapper_1.default condition={isScrollable} wrapper={(children) => <div className="ds_search-filters__scrollable">{children}</div>}>
+                    {children}
+                </ConditionalWrapper_1.default>
+            </fieldset>
+        </Accordion_1.default.Item>);
+};
+exports.FilterPanel = FilterPanel;
+const FilterCheckboxGroup = ({ children, ...props }) => {
+    return (<Checkbox_1.CheckboxGroup className="ds_search-filters__checkboxes" isSmall {...props}>
+            {children}
+        </Checkbox_1.CheckboxGroup>);
+};
+const Filters = ({ children, searchResultsContainerId = 'search-results', ...props }) => {
+    return (<div className="ds_search-filters" {...props}>
+            <div className="ds_details  ds_no-margin" data-module="ds-details">
+                <input id="filters-toggle" type="checkbox" className="ds_details__toggle  visually-hidden"/>
+                <label htmlFor="filters-toggle" className="ds_details__summary">
+                    Search filters
+                </label>
+
+                <SkipLinks_1.default isStatic>
+                    <SkipLinks_1.default.Link fragmentId={searchResultsContainerId}>Skip to results</SkipLinks_1.default.Link>
+                </SkipLinks_1.default>
+
+                <div className="ds_details__text">
+                    <form id="filters">
+                        <h2 className="ds_search-filters__title  ds_h4">Filter by</h2>
+
+                        <Accordion_1.default className="ds_!_margin-top--0" isSmall hideOpenAll>
+                            {children}
+                        </Accordion_1.default>
+
+                        <Button_1.default isSmall width="max" className="ds_no-margin">Apply filter</Button_1.default>
+                    </form>
+                </div>
+            </div>
+        </div>);
+};
+Filters.Panel = exports.FilterPanel;
+Filters.CheckboxGroup = FilterCheckboxGroup;
+FilterCheckboxGroup.displayName = 'Filters.CheckboxGroup';
+exports.FilterPanel.displayName = 'Filters.Panel';
+exports.default = Filters;

package/dist/components/SearchFilters/index.d.ts

@@ -0,0 +1 @@
+export { default } from './SearchFilters';

package/dist/components/SearchFilters/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var SearchFilters_1 = require("./SearchFilters");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(SearchFilters_1).default; } });

package/dist/components/SearchResult/SearchResult.d.ts

@@ -0,0 +1,28 @@
+declare const SearchResult: {
+    ({ children, href, isPromoted, linkComponent, promotedTitle, title, ...props }: SGDS.Component.SearchResult): import("react").JSX.Element;
+    Content: {
+        ({ children }: SGDS.Component.SearchResult.Content): import("react").JSX.Element;
+        displayName: string;
+    };
+    Context: {
+        ({ children, title }: SGDS.Component.SearchResult.Context): import("react").JSX.Element;
+        displayName: string;
+    };
+    ContextItem: {
+        ({ children }: SGDS.Component.SearchResult.ContextItem): import("react").JSX.Element;
+        displayName: string;
+    };
+    Media: {
+        ({ children }: SGDS.Component.SearchResult.Media): import("react").JSX.Element;
+        displayName: string;
+    };
+    Meta: {
+        ({ children }: SGDS.Component.SearchResult.Meta): import("react").JSX.Element;
+        displayName: string;
+    };
+    MetaItem: {
+        ({ children, className, name, ...props }: SGDS.Component.Metadata.Item): import("react").JSX.Element;
+        displayName: string;
+    };
+};
+export default SearchResult;

package/dist/components/SearchResult/SearchResult.jsx

@@ -0,0 +1,93 @@
+"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 AspectBox_1 = __importDefault(require("../AspectBox"));
+const PageMetadata_1 = __importDefault(require("../PageMetadata"));
+const SearchResultLinkHrefContext = (0, react_1.createContext)('');
+const SearchResultContent = ({ children }) => {
+    const otherChildren = [];
+    let imageChild = null;
+    // assign to slots
+    react_1.Children.forEach(children, (child) => {
+        const thisChild = child;
+        if (thisChild && thisChild.type === SearchResultMedia) {
+            imageChild = thisChild;
+        }
+        else {
+            otherChildren.push(thisChild);
+        }
+    });
+    return (imageChild ?
+        (<div className="ds_search-result__has-media">
+                {imageChild}
+                <div className="ds_search-result__summary">{otherChildren}</div>
+            </div>)
+        :
+            (<div className="ds_search-result__summary">
+                {otherChildren}
+            </div>));
+};
+const SearchResultContext = ({ children, title = 'Part of' }) => {
+    return (<dl className="ds_search-result__context">
+            <dt className="ds_search-result__context-key">{title}:</dt>
+            {children}
+        </dl>);
+};
+const SearchResultContextItem = ({ children }) => {
+    return (<dd className="ds_search-result__context-value">
+            {children}
+        </dd>);
+};
+const SearchResultMedia = ({ children }) => {
+    return (<div className="ds_search-result__media-wrapper">
+            <a className="ds_search-result__media-link" href={(0, react_1.useContext)(SearchResultLinkHrefContext)} tabIndex={-1} aria-hidden="true">
+                <AspectBox_1.default className="ds_search-result__media" ratio="1:1">
+                    {children}
+                </AspectBox_1.default>
+            </a>
+        </div>);
+};
+const SearchResultMeta = ({ children }) => {
+    return (<PageMetadata_1.default className="ds_search-result__metadata" isInline>
+            {children}
+        </PageMetadata_1.default>);
+};
+const SearchResult = ({ children, href, isPromoted, linkComponent, promotedTitle = 'Recommended', title, ...props }) => {
+    const LINK_CLASS = 'ds_search-result__link';
+    return (<div className={[
+            'ds_search-result',
+            isPromoted ? 'ds_search-result--promoted' : ''
+        ].join(' ')} {...props}>
+            <ConditionalWrapper_1.default condition={!!isPromoted} wrapper={(children) => <div className="ds_search-result--promoted-content">
+                    <header className="ds_search-result--promoted-title">{promotedTitle}</header>
+                    {children}
+                </div>}>
+                <SearchResultLinkHrefContext value={href}>
+                    <h3 className="ds_search-result__title">
+                        {linkComponent ?
+            linkComponent({ className: LINK_CLASS, children: title, href }) :
+            <a className={LINK_CLASS} href={href}>{title}</a>}
+                    </h3>
+
+                    {children}
+                </SearchResultLinkHrefContext>
+            </ConditionalWrapper_1.default>
+        </div>);
+};
+SearchResult.Content = SearchResultContent;
+SearchResult.Context = SearchResultContext;
+SearchResult.ContextItem = SearchResultContextItem;
+SearchResult.Media = SearchResultMedia;
+SearchResult.Meta = SearchResultMeta;
+SearchResult.MetaItem = PageMetadata_1.default.Item;
+SearchResultContent.displayName = 'SearchResult.Content';
+SearchResultContext.displayName = 'SearchResult.Context';
+SearchResultContextItem.displayName = 'SearchResult.ContextItem';
+SearchResultMedia.displayName = 'SearchResult.Media';
+SearchResultMeta.displayName = 'SearchResult.Meta';
+SearchResult.MetaItem.displayName = 'SearchResult.MetaItem';
+exports.default = SearchResult;

package/dist/components/SearchResult/index.d.ts

@@ -0,0 +1 @@
+export { default } from './SearchResult';

package/dist/components/SearchResult/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var SearchResult_1 = require("./SearchResult");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(SearchResult_1).default; } });

package/dist/components/SearchSort/SearchSort.d.ts

@@ -0,0 +1,10 @@
+import { AllHTMLAttributes } from "react";
+declare const SearchSort: {
+    ({ children, className, id, label, onApply, ...props }: SGDS.Component.SearchSort): import("react").JSX.Element;
+    displayName: string;
+    Option: {
+        ({ children, value }: AllHTMLAttributes<HTMLOptionElement>): import("react").JSX.Element;
+        displayName: string;
+    };
+};
+export default SearchSort;

package/dist/components/SearchSort/SearchSort.jsx

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const Button_1 = __importDefault(require("../Button"));
+const Select_1 = __importDefault(require("../Select"));
+const Option = ({ children, value }) => {
+    return (<option value={value}>
+            {children}
+        </option>);
+};
+const SearchSort = ({ children, className, id = 'sort-by', label = 'Sort by', onApply, ...props }) => {
+    return (<div className={[
+            'ds_sort-options',
+            className
+        ].join(' ')} {...props}>
+            <Select_1.default id={id} label={label}>
+                {children}
+            </Select_1.default>
+
+            <Button_1.default onClick={onApply} isSmall buttonStyle="secondary" type="submit">Apply sort</Button_1.default>
+        </div>);
+};
+SearchSort.displayName = 'SearchSort';
+Option.displayName = 'SearchSort.Option';
+SearchSort.Option = Option;
+exports.default = SearchSort;

package/dist/components/SearchSort/index.d.ts

@@ -0,0 +1 @@
+export { default } from './SearchSort';

package/dist/components/SearchSort/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var SearchSort_1 = require("./SearchSort");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(SearchSort_1).default; } });

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,5 @@
+declare const Select: {
+    ({ children, className, defaultValue, errorMessage, hasError, hintText, id, label, name, onBlur, onChange, placeholder, width, ...props }: SGDS.Component.Select): import("react").JSX.Element;
+    displayName: string;
+};
+export default Select;

package/dist/components/Select/Select.jsx

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const ErrorMessage_1 = __importDefault(require("../ErrorMessage/ErrorMessage"));
+const ErrorMessage_1 = __importDefault(require("../ErrorMessage"));
 const HintText_1 = __importDefault(require("../../common/HintText"));
 const Select = function ({ children, className, defaultValue, errorMessage, hasError, hintText, id, label, name, onBlur, onChange, placeholder, width, ...props }) {
     const errorMessageId = `error-message-${id}`;

package/dist/components/Select/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Select';