cx 26.3.5 → 26.3.6

package/src/widgets/grid/variables.scss

@@ -1,47 +1,47 @@
-@use "sass:map";
-@use "../box" as *;
-@use "../../util/scss/defaults" as *;
-@use "../../util/scss/include" as *;
-@use "../../util/scss/clockwise.scss" as *;
-@use "../../util/scss/calc.scss" as *;
-
-// GRID
-$cx-default-grid-font-size: $cx-default-box-font-size !default;
-$cx-default-grid-border-color: $cx-default-border-color !default;
-$cx-default-grid-background: null !default;
-$cx-default-grid-border-radius: null !default;
-$cx-default-grid-box-shadow: null !default;
-
-// header
-$cx-default-grid-header-font-size: $cx-default-box-font-size !default;
-$cx-default-grid-header-font-weight: normal !default;
-$cx-default-grid-header-line-height: null !default;
-$cx-default-grid-header-color: $cx-default-color !default;
-$cx-default-grid-header-background-color: #eee !default;
-$cx-default-grid-header-border-color: $cx-default-border-color !default;
-$cx-default-grid-header-box-shadow: null !default;
-$cx-default-grid-header-padding: null !default;
-
-// data
-$cx-default-grid-data-font-size: null !default;
-$cx-default-grid-data-font-weight: null !default;
-$cx-default-grid-data-line-height: null !default;
-$cx-default-grid-data-background-color: transparent !default;
-$cx-default-grid-data-alternate-background-color: null !default;
-$cx-default-grid-data-border-color: $cx-default-grid-border-color !default;
-$cx-default-grid-data-padding: 5px !default;
-$cx-default-grid-scroll-wrapper-padding-top: 0 !default;
-$cx-default-grid-caption-gap: 15px !default;
-
-// pagination
-$cx-grid-pagination-default-border-width: $cx-default-border-width !default;
-$cx-grid-pagination-default-border-color: $cx-default-border-color !default;
-$cx-grid-pagination-default-border-radius: null !default;
-$cx-grid-pagination-default-outer-border-radius: $cx-default-border-radius !default;
-$cx-grid-pagination-default-padding: $cx-default-box-padding-top cx-multiply(2, $cx-default-box-padding-top) !default;
-
-@include cx-register-dependencies(
-   (
-      "cx/widgets/Grid": "cx/widgets/DragClone",
-   )
-);
+@use "sass:map";
+@use "../box" as *;
+@use "../../util/scss/defaults" as *;
+@use "../../util/scss/include" as *;
+@use "../../util/scss/clockwise.scss" as *;
+@use "../../util/scss/calc.scss" as *;
+
+// GRID
+$cx-default-grid-font-size: $cx-default-box-font-size !default;
+$cx-default-grid-border-color: $cx-default-border-color !default;
+$cx-default-grid-background: null !default;
+$cx-default-grid-border-radius: null !default;
+$cx-default-grid-box-shadow: null !default;
+
+// header
+$cx-default-grid-header-font-size: $cx-default-box-font-size !default;
+$cx-default-grid-header-font-weight: normal !default;
+$cx-default-grid-header-line-height: null !default;
+$cx-default-grid-header-color: $cx-default-color !default;
+$cx-default-grid-header-background-color: #eee !default;
+$cx-default-grid-header-border-color: $cx-default-border-color !default;
+$cx-default-grid-header-box-shadow: null !default;
+$cx-default-grid-header-padding: null !default;
+
+// data
+$cx-default-grid-data-font-size: null !default;
+$cx-default-grid-data-font-weight: null !default;
+$cx-default-grid-data-line-height: null !default;
+$cx-default-grid-data-background-color: transparent !default;
+$cx-default-grid-data-alternate-background-color: null !default;
+$cx-default-grid-data-border-color: $cx-default-grid-border-color !default;
+$cx-default-grid-data-padding: 5px !default;
+$cx-default-grid-scroll-wrapper-padding-top: 0 !default;
+$cx-default-grid-caption-gap: 15px !default;
+
+// pagination
+$cx-grid-pagination-default-border-width: $cx-default-border-width !default;
+$cx-grid-pagination-default-border-color: $cx-default-border-color !default;
+$cx-grid-pagination-default-border-radius: null !default;
+$cx-grid-pagination-default-outer-border-radius: $cx-default-border-radius !default;
+$cx-grid-pagination-default-padding: $cx-default-box-padding-top cx-multiply(2, $cx-default-box-padding-top) !default;
+
+@include cx-register-dependencies(
+   (
+      "cx/widgets/Grid": "cx/widgets/DragClone",
+   )
+);

