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

package/dist/client/web/752.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkcreevey=self.webpackChunkcreevey||[]).push([[752],{58752:(e,r,a)=>{a.r(r),a.d(r,{SyntaxHighlighter:()=>c.bF,createCopyToClipboardFunction:()=>c.zH,default:()=>c.L0});var c=a(340)}}]);

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

@@ -1,11 +1,11 @@
-import { CreeveySuite } from '../../types';
-import { CreeveyClientApi } from '../shared/creeveyClientApi';
-export interface CreeveyAppProps {
-    api?: CreeveyClientApi;
-    initialState: {
-        tests: CreeveySuite;
-        isRunning: boolean;
-        isReport: boolean;
-    };
-}
-export declare function CreeveyApp({ api, initialState }: CreeveyAppProps): JSX.Element;
+import { CreeveySuite } from '../../types.js';
+import { CreeveyClientApi } from '../shared/creeveyClientApi.js';
+export interface CreeveyAppProps {
+    api?: CreeveyClientApi;
+    initialState: {
+        tests: CreeveySuite;
+        isRunning: boolean;
+        isReport: boolean;
+    };
+}
+export declare function CreeveyApp({ api, initialState }: CreeveyAppProps): JSX.Element;

package/dist/client/web/CreeveyApp.js

@@ -0,0 +1,167 @@
+"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.CreeveyApp = CreeveyApp;
+const react_1 = __importStar(require("react"));
+const use_immer_1 = require("use-immer");
+const theming_1 = require("@storybook/theming");
+const types_js_1 = require("../../types.js");
+const helpers_js_1 = require("../shared/helpers.js");
+const CreeveyContext_js_1 = require("./CreeveyContext.js");
+const KeyboardEventsContext_js_1 = require("./KeyboardEventsContext.js");
+const index_js_1 = require("./CreeveyView/SideBar/index.js");
+const ResultsPage_js_1 = require("../shared/components/ResultsPage.js");
+const Toggle_js_1 = require("./CreeveyView/SideBar/Toggle.js");
+const FlexContainer = (0, theming_1.withTheme)(theming_1.styled.div(({ theme }) => ({
+    height: '100vh',
+    display: 'flex',
+    background: theme.background.content,
+    color: theme.color.defaultText,
+})));
+const ToggleContainer = theming_1.styled.div({
+    zIndex: 1,
+    position: 'absolute',
+    right: 10,
+    top: 10,
+});
+function CreeveyApp({ api, initialState }) {
+    const [tests, updateTests] = (0, use_immer_1.useImmer)(initialState.tests);
+    const [isRunning, setIsRunning] = (0, react_1.useState)(initialState.isRunning);
+    const [openedTestPath, openTest] = (0, react_1.useState)([]);
+    const [filter, setFilter] = (0, react_1.useState)({ status: null, subStrings: [] });
+    const [theme, setTheme] = (0, helpers_js_1.useTheme)();
+    const openedTest = (0, helpers_js_1.getTestByPath)(tests, openedTestPath);
+    const failedTests = (0, react_1.useMemo)(() => (0, helpers_js_1.getFailedTests)(tests), [tests]);
+    const [retry, setRetry] = (0, react_1.useState)(openedTest?.results?.length ?? 0);
+    const result = openedTest?.results?.[retry - 1] ?? { images: {} };
+    const [imageName, setImageName] = (0, react_1.useState)(Object.keys(result.images ?? {})[0] ?? '');
+    const canApprove = (0, react_1.useMemo)(() => Boolean(openedTest?.results?.[retry - 1]?.images &&
+        openedTest.approved?.[imageName] != retry - 1 &&
+        openedTest.results[retry - 1].status != 'success'), [imageName, openedTest, retry]);
+    if (openedTestPath.length > 0 && !(0, types_js_1.isDefined)(openedTest))
+        openTest([]);
+    const handleSuiteOpen = (0, react_1.useCallback)((path, opened) => {
+        updateTests((draft) => {
+            (0, helpers_js_1.openSuite)(draft, path, opened);
+        });
+    }, [updateTests]);
+    const handleSuiteToggle = (0, react_1.useCallback)((path, checked) => {
+        updateTests((draft) => {
+            (0, helpers_js_1.checkSuite)(draft, path, checked);
+        });
+    }, [updateTests]);
+    const handleOpenTest = (0, react_1.useCallback)((test) => {
+        const testPath = (0, helpers_js_1.getTestPath)(test);
+        (0, helpers_js_1.setSearchParams)(testPath);
+        updateTests((draft) => {
+            (0, helpers_js_1.openSuite)(draft, testPath, true);
+            openTest(testPath);
+        });
+    }, [updateTests]);
+    const handleGoToNextFailedTest = (0, react_1.useCallback)(() => {
+        if (failedTests.length <= 1)
+            return;
+        const currentTest = failedTests.findIndex((t) => t.id === openedTest?.id);
+        const nextFailedTest = failedTests[currentTest + 1] || failedTests[0];
+        handleOpenTest(nextFailedTest);
+    }, [failedTests, handleOpenTest, openedTest?.id]);
+    const handleImageApproveNew = (0, react_1.useCallback)(() => {
+        const id = openedTest?.id;
+        if (!id)
+            return;
+        api?.approve(id, retry - 1, imageName);
+    }, [api, imageName, openedTest?.id, retry]);
+    const handleImageApproveAndGoNext = (0, react_1.useCallback)(() => {
+        handleImageApproveNew();
+        handleGoToNextFailedTest();
+    }, [handleImageApproveNew, handleGoToNextFailedTest]);
+    const handleApproveAll = (0, react_1.useCallback)(() => {
+        api?.approveAll();
+    }, [api]);
+    const handleStart = (0, react_1.useCallback)((tests) => api?.start((0, helpers_js_1.getCheckedTests)(tests).map((test) => test.id)), [api]);
+    const handleStop = (0, react_1.useCallback)(() => api?.stop(), [api]);
+    const handleThemeChange = (0, react_1.useCallback)((isDark) => {
+        setTheme(isDark ? 'dark' : 'light');
+    }, [setTheme]);
+    (0, react_1.useEffect)(() => {
+        const retry = openedTest?.results?.length ?? 0;
+        const result = openedTest?.results?.[retry - 1] ?? { images: {} };
+        setImageName(Object.keys(result.images ?? {})[0] ?? '');
+        setRetry(retry);
+    }, [openedTest?.results]);
+    (0, react_1.useEffect)(() => {
+        window.addEventListener('popstate', (event) => {
+            updateTests((draft) => {
+                const state = event.state;
+                if (state && typeof state == 'object' && 'testPath' in state) {
+                    const { testPath } = state;
+                    if (Array.isArray(testPath)) {
+                        // TODO Add validations
+                        (0, helpers_js_1.openSuite)(draft, testPath, true);
+                        openTest(testPath);
+                    }
+                }
+            });
+        });
+        updateTests((draft) => {
+            const testPath = (0, helpers_js_1.getTestPathFromSearch)();
+            (0, helpers_js_1.openSuite)(draft, testPath, true);
+            openTest(testPath);
+        });
+    }, [updateTests]);
+    // TODO unsubscribe
+    (0, react_1.useEffect)(() => api?.onUpdate(({ isRunning, tests, removedTests = [] }) => {
+        if ((0, types_js_1.isDefined)(isRunning))
+            setIsRunning(isRunning);
+        if ((0, types_js_1.isDefined)(tests))
+            updateTests((draft) => {
+                Object.values(tests).forEach((test) => {
+                    if (test)
+                        (0, helpers_js_1.updateTestStatus)(draft, (0, helpers_js_1.getTestPath)(test), test);
+                });
+                removedTests.forEach((test) => {
+                    (0, helpers_js_1.removeTests)(draft, (0, helpers_js_1.getTestPath)(test));
+                });
+            });
+    }), [api, updateTests]);
+    return (react_1.default.createElement(CreeveyContext_js_1.CreeveyContext.Provider, { value: {
+            isReport: initialState.isReport,
+            isRunning,
+            onImageApprove: canApprove ? handleImageApproveAndGoNext : undefined,
+            onApproveAll: handleApproveAll,
+            onStart: handleStart,
+            onStop: handleStop,
+            onSuiteOpen: handleSuiteOpen,
+            onSuiteToggle: handleSuiteToggle,
+        } },
+        react_1.default.createElement(theming_1.ThemeProvider, { theme: (0, theming_1.ensure)(theming_1.themes[theme]) },
+            react_1.default.createElement(KeyboardEventsContext_js_1.KeyboardEvents, { rootSuite: tests, filter: filter },
+                react_1.default.createElement(FlexContainer, null,
+                    react_1.default.createElement(index_js_1.SideBar, { rootSuite: tests, testId: openedTest?.id, onOpenTest: handleOpenTest, filter: filter, setFilter: setFilter }),
+                    openedTest && (react_1.default.createElement(ResultsPage_js_1.ResultsPage, { key: `${openedTest.id}_${openedTest.results?.length ?? 0}`, path: openedTestPath, results: openedTest.results, approved: openedTest.approved, retry: retry, imageName: imageName, onImageChange: setImageName, onRetryChange: setRetry })),
+                    react_1.default.createElement(ToggleContainer, null,
+                        react_1.default.createElement(Toggle_js_1.Toggle, { value: theme == 'dark', onChange: handleThemeChange })))))));
+}
+//# sourceMappingURL=CreeveyApp.js.map

