cx 25.11.1 → 26.0.1

package/src/widgets/icons/clear.js

@@ -1,14 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('clear', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 32 32">
-      <path fill="currentColor"
-            strokeWidth="1"
-            stroke="currentColor"
-            d="M16.9 16l4.92-4.92c.24-.24.24-.6 0-.84s-.6-.24-.84 0l-4.92 4.92-5.04-4.98c-.24-.24-.6-.24-.84 0s-.24.6 0 .84L15.16 16l-4.98 4.98c-.24.24-.24.6 0 .84s.6.24.84 0L16 16.84l4.98 4.98c.24.24.6.24.84 0s.24-.6 0-.84L16.9 16z"/>
-   </svg>
-}, true);
-

package/src/widgets/icons/close.js

@@ -1,19 +0,0 @@
-import { VDOM } from "../../ui/Widget";
-import { registerIcon } from "./registry";
-
-export default registerIcon(
-   "close",
-   (props) => {
-      return (
-         <svg {...props} viewBox="0 0 32 32">
-            <path
-               fill="currentColor"
-               strokeWidth="1"
-               stroke="currentColor"
-               d="M17.8 16l9.84-9.84c.48-.48.48-1.2 0-1.68s-1.2-.48-1.68 0l-9.84 9.84L6.04 4.36c-.48-.48-1.2-.48-1.68 0s-.48 1.2 0 1.68L14.32 16l-9.96 9.96c-.48.48-.48 1.2 0 1.68s1.2.48 1.68 0L16 17.68l9.96 9.96c.48.48 1.2.48 1.68 0s.48-1.2 0-1.68L17.8 16z"
-            />
-         </svg>
-      );
-   },
-   true
-);

package/src/widgets/icons/cx.js

@@ -1,37 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('cx', props => {
-   return <svg
-      {...props}
-      viewBox="-347 249.7 48 48"
-   >
-      <g>
-         <path fill="currentColor" opacity="0.7" d="M-337.1 273.16l-4.23-7.33h8.46z"/>
-         <path fill="currentColor" d="M-318.32 273.16l-4.23-7.33h8.46z"/>
-         <path fill="currentColor" opacity="0.7" d="M-337.53 273.43h-8.45l4.22-7.33z"/>
-         <path fill="currentColor" d="M-309.38 273.43h-8.46l4.23-7.33z"/>
-         <path fill="currentColor" opacity="0.7" d="M-332.4 265.03l-4.22-7.33h8.46z"/>
-         <path fill="currentColor" d="M-304.24 265.03l-4.23-7.33h8.45z"/>
-         <path fill="currentColor" d="M-322.97 265.03l-4.28-7.33h8.5z"/>
-         <path fill="currentColor" opacity="0.7" d="M-332.87 265.3h-8.46l4.23-7.33z"/>
-         <path fill="currentColor" opacity="0.7" d="M-323.45 265.3h-8.46l4.2-7.33z"/>
-         <path fill="currentColor" d="M-314.1 265.3h-8.45l4.23-7.33z"/>
-         <path fill="currentColor" d="M-308.9 273.16l-4.23-7.33h8.46z"/>
-         <path fill="currentColor" d="M-304.67 265.3h-8.46l4.23-7.33z"/>
-         <path fill="currentColor" d="M-314.1 281.57h-8.45l4.23-7.33z"/>
-         <path fill="currentColor" d="M-313.6 281.3l-4.24-7.33h8.46z"/>
-         <path fill="currentColor" d="M-318.32 289.43l-4.23-7.33h8.46z"/>
-         <path fill="currentColor" d="M-304.67 281.57h-8.46l4.23-7.33z"/>
-         <path fill="currentColor" d="M-308.9 289.43l-4.23-7.33h8.46z"/>
-         <path fill="currentColor" opacity="0.7" d="M-341.76 281.3l-4.22-7.33h8.45z"/>
-         <path fill="currentColor" opacity="0.7" d="M-332.87 281.57h-8.46l4.23-7.33z"/>
-         <path fill="currentColor" opacity="0.7" d="M-337.1 289.43l-4.23-7.33h8.46z"/>
-         <path fill="currentColor" opacity="0.7" d="M-327.68 289.43l-4.23-7.33h8.43z"/>
-         <path fill="currentColor" opacity="0.7" d="M-328.16 289.7h-8.46l4.23-7.33z"/>
-         <path fill="currentColor" d="M-318.75 289.7h-8.5l4.28-7.33z"/>
-         <path fill="currentColor" d="M-300.02 289.7h-8.45l4.23-7.33z"/>
-      </g>
-   </svg>
-}, true);
-

