draft-components 1.7.1 → 1.8.0

package/cjs/components/filtered-search/filtered-search.cjs

@@ -14,7 +14,7 @@ const keyboardKeys = require('../../lib/keyboard-keys.cjs');
 const helpers = require('../../lib/helpers.cjs');
 const reactHelpers = require('../../lib/react-helpers.cjs');
 
-function FilteredSearch({ className, placeholder = 'Search and filter', applyButtonLabel = 'Apply', cancelButtonLabel = 'Cancel', clearButtonAccessibleName = 'Clear', removeFilterButtonAccessibleName = 'Remove filter', filtersConfig, filters, onChange, onMouseDown, ...props }) {
+function FilteredSearch({ className, placeholder = 'Search and filter', applyButtonLabel = 'Apply', cancelButtonLabel = 'Cancel', clearButtonAccessibleName = 'Clear', removeFilterButtonAccessibleName = 'Remove filter', filtersConfig, filters, onChangeFilters, onMouseDown, ...props }) {
     const containerRef = react.useRef(null);
     const [query, setQuery] = react.useState('');
     const [hasFocus, setHasFocus] = react.useState(false);
@@ -39,18 +39,18 @@ function FilteredSearch({ className, placeholder = 'Search and filter', applyBut
     const addFilter = (config) => {
         const filter = createFilter(config);
         const textBoxElement = getTextBoxElement();
-        onChange([...filters, filter]);
+        onChangeFilters([...filters, filter]);
         textBoxElement.blur();
         setQuery('');
         setActiveField(filter.field);
     };
     const changeFilter = (changedFilter) => {
         const newFilters = filters.map((filter) => (filter.field === changedFilter.field ? changedFilter : filter));
-        onChange(newFilters);
+        onChangeFilters(newFilters);
     };
     const removeFilter = (filterToRemove) => {
         const newFilters = filters.filter((filter) => (filter.field !== filterToRemove.field));
-        onChange(newFilters);
+        onChangeFilters(newFilters);
     };
     const onFilterEditStarted = (filter) => {
         setActiveField(filter.field);
@@ -133,7 +133,7 @@ function FilteredSearch({ className, placeholder = 'Search and filter', applyBut
         }
         else if (key === keyboardKeys.KeyboardKeys.Backspace) {
             if (query === '' && filters.length > 0) {
-                onChange(filters.slice(0, -1));
+                onChangeFilters(filters.slice(0, -1));
                 isHandled = true;
             }
         }
@@ -163,7 +163,7 @@ function FilteredSearch({ className, placeholder = 'Search and filter', applyBut
     };
     const onClearButtonPressed = (event) => {
         event.stopPropagation();
-        onChange([]);
+        onChangeFilters([]);
     };
     const onContainerPressed = (event) => {
         if (event.currentTarget === event.target) {

package/cjs/components/index.cjs

@@ -24,9 +24,9 @@ const emptyState = require('./empty-state/empty-state.cjs');
 const filePicker = require('./file-picker/file-picker.cjs');
 const filterButtons = require('./filter-buttons/filter-buttons.cjs');
 const filterButton = require('./filter-buttons/filter-button.cjs');
+const filteredSearch = require('./filtered-search/filtered-search.cjs');
 const stringFilter = require('./filtered-search/model/string-filter.cjs');
 const stringSetFilter = require('./filtered-search/model/string-set-filter.cjs');
-const filteredSearch = require('./filtered-search/filtered-search.cjs');
 const formField = require('./form-field/form-field.cjs');
 const label = require('./label/label.cjs');
 const menu = require('./menu/menu.cjs');
@@ -95,9 +95,9 @@ exports.EmptyState = emptyState.EmptyState;
 exports.FilePicker = filePicker.FilePicker;
 exports.FilterButtons = filterButtons.FilterButtons;
 exports.FilterButton = filterButton.FilterButton;
+exports.FilteredSearch = filteredSearch.FilteredSearch;
 exports.StringFilter = stringFilter.StringFilter;
 exports.StringSetFilter = stringSetFilter.StringSetFilter;
-exports.FilteredSearch = filteredSearch.FilteredSearch;
 exports.FormField = formField.FormField;
 exports.Label = label.Label;
 exports.Menu = menu.Menu;

package/cjs/index.cjs

@@ -31,9 +31,9 @@ const emptyState = require('./components/empty-state/empty-state.cjs');
 const filePicker = require('./components/file-picker/file-picker.cjs');
 const filterButtons = require('./components/filter-buttons/filter-buttons.cjs');
 const filterButton = require('./components/filter-buttons/filter-button.cjs');
+const filteredSearch = require('./components/filtered-search/filtered-search.cjs');
 const stringFilter = require('./components/filtered-search/model/string-filter.cjs');
 const stringSetFilter = require('./components/filtered-search/model/string-set-filter.cjs');
-const filteredSearch = require('./components/filtered-search/filtered-search.cjs');
 const formField = require('./components/form-field/form-field.cjs');
 const label = require('./components/label/label.cjs');
 const menu = require('./components/menu/menu.cjs');
@@ -115,9 +115,9 @@ exports.EmptyState = emptyState.EmptyState;
 exports.FilePicker = filePicker.FilePicker;
 exports.FilterButtons = filterButtons.FilterButtons;
 exports.FilterButton = filterButton.FilterButton;
+exports.FilteredSearch = filteredSearch.FilteredSearch;
 exports.StringFilter = stringFilter.StringFilter;
 exports.StringSetFilter = stringSetFilter.StringSetFilter;
-exports.FilteredSearch = filteredSearch.FilteredSearch;
 exports.FormField = formField.FormField;
 exports.Label = label.Label;
 exports.Menu = menu.Menu;

package/esm/components/filtered-search/filtered-search.js

@@ -12,7 +12,7 @@ import { KeyboardKeys } from '../../lib/keyboard-keys.js';
 import { exhaustiveCheck } from '../../lib/helpers.js';
 import { classNames } from '../../lib/react-helpers.js';
 
-function FilteredSearch({ className, placeholder = 'Search and filter', applyButtonLabel = 'Apply', cancelButtonLabel = 'Cancel', clearButtonAccessibleName = 'Clear', removeFilterButtonAccessibleName = 'Remove filter', filtersConfig, filters, onChange, onMouseDown, ...props }) {
+function FilteredSearch({ className, placeholder = 'Search and filter', applyButtonLabel = 'Apply', cancelButtonLabel = 'Cancel', clearButtonAccessibleName = 'Clear', removeFilterButtonAccessibleName = 'Remove filter', filtersConfig, filters, onChangeFilters, onMouseDown, ...props }) {
     const containerRef = useRef(null);
     const [query, setQuery] = useState('');
     const [hasFocus, setHasFocus] = useState(false);
@@ -37,18 +37,18 @@ function FilteredSearch({ className, placeholder = 'Search and filter', applyBut
     const addFilter = (config) => {
         const filter = createFilter(config);
         const textBoxElement = getTextBoxElement();
-        onChange([...filters, filter]);
+        onChangeFilters([...filters, filter]);
         textBoxElement.blur();
         setQuery('');
         setActiveField(filter.field);
     };
     const changeFilter = (changedFilter) => {
         const newFilters = filters.map((filter) => (filter.field === changedFilter.field ? changedFilter : filter));
-        onChange(newFilters);
+        onChangeFilters(newFilters);
     };
     const removeFilter = (filterToRemove) => {
         const newFilters = filters.filter((filter) => (filter.field !== filterToRemove.field));
-        onChange(newFilters);
+        onChangeFilters(newFilters);
     };
     const onFilterEditStarted = (filter) => {
         setActiveField(filter.field);
@@ -131,7 +131,7 @@ function FilteredSearch({ className, placeholder = 'Search and filter', applyBut
         }
         else if (key === KeyboardKeys.Backspace) {
             if (query === '' && filters.length > 0) {
-                onChange(filters.slice(0, -1));
+                onChangeFilters(filters.slice(0, -1));
                 isHandled = true;
             }
         }
@@ -161,7 +161,7 @@ function FilteredSearch({ className, placeholder = 'Search and filter', applyBut
     };
     const onClearButtonPressed = (event) => {
         event.stopPropagation();
-        onChange([]);
+        onChangeFilters([]);
     };
     const onContainerPressed = (event) => {
         if (event.currentTarget === event.target) {

package/esm/components/index.js

@@ -22,9 +22,9 @@ export { EmptyState } from './empty-state/empty-state.js';
 export { FilePicker } from './file-picker/file-picker.js';
 export { FilterButtons } from './filter-buttons/filter-buttons.js';
 export { FilterButton } from './filter-buttons/filter-button.js';
+export { FilteredSearch } from './filtered-search/filtered-search.js';
 export { StringFilter } from './filtered-search/model/string-filter.js';
 export { StringSetFilter } from './filtered-search/model/string-set-filter.js';
-export { FilteredSearch } from './filtered-search/filtered-search.js';
 export { FormField } from './form-field/form-field.js';
 export { Label } from './label/label.js';
 export { Menu } from './menu/menu.js';

package/esm/index.js

@@ -29,9 +29,9 @@ export { EmptyState } from './components/empty-state/empty-state.js';
 export { FilePicker } from './components/file-picker/file-picker.js';
 export { FilterButtons } from './components/filter-buttons/filter-buttons.js';
 export { FilterButton } from './components/filter-buttons/filter-button.js';
+export { FilteredSearch } from './components/filtered-search/filtered-search.js';
 export { StringFilter } from './components/filtered-search/model/string-filter.js';
 export { StringSetFilter } from './components/filtered-search/model/string-set-filter.js';
-export { FilteredSearch } from './components/filtered-search/filtered-search.js';
 export { FormField } from './components/form-field/form-field.js';
 export { Label } from './components/label/label.js';
 export { Menu } from './components/menu/menu.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "draft-components",
-  "version": "1.7.1",
+  "version": "1.8.0",
   "description": "The React based UI components library.",
   "type": "module",
   "exports": {
@@ -29,8 +29,8 @@
     "coverage": "npm run test -- --coverage --no-cache",
     "lint": "eslint '**/*.{js,ts,tsx}'",
     "lint-styles": "stylelint 'src/**/*.css'",
-    "check-types": "tsc --noEmit",
-    "prebuild": "npm run test && npm run lint && npm run lint-styles",
+    "check-types": "tsc --project 'tsconfig.json' --noEmit",
+    "prebuild": "npm run check-types && npm run test && npm run lint && npm run lint-styles",
     "build": "node scripts/build.js",
     "build-storybook": "storybook build",
     "preversion": "npm run build",

package/types/components/filtered-search/filtered-search.d.ts

@@ -10,6 +10,6 @@ export type FilteredSearchProps = FilteredSearchBaseProps & {
     removeFilterButtonAccessibleName?: string;
     filtersConfig: FilterConfig[];
     filters: Filter[];
-    onChange: (filters: Filter[]) => void;
+    onChangeFilters: (filters: Filter[]) => void;
 };
-export declare function FilteredSearch({ className, placeholder, applyButtonLabel, cancelButtonLabel, clearButtonAccessibleName, removeFilterButtonAccessibleName, filtersConfig, filters, onChange, onMouseDown, ...props }: FilteredSearchProps): import("react/jsx-runtime").JSX.Element;
+export declare function FilteredSearch({ className, placeholder, applyButtonLabel, cancelButtonLabel, clearButtonAccessibleName, removeFilterButtonAccessibleName, filtersConfig, filters, onChangeFilters, onMouseDown, ...props }: FilteredSearchProps): import("react/jsx-runtime").JSX.Element;

package/types/components/filtered-search/index.d.ts

@@ -1,4 +1,4 @@
-export { StringFilter } from './model/string-filter';
-export { StringSetFilter } from './model/string-set-filter';
 export { FilteredSearch, type FilteredSearchProps, type FilteredSearchBaseProps, type FilteredSearchHTMLProps, } from './filtered-search';
 export { type Filter, type FilterConfig, } from './types';
+export { StringFilter, type StringFilterState, type StringFilterConfig, } from './model/string-filter';
+export { StringSetFilter, type StringSetFilterState, type StringSetFilterConfig, } from './model/string-set-filter';

package/types/components/filtered-search/model/string-filter.d.ts

@@ -1,6 +1,6 @@
 import { AbstractFilter } from './abstract-filter';
 import { ValidationResult } from './validation-result';
-declare const TYPE = "STRING";
+declare const TYPE: "STRING";
 declare const OPERATORS: {
     readonly equal: "EQUAL";
     readonly notEqual: "NOT_EQUAL";
@@ -25,7 +25,7 @@ export type StringFilterState = {
     operator: StringFilterOperator;
 };
 export declare class StringFilter extends AbstractFilter {
-    static readonly Type = "STRING";
+    static readonly Type: "STRING";
     static readonly Operators: {
         readonly equal: "EQUAL";
         readonly notEqual: "NOT_EQUAL";

package/types/components/filtered-search/model/string-set-filter.d.ts

@@ -1,5 +1,5 @@
 import { AbstractFilter } from './abstract-filter';
-declare const TYPE = "STRING_SET";
+declare const TYPE: "STRING_SET";
 declare const OPERATORS: {
     readonly in: "IN";
     readonly notIn: "NOT_IN";
@@ -21,7 +21,7 @@ export type StringSetFilterState = {
     operator: StringSetFilterOperator;
 };
 export declare class StringSetFilter extends AbstractFilter {
-    static readonly Type = "STRING_SET";
+    static readonly Type: "STRING_SET";
     static readonly Operators: {
         readonly in: "IN";
         readonly notIn: "NOT_IN";