native-document 1.0.138 → 1.0.140

package/src/ui/index.js

@@ -0,0 +1,82 @@
+import SpinnerRender from "./components/spinner/SpinnerRender";
+import AvatarRender from "./components/avatar/avatar/AvatarRender";
+import AvatarGroupRender from "./components/avatar/avata-group/AvatarGroupRender";
+import BadgeRender from "./components/badge/BadgeRender";
+import DividerRender from "./components/divider/DividerRender";
+import SkeletonRender from "./components/skeleton/SkeletonRender";
+import ProgressRender from "./components/progress/ProgressRender";
+import ButtonRender from "./components/button/ButtonRender";
+import AlertRender from "./components/alert/AlertRender";
+import ToastRender from "./components/toast/ToastRender";
+import PopoverRender from "./components/popover/PopoverRender";
+import TooltipRender from "./components/tooltip/TooltipRender";
+import DropdownRender from "./components/dropdown/DropdownRender";
+import ModalRender from "./components/modal/ModalRender";
+import DropdownItemRender from "./components/dropdown/item/DropdownItemRender";
+import DropdownGroupRender from "./components/dropdown/group/DropdownGroupRender";
+import DropdownDividerRender from "./components/dropdown/divider/DropdownDividerRender";
+import BreadcrumbRender from "./components/breadcrumb/BreadcrumbRender";
+import TabsRender from "./components/tabs/TabsRender";
+import PaginationRender from "./components/pagination/PaginationRender";
+import StepperRender from "./components/stepper/StepperRender";
+import StepperStepRender from "./components/stepper/StepperStepRender";
+import MenuRender from "./components/menu/MenuRender";
+import MenuItemRender from "./components/menu/MenuItemRender";
+import MenuGroupRender from "./components/menu/MenuGroupRender";
+import MenuLinkRender from "./components/menu/MenuLinkRender";
+import MenuDividerRender from "./components/menu/MenuDividerRender";
+import ContextMenuRender, { contextMenuHandler} from "./components/contextmenu/ContextMenuRender";
+import SplitterRender from "./components/splitter/SplitterRender";
+import SplitterGutterRender from "./components/splitter/SplitterGutterRender";
+import SplitterPanelRender from "./components/splitter/SplitterPanelRender";
+import AccordionItemRender from "./components/accordion/AccordionItemRender";
+import AccordionRender from "./components/accordion/AccordionRender";
+
+import SimpleTableRender from "./components/table/simple-table/SimpleTableRender";
+import DataTableRender from "./components/table/data-table/DataTableRender";
+import SwitchRender from "./components/switch/SwitchRender";
+
+export * from './components/stacks';
+export * from './components/form';
+
+export {
+    SpinnerRender,
+    AvatarRender,
+    AvatarGroupRender,
+    BadgeRender,
+    DividerRender,
+    SkeletonRender,
+    ProgressRender,
+    ButtonRender,
+    AlertRender,
+    ToastRender,
+    PopoverRender,
+    TooltipRender,
+    DropdownRender,
+    ModalRender,
+    DropdownDividerRender,
+    DropdownItemRender,
+    DropdownGroupRender,
+    BreadcrumbRender,
+    TabsRender,
+    PaginationRender,
+    StepperRender,
+    StepperStepRender,
+    MenuRender,
+    MenuItemRender,
+    MenuLinkRender,
+    MenuDividerRender,
+    MenuGroupRender,
+    ContextMenuRender,
+    contextMenuHandler,
+    SplitterRender,
+    SplitterGutterRender,
+    SplitterPanelRender,
+    AccordionRender,
+    AccordionItemRender,
+
+    SimpleTableRender,
+    DataTableRender,
+    SwitchRender
+
+};

package/src/ui/tokens/colors-dark.scss