package/src/widgets/icons/drop-down.js

@@ -1,14 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('drop-down', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 20 20">
-      <path fill="currentColor"
-            strokeWidth="0"
-            stroke="currentColor"
-            d="M4.516 8.147L10.01 12.5l5.474-4.33-.473-.65-5 3.98-5-4z"/>
-   </svg>
-}, true);
-

package/src/widgets/icons/file.js

@@ -1,12 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('file', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 16 16">
-      <path d="M2 2h5v5h5v7H2z" fill="currentColor" stroke="none"/>
-      <path d="M8 2v4h4z" fill="currentColor" stroke="none"/>
-   </svg>
-}, true);
-

package/src/widgets/icons/folder-open.js

@@ -1,14 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('folder-open', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 16 16">
-
-      <path d="M0 5v7l2.5-6H13V5zm1 0h6L6 3H2z" fill="currentColor" stroke="none"/>
-      <path d="M3 7h13l-3 7H0z" fill="currentColor" stroke="none"/>
-
-   </svg>
-}, true);
-

package/src/widgets/icons/folder.js

@@ -1,12 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('folder', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 16 16">
-
-      <path d="M1 5h13v9H1zm1 0h6L7 3H3z" fill="currentColor" stroke="none"/>
-   </svg>
-}, true);
-

package/src/widgets/icons/forward.js

@@ -1,21 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('forward', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 20 20">
-
-      <path fill="currentColor"
-         strokeWidth="0"
-         stroke="currentColor"
-         d="M10.15 15.5L14.5 10l-4.33-5.47-.65.47 3.98 5-4 5z" />
-
-      <path fill="currentColor"
-         strokeWidth="0"
-         stroke="currentColor"
-         d="M6.15 15.5L10.5 10 6.17 4.53 5.52 5l3.98 5-4 5z" />
-
-   </svg>
-}, true);
-

package/src/widgets/icons/loading.js

@@ -1,23 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('loading', props => {
-   let style = {
-      animation: 'linear infinite 0.5s cx-rotate'
-   };
-
-   if (props && props.style)
-      Object.assign(style, props.style);
-
-   props = {
-      ...props,
-      style
-   };
-
-   return <svg
-      {...props}
-      viewBox="0 0 50 50">
-      <path fill="currentColor" d="M43.94 25.14c0-10.3-8.37-18.68-18.7-18.68-10.3 0-18.67 8.37-18.67 18.68h4.07c0-8.07 6.54-14.6 14.6-14.6 8.08 0 14.63 6.53 14.63 14.6h4.07z" />
-   </svg>
-}, true);
-

package/src/widgets/icons/menu.js

@@ -1,16 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('menu', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 24 24">
-
-      <path d="M0 0h24v24H0z" 
-            fill="none" />
-      <path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"
-            fill="currentColor" />
-
-   </svg>
-}, true);
-

package/src/widgets/icons/pixel-picker.js

