@databiosphere/findable-ui 25.0.0 → 26.0.0

package/tests/tableFilter.test.tsx

@@ -0,0 +1,90 @@
+import { composeStories } from "@storybook/react";
+import { render } from "@testing-library/react";
+import React from "react";
+import * as filterStories from "../src/components/Detail/components/Table/stories/filter/filter.stories";
+
+const COLUMN_INDEX = {
+  ARRAY: 1,
+  NUMBER: 3,
+  STRING: 0,
+};
+
+const {
+  FilterByArrayValue,
+  FilterByRangeBetweenValue,
+  FilterByRangeGreaterThanValue,
+  FilterByRangeLessThanValue,
+  FilterByStringValue,
+  FilterByStringValueWithNoMatch,
+} = composeStories(filterStories);
+
+describe("Table - Filtering", () => {
+  describe("Table filter stories", () => {
+    test("FilterByStringValueWithNoMatch shows no rows", () => {
+      const { container } = render(<FilterByStringValueWithNoMatch />);
+      const rows = container.querySelectorAll("tbody tr");
+      expect(rows).toHaveLength(0);
+    });
+
+    test("FilterByStringValue shows rows matching the filters of string values", () => {
+      const { container } = render(<FilterByStringValue />);
+      const rows = container.querySelectorAll("tbody tr");
+      expect(rows).toHaveLength(2);
+      rows.forEach((row) => {
+        const cell = row.querySelectorAll("td")[COLUMN_INDEX.STRING];
+        const text = cell.textContent;
+        expect(text).toMatch(
+          /Coronary Artery Disease Study|Myocardial Infarction Study/
+        );
+        expect(text).not.toMatch(/Myocardial Infarction Study X/);
+      });
+    });
+
+    test("FilterByArrayValue shows rows matching the filters of array values", () => {
+      const { container } = render(<FilterByArrayValue />);
+      const rows = container.querySelectorAll("tbody tr");
+      expect(rows).toHaveLength(4);
+      rows.forEach((row) => {
+        const cell = row.querySelectorAll("td")[COLUMN_INDEX.ARRAY];
+        const text = cell.textContent;
+        expect(text).toMatch(/Exome|RNAseq/);
+        // Confirm that the text "Whole Genome" is not present in any row cell as a single value.
+        expect(text).not.toMatch(/^Whole Genome$/);
+      });
+    });
+
+    test("FilterByRangeBetweenValue shows rows matching filters between two number values", () => {
+      const { container } = render(<FilterByRangeBetweenValue />);
+      const rows = container.querySelectorAll("tbody tr");
+      expect(rows).toHaveLength(2);
+      rows.forEach((row) => {
+        const cell = row.querySelectorAll("td")[COLUMN_INDEX.NUMBER];
+        const value = Number(cell.textContent);
+        expect(value).toBeGreaterThanOrEqual(10);
+        expect(value).toBeLessThanOrEqual(100);
+      });
+    });
+
+    test("FilterByRangeGreaterThanValue shows rows matching filters greater than a number value", () => {
+      const { container } = render(<FilterByRangeGreaterThanValue />);
+      const rows = container.querySelectorAll("tbody tr");
+      expect(rows).toHaveLength(4);
+      rows.forEach((row) => {
+        const cell = row.querySelectorAll("td")[COLUMN_INDEX.NUMBER];
+        const value = Number(cell.textContent);
+        expect(value).toBeGreaterThanOrEqual(100);
+      });
+    });
+
+    test("FilterByRangeLessThanValue shows rows matching filters less than a number value", () => {
+      const { container } = render(<FilterByRangeLessThanValue />);
+      const rows = container.querySelectorAll("tbody tr");
+      expect(rows).toHaveLength(3);
+      rows.forEach((row) => {
+        const cell = row.querySelectorAll("td")[COLUMN_INDEX.NUMBER];
+        const value = Number(cell.textContent);
+        expect(value).toBeLessThanOrEqual(100);
+      });
+    });
+  });
+});

package/lib/components/DataDictionary/components/Table/columns/columnDef.d.ts