@@ -1,7 +1,8 @@
 @media (prefers-color-scheme: dark) {
   :root {
     --transparent: transparent;
-    --background: #242426;
+    --background: white;
+    //--background: #242426;
     --background-color: #242426;
     --text-color: black;
 

package/src/ui/tokens/reset.scss

@@ -23,6 +23,9 @@ time, mark, audio, video {
   font: inherit;
   vertical-align: baseline;
 }
+th, td {
+  vertical-align: middle;
+}
 /* HTML5 display-role reset for older browsers */
 article, aside, details, figcaption, figure,
 footer, header, hgroup, menu, nav, section {

package/types/control-flow.d.ts

@@ -32,14 +32,14 @@ export interface WhenFunction {
 
 export interface ForEachFunction {
     <T>(data: T[] | Record<string, T> | ObservableItem<T[]> | ObservableItem<Record<string, T>>,
-        callback: (item: T, index?: ObservableItem<number>) => ValidChild,
+        callback?: (item: T, index?: ObservableItem<number>) => ValidChild,
         key?: string | ((item: T, defaultKey: string | number) => string | number),
         options?: { shouldKeepItemsInCache: boolean, isParentUniqueChild: boolean,  }): DocumentFragment,
 }
 
 export interface ForEachArrayFunction {
     <T>(data: ObservableArray<T>,
-        callback: (item: T, index?: ObservableItem<number>) => ValidChild,
+        callback?: (item: T, index?: ObservableItem<number>) => ValidChild,
         configs?: { isParentUniqueChild: boolean, shouldKeepItemsInCache?: boolean }): DocumentFragment;
 }
 

package/src/components/layouts/ZStack.js

@@ -1,41 +0,0 @@
-import BaseComponent from "../BaseComponent";
-import DebugManager from "../../core/utils/debug-manager";
-
-export default function ZStack(content, props = {}) {
-    if (!(this instanceof ZStack)) {
-        return new ZStack(content, props);
-    }
-    BaseComponent.call(this, props);
-
-    this.$description = {
-        content: content,
-        alignment: 'center',
-        props
-    };
-}
-
-BaseComponent.extends(ZStack);
-
-ZStack.defaultTemplate = null;
-ZStack.use = function(template) {
-    ZStack.defaultTemplate = template;
-};
-
-ZStack.preset = function(name, callback) {
-    if (ZStack.prototype[name] || ZStack[name]) {
-        DebugManager.warn(`Warning: the ${name} method already exists in ZStack.`);
-        return;
-    }
-    ZStack[name] = (content, props) => callback(new ZStack(content, props));
-};
-
-ZStack.presets = function(presets) {
-    for (const name in presets) {
-        ZStack.preset(name, presets[name]);
-    }
-};
-
-ZStack.prototype.alignment = function(align) {
-    this.$description.alignment = align;
-    return this;
-};

package/src/ui/components/button/button.render.js

@@ -1,63 +0,0 @@
-import { Button as NativeButton, Span } from 'native-document/elements';
-import { classPropertyAccumulator } from 'native-document/utils';
-import './button.css';
-
-/**
- * @param {Button} instance
- * @returns {HTMLElement}
- */
-const ButtonRender = function(instance) {
-    const desc = instance.$description;
-
-    const classes = classPropertyAccumulator([
-        'btn',
-        `btn--${desc.variant || 'secondary'}`,
-        desc.outline          && 'btn--outline',
-        desc.block            && 'btn--block',
-        desc.size === 'small' && 'btn--sm',
-        desc.size === 'large' && 'btn--lg',
-        desc.borderRadiusType && `btn--${desc.borderRadiusType}`,
-    ].filter(Boolean));
-
-    classes.add('btn--loading',  desc.loading);
-    classes.add('btn--disabled', desc.disabled);
-
-    const content = buildContent(desc);
-
-    return NativeButton({
-        class:    classes.value(),
-        type:     desc.type || 'button',
-        disabled: desc.disabled,
-    }, content);
-};
-
-/**
- * Construit le contenu du bouton
- * icon + label + loader selon la configuration
- */
-const buildContent = (desc) => {
-    const content = [];
-
-    if (desc.loading) {
-        content.push(Span({ class: 'btn__loader' }));
-    }
-
-    if (desc.icon && isIconBefore(desc.iconPosition)) {
-        content.push(Span({ class: 'btn__icon' }, desc.icon));
-    }
-
-    if (desc.label != null) {
-        content.push(Span({ class: 'btn__label' }, desc.label));
-    }
-
-    if (desc.icon && isIconAfter(desc.iconPosition)) {
-        content.push(Span({ class: 'btn__icon' }, desc.icon));
-    }
-
-    return content;
-};
-
-const isIconBefore = (position) => !position || position === 'left' || position === 'top';
-const isIconAfter  = (position) => position === 'right' || position === 'bottom';
-
-export default ButtonRender;