@@ -1,17 +0,0 @@
-import { VDOM } from "../../ui/Widget";
-import { registerIcon } from "./registry";
-
-export default registerIcon(
-   "pixel-picker",
-   (props) => {
-      return (
-         <svg {...props} viewBox="0 0 30 30">
-            <path
-               d="M27.7,3.3c-1.5-1.5-3.9-1.5-5.4,0L17,8.6l-1.3-1.3c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4l1.3,1.3L5,20.6 c-0.6,0.6-1,1.4-1.1,2.3C3.3,23.4,3,24.2,3,25c0,1.7,1.3,3,3,3c0.8,0,1.6-0.3,2.2-0.9C9,27,9.8,26.6,10.4,26L21,15.4l1.3,1.3 c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3c0.4-0.4,0.4-1,0-1.4L22.4,14l5.3-5.3C29.2,7.2,29.2,4.8,27.7,3.3z M9,24.6 c-0.4,0.4-0.8,0.6-1.3,0.5c-0.4,0-0.7,0.2-0.9,0.5C6.7,25.8,6.3,26,6,26c-0.6,0-1-0.4-1-1c0-0.3,0.2-0.7,0.5-0.8 c0.3-0.2,0.5-0.5,0.5-0.9c0-0.5,0.2-1,0.5-1.3L17,11.4l2.6,2.6L9,24.6z"
-               fill="currentColor"
-            />
-         </svg>
-      );
-   },
-   true
-);

package/src/widgets/icons/registry.js

@@ -1,54 +0,0 @@
-import {isFunction} from '../../util/isFunction';
-
-let icons = {};
-let iconFactory = null;
-let defaultIcons = {};
-
-let unregisteredDefaultIcons = {};
-
-export function registerIcon(name, icon, defaultIcon = false) {
-   if (!defaultIcon || !unregisteredDefaultIcons[name])
-      icons[name] = icon;
-
-   if (!defaultIcon)
-      unregisteredDefaultIcons[name] = true;
-   else
-      defaultIcons[name] = icon;
-
-   return props => renderIcon(name, props);
-}
-
-export function unregisterIcon(...args) {
-   args.forEach(name => {
-      delete icons[name];
-      unregisteredDefaultIcons[name] = true;
-   });
-}
-
-export function renderIcon(name, props) {
-
-   if (isFunction(name))
-      return name(props);
-
-   if (icons[name])
-      return icons[name](props);
-
-   if (iconFactory)
-      return iconFactory(name, props);
-
-   return null;
-}
-
-export function clearIcons() {
-   icons = {};
-}
-
-export function registerIconFactory(factory) {
-   iconFactory = factory;
-}
-
-export function restoreDefaultIcons() {
-   icons = {
-      ...defaultIcons
-   }
-}

package/src/widgets/icons/search.js

@@ -1,12 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('search', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 32 32">
-      <path fill="currentColor"
-            d="M25.595 22.036l-5.26-5.075c.75-1.18 1.206-2.56 1.206-4.05 0-4.32-3.63-7.82-8.103-7.82-4.477 0-8.107 3.503-8.107 7.82 0 4.32 3.63 7.825 8.106 7.825 1.544 0 2.972-.44 4.198-1.162l5.26 5.074c.37.356.98.354 1.35 0l1.352-1.304c.37-.357.37-.947 0-1.304zm-12.16-3.91c-2.985 0-5.405-2.336-5.405-5.216 0-2.88 2.42-5.214 5.405-5.214 2.984 0 5.404 2.335 5.404 5.214 0 2.88-2.42 5.215-5.407 5.215z" />
-   </svg>
-}, true);
-

package/src/widgets/icons/sort-asc.js

@@ -1,13 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('sort-asc', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 16 16">
-      <path fill="currentColor"
-         d="M10.5 5.8l-3-3-3 3 .707.708L7 4.688v8.312h1V4.69l1.793 1.817z"
-      />
-   </svg>
-}, true);
-

package/src/widgets/icons/square.js

@@ -1,17 +0,0 @@
-import {VDOM} from '../../ui/Widget';
-import {registerIcon} from './registry';
-
-export default registerIcon('square', props => {
-   return <svg
-      {...props}
-      viewBox="0 0 64 64">
-      <rect
-         x="12"
-         y="12"
-         width="40"
-         height="40"
-         fill="currentColor"
-      />
-   </svg>
-}, true);
-

