creevey 0.9.0-non-webpack.2.fix-capture-element → 0.9.1

package/{lib/types → dist}/client/web/CreeveyView/SideBar/SideBar.d.ts

@@ -1,14 +1,14 @@
-import React from 'react';
-import { CreeveySuite, CreeveyTest } from '../../../../types';
-import { CreeveyViewFilter } from '../../../shared/helpers';
-export declare const SideBarContext: React.Context<{
-    onOpenTest: (test: CreeveyTest) => void;
-}>;
-export interface SideBarProps {
-    rootSuite: CreeveySuite;
-    openedTest: CreeveyTest | null;
-    onOpenTest: (test: CreeveyTest) => void;
-    filter: CreeveyViewFilter;
-    setFilter: (filter: CreeveyViewFilter) => void;
-}
-export declare function SideBar({ rootSuite, openedTest, onOpenTest, filter, setFilter }: SideBarProps): JSX.Element;
+import React from 'react';
+import { CreeveySuite, CreeveyTest } from '../../../../types.js';
+import { CreeveyViewFilter } from '../../../shared/helpers.js';
+export declare const SideBarContext: React.Context<{
+    onOpenTest: (test: CreeveyTest) => void;
+}>;
+export interface SideBarProps {
+    testId?: string;
+    rootSuite: CreeveySuite;
+    onOpenTest: (test: CreeveyTest) => void;
+    filter: CreeveyViewFilter;
+    setFilter: (filter: CreeveyViewFilter) => void;
+}
+export declare function SideBar({ rootSuite, testId, onOpenTest, filter, setFilter }: SideBarProps): JSX.Element;

package/dist/client/web/CreeveyView/SideBar/SideBar.js

@@ -0,0 +1,111 @@
+"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.SideBarContext = void 0;
+exports.SideBar = SideBar;
+const react_1 = __importStar(require("react"));
+const polished_1 = require("polished");
+const components_1 = require("@storybook/components");
+const theming_1 = require("@storybook/theming");
+const SideBarHeader_js_1 = require("./SideBarHeader.js");
+const types_js_1 = require("../../../../types.js");
+const helpers_js_1 = require("../../../shared/helpers.js");
+const CreeveyContext_js_1 = require("../../CreeveyContext.js");
+const SuiteLink_js_1 = require("./SuiteLink.js");
+const TestLink_js_1 = require("./TestLink.js");
+const SideBarFooter_js_1 = require("./SideBarFooter.js");
+exports.SideBarContext = (0, react_1.createContext)({
+    onOpenTest: types_js_1.noop,
+});
+const Container = (0, theming_1.withTheme)(theming_1.styled.div(({ theme }) => ({
+    width: '300px',
+    boxShadow: `0 0 5px  ${(0, polished_1.transparentize)(0.8, theme.color.defaultText)}`,
+    zIndex: 1000,
+    background: theme.background.content,
+})));
+const ScrollContainer = theming_1.styled.div({
+    height: 'calc(100vh - 245px)',
+    width: 300,
+    flex: 'none',
+    overflowY: 'auto',
+    position: 'sticky',
+    top: '0',
+    left: '0',
+});
+const StyledScrollArea = (0, theming_1.styled)(components_1.ScrollArea)({
+    '& > div > div': {
+        height: 'calc(100% - 8px)',
+    },
+});
+const Shadow = (0, theming_1.withTheme)(theming_1.styled.div(({ theme, position }) => ({
+    [position]: '0px',
+    position: 'sticky',
+    boxShadow: `0 0 5px 2.5px ${(0, polished_1.transparentize)(0.8, theme.color.defaultText)}`,
+    zIndex: 3,
+})));
+const SelectAllContainer = theming_1.styled.div({
+    marginBottom: '30px',
+    paddingTop: '9px',
+});
+const TestsContainer = theming_1.styled.div({
+    position: 'relative',
+    paddingBottom: '8px',
+    height: '100%',
+});
+const Divider = (0, theming_1.withTheme)(theming_1.styled.div(({ theme, position }) => ({
+    ...(position === 'top' ? { position: 'absolute' } : { position: 'relative', bottom: '8px', marginBottom: '-8px' }),
+    height: '8px',
+    width: '100%',
+    zIndex: 4,
+    background: theme.background.content,
+})));
+function SideBar({ rootSuite, testId, onOpenTest, filter, setFilter }) {
+    const { onStart, onStop } = (0, CreeveyContext_js_1.useCreeveyContext)();
+    // TODO Maybe need to do flatten first?
+    const suite = (0, helpers_js_1.filterTests)(rootSuite, filter);
+    const testsStatus = (0, helpers_js_1.countTestsStatus)(rootSuite);
+    const suiteList = (0, helpers_js_1.flattenSuite)(suite);
+    const countCheckedTests = (0, helpers_js_1.getCheckedTests)(rootSuite).length;
+    const handleStart = () => {
+        onStart(suite);
+    };
+    return (react_1.default.createElement(exports.SideBarContext.Provider, { value: { onOpenTest } },
+        react_1.default.createElement(Container, null,
+            react_1.default.createElement(SideBarHeader_js_1.SideBarHeader, { testsStatus: testsStatus, filter: filter, onFilterChange: setFilter, onStart: handleStart, onStop: onStop, canStart: countCheckedTests !== 0 }),
+            react_1.default.createElement(ScrollContainer, null,
+                react_1.default.createElement(StyledScrollArea, { vertical: true },
+                    react_1.default.createElement(Shadow, { position: "top" }),
+                    react_1.default.createElement(TestsContainer, null,
+                        react_1.default.createElement(Divider, { position: "top" }),
+                        react_1.default.createElement(SelectAllContainer, null,
+                            react_1.default.createElement(SuiteLink_js_1.SuiteLink, { title: "Select all", suite: rootSuite, "data-testid": "selectAll" })),
+                        suiteList.map(({ title, suite }) => 
+                        // TODO Update components without re-mount
+                        (0, types_js_1.isTest)(suite) ? (react_1.default.createElement(TestLink_js_1.TestLink, { key: suite.id, title: title, opened: suite.id == testId, test: suite })) : (react_1.default.createElement(SuiteLink_js_1.SuiteLink, { key: suite.path.join('/'), title: title, suite: suite, "data-testid": title })))),
+                    react_1.default.createElement(Divider, { position: "bottom" })),
+                react_1.default.createElement(Shadow, { position: "bottom" })),
+            react_1.default.createElement(SideBarFooter_js_1.SideBarFooter, null))));
+}
+//# sourceMappingURL=SideBar.js.map