@@ -1,6 +0,0 @@
-import { ColumnDef } from "@tanstack/react-table";
-import { Attribute } from "../../../../../common/entities";
-import { COLUMN_IDENTIFIER } from "./columnIdentifier";
-import { AttributeValue } from "./types";
-export declare const COLUMN_DEF: Record<keyof typeof COLUMN_IDENTIFIER, ColumnDef<Attribute, AttributeValue>>;
-export declare const COLUMN_DEFS: ColumnDef<Attribute, AttributeValue>[];

package/lib/components/DataDictionary/components/Table/columns/columnDef.js

@@ -1,33 +0,0 @@
-import { BasicCell } from "../components/BasicCell/basicCell";
-import { COLUMN_IDENTIFIER } from "./columnIdentifier";
-const COLUMN_DEF_DESCRIPTION = {
-    accessorFn: (row) => row.description,
-    cell: (props) => BasicCell({ ...props }),
-    header: "Description",
-    id: COLUMN_IDENTIFIER.DESCRIPTION,
-    meta: { width: { max: "2fr", min: "480px" } },
-};
-const COLUMN_DEF_KEY = {
-    accessorFn: (row) => row.key,
-    cell: (props) => BasicCell({ ...props }),
-    header: "Key",
-    id: COLUMN_IDENTIFIER.KEY,
-    meta: { width: { max: "1fr", min: "180px" } },
-};
-const COLUMN_DEF_LABEL = {
-    accessorFn: (row) => row.label,
-    cell: (props) => BasicCell({ ...props }),
-    header: "Label",
-    id: COLUMN_IDENTIFIER.LABEL,
-    meta: { width: { max: "1fr", min: "200px" } },
-};
-export const COLUMN_DEF = {
-    DESCRIPTION: COLUMN_DEF_DESCRIPTION,
-    KEY: COLUMN_DEF_KEY,
-    LABEL: COLUMN_DEF_LABEL,
-};
-export const COLUMN_DEFS = [
-    COLUMN_DEF.LABEL,
-    COLUMN_DEF.KEY,
-    COLUMN_DEF.DESCRIPTION,
-];

package/lib/components/DataDictionary/components/Table/columns/columnIdentifier.d.ts

@@ -1,5 +0,0 @@
-export declare const COLUMN_IDENTIFIER: {
-    readonly DESCRIPTION: "description";
-    readonly KEY: "key";
-    readonly LABEL: "label";
-};

package/lib/components/DataDictionary/components/Table/columns/columnIdentifier.js

@@ -1,5 +0,0 @@
-export const COLUMN_IDENTIFIER = {
-    DESCRIPTION: "description",
-    KEY: "key",
-    LABEL: "label",
-};

package/lib/components/DataDictionary/components/Table/columns/types.d.ts

@@ -1,2 +0,0 @@
-import { Attribute } from "../../../../../common/entities";
-export type AttributeValue = Attribute[keyof Attribute];

package/lib/components/Detail/components/Table/components/TableHead/tableHead.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { Table } from "@tanstack/react-table";
-import { ROW_DIRECTION } from "../../../../../Table/common/entities";
-export interface TableBodyProps<T> {
-    rowDirection: ROW_DIRECTION;
-    tableInstance: Table<T>;
-}
-export declare const TableHead: <T extends object>({ rowDirection, tableInstance, }: TableBodyProps<T>) => JSX.Element;

package/lib/components/Detail/components/Table/components/TableHead/tableHead.js

@@ -1,36 +0,0 @@
-"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 (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TableHead = void 0;
-const material_1 = require("@mui/material");
-const react_table_1 = require("@tanstack/react-table");
-const react_1 = __importStar(require("react"));
-const entities_1 = require("../../../../../Table/common/entities");
-const TableHead = ({ rowDirection, tableInstance, }) => {
-    return (react_1.default.createElement(react_1.Fragment, null, rowDirection === entities_1.ROW_DIRECTION.DEFAULT &&
-        tableInstance.getHeaderGroups().map((headerGroup) => (react_1.default.createElement(material_1.TableHead, { key: headerGroup.id },
-            react_1.default.createElement(material_1.TableRow, null, headerGroup.headers.map((header) => (react_1.default.createElement(material_1.TableCell, { key: header.id }, (0, react_table_1.flexRender)(header.column.columnDef.header, header.getContext()))))))))));
-};
-exports.TableHead = TableHead;

package/lib/components/Index/components/Cell/cell.d.ts