package/src/widgets/index.ts

@@ -1,63 +1,63 @@
-import { Widget } from "../ui/Widget";
-import { Text } from "../ui/Text";
-import { StaticText } from "../ui/StaticText";
-import { PureContainer } from "../ui/PureContainer";
-import { IsolatedScope } from "../ui/IsolatedScope";
-import { DetachedScope } from "../ui/DetachedScope";
-import { Restate, PrivateStore } from "../ui/Restate";
-import { DataProxy } from "../ui/DataProxy";
-import { Content } from "../ui/layout/Content";
-import { ContentPlaceholder, ContentPlaceholderScope } from "../ui/layout/ContentPlaceholder";
-import { LabelsTopLayout, LabelsTopLayoutCell } from "../ui/layout/LabelsTopLayout";
-import { LabelsLeftLayout } from "../ui/layout/LabelsLeftLayout";
-import { ContentResolver } from "../ui/ContentResolver";
-import { Rescope } from "../ui/Rescope";
-import { Repeater } from "../ui/Repeater";
-
-//re-export widgets defined in ui namespace
-export {
-   Widget,
-   StaticText,
-   Text,
-   PureContainer,
-   Content,
-   ContentPlaceholder,
-   ContentPlaceholderScope,
-   ContentResolver,
-   Rescope,
-   Repeater,
-   IsolatedScope,
-   DetachedScope,
-   Restate,
-   PrivateStore,
-   DataProxy,
-   LabelsTopLayout,
-   LabelsTopLayoutCell,
-   LabelsLeftLayout,
-};
-
-export * from "./cx";
-export * from "./HtmlElement";
-export * from "./Button";
-export * from "./DocumentTitle";
-export * from "./List";
-export * from "./Sandbox";
-export * from "./CxCredit";
-export * from "./Heading";
-export * from "./Section";
-export * from "./FlexBox";
-export * from "./Icon";
-export * from "./ProgressBar";
-export * from "./Resizer";
-export * from "./HighlightedSearchText";
-export * from "./autoFocus";
-export * from "./ReactElementWrapper";
-
-export * from "./icons/index";
-export * from "./overlay/index";
-export * from "./nav/index";
-export * from "./form/index";
-export * from "./grid/index";
-export * from "./drag-drop/index";
-
-export * from "./enableAllInternalDependencies";
+import { Widget } from "../ui/Widget";
+import { Text } from "../ui/Text";
+import { StaticText } from "../ui/StaticText";
+import { PureContainer } from "../ui/PureContainer";
+import { IsolatedScope } from "../ui/IsolatedScope";
+import { DetachedScope } from "../ui/DetachedScope";
+import { Restate, PrivateStore } from "../ui/Restate";
+import { DataProxy } from "../ui/DataProxy";
+import { Content } from "../ui/layout/Content";
+import { ContentPlaceholder, ContentPlaceholderScope } from "../ui/layout/ContentPlaceholder";
+import { LabelsTopLayout, LabelsTopLayoutCell } from "../ui/layout/LabelsTopLayout";
+import { LabelsLeftLayout } from "../ui/layout/LabelsLeftLayout";
+import { ContentResolver } from "../ui/ContentResolver";
+import { Rescope } from "../ui/Rescope";
+import { Repeater } from "../ui/Repeater";
+
+//re-export widgets defined in ui namespace
+export {
+   Widget,
+   StaticText,
+   Text,
+   PureContainer,
+   Content,
+   ContentPlaceholder,
+   ContentPlaceholderScope,
+   ContentResolver,
+   Rescope,
+   Repeater,
+   IsolatedScope,
+   DetachedScope,
+   Restate,
+   PrivateStore,
+   DataProxy,
+   LabelsTopLayout,
+   LabelsTopLayoutCell,
+   LabelsLeftLayout,
+};
+
+export * from "./cx";
+export * from "./HtmlElement";
+export * from "./Button";
+export * from "./DocumentTitle";
+export * from "./List";
+export * from "./Sandbox";
+export * from "./CxCredit";
+export * from "./Heading";
+export * from "./Section";
+export * from "./FlexBox";
+export * from "./Icon";
+export * from "./ProgressBar";
+export * from "./Resizer";
+export * from "./HighlightedSearchText";
+export * from "./autoFocus";
+export * from "./ReactElementWrapper";
+
+export * from "./icons/index";
+export * from "./overlay/index";
+export * from "./nav/index";
+export * from "./form/index";
+export * from "./grid/index";
+export * from "./drag-drop/index";
+
+export * from "./enableAllInternalDependencies";