package/dist/client/web/CreeveyView/SideBar/SideBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideBar.js","sourceRoot":"","sources":["../../../../../src/client/web/CreeveyView/SideBar/SideBar.tsx"],"names":[],"mappings":"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"}

package/dist/client/web/CreeveyView/SideBar/SideBarFooter.d.ts

@@ -0,0 +1 @@
+export declare function SideBarFooter(): JSX.Element;

package/dist/client/web/CreeveyView/SideBar/SideBarFooter.js

@@ -0,0 +1,32 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SideBarFooter = SideBarFooter;
+const react_1 = __importDefault(require("react"));
+const theming_1 = require("@storybook/theming");
+const components_1 = require("@storybook/components");
+const CreeveyContext_js_1 = require("../../CreeveyContext.js");
+const Sticky = (0, theming_1.withTheme)(theming_1.styled.div(({ theme }) => ({
+    padding: '24px 16px 8px 16px',
+    background: theme.background.content,
+    height: '50px',
+    zIndex: 5,
+    position: 'sticky',
+    bottom: '0',
+})));
+const Container = theming_1.styled.div({
+    display: 'flex',
+    justifyContent: 'space-between',
+});
+function SideBarFooter() {
+    const { onApproveAll, onImageApprove } = (0, CreeveyContext_js_1.useCreeveyContext)();
+    return (react_1.default.createElement(Sticky, null,
+        react_1.default.createElement(Container, null,
+            react_1.default.createElement(components_1.Button, { secondary: true, onClick: onImageApprove, disabled: !onImageApprove, style: { paddingRight: 8 } },
+                "Approve",
+                react_1.default.createElement(components_1.Icons, { icon: "arrowright", style: { paddingLeft: 4 } })),
+            react_1.default.createElement(components_1.Button, { secondary: true, outline: true, onClick: onApproveAll }, "Approve all"))));
+}
+//# sourceMappingURL=SideBarFooter.js.map