@@ -1,7 +0,0 @@
-export interface CellProps {
-    value?: number | string | string[];
-}
-/**
- * @deprecated - use BasicCell from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/BasicCell/basicCell"
- */
-export declare const Cell: ({ value }: CellProps) => JSX.Element;

package/lib/components/Index/components/Cell/cell.js

@@ -1,10 +0,0 @@
-import React from "react";
-/**
- * @deprecated - use BasicCell from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/BasicCell/basicCell"
- */
-export const Cell = ({ value = "Unspecified" }) => {
-    if (typeof value === "string" || typeof value === "number") {
-        return React.createElement("div", null, value);
-    }
-    return (React.createElement(React.Fragment, null, value.map((v) => (React.createElement("div", { key: v }, v)))));
-};

package/lib/components/Index/components/EntitiesView/constants.d.ts

@@ -1 +0,0 @@
-export declare const ENTITIES_VIEW_TEST_ID = "entities-view";

package/lib/components/Index/components/EntitiesView/constants.js

@@ -1 +0,0 @@
-export const ENTITIES_VIEW_TEST_ID = "entities-view";

package/lib/components/Index/components/NTag/components/Tooltip/tooltip.d.ts

@@ -1,8 +0,0 @@
-import { TooltipProps as MTooltipProps } from "@mui/material";
-export interface TooltipProps extends MTooltipProps {
-    className?: string;
-}
-/**
- * @deprecated - use Tooltip from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/NTagCell/components/NTag/components/Tooltip/tooltip"
- */
-export declare const Tooltip: ({ children, className, title, ...props }: TooltipProps) => JSX.Element;

package/lib/components/Index/components/NTag/components/Tooltip/tooltip.js

@@ -1,57 +0,0 @@
-import { Tooltip as MTooltip, } from "@mui/material";
-import { detectOverflow } from "@popperjs/core";
-import React, { useMemo, useState } from "react";
-import { TooltipContent } from "./tooltip.styles";
-const DEFAULT_FLIP_MODIFIER = {
-    enabled: true,
-    name: "flip",
-    options: {
-        fallbackPlacements: ["bottom", "right", "left"],
-    },
-};
-const DEFAULT_PREVENT_OVERFLOW_MODIFIER = {
-    enabled: true,
-    name: "preventOverflow",
-    options: {
-        padding: 16,
-    },
-};
-/**
- * @deprecated - use Tooltip from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/NTagCell/components/NTag/components/Tooltip/tooltip"
- */
-export const Tooltip = ({ children, className, title, ...props /* Spread props to allow for Mui Tooltip specific prop overrides. */ }) => {
-    const [maxHeight, setMaxHeight] = useState();
-    const modifiers = useMemo(() => [
-        {
-            enabled: true,
-            fn: ({ state }) => setMaxHeight(calculateMaxHeight(state)),
-            name: "maxHeight",
-            phase: "main",
-            requiresIfExists: ["offset"],
-        },
-        DEFAULT_FLIP_MODIFIER,
-        DEFAULT_PREVENT_OVERFLOW_MODIFIER,
-    ], []);
-    return (React.createElement(MTooltip, { arrow: true, className: className, onClose: () => setMaxHeight(undefined), slotProps: {
-            popper: { modifiers },
-            tooltip: { style: { display: "flex", maxHeight, padding: 0 } },
-        }, title: React.createElement(TooltipContent, null, title), ...props }, children));
-};
-/**
- * Calculate the max height of the tooltip based on the current popper modifier state.
- * @param state - Popper modifier state.
- * @returns tooltip maximum height.
- */
-function calculateMaxHeight(state) {
-    const overflow = detectOverflow(state);
-    const { placement } = state;
-    if (placement === "left" || placement === "right") {
-        return window.innerHeight - 32;
-    }
-    if (placement === "top") {
-        return state.rects.popper.height - overflow.top - 24;
-    }
-    if (placement === "bottom") {
-        return state.rects.popper.height - overflow.bottom - 24;
-    }
-}

package/lib/components/Index/components/NTag/components/Tooltip/tooltip.styles.d.ts

@@ -1,4 +0,0 @@
-export declare const TooltipContent: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/lib/components/Index/components/NTag/components/Tooltip/tooltip.styles.js