package/dist/client/web/CreeveyApp.js.map

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

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

@@ -1,11 +1,14 @@
-import React from 'react';
-import { CreeveySuite } from '../../types';
-export interface CreeveyContextType {
-    isReport: boolean;
-    isRunning: boolean;
-    onStop: () => void;
-    onStart: (rootSuite: CreeveySuite) => void;
-    onSuiteOpen: (path: string[], opened: boolean) => void;
-    onSuiteToggle: (path: string[], checked: boolean) => void;
-}
-export declare const CreeveyContext: React.Context<CreeveyContextType>;
+import React from 'react';
+import { CreeveySuite } from '../../types.js';
+export interface CreeveyContextType {
+    isReport: boolean;
+    isRunning: boolean;
+    onStop: () => void;
+    onImageApprove?: () => void;
+    onApproveAll: () => void;
+    onStart: (rootSuite: CreeveySuite) => void;
+    onSuiteOpen: (path: string[], opened: boolean) => void;
+    onSuiteToggle: (path: string[], checked: boolean) => void;
+}
+export declare const CreeveyContext: React.Context<CreeveyContextType>;
+export declare const useCreeveyContext: () => CreeveyContextType;

package/dist/client/web/CreeveyContext.js

@@ -0,0 +1,41 @@
+"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.useCreeveyContext = exports.CreeveyContext = void 0;
+const react_1 = __importStar(require("react"));
+const types_js_1 = require("../../types.js");
+exports.CreeveyContext = react_1.default.createContext({
+    isReport: true,
+    isRunning: false,
+    onImageApprove: types_js_1.noop,
+    onApproveAll: types_js_1.noop,
+    onStop: types_js_1.noop,
+    onStart: types_js_1.noop,
+    onSuiteOpen: types_js_1.noop,
+    onSuiteToggle: types_js_1.noop,
+});
+const useCreeveyContext = () => (0, react_1.useContext)(exports.CreeveyContext);
+exports.useCreeveyContext = useCreeveyContext;
+//# sourceMappingURL=CreeveyContext.js.map