package/dist/client/web/CreeveyView/SideBar/SideBarFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideBarFooter.js","sourceRoot":"","sources":["../../../../../src/client/web/CreeveyView/SideBar/SideBarFooter.tsx"],"names":[],"mappings":";;;;;AAqBA,sCAgBC;AArCD,kDAA0B;AAC1B,gDAAuD;AACvD,sDAAsD;AACtD,+DAA4D;AAE5D,MAAM,MAAM,GAAG,IAAA,mBAAS,EACtB,gBAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACzB,OAAO,EAAE,oBAAoB;IAC7B,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO;IACpC,MAAM,EAAE,MAAM;IACd,MAAM,EAAE,CAAC;IACT,QAAQ,EAAE,QAAQ;IAClB,MAAM,EAAE,GAAG;CACZ,CAAC,CAAC,CACJ,CAAC;AAEF,MAAM,SAAS,GAAG,gBAAM,CAAC,GAAG,CAAC;IAC3B,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,eAAe;CAChC,CAAC,CAAC;AAEH,SAAgB,aAAa;IAC3B,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,IAAA,qCAAiB,GAAE,CAAC;IAE7D,OAAO,CACL,8BAAC,MAAM;QACL,8BAAC,SAAS;YACR,8BAAC,mBAAM,IAAC,SAAS,QAAC,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,cAAc,EAAE,KAAK,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE;;gBAE9F,8BAAC,kBAAK,IAAC,IAAI,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,GAAI,CAC/C;YACT,8BAAC,mBAAM,IAAC,SAAS,QAAC,OAAO,QAAC,OAAO,EAAE,YAAY,kBAEtC,CACC,CACL,CACV,CAAC;AACJ,CAAC"}

package/{lib/types → dist}/client/web/CreeveyView/SideBar/SideBarHeader.d.ts

@@ -1,12 +1,12 @@
-import { TestsStatusProps } from './TestsStatus';
-import { CreeveyViewFilter } from '../../../shared/helpers';
-interface SideBarHeaderProps {
-    testsStatus: Omit<TestsStatusProps, 'onClickByStatus'>;
-    onStart: () => void;
-    onStop: () => void;
-    filter: CreeveyViewFilter;
-    onFilterChange: (value: CreeveyViewFilter) => void;
-    canStart?: boolean;
-}
-export declare function SideBarHeader({ testsStatus, onStop, onStart, filter, onFilterChange, canStart, }: SideBarHeaderProps): JSX.Element;
-export {};
+import { TestsStatusProps } from './TestsStatus.js';
+import { CreeveyViewFilter } from '../../../shared/helpers.js';
+interface SideBarHeaderProps {
+    testsStatus: Omit<TestsStatusProps, 'onClickByStatus'>;
+    onStart: () => void;
+    onStop: () => void;
+    filter: CreeveyViewFilter;
+    onFilterChange: (value: CreeveyViewFilter) => void;
+    canStart?: boolean;
+}
+export declare function SideBarHeader({ testsStatus, onStop, onStart, filter, onFilterChange, canStart, }: SideBarHeaderProps): JSX.Element;
+export {};

package/dist/client/web/CreeveyView/SideBar/SideBarHeader.js