@@ -1,10 +0,0 @@
-import styled from "@emotion/styled";
-export const TooltipContent = styled.span `
-  overflow: scroll;
-  overscroll-behavior: none;
-  padding: 8px 12px;
-
-  &::-webkit-scrollbar {
-    display: none;
-  }
-`;

package/lib/components/Index/components/NTag/nTag.d.ts

@@ -1,10 +0,0 @@
-import { ReactElement } from "react";
-export interface NTagProps {
-    className?: string;
-    Tag: ReactElement;
-    TooltipTitle: ReactElement;
-}
-/**
- * @deprecated - use NTag from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/NTagCell/components/NTag/nTag"
- */
-export declare const NTag: ({ className, Tag, TooltipTitle, ...props }: NTagProps) => JSX.Element;

package/lib/components/Index/components/NTag/nTag.js

@@ -1,8 +0,0 @@
-import React from "react";
-import { Tooltip } from "./components/Tooltip/tooltip";
-/**
- * @deprecated - use NTag from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/NTagCell/components/NTag/nTag"
- */
-export const NTag = ({ className, Tag, TooltipTitle, ...props /* Spread props to allow for Mui Tooltip specific prop overrides. */ }) => {
-    return (React.createElement(Tooltip, { className: className, title: TooltipTitle, ...props }, Tag));
-};

package/lib/components/Index/components/NTagCell/nTagCell.d.ts

@@ -1,11 +0,0 @@
-import { TypographyProps } from "../../../common/Typography/common/entities";
-export type MetadataValue = string;
-export interface NTagCellProps {
-    label: string;
-    TypographyProps?: TypographyProps;
-    values: MetadataValue[];
-}
-/**
- * @deprecated - use NTagCell from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/NTagCell/nTagCell"
- */
-export declare const NTagCell: ({ label, TypographyProps, values, }: NTagCellProps) => JSX.Element;

package/lib/components/Index/components/NTagCell/nTagCell.js

@@ -1,29 +0,0 @@
-import { Chip as MChip, Typography, } from "@mui/material";
-import React, { forwardRef } from "react";
-import { TEXT_BODY_SMALL_400 } from "../../../../theme/common/typography";
-import { NTag } from "../NTag/nTag";
-// Template constants
-const MAX_DISPLAYABLE_VALUES = 1;
-/**
- * String-concatenates the specified list of metadata values to a string value, joined by a comma ",".
- * @param metadataValues - List of metadata values.
- * @returns the metadata values in a string, each value joined by a comma.
- */
-function stringifyMetadataValues(metadataValues) {
-    return metadataValues.join(", ");
-}
-/**
- * Renders tag for NTag component.
- * Tooltip children require forward ref.
- */
-const Tag = forwardRef(function Tag(props, ref) {
-    return React.createElement(MChip, { ref: ref, ...props });
-});
-/**
- * @deprecated - use NTagCell from "@databiosphere/findable-ui/lib/components/Table/components/TableCell/components/NTagCell/nTagCell"
- */
-export const NTagCell = ({ label, TypographyProps, values, }) => {
-    const metadataCount = values.length;
-    const showNTag = metadataCount > MAX_DISPLAYABLE_VALUES;
-    return (React.createElement(React.Fragment, null, showNTag ? (React.createElement(NTag, { Tag: React.createElement(Tag, { label: `${metadataCount} ${label}`, variant: "ntag" }), TooltipTitle: React.createElement(Typography, { display: "block", variant: TEXT_BODY_SMALL_400 }, stringifyMetadataValues(values)) })) : (values.map((value, v) => (React.createElement(Typography, { key: `${value}${v}`, variant: "inherit", ...TypographyProps }, value))))));
-};

package/lib/components/Index/components/NTagCell/nTagCell.stories.d.ts

@@ -1,5 +0,0 @@
-import { ComponentMeta } from "@storybook/react";
-import { NTagCell } from "./nTagCell";
-declare const _default: ComponentMeta<typeof NTagCell>;
-export default _default;
-export declare const NTagCellStory: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./nTagCell").NTagCellProps>;

package/lib/components/Index/components/NTagCell/nTagCell.stories.js