package/src/widgets/nav/Link.d.ts

@@ -1,26 +0,0 @@
-import * as React from "react";
-import * as Cx from "../../core";
-import { Instance } from "../../ui/Instance";
-import { LinkButtonProps } from "./LinkButton";
-
-interface LinkProps extends LinkButtonProps {
-   /** Set to `true` to disable the link. */
-   disabled?: Cx.BooleanProp;
-
-   /** Url to the link's target location. Should start with `~/` or `#/` for pushState/hash based navigation. */
-   href?: Cx.StringProp;
-
-   url?: Cx.StringProp;
-
-   /** Base CSS class to be applied to the element. No class is applied by default. */
-   baseClass?: string;
-
-   tag?: string;
-   match?: "equal" | "prefix" | "subroute";
-
-   activeClass?: Cx.ClassProp;
-   activeStyle?: Cx.StyleProp;
-   onClick?: string | ((e: React.SyntheticEvent<any>, instance: Instance) => void);
-}
-
-export class Link extends Cx.Widget<LinkProps> {}

package/src/widgets/nav/Link.js

@@ -1,8 +0,0 @@
-import {Widget, VDOM} from '../../ui/Widget';
-import {LinkButton} from './LinkButton';
-
-export class Link extends LinkButton {}
-
-Link.prototype.baseClass = "link";
-
-Widget.alias('link', Link);

package/src/widgets/nav/LinkButton.d.ts

@@ -1,34 +0,0 @@
-import * as Cx from "../../core";
-import { ButtonProps } from "../Button";
-
-export interface LinkButtonProps extends ButtonProps {
-   /** Url to the link's target location. Should start with `~/` or `#/` for pushState/hash based navigation. */
-   href?: Cx.StringProp;
-
-   /** Binding to the current url location in the store. If `href` matches `url`, additional CSS class `active` is applied. */
-   url?: Cx.StringProp;
-
-   /**
-    * Accepted values are `equal`, `prefix` and `subroute`. Default is `equal` which means that `url` must exactly match `href` in order to consider the link active.
-    * In `prefix` mode, if `href` is a prefix of `url`, the link is considered active. The `subroute` mode is similar to `prefix` mode, except that `href` must be followed by a forward slash `/`, indicating
-    * a subroute.
-    */
-   match?: "equal" | "prefix" | "subroute";
-
-   /** Additional CSS style to aplied when the link is active. */
-   activeStyle?: Cx.StyleProp;
-
-   /** Additional CSS style to aplied when the link is inactive. */
-   inactiveStyle?: Cx.StyleProp;
-
-   /** Additional CSS class to aplied when the link is active. */
-   activeClass?: Cx.StyleProp;
-
-   /** Additional CSS class to aplied when the link is inactive. */
-   inactiveClass?: Cx.StyleProp;
-
-   /** Where to display the linked URL, as the name for a browsing context (a tab, window, or <iframe>) */
-   target?: Cx.Prop<"_self" | "_blank" | "_parent" | "_top" | (string & {})>;
-}
-
-export class LinkButton extends Cx.Widget<LinkButtonProps> {}

package/src/widgets/nav/LinkButton.js