package/src/widgets/nav/Tab.ts

@@ -1,122 +1,122 @@
-import { Widget, VDOM } from "../../ui/Widget";
-import { HtmlElement, HtmlElementConfigBase, HtmlElementInstance } from "../HtmlElement";
-import { Instance } from "../../ui/Instance";
-import { RenderingContext } from "../../ui/RenderingContext";
-import { preventFocus, preventFocusOnTouch } from "../../ui/FocusManager";
-import { isUndefined } from "../../util/isUndefined";
-import { BooleanProp, Prop, StringProp } from "../../ui/Prop";
-
-export interface TabConfig extends HtmlElementConfigBase {
-   /** A value to be written to the `value` property if the tab is clicked. */
-   tab?: Prop<string | number>;
-
-   /**
-    * Value of the currently selected tab.
-    * If `value` is equal to `tab`, the tab appears active.
-    */
-   value?: StringProp;
-
-   /** Set to `true` to disable selection. */
-   disabled?: BooleanProp;
-
-   /** Base CSS class to be applied to the element. No class is applied by default. */
-   baseClass?: string;
-
-   /** Name of the HTML element to be rendered. Default is `div`. */
-   tag?: string;
-
-   /**
-    * Determines if tab should receive focus on `mousedown` event.
-    * Default is `false`, which means that focus can be set only using the keyboard `Tab` key.
-    */
-   focusOnMouseDown?: boolean;
-
-   /** Set to true to set the default tab. */
-   default?: boolean;
-}
-
-export class Tab extends HtmlElement<TabConfig> {
-   declare public baseClass: string;
-   declare public tag: string;
-   declare public focusOnMouseDown: boolean;
-   declare public default: boolean;
-   declare public shape?: string;
-   declare public onMouseDown?: any;
-   declare public onClick?: any;
-   declareData() {
-      super.declareData(
-         {
-            tab: undefined,
-            value: undefined,
-            disabled: undefined,
-            text: undefined,
-         },
-         ...arguments,
-      );
-   }
-
-   prepareData(context: RenderingContext, instance: HtmlElementInstance) {
-      let { data } = instance;
-      data.stateMods = {
-         active: data.tab == data.value,
-         disabled: data.disabled,
-         shape: this.shape,
-      };
-      if (this.default && isUndefined(data.value)) instance.set("value", data.tab);
-      super.prepareData(context, instance);
-   }
-
-   isValidHtmlAttribute(attrName: string) {
-      switch (attrName) {
-         case "value":
-         case "tab":
-         case "text":
-         case "disabled":
-         case "default":
-            return false;
-
-         default:
-            return super.isValidHtmlAttribute(attrName);
-      }
-   }
-
-   attachProps(context: RenderingContext, instance: HtmlElementInstance, props: any) {
-      super.attachProps(context, instance, props);
-
-      let { data } = instance;
-      if (!data.disabled) {
-         props.href = "#";
-         delete props.value;
-
-         props.onMouseDown = (e: any) => {
-            if (this.onMouseDown && instance.invoke("onMouseDown", e, instance) === false) return;
-            if (!this.focusOnMouseDown) preventFocus(e);
-            else preventFocusOnTouch(e);
-         };
-
-         props.onClick = (e: any) => this.handleClick(e, instance);
-      }
-   }
-
-   handleClick(e: any, instance: Instance) {
-      if (this.onClick && instance.invoke("onClick", e, instance) === false) {
-         return;
-      }
-
-      e.preventDefault();
-      e.stopPropagation();
-
-      let { data } = instance;
-
-      if (data.disabled) return;
-
-      instance.set("value", data.tab);
-   }
-}
-
-Tab.prototype.baseClass = "tab";
-Tab.prototype.tag = "a";
-Tab.prototype.focusOnMouseDown = false;
-Tab.prototype.default = false;
-
-Widget.alias("tab", Tab);
+import { Widget, VDOM } from "../../ui/Widget";
+import { HtmlElement, HtmlElementConfigBase, HtmlElementInstance } from "../HtmlElement";
+import { Instance } from "../../ui/Instance";
+import { RenderingContext } from "../../ui/RenderingContext";
+import { preventFocus, preventFocusOnTouch } from "../../ui/FocusManager";
+import { isUndefined } from "../../util/isUndefined";
+import { BooleanProp, Prop, StringProp } from "../../ui/Prop";
+
+export interface TabConfig extends HtmlElementConfigBase {
+   /** A value to be written to the `value` property if the tab is clicked. */
+   tab?: Prop<string | number>;
+
+   /**
+    * Value of the currently selected tab.
+    * If `value` is equal to `tab`, the tab appears active.
+    */
+   value?: StringProp;
+
+   /** Set to `true` to disable selection. */
+   disabled?: BooleanProp;
+
+   /** Base CSS class to be applied to the element. No class is applied by default. */
+   baseClass?: string;
+
+   /** Name of the HTML element to be rendered. Default is `div`. */
+   tag?: string;
+
+   /**
+    * Determines if tab should receive focus on `mousedown` event.
+    * Default is `false`, which means that focus can be set only using the keyboard `Tab` key.
+    */
+   focusOnMouseDown?: boolean;
+
+   /** Set to true to set the default tab. */
+   default?: boolean;
+}
+
+export class Tab extends HtmlElement<TabConfig> {
+   declare public baseClass: string;
+   declare public tag: string;
+   declare public focusOnMouseDown: boolean;
+   declare public default: boolean;
+   declare public shape?: string;
+   declare public onMouseDown?: any;
+   declare public onClick?: any;
+   declareData() {
+      super.declareData(
+         {
+            tab: undefined,
+            value: undefined,
+            disabled: undefined,
+            text: undefined,
+         },
+         ...arguments,
+      );
+   }
+
+   prepareData(context: RenderingContext, instance: HtmlElementInstance) {
+      let { data } = instance;
+      data.stateMods = {
+         active: data.tab == data.value,
+         disabled: data.disabled,
+         shape: this.shape,
+      };
+      if (this.default && isUndefined(data.value)) instance.set("value", data.tab);
+      super.prepareData(context, instance);
+   }
+
+   isValidHtmlAttribute(attrName: string) {
+      switch (attrName) {
+         case "value":
+         case "tab":
+         case "text":
+         case "disabled":
+         case "default":
+            return false;
+
+         default:
+            return super.isValidHtmlAttribute(attrName);
+      }
+   }
+
+   attachProps(context: RenderingContext, instance: HtmlElementInstance, props: any) {
+      super.attachProps(context, instance, props);
+
+      let { data } = instance;
+      if (!data.disabled) {
+         props.href = "#";
+         delete props.value;
+
+         props.onMouseDown = (e: any) => {
+            if (this.onMouseDown && instance.invoke("onMouseDown", e, instance) === false) return;
+            if (!this.focusOnMouseDown) preventFocus(e);
+            else preventFocusOnTouch(e);
+         };
+
+         props.onClick = (e: any) => this.handleClick(e, instance);
+      }
+   }
+
+   handleClick(e: any, instance: Instance) {
+      if (this.onClick && instance.invoke("onClick", e, instance) === false) {
+         return;
+      }
+
+      e.preventDefault();
+      e.stopPropagation();
+
+      let { data } = instance;
+
+      if (data.disabled) return;
+
+      instance.set("value", data.tab);
+   }
+}
+
+Tab.prototype.baseClass = "tab";
+Tab.prototype.tag = "a";
+Tab.prototype.focusOnMouseDown = false;
+Tab.prototype.default = false;
+
+Widget.alias("tab", Tab);