package/dist/client/web/CreeveyContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CreeveyContext.js","sourceRoot":"","sources":["../../../src/client/web/CreeveyContext.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,6CAAoD;AAavC,QAAA,cAAc,GAAG,eAAK,CAAC,aAAa,CAAqB;IACpE,QAAQ,EAAE,IAAI;IACd,SAAS,EAAE,KAAK;IAChB,cAAc,EAAE,eAAI;IACpB,YAAY,EAAE,eAAI;IAClB,MAAM,EAAE,eAAI;IACZ,OAAO,EAAE,eAAI;IACb,WAAW,EAAE,eAAI;IACjB,aAAa,EAAE,eAAI;CACpB,CAAC,CAAC;AAEI,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,IAAA,kBAAU,EAAC,sBAAc,CAAC,CAAC;AAArD,QAAA,iBAAiB,qBAAoC"}

package/dist/client/web/CreeveyLoader.d.ts

@@ -0,0 +1,3 @@
+import { Keyframes } from '@storybook/theming';
+export declare const rotate360: Keyframes;
+export declare function CreeveyLoader(): JSX.Element;

package/dist/client/web/CreeveyLoader.js

@@ -0,0 +1,52 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.rotate360 = void 0;
+exports.CreeveyLoader = CreeveyLoader;
+const react_1 = __importDefault(require("react"));
+const theming_1 = require("@storybook/theming");
+const helpers_js_1 = require("../shared/helpers.js");
+const Container = (0, theming_1.withTheme)(theming_1.styled.div(({ theme }) => ({
+    height: '100vh',
+    width: '100vw',
+    background: theme.background.app,
+})));
+const Loader = (0, theming_1.withTheme)(theming_1.styled.div(({ size = 32, theme }) => ({
+    borderRadius: '50%',
+    cursor: 'progress',
+    display: 'inline-block',
+    overflow: 'hidden',
+    position: 'absolute',
+    transition: 'all 200ms ease-out',
+    verticalAlign: 'top',
+    top: '50%',
+    left: '50%',
+    marginTop: -(size / 2),
+    marginLeft: -(size / 2),
+    height: size,
+    width: size,
+    zIndex: 4,
+    borderWidth: 2,
+    borderStyle: 'solid',
+    borderColor: theme.base === 'light' ? 'rgba(97, 97, 97, 0.29)' : 'rgba(255, 255, 255, 0.2)',
+    borderTopColor: theme.base === 'light' ? 'rgb(100,100,100)' : 'rgba(255, 255, 255, 0.4)',
+    animation: `${exports.rotate360} 0.7s linear infinite`,
+    mixBlendMode: 'difference',
+})));
+exports.rotate360 = (0, theming_1.keyframes) `
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+`;
+function CreeveyLoader() {
+    const [theme] = (0, helpers_js_1.useTheme)();
+    return (react_1.default.createElement(theming_1.ThemeProvider, { theme: (0, theming_1.ensure)(theming_1.themes[theme]) },
+        react_1.default.createElement(Container, null,
+            react_1.default.createElement(Loader, { size: 64 }))));
+}
+//# sourceMappingURL=CreeveyLoader.js.map

