cx 24.9.1 → 24.9.3

package/src/widgets/HtmlElement.spec.js

@@ -1,57 +1,57 @@
-import { Cx } from '../ui/Cx';
-import { VDOM } from '../ui/Widget';
-import { HtmlElement } from './HtmlElement';
-import { Store } from '../data/Store';
-
-import renderer from 'react-test-renderer';
-import assert from 'assert';
-
-describe('HtmlElement', () => {
-
-   it('renders textual content provided through the text property', () => {
-
-      let widget = <cx>
-         <div text:bind="text" />
-      </cx>;
-
-      let store = new Store({
-         data: {
-            text: 'Test'
-         }
-      });
-
-      const component = renderer.create(
-         <Cx widget={widget} store={store} />
-      );
-
-      let tree = component.toJSON();
-      assert.equal(tree.type, 'div');
-      assert.deepEqual(tree.children, ['Test']);
-   });
-
-   it('allows spread bindings', () => {
-
-      let store = new Store({
-         data: {
-            title: 'title'
-         }
-      });
-
-      const component = renderer.create(
-         <Cx store={store}>
-            <a href="#" {...{title: {bind:"title"}}}>Link</a>
-         </Cx>
-      );
-
-      let tree = component.toJSON();
-      assert.deepEqual(tree, {
-         type: 'a',
-         children: ['Link'],
-         props: {
-            href: '#',
-            title: 'title'
-         }
-      })
-   });
-});
-
+import { Cx } from '../ui/Cx';
+import { VDOM } from '../ui/Widget';
+import { HtmlElement } from './HtmlElement';
+import { Store } from '../data/Store';
+
+import renderer from 'react-test-renderer';
+import assert from 'assert';
+
+describe('HtmlElement', () => {
+
+   it('renders textual content provided through the text property', () => {
+
+      let widget = <cx>
+         <div text:bind="text" />
+      </cx>;
+
+      let store = new Store({
+         data: {
+            text: 'Test'
+         }
+      });
+
+      const component = renderer.create(
+         <Cx widget={widget} store={store} />
+      );
+
+      let tree = component.toJSON();
+      assert.equal(tree.type, 'div');
+      assert.deepEqual(tree.children, ['Test']);
+   });
+
+   it('allows spread bindings', () => {
+
+      let store = new Store({
+         data: {
+            title: 'title'
+         }
+      });
+
+      const component = renderer.create(
+         <Cx store={store}>
+            <a href="#" {...{title: {bind:"title"}}}>Link</a>
+         </Cx>
+      );
+
+      let tree = component.toJSON();
+      assert.deepEqual(tree, {
+         type: 'a',
+         children: ['Link'],
+         props: {
+            href: '#',
+            title: 'title'
+         }
+      })
+   });
+});
+

package/src/widgets/Icon.d.ts

