cx 25.11.1 → 26.0.1

package/src/widgets/Heading.d.ts

@@ -1,16 +0,0 @@
-import * as Cx from '../core';
-
-interface HeadingProps extends Cx.HtmlElementProps {
-   
-   /** Name of the HTML element to be rendered. Default is `div`. */
-   tag?: string,
-
-   /** Heading level. Allowed values go from 1 to 6. Default is 3. */
-   level?: number | string,
-
-    /** Base CSS class. Default is `heading`. */
-    baseClass?: string
-
-}
-
-export class Heading extends Cx.Widget<HeadingProps> {}

package/src/widgets/Heading.js

@@ -1,33 +0,0 @@
-import {HtmlElement} from './HtmlElement';
-
-
-export class Heading extends HtmlElement {
-
-   init() {
-      this.tag = `h${this.level}`;
-      super.init();
-   }
-
-   prepareData(context, instance) {
-      let {data} = instance;
-      data.stateMods = {
-         ...data.stateMods,
-         [`level-${this.level}`]: true
-      };
-      super.prepareData(context, instance);
-   }
-
-   isValidHtmlAttribute(attrName) {
-      switch (attrName) {
-         case "level":
-            return false;
-
-         default:
-            return super.isValidHtmlAttribute(attrName);
-      }
-   }
-}
-
-
-Heading.prototype.level = 3;
-Heading.prototype.baseClass = 'heading';

package/src/widgets/HighlightedSearchText.d.ts

@@ -1,9 +0,0 @@
-import * as Cx from "../core";
-
-interface HighlightedSearchTextProps extends Cx.WidgetProps {
-   query?: Cx.StringProp;
-   text?: Cx.StringProp;
-   chunks?: Cx.Prop<string[]>;
-}
-
-export class HighlightedSearchText extends Cx.Widget<HighlightedSearchTextProps> {}

package/src/widgets/HighlightedSearchText.js

@@ -1,36 +0,0 @@
-import { Widget } from "../ui/Widget";
-import { VDOM } from "../ui/VDOM";
-import { getSearchQueryHighlighter } from "../util/getSearchQueryPredicate";
-
-export class HighlightedSearchText extends Widget {
-   declareData(...args) {
-      super.declareData(...args, {
-         text: undefined,
-         chunks: undefined,
-         query: undefined,
-      });
-   }
-
-   render(context, instance, key) {
-      let { data } = instance;
-      let { text, chunks, query, classNames, style } = data;
-
-      if (!chunks && text && query) {
-         let highlighter = getSearchQueryHighlighter(query, { cache: true });
-         chunks = highlighter(text);
-      }
-
-      if (!chunks) return text;
-      return chunks.map((text, i) => {
-         if (i % 2 == 0) return text;
-         return (
-            <span key={`${key}-${i}`} className={classNames} style={style}>
-               {text}
-            </span>
-         );
-      });
-   }
-}
-
-HighlightedSearchText.prototype.styled = true;
-HighlightedSearchText.prototype.baseClass = "highlightedsearchtext";

package/src/widgets/HtmlElement.d.ts

@@ -1,30 +0,0 @@
-import * as Cx from "../core";
-import { Instance } from "../ui/Instance";
-
-interface HtmlElementProps extends Cx.HtmlElementProps {
-   /** HTML to be injected into the element. */
-   innerHtml?: Cx.StringProp;
-
-   attrs?: Cx.StructuredProp;
-   data?: Cx.StructuredProp;
-
-   /** Name of the HTML element to be rendered. Default is `div`. */
-   tag?: string;
-
-   /** HTML to be injected into the element. */
-   html?: Cx.StringProp;
-
-   styled?: boolean;
-
-   //** Set to true to automatically focus the element when mounted. */
-   autoFocus?: Cx.BooleanProp;
-
-   /** Allow any prop if HtmlElement is used directly.
-    * e.g. `<HtmlElement tag="form" onSubmit="submit" />`*/
-   [key: string]: any;
-
-   /** Callback function called when the element is mounted in the DOM. Provides reference to the element and the component instance. */
-   onRef?: string | ((element: any, instance: Instance) => void);
-}
-
-export class HtmlElement extends Cx.Widget<HtmlElementProps> {}