package/dist/client/web/CreeveyLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CreeveyLoader.js","sourceRoot":"","sources":["../../../src/client/web/CreeveyLoader.tsx"],"names":[],"mappings":";;;;;;AA8CA,sCASC;AAvDD,kDAA0B;AAC1B,gDAAmH;AACnH,qDAAgD;AAEhD,MAAM,SAAS,GAAG,IAAA,mBAAS,EACzB,gBAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACzB,MAAM,EAAE,OAAO;IACf,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,GAAG;CACjC,CAAC,CAAC,CACJ,CAAC;AAEF,MAAM,MAAM,GAAG,IAAA,mBAAS,EACtB,gBAAM,CAAC,GAAG,CAAkC,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACrE,YAAY,EAAE,KAAK;IACnB,MAAM,EAAE,UAAU;IAClB,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE,QAAQ;IAClB,QAAQ,EAAE,UAAU;IACpB,UAAU,EAAE,oBAAoB;IAChC,aAAa,EAAE,KAAK;IACpB,GAAG,EAAE,KAAK;IACV,IAAI,EAAE,KAAK;IACX,SAAS,EAAE,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC;IACtB,UAAU,EAAE,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC;IACvB,MAAM,EAAE,IAAI;IACZ,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,CAAC;IACT,WAAW,EAAE,CAAC;IACd,WAAW,EAAE,OAAO;IACpB,WAAW,EAAE,KAAK,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,0BAA0B;IAC3F,cAAc,EAAE,KAAK,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,0BAA0B;IACxF,SAAS,EAAE,GAAG,iBAAS,uBAAuB;IAC9C,YAAY,EAAE,YAAY;CAC3B,CAAC,CAAC,CACJ,CAAC;AAEW,QAAA,SAAS,GAAc,IAAA,mBAAS,EAAA;;;;;;;CAO5C,CAAC;AAEF,SAAgB,aAAa;IAC3B,MAAM,CAAC,KAAK,CAAC,GAAG,IAAA,qBAAQ,GAAE,CAAC;IAC3B,OAAO,CACL,8BAAC,uBAAa,IAAC,KAAK,EAAE,IAAA,gBAAM,EAAC,gBAAM,CAAC,KAAK,CAAC,CAAC;QACzC,8BAAC,SAAS;YACR,8BAAC,MAAM,IAAC,IAAI,EAAE,EAAE,GAAI,CACV,CACE,CACjB,CAAC;AACJ,CAAC"}

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