@@ -1,16 +0,0 @@
-import React from "react";
-import { NTagCell } from "./nTagCell";
-export default {
-    argTypes: {
-        label: { control: "text" },
-        values: { control: "array" },
-    },
-    component: NTagCell,
-    title: "Components/Table/Cell/NTagCell",
-};
-const NTagCellTemplate = (args) => (React.createElement(NTagCell, { ...args }));
-export const NTagCellStory = NTagCellTemplate.bind({});
-NTagCellStory.args = {
-    label: "species",
-    values: ["Homo sapiens", "Mus musculus"],
-};

package/lib/components/Index/components/TitleCell/titleCell.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from "react";
-import { LinkProps } from "../../../Links/components/Link/link";
-export interface TitleCellProps extends LinkProps {
-    title: ReactNode;
-}
-export declare const TitleCell: ({ title, ...props }: TitleCellProps) => JSX.Element;

package/lib/components/Index/components/TitleCell/titleCell.js

@@ -1,10 +0,0 @@
-import { Typography } from "@mui/material";
-import React from "react";
-import { TEXT_BODY_400 } from "../../../../theme/common/typography";
-import { Link } from "../../../Links/components/Link/link";
-import { TitleCell as Cell } from "./titleCell.styles";
-export const TitleCell = ({ title, ...props }) => {
-    return (React.createElement(Cell, { gridSx: { gap: 1 } },
-        typeof title === "string" ? (React.createElement(Typography, { variant: TEXT_BODY_400 }, title)) : (title),
-        React.createElement(Link, { ...props })));
-};

package/lib/components/Index/components/TitleCell/titleCell.styles.d.ts

@@ -1,3 +0,0 @@
-export declare const TitleCell: import("@emotion/styled").StyledComponent<import("../../../common/Grid/grid").GridProps & {
-    theme?: import("@emotion/react").Theme;
-}, {}, {}>;

package/lib/components/Index/components/TitleCell/titleCell.styles.js

@@ -1,6 +0,0 @@
-import styled from "@emotion/styled";
-import { textBodySmall400 } from "../../../../styles/common/mixins/fonts";
-import { Grid } from "../../../common/Grid/grid";
-export const TitleCell = styled(Grid) `
-  ${textBodySmall400};
-`;

package/lib/components/Layout/components/BackPage/components/BackPageHero/backPageHero.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { BackPageHero } from "./backPageHero";
-declare const _default: Meta<typeof BackPageHero>;
-export default _default;
-type Story = StoryObj<typeof BackPageHero>;
-export declare const BackPageHeroStory: Story;

package/lib/components/Layout/components/BackPage/components/BackPageHero/backPageHero.stories.js

@@ -1,10 +0,0 @@
-import { BackPageHero } from "./backPageHero";
-export default {
-    component: BackPageHero,
-    title: "Components/Hero",
-};
-export const BackPageHeroStory = {
-    args: {
-        title: "A Single-Cell Transcriptomic Map of the Human and Mouse Pancreas Reveals Inter- and Intra-cell Population Structure",
-    },
-};

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Authentication/components/AuthenticationMenu/authenticationMenu.stories.d.ts

@@ -1,5 +0,0 @@
-import { Meta } from "@storybook/react";
-import { AuthenticationMenu } from "./authenticationMenu";
-declare const _default: Meta<typeof AuthenticationMenu>;
-export default _default;
-export declare const AuthenticationMenuStory: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./authenticationMenu").AuthenticationMenuProps>;

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Authentication/components/AuthenticationMenu/authenticationMenu.stories.js

@@ -1,29 +0,0 @@
-import React from "react";
-import { AuthenticationMenu } from "./authenticationMenu";
-export default {
-    argTypes: {
-        onLogout: {
-            description: "Callback to be called when 'Logout' button is clicked",
-        },
-        userProfile: {
-            description: "User profile with name and avatar",
-        },
-    },
-    component: AuthenticationMenu,
-    title: "Components/Navigation/AuthenticationMenu",
-};
-const AuthenticationMenuTemplate = (args) => React.createElement(AuthenticationMenu, { ...args });
-export const AuthenticationMenuStory = AuthenticationMenuTemplate.bind({});
-AuthenticationMenuStory.args = {
-    userProfile: {
-        email: "john@smith.com",
-        email_verified: true,
-        family_name: "Smith",
-        given_name: "John",
-        hd: "",
-        locale: "",
-        name: "john_smith",
-        picture: "https://i.pravatar.cc/200",
-        sub: "",
-    },
-};

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Authentication/components/RequestAuthentication/requestAuthentication.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-export interface RequestAuthenticationProps {
-    closeMenu: () => void;
-    requestAuthorization: () => void;
-}
-export declare const RequestAuthentication: ({ closeMenu, requestAuthorization, }: RequestAuthenticationProps) => JSX.Element;

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Authentication/components/RequestAuthentication/requestAuthentication.js