package/src/widgets/HtmlElement.js

@@ -1,275 +0,0 @@
-import { Widget, VDOM } from "../ui/Widget";
-import { Container } from "../ui/Container";
-import {
-   tooltipMouseMove,
-   tooltipParentWillUnmount,
-   tooltipMouseLeave,
-   tooltipParentWillReceiveProps,
-   tooltipParentDidMount,
-   tooltipParentDidUpdate,
-} from "./overlay/tooltip-ops";
-import { Url } from "../ui/app/Url";
-import { debug } from "../util/Debug";
-import { isString } from "../util/isString";
-import { isUndefined } from "../util/isUndefined";
-import { isDefined } from "../util/isDefined";
-import { isArray } from "../util/isArray";
-import { autoFocus } from "./autoFocus";
-
-let isDataAttribute = (attr) => (attr.indexOf("data-") == 0 ? attr.substring(5) : false);
-
-export let urlAttributes = {
-   "a.href": true,
-   "img.src": true,
-   "iframe.src": true,
-};
-
-export class HtmlElement extends Container {
-   constructor(config) {
-      super(config);
-
-      if (isUndefined(this.jsxAttributes) && config)
-         this.jsxAttributes = Object.keys(config).filter(this.isValidHtmlAttribute.bind(this));
-   }
-
-   declareData() {
-      let data = {
-         text: undefined,
-         innerHtml: undefined,
-         attrs: {
-            structured: true,
-         },
-         data: {
-            structured: true,
-         },
-         autoFocus: undefined,
-      };
-
-      let name;
-
-      this.urlAttributes = [];
-
-      if (this.jsxAttributes) {
-         this.jsxAttributes.forEach((attr) => {
-            if (urlAttributes[`${this.tag}.${attr}`]) this.urlAttributes.push(attr);
-
-            if ((name = isDataAttribute(attr))) {
-               if (!this.data) this.data = {};
-               this.data[name] = this[attr];
-            } else if ((name = this.isValidHtmlAttribute(attr)) && !data.hasOwnProperty(name)) {
-               if (name.indexOf("on") == 0) {
-                  if (this[attr]) {
-                     if (!this.events) this.events = {};
-                     this.events[name] = this[attr];
-                  }
-               } else {
-                  if (!this.attrs) this.attrs = {};
-                  this.attrs[name] = this[attr];
-               }
-            }
-         });
-      }
-
-      if (this.urlAttributes.length == 0) delete this.urlAttributes;
-
-      super.declareData(...arguments, data);
-   }
-
-   isValidHtmlAttribute(attrName) {
-      switch (attrName) {
-         case "tag":
-         case "type":
-         case "$type":
-         case "$props":
-         case "text":
-         case "layout":
-         case "class":
-         case "className":
-         case "style":
-         case "controller":
-         case "outerLayout":
-         case "items":
-         case "children":
-         case "visible":
-         case "if":
-         case "mod":
-         case "putInto":
-         case "contentFor":
-         case "trimWhitespace":
-         case "preserveWhitespace":
-         case "ws":
-         case "plainText":
-         case "vertical":
-         case "memoize":
-         case "onInit":
-         case "onExplore":
-         case "onDestroy":
-         case "onRef":
-         case "html":
-         case "innerText":
-         case "baseClass":
-         case "CSS":
-         case "tooltip":
-         case "styles":
-         case "jsxAttributes":
-         case "jsxSpread":
-         case "instance":
-         case "store":
-         case "autoFocus":
-         case "vdomKey":
-            return false;
-
-         default:
-            if (isDataAttribute(attrName)) return false;
-
-            break;
-      }
-
-      return attrName;
-   }
-
-   init() {
-      if (this.html) this.innerHtml = this.html;
-
-      if (this.innerText) this.text = this.innerText;
-
-      super.init();
-   }
-
-   prepareData(context, instance) {
-      let { data } = instance;
-      if (this.urlAttributes && data.attrs) {
-         data.attrs = { ...data.attrs };
-         this.urlAttributes.forEach((attr) => {
-            if (isString(data.attrs[attr])) data.attrs[attr] = Url.resolve(data.attrs[attr]);
-         });
-      }
-      super.prepareData(context, instance);
-   }
-
-   attachProps(context, instance, props) {
-      Object.assign(props, this.extraProps);
-
-      if (!isString(this.tag)) props.instance = instance;
-   }
-
-   render(context, instance, key) {
-      //rebind events to pass instance
-      if (this.events && !instance.events) {
-         instance.events = {};
-         for (let eventName in this.events) {
-            instance.events[eventName] = (e) => instance.invoke(eventName, e, instance);
-         }
-      }
-
-      let { data, events } = instance;
-
-      let props = Object.assign(
-         {
-            key: key,
-         },
-         data.attrs,
-         events,
-      );
-
-      if (data.classNames) props.className = data.classNames;
-
-      if (data.style) props.style = data.style;
-
-      let children;
-      if (isDefined(data.text)) children = data.text;
-      else if (isString(data.innerHtml)) {
-         props.dangerouslySetInnerHTML = { __html: data.innerHtml };
-      } else {
-         children = this.renderChildren(context, instance);
-         if (children && isArray(children) && children.length == 0) children = undefined;
-      }
-
-      props.children = children;
-
-      this.attachProps(context, instance, props);
-
-      if (this.tooltip || this.onRef || this.autoFocus)
-         return (
-            <ContainerComponent key={key} tag={this.tag} props={props} instance={instance} data={data}>
-               {props.children}
-            </ContainerComponent>
-         );
-
-      return VDOM.createElement(this.tag, props, props.children);
-   }
-}
-
-HtmlElement.prototype.tag = "div";
-HtmlElement.prototype.styled = true;
-
-class ContainerComponent extends VDOM.Component {
-   constructor(props) {
-      super(props);
-      this.ref = (c) => {
-         this.el = c;
-         let { instance } = this.props;
-         if (instance.widget.onRef) {
-            instance.invoke("onRef", c, instance);
-         }
-      };
-   }
-
-   render() {
-      let { tag, props, children, instance } = this.props;
-      let { widget } = instance;
-
-      props.ref = this.ref;
-
-      if (widget.tooltip) {
-         let { onMouseLeave, onMouseMove } = props;
-
-         props.onMouseLeave = (e) => {
-            tooltipMouseLeave(e, instance, widget.tooltip);
-            if (onMouseLeave) onMouseLeave(e);
-         };
-         props.onMouseMove = (e) => {
-            tooltipMouseMove(e, instance, widget.tooltip);
-            if (onMouseMove) onMouseMove(e);
-         };
-      }
-
-      return VDOM.createElement(tag, props, children);
-   }
-
-   componentWillUnmount() {
-      tooltipParentWillUnmount(this.props.instance);
-   }
-
-   UNSAFE_componentWillReceiveProps(props) {
-      tooltipParentWillReceiveProps(this.el, props.instance, this.props.instance.widget.tooltip);
-   }
-
-   componentDidMount() {
-      tooltipParentDidMount(this.el, this.props.instance, this.props.instance.widget.tooltip);
-      autoFocus(this.el, this);
-   }
-
-   componentDidUpdate() {
-      tooltipParentDidUpdate(this.el, this.props.instance, this.props.instance.widget.tooltip);
-      autoFocus(this.el, this);
-   }
-}
-
-let originalWidgetFactory = Widget.factory;
-
-//support for React components
-Widget.factory = function (type, config, more) {
-   let typeType = typeof type;
-
-   if (typeType == "undefined") {
-      debug("Creating a widget of unknown type.", config, more);
-      return new HtmlElement(Object.assign({}, config, more));
-   }
-
-   if (typeType == "function") return HtmlElement.create(HtmlElement, { tag: type }, config);
-
-   return originalWidgetFactory.call(Widget, type, config, more);
-};
-
-Widget.alias("html-element", HtmlElement);

package/src/widgets/HtmlElement.spec.js

@@ -1,57 +0,0 @@
-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 +0,0 @@
-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 +0,0 @@
-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/List.d.ts

@@ -1,96 +0,0 @@
-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>> {}