@@ -1,128 +0,0 @@
-import { Widget, VDOM } from "../../ui/Widget";
-import { Button } from "../Button";
-import { History } from "../../ui/app/History";
-import { Url } from "../../ui/app/Url";
-import { routeAppend } from "../../util/routeAppend";
-import { parseStyle } from "../../util/parseStyle";
-
-export class LinkButton extends Button {
-   init() {
-      this.activeStyle = parseStyle(this.activeStyle);
-      this.inactiveStyle = parseStyle(this.inactiveStyle);
-      super.init();
-   }
-
-   declareData() {
-      super.declareData(
-         {
-            href: undefined,
-            url: undefined,
-            target: undefined,
-            active: undefined,
-            activeClass: undefined,
-            activeStyle: undefined,
-            inactiveClass: undefined,
-            inactiveStyle: undefined,
-         },
-         ...arguments,
-      );
-   }
-
-   prepareData(context, instance) {
-      let { data } = instance;
-
-      data.unresolvedHref = data.href;
-
-      if (typeof data.href === "string") {
-         if (data.unresolvedHref[0] === "+")
-            data.unresolvedHref = routeAppend(context.lastRoute.reverse(), data.href.substring(1));
-
-         data.href = Url.resolve(data.unresolvedHref);
-      }
-
-      let active = this.isActive(data);
-
-      data.stateMods = {
-         disabled: data.disabled,
-         active,
-      };
-
-      super.prepareData(context, instance);
-
-      if (active) {
-         if (data.activeClass) data.classNames += " " + data.activeClass;
-         if (data.activeStyle)
-            data.style = {
-               ...data.style,
-               ...parseStyle(data.activeStyle),
-            };
-      } else {
-         if (data.inactiveClass) data.classNames += " " + data.inactiveClass;
-         if (data.inactiveStyle)
-            data.style = {
-               ...data.style,
-               ...parseStyle(data.inactiveStyle),
-            };
-      }
-   }
-
-   isActive(data) {
-      if (data.active != null) return data.active;
-
-      switch (this.match) {
-         default:
-         case "equal":
-            return data.url === data.unresolvedHref;
-
-         case "prefix":
-            return data.url && data.unresolvedHref && data.url.indexOf(data.unresolvedHref) === 0;
-
-         case "subroute":
-            return (
-               data.url &&
-               data.unresolvedHref &&
-               data.url.indexOf(data.unresolvedHref) === 0 &&
-               (data.url === data.unresolvedHref || data.url[data.unresolvedHref.length] === "/")
-            );
-      }
-   }
-
-   attachProps(context, instance, props) {
-      props.onClick = (ev) => {
-         this.handleClick(ev, instance);
-      };
-      super.attachProps(context, instance, props);
-      props.href = instance.data.href;
-      delete props.active;
-      delete props.activeClass;
-      delete props.activeStyle;
-      delete props.inactiveClass;
-      delete props.inactiveStyle;
-   }
-
-   isValidHtmlAttribute(attr) {
-      if (attr === "url" || attr === "match") return false;
-      return super.isValidHtmlAttribute(attr);
-   }
-
-   handleClick(e, instance) {
-      let { data } = instance;
-
-      if (data.disabled) {
-         e.preventDefault();
-         return;
-      }
-
-      if (this.onClick && instance.invoke("onClick", e, instance) === false) return;
-
-      if (data.href && Url.isLocal(data.href) && !e.ctrlKey && !e.shiftKey && !e.metaKey) {
-         e.preventDefault();
-         History.pushState({}, null, data.href);
-      }
-   }
-}
-
-LinkButton.prototype.match = "equal";
-LinkButton.prototype.tag = "a";
-
-Widget.alias("link-button", LinkButton);

package/src/widgets/nav/Menu.d.ts

@@ -1,27 +0,0 @@
-import * as Cx from '../../core';
-
-interface MenuProps extends Cx.HtmlElementProps {
-
-   /** Set to `true` for horizontal menus. */
-   horizontal?: boolean,
-   
-   /** 
-    * Controls size of menu items. Supported values are `xsmall`, `small`, `medium`, `large` or `xlarge`. 
-    * For horizontal menus default size is `small` and for vertical it's `medium`. 
-    */
-   itemPadding?: string,
-
-   defaultVerticalItemPadding?: string,
-   defaultHorizontalItemPadding?: string,
-
-   /** Set to true to put overflow items into a submenu on the right. */
-   overflow?: boolean,
-
-   /** Icon to be used for the overflow menu. */
-   overflowIcon?: string,
-
-   /** Base CSS class to be applied to the element. No class is applied by default. */
-   baseClass?: string
-}
-
-export class Menu extends Cx.Widget<MenuProps> {}