@@ -0,0 +1,113 @@
+"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.SideBarHeader = SideBarHeader;
+const react_1 = __importStar(require("react"));
+const components_1 = require("@storybook/components");
+const theming_1 = require("@storybook/theming");
+const CreeveyContext_js_1 = require("../../CreeveyContext.js");
+const TestsStatus_js_1 = require("./TestsStatus.js");
+const Search_js_1 = require("./Search.js");
+const Sticky = (0, theming_1.withTheme)(theming_1.styled.div(({ theme }) => ({
+    padding: '24px 36px 8px',
+    background: theme.background.content,
+    height: '130px',
+    zIndex: 5,
+    position: 'sticky',
+    top: '0',
+})));
+const Container = theming_1.styled.div({
+    display: 'flex',
+    justifyContent: 'space-between',
+});
+const Header = theming_1.styled.h2({
+    fontWeight: 'normal',
+    margin: 0,
+});
+const Button = (0, theming_1.withTheme)((0, theming_1.styled)(components_1.Button)(({ theme }) => ({
+    display: 'flex',
+    justifyContent: 'center',
+    transform: 'none',
+    width: '60px',
+    padding: '8px 12px',
+    '& svg': {
+        width: '24px',
+        height: '24px',
+        marginRight: 0,
+    },
+    '&:active svg path': {
+        fill: theme.color.inverseText,
+    },
+})));
+const MarginContainer = theming_1.styled.div(({ left, right, top, bottom }) => ({
+    marginLeft: left ?? 0,
+    marginRight: right ?? 0,
+    marginTop: top ?? 0,
+    marginBottom: bottom ?? 0,
+}));
+const parseStringForFilter = (value) => {
+    let status = null;
+    const subStrings = [];
+    const tokens = value
+        .split(' ')
+        .filter(Boolean)
+        .map((word) => word.toLowerCase());
+    tokens.forEach((word) => {
+        const [, matchedStatus] = /^status:(failed|success|pending)$/i.exec(word) ?? [];
+        if (matchedStatus)
+            return (status = matchedStatus);
+        subStrings.push(word);
+    });
+    return { status, subStrings };
+};
+function SideBarHeader({ testsStatus, onStop, onStart, filter, onFilterChange, canStart, }) {
+    const { isReport, isRunning } = (0, react_1.useContext)(CreeveyContext_js_1.CreeveyContext);
+    const [filterInput, setFilterInput] = (0, react_1.useState)('');
+    const handleClickByStatus = (status) => {
+        if (status === filter.status) {
+            setFilterInput(filter.subStrings.join(' '));
+            onFilterChange({ status: null, subStrings: filter.subStrings });
+        }
+        else {
+            setFilterInput(filter.subStrings.join(' ') + ' status:' + status);
+            onFilterChange({ status, subStrings: filter.subStrings });
+        }
+    };
+    const handleInputFilterChange = (value) => {
+        setFilterInput(value);
+        onFilterChange(parseStringForFilter(value));
+    };
+    return (react_1.default.createElement(Sticky, null,
+        react_1.default.createElement(Container, null,
+            react_1.default.createElement("div", null,
+                react_1.default.createElement(Header, null, "colin.creevey"),
+                react_1.default.createElement(TestsStatus_js_1.TestsStatus, { ...testsStatus, onClickByStatus: handleClickByStatus })),
+            isReport ? null : (react_1.default.createElement(MarginContainer, { top: "10px" }, isRunning ? (react_1.default.createElement(Button, { outline: true, secondary: true, onClick: onStop },
+                react_1.default.createElement(components_1.Icons, { icon: "stop" }))) : (react_1.default.createElement(Button, { outline: true, secondary: true, onClick: onStart, disabled: !canStart },
+                react_1.default.createElement(components_1.Icons, { icon: "play" })))))),
+        react_1.default.createElement(MarginContainer, { top: "24px", bottom: "24px" },
+            react_1.default.createElement(Search_js_1.Search, { onChange: handleInputFilterChange, value: filterInput }))));
+}
+//# sourceMappingURL=SideBarHeader.js.map

package/dist/client/web/CreeveyView/SideBar/SideBarHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideBarHeader.js","sourceRoot":"","sources":["../../../../../src/client/web/CreeveyView/SideBar/SideBarHeader.tsx"],"names":[],"mappings":"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"}

package/dist/client/web/CreeveyView/SideBar/SuiteLink.d.ts