@@ -1,34 +1,34 @@
-import * as Cx from "../core";
-
-interface IconProps extends Cx.WidgetProps {
-   /** Name under which the icon is registered. */
-   name?: Cx.StringProp;
-
-   /** Additional CSS classes to be applied to the field.
-    * If an object is provided, all keys with a "truthy" value will be added to the CSS class list. */
-   className?: Cx.ClassProp;
-
-   /** Additional CSS classes to be applied to the field.
-    * If an object is provided, all keys with a "truthy" value will be added to the CSS class list. */
-   class?: Cx.ClassProp;
-
-   /** Style object applied to the wrapper div. Used for setting the dimensions of the field. */
-   style?: Cx.StyleProp;
-
-   /** Base CSS class to be applied to the element. Default is `icon`. */
-   baseClass?: string;
-}
-
-export class Icon extends Cx.Widget<IconProps> {
-   static restoreDefaultIcons();
-
-   static clear();
-
-   static register(name: string, icon: any, defaultIcon?: boolean);
-
-   static unregister(...args: string[]);
-
-   static registerFactory(factory: (name: string, props: { [key: string]: any }) => any);
-
-   static render(name: string, props: { [key: string]: any });
-}
+import * as Cx from "../core";
+
+interface IconProps extends Cx.WidgetProps {
+   /** Name under which the icon is registered. */
+   name?: Cx.StringProp;
+
+   /** Additional CSS classes to be applied to the field.
+    * If an object is provided, all keys with a "truthy" value will be added to the CSS class list. */
+   className?: Cx.ClassProp;
+
+   /** Additional CSS classes to be applied to the field.
+    * If an object is provided, all keys with a "truthy" value will be added to the CSS class list. */
+   class?: Cx.ClassProp;
+
+   /** Style object applied to the wrapper div. Used for setting the dimensions of the field. */
+   style?: Cx.StyleProp;
+
+   /** Base CSS class to be applied to the element. Default is `icon`. */
+   baseClass?: string;
+}
+
+export class Icon extends Cx.Widget<IconProps> {
+   static restoreDefaultIcons();
+
+   static clear();
+
+   static register(name: string, icon: any, defaultIcon?: boolean);
+
+   static unregister(...args: string[]);
+
+   static registerFactory(factory: (name: string, props: { [key: string]: any }) => any);
+
+   static render(name: string, props: { [key: string]: any });
+}

package/src/widgets/Icon.js

@@ -1,50 +1,50 @@
-import { Widget, VDOM } from '../ui/Widget';
-import { registerIcon, registerIconFactory, clearIcons, unregisterIcon, renderIcon, restoreDefaultIcons } from './icons/registry';
-import "./icons/index";
-
-
-export class Icon extends Widget {
-   declareData() {
-      super.declareData(...arguments, {
-         name: undefined
-      })
-   }
-
-   render(context, instance, key) {
-      let {data} = instance;
-      return renderIcon(data.name, {
-         key: key,
-         className: data.classNames,
-         style: data.style
-      });
-   }
-
-   static register(name, icon, defaultIcon = false) {
-      return registerIcon(name, icon, defaultIcon);
-   }
-
-   static unregister(...args) {
-      return unregisterIcon(...args);
-   }
-
-   static render(name, props) {
-      return renderIcon(name, props);
-   }
-
-   static clear() {
-      return clearIcons();
-   }
-
-   static registerFactory(factory) {
-      return registerIconFactory(factory);
-   }
-
-   static restoreDefaultIcons() {
-      restoreDefaultIcons();
-   }
-}
-
-Icon.prototype.baseClass = "icon";
-Icon.prototype.styled = true;
-
-Widget.alias('icon', Icon);
+import { Widget, VDOM } from '../ui/Widget';
+import { registerIcon, registerIconFactory, clearIcons, unregisterIcon, renderIcon, restoreDefaultIcons } from './icons/registry';
+import "./icons/index";
+
+
+export class Icon extends Widget {
+   declareData() {
+      super.declareData(...arguments, {
+         name: undefined
+      })
+   }
+
+   render(context, instance, key) {
+      let {data} = instance;
+      return renderIcon(data.name, {
+         key: key,
+         className: data.classNames,
+         style: data.style
+      });
+   }
+
+   static register(name, icon, defaultIcon = false) {
+      return registerIcon(name, icon, defaultIcon);
+   }
+
+   static unregister(...args) {
+      return unregisterIcon(...args);
+   }
+
+   static render(name, props) {
+      return renderIcon(name, props);
+   }
+
+   static clear() {
+      return clearIcons();
+   }
+
+   static registerFactory(factory) {
+      return registerIconFactory(factory);
+   }
+
+   static restoreDefaultIcons() {
+      restoreDefaultIcons();
+   }
+}
+
+Icon.prototype.baseClass = "icon";
+Icon.prototype.styled = true;
+
+Widget.alias('icon', Icon);

package/src/widgets/Icon.scss