@@ -1,13 +0,0 @@
-import LoginRoundedIcon from "@mui/icons-material/LoginRounded";
-import { IconButton as MIconButton } from "@mui/material";
-import React from "react";
-import { useBreakpoint } from "../../../../../../../../../../../../hooks/useBreakpoint";
-import { Button } from "./requestAuthentication.styles";
-export const RequestAuthentication = ({ closeMenu, requestAuthorization, }) => {
-    const { mdUp } = useBreakpoint();
-    return mdUp ? (React.createElement(Button, { onClick: requestAuthorization, startIcon: React.createElement(LoginRoundedIcon, null), variant: "nav" }, "Sign in")) : (React.createElement(MIconButton, { color: "ink", onClick: () => {
-            closeMenu();
-            requestAuthorization();
-        } },
-        React.createElement(LoginRoundedIcon, null)));
-};

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Authentication/components/RequestAuthentication/requestAuthentication.styles.d.ts

@@ -1,36 +0,0 @@
-/// <reference types="react" />
-export declare const Button: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: "inherit" | "primary" | "secondary" | "error" | "info" | "success" | "warning" | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: "large" | "medium" | "small" | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: "nav" | "text" | "outlined" | "contained" | "activeNav" | "backNav" | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "sx" | "variant" | "href" | "disabled" | "action" | "size" | "fullWidth" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Authentication/components/RequestAuthentication/requestAuthentication.styles.js

@@ -1,9 +0,0 @@
-import styled from "@emotion/styled";
-import { Button as MButton } from "@mui/material";
-import { textBody500 } from "../../../../../../../../../../../../styles/common/mixins/fonts";
-export const Button = styled(MButton) `
-  & {
-    ${textBody500};
-    padding: 6px 12px;
-  }
-`;

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Search/components/SearchButton/searchButton.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export interface SearchProps {
-    openSearch: () => void;
-}
-export declare const SearchButton: ({ openSearch }: SearchProps) => JSX.Element;

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Search/components/SearchButton/searchButton.js

@@ -1,10 +0,0 @@
-import { IconButton } from "@mui/material";
-import React from "react";
-import { useBreakpoint } from "../../../../../../../../../../../../hooks/useBreakpoint";
-import { SearchIcon } from "../../../../../../../../../../../common/CustomIcon/components/SearchIcon/searchIcon";
-import { Button } from "./searchButton.styles";
-export const SearchButton = ({ openSearch }) => {
-    const { mdUp } = useBreakpoint();
-    return mdUp ? (React.createElement(Button, { onClick: openSearch, startIcon: React.createElement(SearchIcon, null), variant: "nav" }, "Search")) : (React.createElement(IconButton, { color: "ink", onClick: openSearch },
-        React.createElement(SearchIcon, { fontSize: "medium" })));
-};

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Search/components/SearchButton/searchButton.styles.d.ts

@@ -1,36 +0,0 @@
-/// <reference types="react" />
-export declare const Button: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: "inherit" | "primary" | "secondary" | "error" | "info" | "success" | "warning" | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: "large" | "medium" | "small" | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: "nav" | "text" | "outlined" | "contained" | "activeNav" | "backNav" | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "sx" | "variant" | "href" | "disabled" | "action" | "size" | "fullWidth" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;

package/lib/components/Layout/components/Header/components/Content/components/Actions/components/Search/components/SearchButton/searchButton.styles.js

@@ -1,9 +0,0 @@
-import styled from "@emotion/styled";
-import { Button as MButton } from "@mui/material";
-import { textBody500 } from "../../../../../../../../../../../../styles/common/mixins/fonts";
-export const Button = styled(MButton) `
-  & {
-    ${textBody500};
-    padding: 6px 12px;
-  }
-`;