@@ -0,0 +1,43 @@
+import React from 'react';
+import { Theme } from '@storybook/theming';
+import { CreeveySuite } from '../../../../types.js';
+export interface SuiteLinkProps {
+    title: string;
+    suite: CreeveySuite;
+    'data-testid'?: string;
+}
+export declare const Container: React.FC<Pick<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & {
+    theme: Theme;
+    disabled?: boolean;
+    active?: boolean;
+    focused?: boolean;
+} & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+    children?: React.ReactNode | undefined;
+}, "as" | keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement> | "disabled" | "active" | "focused"> & {
+    theme?: Theme;
+}>;
+export declare const Button: React.FC<Pick<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & {
+    theme: Theme;
+    active?: boolean;
+} & React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    children?: React.ReactNode | undefined;
+}, "as" | "active" | keyof React.ClassAttributes<HTMLButtonElement> | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & {
+    theme?: Theme;
+}>;
+export declare const SuiteContainer: import("@storybook/theming").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & {
+    padding: number;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const SuiteTitle: import("@storybook/theming").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare function SuiteLink({ title, suite, 'data-testid': dataTid }: SuiteLinkProps): JSX.Element;

package/dist/client/web/CreeveyView/SideBar/SuiteLink.js

@@ -0,0 +1,123 @@
+"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.SuiteTitle = exports.SuiteContainer = exports.Button = exports.Container = void 0;
+exports.SuiteLink = SuiteLink;
+const react_1 = __importStar(require("react"));
+const components_1 = require("@storybook/components");
+const theming_1 = require("@storybook/theming");
+const Checkbox_js_1 = require("./Checkbox.js");
+const TestStatusIcon_js_1 = require("./TestStatusIcon.js");
+const types_js_1 = require("../../../../types.js");
+const CreeveyContext_js_1 = require("../../CreeveyContext.js");
+const KeyboardEventsContext_js_1 = require("../../KeyboardEventsContext.js");
+exports.Container = (0, theming_1.withTheme)(theming_1.styled.div(({ theme, disabled, active, focused }) => ({
+    position: 'relative',
+    width: '100%',
+    height: '28px',
+    lineHeight: '20px',
+    display: 'flex',
+    background: active ? theme.color.secondary : focused ? theme.background.hoverable : 'none',
+    color: active ? theme.color.inverseText : 'inherit',
+    outline: focused ? `1px solid ${theme.color.ancillary}` : 'none',
+    ...(disabled ? { color: theme.color.mediumdark, pointerEvents: 'none' } : {}),
+    // NOTE There is no way to trigger hover from js, so we add `.hover` class for testing purpose
+    '&:hover, &.hover': active
+        ? {}
+        : {
+            background: theme.background.hoverable,
+        },
+})));
+exports.Button = (0, theming_1.withTheme)(theming_1.styled.button(({ theme, active }) => ({
+    flexGrow: 1,
+    boxSizing: 'border-box',
+    appearance: 'none',
+    padding: '4px 16px 4px 8px',
+    lineHeight: '18px',
+    cursor: 'pointer',
+    border: 'none',
+    zIndex: 1,
+    textAlign: 'left',
+    background: 'none',
+    outline: 'none',
+    color: active ? theme.color.inverseText : 'inherit',
+})));
+const ArrowIcon = (0, theming_1.styled)(components_1.Icons)({
+    paddingRight: '4px',
+    display: 'inline-block',
+    width: '12px',
+    height: '18px',
+    verticalAlign: 'unset',
+});
+exports.SuiteContainer = theming_1.styled.span(({ padding }) => ({
+    paddingLeft: padding,
+    whiteSpace: 'normal',
+    display: 'grid',
+    gridTemplateColumns: 'repeat(2, min-content) auto',
+}));
+exports.SuiteTitle = theming_1.styled.span({
+    paddingLeft: '4px',
+    whiteSpace: 'nowrap',
+    overflowX: 'hidden',
+    textOverflow: 'ellipsis',
+});
+function SuiteLink({ title, suite, 'data-testid': dataTid }) {
+    const { onSuiteOpen, onSuiteToggle } = (0, react_1.useContext)(CreeveyContext_js_1.CreeveyContext);
+    const { sidebarFocusedItem, setSidebarFocusedItem } = (0, react_1.useContext)(KeyboardEventsContext_js_1.KeyboardEventsContext);
+    const checkboxRef = (0, react_1.useRef)(null);
+    const buttonRef = (0, react_1.useRef)(null);
+    const isSuiteFocused = (0, react_1.useMemo)(() => Array.isArray(sidebarFocusedItem) &&
+        sidebarFocusedItem.length === suite.path.length &&
+        sidebarFocusedItem.every((x) => suite.path.includes(x)), [suite, sidebarFocusedItem]);
+    (0, react_1.useEffect)(() => (suite.indeterminate ? checkboxRef.current?.setIndeterminate() : checkboxRef.current?.resetIndeterminate()), [suite.indeterminate]);
+    (0, react_1.useEffect)(() => {
+        if (isSuiteFocused)
+            buttonRef.current?.focus();
+    }, [isSuiteFocused]);
+    const isRootSuite = suite.path.length == 0;
+    const handleCheck = (value) => {
+        onSuiteToggle(suite.path, value);
+    };
+    const handleOpen = () => {
+        if (!isRootSuite) {
+            onSuiteOpen(suite.path, !suite.opened);
+            setSidebarFocusedItem(suite.path);
+        }
+    };
+    const handleFocus = () => {
+        setSidebarFocusedItem(suite.path);
+    };
+    return (react_1.default.createElement(exports.Container, { focused: isSuiteFocused },
+        react_1.default.createElement(Checkbox_js_1.CheckboxContainer, null,
+            react_1.default.createElement(Checkbox_js_1.Checkbox, { ref: checkboxRef, checked: suite.skip ? false : suite.checked, disabled: Boolean(suite.skip), onValueChange: handleCheck })),
+        react_1.default.createElement(exports.Button, { onClick: handleOpen, onFocus: handleFocus, "data-testid": dataTid, ref: buttonRef },
+            react_1.default.createElement(exports.SuiteContainer, { padding: (suite.path.length - 1) * 8 },
+                (0, types_js_1.isTest)(suite) ||
+                    (Boolean(suite.path.length) &&
+                        (suite.opened ? react_1.default.createElement(ArrowIcon, { icon: "arrowdown" }) : react_1.default.createElement(ArrowIcon, { icon: "arrowright" }))),
+                react_1.default.createElement(TestStatusIcon_js_1.TestStatusIcon, { status: suite.status, skip: suite.skip }),
+                react_1.default.createElement(exports.SuiteTitle, null, title)))));
+}
+//# sourceMappingURL=SuiteLink.js.map

package/dist/client/web/CreeveyView/SideBar/SuiteLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuiteLink.js","sourceRoot":"","sources":["../../../../../src/client/web/CreeveyView/SideBar/SuiteLink.tsx"],"names":[],"mappings":"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"}

package/{lib/types → dist}/client/web/CreeveyView/SideBar/TestLink.d.ts

@@ -1,7 +1,7 @@
-import { CreeveyTest } from '../../../../types';
-export interface TestLinkProps {
-    title: string;
-    opened: boolean;
-    test: CreeveyTest;
-}
-export declare function TestLink({ title, opened, test }: TestLinkProps): JSX.Element;
+import { CreeveyTest } from '../../../../types.js';
+export interface TestLinkProps {
+    title: string;
+    opened: boolean;
+    test: CreeveyTest;
+}
+export declare function TestLink({ title, opened, test }: TestLinkProps): JSX.Element;

package/dist/client/web/CreeveyView/SideBar/TestLink.js

@@ -0,0 +1,64 @@
+"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.TestLink = TestLink;
+const react_1 = __importStar(require("react"));
+const TestStatusIcon_js_1 = require("./TestStatusIcon.js");
+const CreeveyContext_js_1 = require("../../CreeveyContext.js");
+const SideBar_js_1 = require("./SideBar.js");
+const KeyboardEventsContext_js_1 = require("../../KeyboardEventsContext.js");
+const SuiteLink_js_1 = require("./SuiteLink.js");
+const Checkbox_js_1 = require("./Checkbox.js");
+const helpers_js_1 = require("../../../shared/helpers.js");
+function TestLink({ title, opened, test }) {
+    const { onSuiteToggle } = (0, react_1.useContext)(CreeveyContext_js_1.CreeveyContext);
+    const { onOpenTest } = (0, react_1.useContext)(SideBar_js_1.SideBarContext);
+    const { sidebarFocusedItem, setSidebarFocusedItem } = (0, react_1.useContext)(KeyboardEventsContext_js_1.KeyboardEventsContext);
+    const buttonRef = (0, react_1.useRef)(null);
+    const emptyResults = (test.results?.length ?? 0) == 0;
+    const testPath = (0, react_1.useMemo)(() => (0, helpers_js_1.getTestPath)(test), [test]);
+    const isTestFocused = (0, react_1.useMemo)(() => Array.isArray(sidebarFocusedItem) &&
+        testPath.length === sidebarFocusedItem.length &&
+        testPath.every((x) => sidebarFocusedItem.includes(x)), [testPath, sidebarFocusedItem]);
+    const handleCheck = (0, react_1.useCallback)((value) => {
+        onSuiteToggle(testPath, value);
+    }, [testPath, onSuiteToggle]);
+    (0, react_1.useEffect)(() => {
+        if (isTestFocused)
+            buttonRef.current?.focus();
+    }, [isTestFocused]);
+    const handleOpen = (0, react_1.useCallback)(() => {
+        onOpenTest(test);
+        setSidebarFocusedItem((0, helpers_js_1.getTestPath)(test));
+    }, [test, onOpenTest, setSidebarFocusedItem]);
+    return (react_1.default.createElement(SuiteLink_js_1.Container, { disabled: emptyResults, active: opened, focused: isTestFocused },
+        react_1.default.createElement(Checkbox_js_1.CheckboxContainer, null,
+            react_1.default.createElement(Checkbox_js_1.Checkbox, { checked: test.skip ? false : test.checked, disabled: Boolean(test.skip), onValueChange: handleCheck })),
+        react_1.default.createElement(SuiteLink_js_1.Button, { onClick: handleOpen, disabled: emptyResults, ref: buttonRef },
+            react_1.default.createElement(SuiteLink_js_1.SuiteContainer, { padding: (testPath.length + 1) * 8 },
+                react_1.default.createElement(TestStatusIcon_js_1.TestStatusIcon, { inverted: opened, status: test.status, skip: test.skip }),
+                react_1.default.createElement(SuiteLink_js_1.SuiteTitle, null, title)))));
+}
+//# sourceMappingURL=TestLink.js.map

package/dist/client/web/CreeveyView/SideBar/TestLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TestLink.js","sourceRoot":"","sources":["../../../../../src/client/web/CreeveyView/SideBar/TestLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,4BAoDC;AApED,+CAAmF;AAEnF,2DAAqD;AACrD,+DAAyD;AACzD,6CAA8C;AAC9C,6EAAuE;AACvE,iDAA+E;AAC/E,+CAA4D;AAC5D,2DAAyD;AAQzD,SAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAiB;IAC7D,MAAM,EAAE,aAAa,EAAE,GAAG,IAAA,kBAAU,EAAC,kCAAc,CAAC,CAAC;IACrD,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,kBAAU,EAAC,2BAAc,CAAC,CAAC;IAClD,MAAM,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,GAAG,IAAA,kBAAU,EAAC,gDAAqB,CAAC,CAAC;IACxF,MAAM,SAAS,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IAEzD,MAAM,YAAY,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC;IACtD,MAAM,QAAQ,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,IAAA,wBAAW,EAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAE1D,MAAM,aAAa,GAAG,IAAA,eAAO,EAC3B,GAAG,EAAE,CACH,KAAK,CAAC,OAAO,CAAC,kBAAkB,CAAC;QACjC,QAAQ,CAAC,MAAM,KAAK,kBAAkB,CAAC,MAAM;QAC7C,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EACvD,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAC/B,CAAC;IAEF,MAAM,WAAW,GAAG,IAAA,mBAAW,EAC7B,CAAC,KAAc,EAAQ,EAAE;QACvB,aAAa,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IACjC,CAAC,EACD,CAAC,QAAQ,EAAE,aAAa,CAAC,CAC1B,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,aAAa;YAAE,SAAS,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAChD,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,UAAU,GAAG,IAAA,mBAAW,EAAC,GAAS,EAAE;QACxC,UAAU,CAAC,IAAI,CAAC,CAAC;QACjB,qBAAqB,CAAC,IAAA,wBAAW,EAAC,IAAI,CAAC,CAAC,CAAC;IAC3C,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAE9C,OAAO,CACL,8BAAC,wBAAS,IAAC,QAAQ,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa;QAGvE,8BAAC,+BAAiB;YAChB,8BAAC,sBAAQ,IACP,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,EACzC,QAAQ,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAC5B,aAAa,EAAE,WAAW,GAC1B,CACgB;QACpB,8BAAC,qBAAM,IAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,EAAE,SAAS;YACjE,8BAAC,6BAAc,IAAC,OAAO,EAAE,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC;gBAChD,8BAAC,kCAAc,IAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI;gBAC1E,8BAAC,yBAAU,QAAE,KAAK,CAAc,CACjB,CACV,CACC,CACb,CAAC;AACJ,CAAC"}

package/{lib/types → dist}/client/web/CreeveyView/SideBar/TestStatusIcon.d.ts

@@ -1,10 +1,12 @@
-import React from 'react';
-import { Theme } from '@storybook/theming';
-import { TestStatus } from '../../../../types';
-export interface TestStatusIconProps {
-    inverted?: boolean;
-    status?: TestStatus;
-    skip?: string | boolean;
-    theme: Theme;
-}
-export declare const TestStatusIcon: React.FC<import("@storybook/theming").AddOptionalTo<TestStatusIconProps, "theme">>;
+import React from 'react';
+import { Theme } from '@storybook/theming';
+import { TestStatus } from '../../../../types.js';
+export interface TestStatusIconProps {
+    inverted?: boolean;
+    status?: TestStatus;
+    skip?: string | boolean;
+    theme: Theme;
+}
+export declare const TestStatusIcon: React.FC<Pick<TestStatusIconProps, "skip" | "status" | "inverted"> & {
+    theme?: Theme;
+}>;