@@ -1,19 +1,22 @@
-import React from 'react';
-import { Theme } from '@storybook/theming';
-interface BooleanProps {
-    checked?: boolean;
-    onValueChange: (value: boolean) => void;
-    disabled?: boolean;
-}
-interface CheckboxState {
-    indeterminate: boolean;
-}
-export declare const CheckboxContainer: import("@storybook/theming").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement>>, Theme>;
-export declare class Checkbox extends React.Component<BooleanProps, CheckboxState> {
-    state: CheckboxState;
-    handleIndeterminateChange: (value: boolean) => void;
-    setIndeterminate: () => void;
-    resetIndeterminate: () => void;
-    render(): JSX.Element;
-}
-export {};
+import React from 'react';
+import { Theme } from '@storybook/theming';
+interface CheckboxProps {
+    checked?: boolean;
+    onValueChange: (value: boolean) => void;
+    disabled?: boolean;
+}
+interface CheckboxState {
+    indeterminate: boolean;
+}
+export declare const CheckboxContainer: import("@storybook/theming").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare class Checkbox extends React.Component<CheckboxProps, CheckboxState> {
+    state: CheckboxState;
+    handleIndeterminateChange: (value: boolean) => void;
+    setIndeterminate: () => void;
+    resetIndeterminate: () => void;
+    render(): JSX.Element;
+}
+export {};

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

@@ -0,0 +1,86 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Checkbox = exports.CheckboxContainer = void 0;
+const react_1 = __importDefault(require("react"));
+const theming_1 = require("@storybook/theming");
+const components_1 = require("@storybook/components");
+const polished_1 = require("polished");
+const Label = (0, theming_1.withTheme)(theming_1.styled.label(({ theme, disabled }) => ({
+    display: 'inline-flex',
+    alignItems: 'baseline',
+    position: 'relative',
+    whiteSpace: 'nowrap',
+    cursor: 'pointer',
+    fontSize: theme.typography.size.s1,
+    padding: '0px',
+    pointerEvents: disabled ? 'none' : 'auto',
+    input: {
+        display: 'inline-block',
+        opacity: '0',
+        width: 0,
+        height: 0,
+        position: 'absolute',
+        zIndex: -1,
+        '&:focus + span': {
+            outline: 'none',
+            boxShadow: `${(0, polished_1.transparentize)(0.5, theme.color.defaultText)} 0 0 0 1px inset`,
+        },
+    },
+})));
+const Box = (0, theming_1.withTheme)(theming_1.styled.span(({ theme }) => ({
+    display: 'inline-block',
+    width: '16px',
+    height: '16px',
+    border: theme.appBorderColor,
+    borderRadius: theme.input.borderRadius,
+    margin: '2px',
+    boxShadow: `${(0, polished_1.transparentize)(0.8, theme.color.defaultText)} 0 0 0 1px inset`,
+    color: (0, polished_1.transparentize)(0.3, theme.color.defaultText),
+    background: theme.background.content,
+    '&:hover, &:focus': {
+        outline: 'none',
+        boxShadow: `${(0, polished_1.transparentize)(0.5, theme.color.defaultText)} 0 0 0 1px inset`,
+    },
+})));
+const CircleIcon = (0, theming_1.styled)(components_1.Icons)({
+    margin: '4px',
+    verticalAlign: 'baseline',
+});
+const CheckIcon = (0, theming_1.styled)(components_1.Icons)({
+    margin: '2px',
+    verticalAlign: 'baseline',
+});
+exports.CheckboxContainer = theming_1.styled.span({
+    paddingLeft: '8px',
+    verticalAlign: 'middle',
+    alignSelf: 'center',
+    lineHeight: '18px',
+});
+class Checkbox extends react_1.default.Component {
+    state = { indeterminate: false };
+    handleIndeterminateChange = (value) => {
+        this.setState({
+            indeterminate: value,
+        });
+    };
+    setIndeterminate = () => {
+        this.handleIndeterminateChange(true);
+    };
+    resetIndeterminate = () => {
+        this.handleIndeterminateChange(false);
+    };
+    render() {
+        const { checked, disabled, onValueChange } = this.props;
+        const { indeterminate } = this.state;
+        return (react_1.default.createElement(Label, { disabled: disabled },
+            react_1.default.createElement("input", { type: "checkbox", onChange: (e) => {
+                    onValueChange(e.target.checked);
+                }, checked: checked ?? false }),
+            react_1.default.createElement(Box, null, indeterminate ? (react_1.default.createElement(CircleIcon, { icon: "circle", width: "8", height: "8" })) : checked ? (react_1.default.createElement(CheckIcon, { icon: "check", width: "12", height: "12" })) : (' '))));
+    }
+}
+exports.Checkbox = Checkbox;
+//# sourceMappingURL=Checkbox.js.map

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

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

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

