@darajs/ui-components 0.4.8

package/dist/switch/switch.js

@@ -0,0 +1,92 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { forwardRef, useEffect, useMemo, useState } from 'react';
+import styled from '@darajs/styled-components';
+import { Moon } from '@darajs/ui-icons';
+import Sun from './sun-icon';
+const SwitchWrapper = styled.div `
+    cursor: pointer;
+
+    position: relative;
+
+    display: flex;
+    align-items: center;
+    justify-content: ${(props) => (props.enabled ? 'flex-start' : 'flex-end')};
+
+    width: max-content;
+    height: 1.5rem;
+    padding: 0;
+    padding-right: ${(props) => (props.enabled ? '1.75rem' : '0.5rem')};
+    padding-left: ${(props) => (props.enabled ? '0.5rem' : '1.75rem')};
+
+    font-size: ${(props) => props.theme.font.size};
+    color: ${(props) => props.theme.colors.blue1};
+
+    background-color: ${(props) => (props.enabled ? props.theme.colors.primary : props.theme.colors.secondary)};
+    border-radius: 0.75rem;
+
+    svg {
+        color: ${(props) => props.theme.colors.blue1};
+    }
+`;
+const SwitchHandle = styled.span `
+    position: absolute;
+    top: 0.125rem;
+    left: ${(props) => (props.enabled ? 'calc(100% - 1.375rem)' : '0.125rem')};
+
+    display: inline-block;
+
+    width: 1.25rem;
+    height: 1.25rem;
+
+    background-color: ${(props) => props.theme.colors.blue1};
+    border-radius: 0.625rem;
+
+    transition: left 100ms linear;
+`;
+/**
+ * A simple switch component that can be on or off. Accepts an onChange handler to listen for changes to the state.
+ *
+ * @param {SwitchProps} props - the component props
+ */
+function Switch({ className, initialValue = false, labels = {
+    off: 'OFF',
+    on: 'ON',
+}, lightDark = false, onChange, style, value, }, ref) {
+    const [enabled, setEnabled] = useState(value || initialValue);
+    const labelIconToShow = useMemo(() => {
+        if (lightDark) {
+            return enabled ? _jsx(Sun, {}) : _jsx(Moon, {});
+        }
+        return enabled ? labels.on : labels.off;
+    }, [labels, lightDark, enabled]);
+    useEffect(() => {
+        if (value !== undefined) {
+            setEnabled(value);
+        }
+    }, [value]);
+    const onClick = () => {
+        if (value === undefined) {
+            setEnabled(!enabled);
+        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(!enabled);
+    };
+    return (_jsxs(SwitchWrapper, { className: className, "data-testid": "wrapper", enabled: enabled, onClick: onClick, ref: ref, style: style, children: [_jsx(SwitchHandle, { "data-testid": "handle", enabled: enabled }), _jsx("div", { style: { userSelect: 'none' }, children: labelIconToShow })] }));
+}
+export default forwardRef(Switch);
+//# sourceMappingURL=switch.js.map

package/dist/switch/switch.js.map

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

package/dist/table/cells/action-cell.d.ts

@@ -0,0 +1,34 @@
+import { IconProps } from '@darajs/ui-icons';
+export declare enum Action {
+    COPY = "copy",
+    DELETE = "delete",
+    SELECT = "select",
+    SELECT_ALL = "select_all",
+    SWITCH = "switch",
+    UNSELECT_ALL = "unselect_all"
+}
+export interface ActionCol {
+    getIcon?: (row: any) => (props: IconProps) => JSX.Element;
+    getLabel?: (row: any) => string;
+    icon?: (props: IconProps) => JSX.Element;
+    id: Action | string;
+    label?: string;
+}
+export declare const Actions: {
+    [k: string]: ActionCol;
+};
+/** Interface is very loose because react table basically lets anything go through here */
+interface ActionCellProps {
+    column: any;
+    data: any;
+    onAction: (actionId: string, row: any) => void | Promise<void>;
+    row: any;
+}
+/**
+ * The action cell is used by the action column to render row actions such as delete on each row of a table
+ *
+ * @param {ActionCellProps} props see interface for details
+ */
+export declare function ActionCell(props: ActionCellProps): JSX.Element;
+export {};
+//# sourceMappingURL=action-cell.d.ts.map

package/dist/table/cells/action-cell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-cell.d.ts","sourceRoot":"","sources":["../../../src/table/cells/action-cell.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAqB,SAAS,EAAsC,MAAM,kBAAkB,CAAC;AAEpG,oBAAY,MAAM;IACd,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,MAAM,WAAW;IACjB,UAAU,eAAe;IACzB,MAAM,WAAW;IACjB,YAAY,iBAAiB;CAChC;AAkBD,MAAM,WAAW,SAAS;IACtB,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC;IAC1D,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,MAAM,CAAC;IAChC,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC;IACzC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,OAAO,EAAE;IAAE,CAAC,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CAO7C,CAAC;AAeF,0FAA0F;AAC1F,UAAU,eAAe;IACrB,MAAM,EAAE,GAAG,CAAC;IAEZ,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/D,GAAG,EAAE,GAAG,CAAC;CACZ;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,CAoB9D"}

package/dist/table/cells/action-cell.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styled from '@darajs/styled-components';
+import { CheckSquare, Copy, Square, ToggleOff, ToggleOn, Trash } from '@darajs/ui-icons';
+export var Action;
+(function (Action) {
+    Action["COPY"] = "copy";
+    Action["DELETE"] = "delete";
+    Action["SELECT"] = "select";
+    Action["SELECT_ALL"] = "select_all";
+    Action["SWITCH"] = "switch";
+    Action["UNSELECT_ALL"] = "unselect_all";
+})(Action || (Action = {}));
+const SelectCheck = styled(CheckSquare) `
+    color: ${(props) => props.theme.colors.primary};
+`;
+function getSelectIcon(row) {
+    return row.selected ? SelectCheck : Square;
+}
+const SwitchOn = styled(ToggleOn) `
+    color: ${(props) => props.theme.colors.primary};
+`;
+function getSwitchIcon(row) {
+    return row.active ? SwitchOn : ToggleOff;
+}
+export const Actions = {
+    COPY: { icon: Copy, id: Action.COPY, label: 'Copy' },
+    DELETE: { icon: Trash, id: Action.DELETE, label: 'Delete' },
+    SELECT: { getIcon: getSelectIcon, id: Action.SELECT, label: 'Select Row' },
+    SELECT_ALL: { id: Action.SELECT_ALL, label: 'Select All Rows' },
+    SWITCH: { getIcon: getSwitchIcon, id: Action.SWITCH, label: 'Switch On/Off' },
+    UNSELECT_ALL: { id: Action.UNSELECT_ALL, label: 'Unselect All Rows' },
+};
+const ActionWrapper = styled.div `
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+
+    width: 100%;
+    padding: 0 1rem;
+
+    svg:not(:last-of-type) {
+        margin-right: 0.7rem;
+    }
+`;
+/**
+ * The action cell is used by the action column to render row actions such as delete on each row of a table
+ *
+ * @param {ActionCellProps} props see interface for details
+ */
+export function ActionCell(props) {
+    if (!props.column.actions) {
+        throw new Error('Must pass an array of actions to the column def when using the ActionCell');
+    }
+    return (_jsx(ActionWrapper, { className: "table-action-cell", children: props.column.actions.map((action) => {
+            const Icon = action.getIcon ? action.getIcon(props.row.original) : action.icon;
+            if (Icon === undefined) {
+                return;
+            }
+            const label = action.getLabel ? action.getLabel(props.row.original) : action.label;
+            const onClick = (e) => {
+                var _a;
+                e.stopPropagation();
+                (_a = props.onAction) === null || _a === void 0 ? void 0 : _a.call(props, action.id, props.row.original);
+            };
+            return _jsx(Icon, { asButton: true, onClick: onClick, title: label }, action.label);
+        }) }));
+}
+//# sourceMappingURL=action-cell.js.map

package/dist/table/cells/action-cell.js.map

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

package/dist/table/cells/datetime-cell.d.ts

@@ -0,0 +1,12 @@
+/** Interface is very loose because react table basically lets anything go through here */
+interface DateCellProps {
+    value: any;
+}
+/**
+ * A date formatting cell that will accept native JS date objects and render them according to a string format
+ *
+ * @param fmt the date format to render the Date as
+ */
+declare function DatetimeCell(fmt?: string): (props: DateCellProps) => string;
+export default DatetimeCell;
+//# sourceMappingURL=datetime-cell.d.ts.map

package/dist/table/cells/datetime-cell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datetime-cell.d.ts","sourceRoot":"","sources":["../../../src/table/cells/datetime-cell.tsx"],"names":[],"mappings":"AAkBA,0FAA0F;AAC1F,UAAU,aAAa;IACnB,KAAK,EAAE,GAAG,CAAC;CACd;AAED;;;;GAIG;AACH,iBAAS,YAAY,CAAC,GAAG,SAAqB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,MAAM,CAahF;AAED,eAAe,YAAY,CAAC"}

package/dist/table/cells/datetime-cell.js

@@ -0,0 +1,36 @@
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { format, parseISO } from 'date-fns';
+/**
+ * A date formatting cell that will accept native JS date objects and render them according to a string format
+ *
+ * @param fmt the date format to render the Date as
+ */
+function DatetimeCell(fmt = 'yyyy-MM-dd HH:mm') {
+    return ({ value }) => {
+        if (!value) {
+            return '';
+        }
+        const parsed = parseISO(value);
+        if (Number.isNaN(parsed.getTime())) {
+            return '';
+        }
+        return format(parsed, fmt);
+    };
+}
+export default DatetimeCell;
+//# sourceMappingURL=datetime-cell.js.map

package/dist/table/cells/datetime-cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datetime-cell.js","sourceRoot":"","sources":["../../../src/table/cells/datetime-cell.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAO5C;;;;GAIG;AACH,SAAS,YAAY,CAAC,GAAG,GAAG,kBAAkB;IAC1C,OAAO,CAAC,EAAE,KAAK,EAAiB,EAAU,EAAE;QACxC,IAAI,CAAC,KAAK,EAAE,CAAC;YACT,OAAO,EAAE,CAAC;QACd,CAAC;QAED,MAAM,MAAM,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC/B,IAAI,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,CAAC;YACjC,OAAO,EAAE,CAAC;QACd,CAAC;QAED,OAAO,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC/B,CAAC,CAAC;AACN,CAAC;AAED,eAAe,YAAY,CAAC"}

package/dist/table/cells/edit-cell-utils.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as React from 'react';
+/** Interface is very loose because react table basically lets anything go through here */
+export interface EditCellProps<T> {
+    cell: any;
+    column: any;
+    currentEditCell?: [number, string | number];
+    data: any;
+    onAction: (actionId: string, row: any) => void | Promise<void>;
+    onChange: (value: T, rowIdx: number, colId: string) => void | Promise<void>;
+    onStartEdit: (e?: React.SyntheticEvent<HTMLSpanElement>) => void | Promise<void>;
+    onStopEdit: () => void | Promise<void>;
+    row: any;
+    rowIdx: number;
+    value: any;
+}
+//# sourceMappingURL=edit-cell-utils.d.ts.map

package/dist/table/cells/edit-cell-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"edit-cell-utils.d.ts","sourceRoot":"","sources":["../../../src/table/cells/edit-cell-utils.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,0FAA0F;AAC1F,MAAM,WAAW,aAAa,CAAC,CAAC;IAC5B,IAAI,EAAE,GAAG,CAAC;IACV,MAAM,EAAE,GAAG,CAAC;IACZ,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IAC5C,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/D,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5E,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACjF,UAAU,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,GAAG,EAAE,GAAG,CAAC;IACT,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,GAAG,CAAC;CACd"}

package/dist/table/cells/edit-cell-utils.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=edit-cell-utils.js.map

package/dist/table/cells/edit-cell-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edit-cell-utils.js","sourceRoot":"","sources":["../../../src/table/cells/edit-cell-utils.tsx"],"names":[],"mappings":""}

package/dist/table/cells/edit-input-cell.d.ts

@@ -0,0 +1,10 @@
+import { EditCellProps } from './edit-cell-utils';
+/**
+ * The edit input cell can be used to make all the cells of a particular column editable with an input field. When using
+ * an editable cell then an onChange handler should be added to the main table component as well to listen for any
+ * updates. The onChange handler will be called with the value, row index and column id, but it will not update the data
+ * for you. You need to update the data and pass it back in to the component.
+ */
+declare function EditInputCell(): (props: EditCellProps<string>) => JSX.Element;
+export default EditInputCell;
+//# sourceMappingURL=edit-input-cell.d.ts.map

package/dist/table/cells/edit-input-cell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"edit-input-cell.d.ts","sourceRoot":"","sources":["../../../src/table/cells/edit-input-cell.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAelD;;;;;GAKG;AACH,iBAAS,aAAa,IAAI,CAAC,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,GAAG,CAAC,OAAO,CAuCtE;AAED,eAAe,aAAa,CAAC"}

package/dist/table/cells/edit-input-cell.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import isEqual from 'lodash/isEqual';
+import { useEffect, useState } from 'react';
+import styled from '@darajs/styled-components';
+import Input from '../../input/input';
+const InputWrapper = styled.div `
+    display: flex;
+    width: calc(100% + 22px);
+    margin: 0 -1rem;
+`;
+const ValueWrapper = styled.span `
+    display: flex;
+    flex: 1 1 auto;
+    align-items: center;
+    height: 100%;
+`;
+/**
+ * The edit input cell can be used to make all the cells of a particular column editable with an input field. When using
+ * an editable cell then an onChange handler should be added to the main table component as well to listen for any
+ * updates. The onChange handler will be called with the value, row index and column id, but it will not update the data
+ * for you. You need to update the data and pass it back in to the component.
+ */
+function EditInputCell() {
+    return function InputCell(props) {
+        const [value, setValue] = useState(props.value);
+        useEffect(() => {
+            setValue(props.value);
+        }, [props.value]);
+        if (isEqual(props.currentEditCell, [props.rowIdx, props.column.id])) {
+            const onComplete = () => {
+                if (props.onChange && value !== props.value) {
+                    props.onChange(value, props.rowIdx, props.column.id);
+                }
+                props.onStopEdit();
+            };
+            const onChange = (val) => {
+                setValue(val);
+            };
+            return (_jsx(InputWrapper, { children: _jsx(Input, { autoFocus: true, initialValue: props.value, onBlur: onComplete, onChange: onChange, onComplete: onComplete, style: { maxWidth: '100%' } }) }));
+        }
+        return (_jsx(ValueWrapper, { "data-cell": [props.rowIdx, props.column.id], onClick: props.onStartEdit, children: props.value }));
+    };
+}
+export default EditInputCell;
+//# sourceMappingURL=edit-input-cell.js.map

package/dist/table/cells/edit-input-cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edit-input-cell.js","sourceRoot":"","sources":["../../../src/table/cells/edit-input-cell.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,OAAO,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAE/C,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAGtC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI9B,CAAC;AAEF,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;CAK/B,CAAC;AAEF;;;;;GAKG;AACH,SAAS,aAAa;IAClB,OAAO,SAAS,SAAS,CAAC,KAA4B;QAClD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAChD,SAAS,CAAC,GAAG,EAAE;YACX,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;QAElB,IAAI,OAAO,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;YAClE,MAAM,UAAU,GAAG,GAAS,EAAE;gBAC1B,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,KAAK,KAAK,CAAC,KAAK,EAAE,CAAC;oBAC1C,KAAK,CAAC,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;gBACzD,CAAC;gBACD,KAAK,CAAC,UAAU,EAAE,CAAC;YACvB,CAAC,CAAC;YAEF,MAAM,QAAQ,GAAG,CAAC,GAAW,EAAQ,EAAE;gBACnC,QAAQ,CAAC,GAAG,CAAC,CAAC;YAClB,CAAC,CAAC;YAEF,OAAO,CACH,KAAC,YAAY,cACT,KAAC,KAAK,IACF,SAAS,QACT,YAAY,EAAE,KAAK,CAAC,KAAK,EACzB,MAAM,EAAE,UAAU,EAClB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,GAC7B,GACS,CAClB,CAAC;QACN,CAAC;QAED,OAAO,CACH,KAAC,YAAY,iBAAY,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,WAAW,YAC/E,KAAK,CAAC,KAAK,GACD,CAClB,CAAC;IACN,CAAC,CAAC;AACN,CAAC;AAED,eAAe,aAAa,CAAC"}

package/dist/table/cells/edit-select-cell.d.ts

@@ -0,0 +1,12 @@
+import { Item } from '../../types';
+import { EditCellProps } from './edit-cell-utils';
+/**
+ * The edit select cell can be used to make all the cells of a particular column editable with a select field to
+ * constrain the options you can choose from. When using an editable cell then an onChange handler should be added to
+ * the main table component as well to listen for any updates. The onChange handler will be called with the value, row
+ * index and column id, but it will not update the data for you. You need to update the data and pass it back in to the
+ * component.
+ */
+declare function EditSelectCell<T extends Item>(items: Array<T>): (props: EditCellProps<T>) => JSX.Element;
+export default EditSelectCell;
+//# sourceMappingURL=edit-select-cell.d.ts.map

package/dist/table/cells/edit-select-cell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"edit-select-cell.d.ts","sourceRoot":"","sources":["../../../src/table/cells/edit-select-cell.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAelD;;;;;;GAMG;AACH,iBAAS,cAAc,CAAC,CAAC,SAAS,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,OAAO,CA+BjG;AAED,eAAe,cAAc,CAAC"}

package/dist/table/cells/edit-select-cell.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Copyright 2023 Impulse Innovations Limited
+ *
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import isEqual from 'lodash/isEqual';
+import styled from '@darajs/styled-components';
+import Select from '../../select/select';
+const SelectWrapper = styled.div `
+    display: flex;
+    width: calc(100% + 22px);
+    margin: 0 -1rem;
+`;
+const ValueWrapper = styled.span `
+    display: flex;
+    flex: 1 1 auto;
+    align-items: center;
+    height: 100%;
+`;
+/**
+ * The edit select cell can be used to make all the cells of a particular column editable with a select field to
+ * constrain the options you can choose from. When using an editable cell then an onChange handler should be added to
+ * the main table component as well to listen for any updates. The onChange handler will be called with the value, row
+ * index and column id, but it will not update the data for you. You need to update the data and pass it back in to the
+ * component.
+ */
+function EditSelectCell(items) {
+    return function SelectCell(props) {
+        const selectedItem = items.find((item) => item.value === props.value);
+        if (isEqual(props.currentEditCell, [props.rowIdx, props.column.id])) {
+            const onSelect = (item) => {
+                if (props.onChange && item.value !== props.value) {
+                    props.onChange(item.value, props.rowIdx, props.column.id);
+                }
+                props.onStopEdit();
+            };
+            return (_jsx(SelectWrapper, { children: _jsx(Select, { initialIsOpen: true, initialValue: selectedItem, items: items, onSelect: onSelect, style: { flex: '1 1 auto' } }) }));
+        }
+        return (_jsx(ValueWrapper, { "data-cell": [props.rowIdx, props.column.id], onClick: props.onStartEdit, children: selectedItem ? selectedItem.label : '' }));
+    };
+}
+export default EditSelectCell;
+//# sourceMappingURL=edit-select-cell.js.map

package/dist/table/cells/edit-select-cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edit-select-cell.js","sourceRoot":"","sources":["../../../src/table/cells/edit-select-cell.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,OAAO,MAAM,gBAAgB,CAAC;AAErC,OAAO,MAAM,MAAM,2BAA2B,CAAC;AAE/C,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAIzC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI/B,CAAC;AAEF,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;CAK/B,CAAC;AAEF;;;;;;GAMG;AACH,SAAS,cAAc,CAAiB,KAAe;IACnD,OAAO,SAAS,UAAU,CAAC,KAAuB;QAC9C,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,CAAC,CAAC;QAEtE,IAAI,OAAO,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;YAClE,MAAM,QAAQ,GAAG,CAAC,IAAU,EAAQ,EAAE;gBAClC,IAAI,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,EAAE,CAAC;oBAC/C,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;gBAC9D,CAAC;gBACD,KAAK,CAAC,UAAU,EAAE,CAAC;YACvB,CAAC,CAAC;YAEF,OAAO,CACH,KAAC,aAAa,cACV,KAAC,MAAM,IACH,aAAa,QACb,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,GAC7B,GACU,CACnB,CAAC;QACN,CAAC;QAED,OAAO,CACH,KAAC,YAAY,iBAAY,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,WAAW,YAC/E,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,GAC5B,CAClB,CAAC;IACN,CAAC,CAAC;AACN,CAAC;AAED,eAAe,cAAc,CAAC"}

package/dist/table/filters.d.ts

@@ -0,0 +1,46 @@
+import { FilterProps, HeaderGroup, Row } from 'react-table';
+import { FilterResults as DatetimeFilterResults } from '../filter/datetime-filter';
+import { FilterResults as NumericFilterResults } from '../filter/numeric-filter';
+import { Item } from '../types';
+interface HeaderIconWrapperProp {
+    hasFilter?: boolean;
+}
+export declare const HeaderIconWrapper: import("styled-components").StyledComponent<"div", import("@darajs/styled-components").DefaultTheme, HeaderIconWrapperProp, never>;
+/**
+ * Custom numeric filter function
+ *
+ * @param rows rows to filter
+ * @param columnIds IDs of columns
+ * @param filterValue filter value provided
+ */
+export declare function numeric(rows: Array<Row>, columnIds: Array<string>, filterValue: NumericFilterResults): Array<Row>;
+/**
+ * Custom datetime filter function
+ *
+ * @param rows rows to filter
+ * @param columnIds IDs of columns
+ * @param filterValue filter value
+ */
+export declare function datetime(rows: Array<Row>, columnIds: Array<string>, filterValue: DatetimeFilterResults): Array<Row>;
+/**
+ * Custom categorical filter function
+ *
+ * @param rows rows to filter
+ * @param columnIds IDs of columns
+ * @param filterItems filter value
+ */
+export declare function categorical(rows: Array<Row>, columnIds: Array<string>, filterItems: Item[]): Array<Row>;
+/**
+ * Text Filter component
+ */
+export declare function TextFilter(props: FilterProps<any>): JSX.Element;
+interface ColumnFilterProps extends HeaderGroup {
+    /** Optional prop passed to column defining uniqueItems that categorical filter should search for */
+    uniqueItems?: Array<string>;
+}
+export interface FilterContainerProps {
+    col: ColumnFilterProps;
+}
+export declare function FilterContainer(props: FilterContainerProps): JSX.Element;
+export {};
+//# sourceMappingURL=filters.d.ts.map

package/dist/table/filters.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filters.d.ts","sourceRoot":"","sources":["../../src/table/filters.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAK5D,OAAO,EAAE,aAAa,IAAI,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AACnF,OAAO,EAAE,aAAa,IAAI,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEjF,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAOhC,UAAU,qBAAqB;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,iBAAiB,oIAqB7B,CAAC;AAyGF;;;;;;GAMG;AACH,wBAAgB,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,WAAW,EAAE,oBAAoB,GAAG,KAAK,CAAC,GAAG,CAAC,CAUjH;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,WAAW,EAAE,qBAAqB,GAAG,KAAK,CAAC,GAAG,CAAC,CAUnH;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC,GAAG,CAAC,CAUvG;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,WAAW,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,OAAO,CAU/D;AAED,UAAU,iBAAkB,SAAQ,WAAW;IAC3C,oGAAoG;IACpG,WAAW,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,oBAAoB;IACjC,GAAG,EAAE,iBAAiB,CAAC;CAC1B;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG,GAAG,CAAC,OAAO,CA+CxE"}