@@ -1,20 +1,20 @@
-@mixin cx-icon($name: "icon", $size: $cx-default-icon-size, $besm: $cx-besm) {
-   $block: map-get($besm, block);
-   $element: map-get($besm, element);
-   $state: map-get($besm, state);
-   $mod: map-get($besm, mod);
-
-   .#{$block}#{$name} {
-      width: $size;
-      height: $size;
-      font-size: $size;
-      line-height: 1;
-      text-align: center;
-      vertical-align: middle;
-      display: inline-block;
-   }
-}
-
-@if (cx-should-include("cx/widgets/Icon")) {
-   @include cx-icon();
-}
+@mixin cx-icon($name: "icon", $size: $cx-default-icon-size, $besm: $cx-besm) {
+   $block: map-get($besm, block);
+   $element: map-get($besm, element);
+   $state: map-get($besm, state);
+   $mod: map-get($besm, mod);
+
+   .#{$block}#{$name} {
+      width: $size;
+      height: $size;
+      font-size: $size;
+      line-height: 1;
+      text-align: center;
+      vertical-align: middle;
+      display: inline-block;
+   }
+}
+
+@if (cx-should-include("cx/widgets/Icon")) {
+   @include cx-icon();
+}

package/src/widgets/List.d.ts

@@ -1,96 +1,96 @@
-import * as React from "react";
-import {
-   BooleanProp,
-   ClassProp,
-   CollatorOptions,
-   Config,
-   Prop,
-   RecordAlias,
-   SortersProp,
-   StringProp,
-   StructuredProp,
-   StyledContainerProps,
-   StyleProp,
-   Widget,
-} from "../core";
-import { Instance } from "./../ui/Instance";
-
-type KeyDownPipe = (event: KeyboardEvent) => void;
-
-type PipeKeyDownCallback = (pipe: KeyDownPipe) => void;
-
-interface ListProps<T = unknown> extends StyledContainerProps {
-   /** An array of records to be displayed in the list. */
-   records?: Prop<T[]>;
-
-   /** Used for sorting the list. */
-   sorters?: SortersProp;
-
-   /** A binding used to store the name of the field used for sorting the collection. Available only if `sorters` are not used. */
-   sortField?: StringProp;
-
-   /** A binding used to store the sort direction. Available only if `sorters` are not used. Possible values are `"ASC"` and `"DESC"`. Defaults to `"ASC"`. */
-   sortDirection?: StringProp;
-
-   /** CSS style that will be applied to all list items. */
-   itemStyle?: StyleProp;
-
-   /** CSS class that will be applied to all list items. */
-   itemClass?: ClassProp;
-
-   /** CSS class that will be applied to all list items. */
-   itemClassName?: ClassProp;
-
-   emptyText?: StringProp;
-
-   /** Grouping configuration. */
-   grouping?: Config;
-
-   recordName?: RecordAlias;
-   indexName?: RecordAlias;
-
-   /** Base CSS class to be applied to the element. Defaults to 'list'. */
-   baseClass?: string;
-
-   focusable?: boolean;
-   focused?: boolean;
-   itemPad?: boolean;
-   cached?: boolean;
-
-   /** Selection configuration. */
-   selection?: Config;
-
-   /** Parameters that affect filtering */
-   filterParams?: StructuredProp;
-
-   /** Callback to create a filter function for given filter params. */
-   onCreateFilter?: (filterParams: any, instance: Instance) => (record: T) => boolean;
-
-   /** Scrolls selection into the view. Default value is false. */
-   scrollSelectionIntoView?: boolean;
-
-   /** Options for data sorting. See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator */
-   sortOptions?: CollatorOptions;
-
-   /** Parameter used for disabling specific items in the list. */
-   itemDisabled?: BooleanProp;
-
-   /** Lists in this mode perform selection automatically without offering cursor navigation. */
-   selectMode?: boolean;
-
-   /** If this field is set to true pressing the Tab key will select the item under cursor. */
-   selectOnTab?: boolean;
-
-   /** Callback to be invoked when the list is being scrolled. Useful for loading additional items. */
-   onScroll?: (event: Event, instance: Instance) => void;
-
-   onItemClick?: string | ((e: React.SyntheticEvent<any>, instance: Instance) => void);
-
-   onItemDoubleClick?: string | ((e: React.SyntheticEvent<any>, instance: Instance) => void);
-
-   pipeKeyDown?: string | PipeKeyDownCallback;
-
-   keyField?: string;
-}
-
-export class List<T = unknown> extends Widget<ListProps<T>> {}
+import * as React from "react";
+import {
+   BooleanProp,
+   ClassProp,
+   CollatorOptions,
+   Config,
+   Prop,
+   RecordAlias,
+   SortersProp,
+   StringProp,
+   StructuredProp,
+   StyledContainerProps,
+   StyleProp,
+   Widget,
+} from "../core";
+import { Instance } from "./../ui/Instance";
+
+type KeyDownPipe = (event: KeyboardEvent) => void;
+
+type PipeKeyDownCallback = (pipe: KeyDownPipe) => void;
+
+interface ListProps<T = unknown> extends StyledContainerProps {
+   /** An array of records to be displayed in the list. */
+   records?: Prop<T[]>;
+
+   /** Used for sorting the list. */
+   sorters?: SortersProp;
+
+   /** A binding used to store the name of the field used for sorting the collection. Available only if `sorters` are not used. */
+   sortField?: StringProp;
+
+   /** A binding used to store the sort direction. Available only if `sorters` are not used. Possible values are `"ASC"` and `"DESC"`. Defaults to `"ASC"`. */
+   sortDirection?: StringProp;
+
+   /** CSS style that will be applied to all list items. */
+   itemStyle?: StyleProp;
+
+   /** CSS class that will be applied to all list items. */
+   itemClass?: ClassProp;
+
+   /** CSS class that will be applied to all list items. */
+   itemClassName?: ClassProp;
+
+   emptyText?: StringProp;
+
+   /** Grouping configuration. */
+   grouping?: Config;
+
+   recordName?: RecordAlias;
+   indexName?: RecordAlias;
+
+   /** Base CSS class to be applied to the element. Defaults to 'list'. */
+   baseClass?: string;
+
+   focusable?: boolean;
+   focused?: boolean;
+   itemPad?: boolean;
+   cached?: boolean;
+
+   /** Selection configuration. */
+   selection?: Config;
+
+   /** Parameters that affect filtering */
+   filterParams?: StructuredProp;
+
+   /** Callback to create a filter function for given filter params. */
+   onCreateFilter?: (filterParams: any, instance: Instance) => (record: T) => boolean;
+
+   /** Scrolls selection into the view. Default value is false. */
+   scrollSelectionIntoView?: boolean;
+
+   /** Options for data sorting. See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator */
+   sortOptions?: CollatorOptions;
+
+   /** Parameter used for disabling specific items in the list. */
+   itemDisabled?: BooleanProp;
+
+   /** Lists in this mode perform selection automatically without offering cursor navigation. */
+   selectMode?: boolean;
+
+   /** If this field is set to true pressing the Tab key will select the item under cursor. */
+   selectOnTab?: boolean;
+
+   /** Callback to be invoked when the list is being scrolled. Useful for loading additional items. */
+   onScroll?: (event: Event, instance: Instance) => void;
+
+   onItemClick?: string | ((e: React.SyntheticEvent<any>, instance: Instance) => void);
+
+   onItemDoubleClick?: string | ((e: React.SyntheticEvent<any>, instance: Instance) => void);
+
+   pipeKeyDown?: string | PipeKeyDownCallback;
+
+   keyField?: string;
+}
+
+export class List<T = unknown> extends Widget<ListProps<T>> {}