@@ -1,6 +1,6 @@
-interface SearchProps {
-    onChange: (arg: string) => void;
-    value: string;
-}
-export declare const Search: ({ onChange, value }: SearchProps) => JSX.Element;
-export {};
+interface SearchProps {
+    onChange: (arg: string) => void;
+    value: string;
+}
+export declare const Search: ({ onChange, value }: SearchProps) => JSX.Element;
+export {};

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

@@ -0,0 +1,125 @@
+"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.Search = void 0;
+const components_1 = require("@storybook/components");
+const theming_1 = require("@storybook/theming");
+const react_1 = __importStar(require("react"));
+const KeyboardEventsContext_js_1 = require("../../KeyboardEventsContext.js");
+const FilterField = (0, theming_1.withTheme)(theming_1.styled.input(({ theme }) => ({
+    appearance: 'none',
+    border: 'none',
+    boxSizing: 'border-box',
+    display: 'block',
+    outline: 'none',
+    width: '100%',
+    background: 'transparent',
+    padding: 0,
+    fontSize: 'inherit',
+    '&:-webkit-autofill': { WebkitBoxShadow: `0 0 0 3em ${theme.color.lightest} inset` },
+    '::placeholder': {
+        color: theme.color.mediumdark,
+    },
+    '&:placeholder-shown ~ button': {
+        opacity: 0,
+    },
+})));
+const CancelButton = (0, theming_1.withTheme)(theming_1.styled.button(({ theme }) => ({
+    border: 0,
+    margin: 0,
+    padding: 4,
+    textDecoration: 'none',
+    background: theme.appBorderColor,
+    borderRadius: '1em',
+    cursor: 'pointer',
+    opacity: 1,
+    transition: 'all 150ms ease-out',
+    position: 'absolute',
+    top: '50%',
+    transform: 'translateY(-50%)',
+    right: 2,
+    '> svg': {
+        display: 'block',
+        height: 8,
+        width: 8,
+        color: theme.input.color,
+        transition: 'all 150ms ease-out',
+    },
+})));
+const FilterForm = (0, theming_1.withTheme)(theming_1.styled.form(({ theme, focussed }) => ({
+    transition: 'all 150ms ease-out',
+    borderBottom: '1px solid transparent',
+    borderBottomColor: theme.appBorderColor,
+    outline: 0,
+    position: 'relative',
+    color: theme.input.color,
+    input: {
+        color: theme.input.color,
+        fontSize: theme.typography.size.s2 - 1,
+        lineHeight: '20px',
+        paddingTop: 2,
+        paddingBottom: 2,
+        paddingLeft: 20,
+        paddingRight: 20,
+    },
+    '> svg': {
+        transition: 'all 150ms ease-out',
+        position: 'absolute',
+        top: '50%',
+        height: 12,
+        width: 12,
+        transform: 'translateY(-50%)',
+        zIndex: 1,
+        background: 'transparent',
+        path: {
+            transition: 'all 150ms ease-out',
+            fill: 'currentColor',
+            opacity: focussed ? 1 : 0.3,
+        },
+    },
+})));
+const Search = ({ onChange, value }) => {
+    const { setSidebarFocusedItem } = (0, react_1.useContext)(KeyboardEventsContext_js_1.KeyboardEventsContext);
+    const [focussed, onSetFocussed] = (0, react_1.useState)(false);
+    const searchRef = (0, react_1.useRef)(null);
+    return (react_1.default.createElement(FilterForm, { autoComplete: "off", focussed: focussed, onReset: () => {
+            onChange('');
+        }, onSubmit: (e) => {
+            e.preventDefault();
+        } },
+        react_1.default.createElement(FilterField, { type: "text", ref: searchRef, onFocus: () => {
+                onSetFocussed(true);
+                setSidebarFocusedItem(null);
+            }, onBlur: () => {
+                onSetFocussed(false);
+            }, onChange: (e) => {
+                onChange(e.target.value);
+            }, placeholder: "search by status or substring", value: value }),
+        react_1.default.createElement(components_1.Icons, { icon: "search" }),
+        react_1.default.createElement(CancelButton, { tabIndex: -1, type: "reset", value: "reset", title: "Clear search" },
+            react_1.default.createElement(components_1.Icons, { icon: "closeAlt" }))));
+};
+exports.Search = Search;
+//# sourceMappingURL=Search.js.map

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

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