@3t-transform/threeteeui 0.0.3 → 0.0.5

package/dist/cjs/tttx-icon.cjs.entry.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-8a7479e4.js');
+
+const tttxIconCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto&display=swap\");@import url(\"https://fonts.googleapis.com/css2?family=Material+Icons+Round\");*{box-sizing:border-box}.flex-start{justify-content:start}.flex-end{justify-content:end}.flex-centre{justify-content:center}[class^=col-]{display:flex;padding-left:8px !important;padding-right:8px !important}h1,h2,h3,h4,h5,h6,p,label,small{margin:0;padding:0}h1,h2,h3,h4,h5,h6,p,label{display:block}*{font-family:\"Roboto\", sans-serif}html,body{font-weight:normal;font-size:16px}h1{font-weight:700;font-size:24px}h2{font-weight:700;font-size:20px}h3{font-weight:700;font-size:18px}h4{font-weight:normal;font-size:14px;text-transform:uppercase}button{font-weight:500;font-size:14px;text-transform:uppercase}small{font-weight:normal;font-size:14px}label{font-weight:700;font-size:16px}:host{display:block}.material-icons-round{vertical-align:-6px;color:var(--ui-color-lt)}";
+
+const TttxIcon = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.name = undefined;
+    this.color = undefined;
+  }
+  render() {
+    return (index.h("span", { class: "material-icons-round", style: { color: this.color } }, this.name));
+  }
+};
+TttxIcon.style = tttxIconCss;
+
+exports.tttx_icon = TttxIcon;

package/dist/cjs/tttx-page.cjs.entry.js

@@ -2,8 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-eb8fc323.js');
-const toolbar = require('./toolbar-656be6e6.js');
+const index = require('./index-8a7479e4.js');
+const toolbar = require('./toolbar-02115550.js');
+const ui_popover = require('./ui.popover-27780a1d.js');
 
 /**
  * DevExtreme (esm/ui/button_group.js)
@@ -20,14 +21,14 @@ var BUTTON_GROUP_FIRST_ITEM_CLASS = BUTTON_GROUP_CLASS + "-first-item";
 var BUTTON_GROUP_LAST_ITEM_CLASS = BUTTON_GROUP_CLASS + "-last-item";
 var BUTTON_GROUP_ITEM_HAS_WIDTH = BUTTON_GROUP_ITEM_CLASS + "-has-width";
 var SHAPE_STANDARD_CLASS = "dx-shape-standard";
-var ButtonCollection = toolbar.CollectionWidget.inherit({
+var ButtonCollection = ui_popover.CollectionWidget.inherit({
     _initTemplates() {
         this.callBase();
         this._templateManager.addDefaultTemplates({
-            item: new toolbar.BindableTemplate(($container, data, model) => {
+            item: new ui_popover.BindableTemplate(($container, data, model) => {
                 this._prepareItemStyles($container);
                 var template = this.option("buttonTemplate");
-                this._createComponent($container, toolbar.Button, toolbar.extend({}, model, data, this._getBasicButtonOptions(), {
+                this._createComponent($container, ui_popover.Button, ui_popover.extend({}, model, data, this._getBasicButtonOptions(), {
                     _templateData: this._hasCustomTemplate(template) ? model : {},
                     template: model.template || template
                 }));
@@ -44,12 +45,12 @@ var ButtonCollection = toolbar.CollectionWidget.inherit({
         }
     },
     _getDefaultOptions: function() {
-        return toolbar.extend(this.callBase(), {
+        return ui_popover.extend(this.callBase(), {
             itemTemplateProperty: null
         })
     },
     _hasCustomTemplate(template) {
-        return toolbar.isFunction(template) || this.option("integrationOptions.templates")[template]
+        return ui_popover.isFunction(template) || this.option("integrationOptions.templates")[template]
     },
     _prepareItemStyles($item) {
         var itemIndex = $item.data("dxItemIndex");
@@ -59,11 +60,11 @@ var ButtonCollection = toolbar.CollectionWidget.inherit({
         $item.addClass(SHAPE_STANDARD_CLASS);
     },
     _renderItemContent(args) {
-        args.container = toolbar.$(args.container).parent();
+        args.container = ui_popover.$(args.container).parent();
         return this.callBase(args)
     },
     _renderItemContentByNode: function(args, $node) {
-        args.container = toolbar.$(args.container.children().first());
+        args.container = ui_popover.$(args.container.children().first());
         return this.callBase(args, $node)
     },
     _focusTarget() {
@@ -84,9 +85,9 @@ var ButtonCollection = toolbar.CollectionWidget.inherit({
         this.callBase(e);
     }
 });
-var ButtonGroup = toolbar.Widget.inherit({
+var ButtonGroup = ui_popover.Widget.inherit({
     _getDefaultOptions() {
-        return toolbar.extend(this.callBase(), {
+        return ui_popover.extend(this.callBase(), {
             hoverStateEnabled: true,
             focusStateEnabled: true,
             selectionMode: "single",
@@ -123,7 +124,7 @@ var ButtonGroup = toolbar.Widget.inherit({
         });
     },
     _renderButtons() {
-        var $buttons = toolbar.$("<div>").addClass(BUTTON_GROUP_WRAPPER_CLASS).appendTo(this.$element());
+        var $buttons = ui_popover.$("<div>").addClass(BUTTON_GROUP_WRAPPER_CLASS).appendTo(this.$element());
         var selectedItems = this.option("selectedItems");
         var options = {
             selectionMode: this.option("selectionMode"),
@@ -142,7 +143,7 @@ var ButtonGroup = toolbar.Widget.inherit({
             selectionRequired: false,
             onItemRendered: e => {
                 var width = this.option("width");
-                toolbar.isDefined(width) && toolbar.$(e.itemElement).addClass(BUTTON_GROUP_ITEM_HAS_WIDTH);
+                ui_popover.isDefined(width) && ui_popover.$(e.itemElement).addClass(BUTTON_GROUP_ITEM_HAS_WIDTH);
             },
             onSelectionChanged: e => {
                 this._syncSelectionOptions();
@@ -152,7 +153,7 @@ var ButtonGroup = toolbar.Widget.inherit({
                 this._itemClickAction(e);
             }
         };
-        if (toolbar.isDefined(selectedItems) && selectedItems.length) {
+        if (ui_popover.isDefined(selectedItems) && selectedItems.length) {
             options.selectedItems = selectedItems;
         }
         this._buttonsCollection = this._createComponent($buttons, ButtonCollection, options);
@@ -192,7 +193,7 @@ var ButtonGroup = toolbar.Widget.inherit({
         }
     }
 });
-toolbar.registerComponent("dxButtonGroup", ButtonGroup);
+ui_popover.registerComponent("dxButtonGroup", ButtonGroup);
 
 /**
  * DevExtreme (esm/ui/drop_down_editor/utils.js)
@@ -203,8 +204,8 @@ toolbar.registerComponent("dxButtonGroup", ButtonGroup);
  * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
  */
 var getElementWidth = function($element) {
-    if (toolbar.hasWindow()) {
-        return toolbar.getOuterWidth($element)
+    if (ui_popover.hasWindow()) {
+        return ui_popover.getOuterWidth($element)
     }
 };
 var getSizeValue = function(size) {
@@ -234,9 +235,9 @@ var DROP_DOWN_BUTTON_POPUP_WRAPPER_CLASS = "dx-dropdownbutton-popup-wrapper";
 var DROP_DOWN_EDITOR_OVERLAY_CLASS = "dx-dropdowneditor-overlay";
 var DX_BUTTON_TEXT_CLASS = "dx-button-text";
 var DX_ICON_RIGHT_CLASS = "dx-icon-right";
-var DropDownButton = toolbar.Widget.inherit({
+var DropDownButton = ui_popover.Widget.inherit({
     _getDefaultOptions() {
-        return toolbar.extend(this.callBase(), {
+        return ui_popover.extend(this.callBase(), {
             itemTemplate: "item",
             keyExpr: "this",
             displayExpr: void 0,
@@ -244,7 +245,7 @@ var DropDownButton = toolbar.Widget.inherit({
             selectedItemKey: null,
             stylingMode: "outlined",
             deferRendering: true,
-            noDataText: toolbar.messageLocalization.format("dxCollectionWidget-noDataText"),
+            noDataText: ui_popover.messageLocalization.format("dxCollectionWidget-noDataText"),
             useSelectMode: false,
             splitButton: false,
             showArrowIcon: true,
@@ -269,7 +270,7 @@ var DropDownButton = toolbar.Widget.inherit({
     },
     _setOptionsByReference() {
         this.callBase();
-        toolbar.extend(this._optionsByReference, {
+        ui_popover.extend(this._optionsByReference, {
             selectedItem: true
         });
     },
@@ -287,10 +288,10 @@ var DropDownButton = toolbar.Widget.inherit({
     },
     _initTemplates() {
         this._templateManager.addDefaultTemplates({
-            content: new toolbar.FunctionTemplate(options => {
-                var $popupContent = toolbar.$(options.container);
-                var $listContainer = toolbar.$("<div>").appendTo($popupContent);
-                this._list = this._createComponent($listContainer, toolbar.ListSearch, this._listOptions());
+            content: new ui_popover.FunctionTemplate(options => {
+                var $popupContent = ui_popover.$(options.container);
+                var $listContainer = ui_popover.$("<div>").appendTo($popupContent);
+                this._list = this._createComponent($listContainer, ui_popover.ListSearch, this._listOptions());
                 this._list.registerKeyHandler("escape", this._escHandler.bind(this));
                 this._list.registerKeyHandler("tab", this._escHandler.bind(this));
                 this._list.registerKeyHandler("leftArrow", this._escHandler.bind(this));
@@ -301,8 +302,8 @@ var DropDownButton = toolbar.Widget.inherit({
     },
     _itemsToDataSource: function(value) {
         if (!this._dataSource) {
-            this._dataSource = new toolbar.DataSource({
-                store: new toolbar.ArrayStore({
+            this._dataSource = new ui_popover.DataSource({
+                store: new ui_popover.ArrayStore({
                     key: this._getKey(),
                     data: value
                 }),
@@ -314,24 +315,24 @@ var DropDownButton = toolbar.Widget.inherit({
         var _this$_dataSource;
         var keyExpr = this.option("keyExpr");
         var storeKey = null === (_this$_dataSource = this._dataSource) || void 0 === _this$_dataSource ? void 0 : _this$_dataSource.key();
-        return toolbar.isDefined(storeKey) && (!toolbar.isDefined(keyExpr) || "this" === keyExpr) ? storeKey : keyExpr
+        return ui_popover.isDefined(storeKey) && (!ui_popover.isDefined(keyExpr) || "this" === keyExpr) ? storeKey : keyExpr
     },
     _compileKeyGetter() {
-        this._keyGetter = toolbar.compileGetter(this._getKey());
+        this._keyGetter = ui_popover.compileGetter(this._getKey());
     },
     _compileDisplayGetter() {
-        this._displayGetter = toolbar.compileGetter(this.option("displayExpr"));
+        this._displayGetter = ui_popover.compileGetter(this.option("displayExpr"));
     },
     _initMarkup() {
         this.callBase();
         this.$element().addClass(DROP_DOWN_BUTTON_CLASS);
         this._renderButtonGroup();
         this._updateArrowClass();
-        if (toolbar.isDefined(this.option("selectedItemKey"))) {
+        if (ui_popover.isDefined(this.option("selectedItemKey"))) {
             this._loadSelectedItem().done(this._updateActionButton.bind(this));
         }
     },
-    _renderFocusTarget: toolbar.noop,
+    _renderFocusTarget: ui_popover.noop,
     _render() {
         if (!this.option("deferRendering") || this.option("opened")) {
             this._renderPopup();
@@ -347,7 +348,7 @@ var DropDownButton = toolbar.Widget.inherit({
     _loadSelectedItem() {
         var _this$_loadSingleDefe;
         null === (_this$_loadSingleDefe = this._loadSingleDeferred) || void 0 === _this$_loadSingleDefe ? void 0 : _this$_loadSingleDefe.reject();
-        var d = new toolbar.Deferred;
+        var d = new ui_popover.Deferred;
         if (this._list && void 0 !== this._lastSelectedItemData) {
             var cachedResult = this.option("useSelectMode") ? this._list.option("selectedItem") : this._lastSelectedItemData;
             return d.resolve(cachedResult)
@@ -447,12 +448,12 @@ var DropDownButton = toolbar.Widget.inherit({
                 text: text,
                 icon: icon
             } = _ref4;
-            var $firstIcon = toolbar.getImageContainer(icon);
-            var $textContainer = text ? toolbar.$("<span>").text(text).addClass(DX_BUTTON_TEXT_CLASS) : void 0;
-            var $secondIcon = toolbar.getImageContainer("spindown").addClass(DX_ICON_RIGHT_CLASS);
-            toolbar.$(buttonContent).append($firstIcon, $textContainer, $secondIcon);
+            var $firstIcon = ui_popover.getImageContainer(icon);
+            var $textContainer = text ? ui_popover.$("<span>").text(text).addClass(DX_BUTTON_TEXT_CLASS) : void 0;
+            var $secondIcon = ui_popover.getImageContainer("spindown").addClass(DX_ICON_RIGHT_CLASS);
+            ui_popover.$(buttonContent).append($firstIcon, $textContainer, $secondIcon);
         };
-        return toolbar.extend({
+        return ui_popover.extend({
             items: this._getButtonGroupItems(),
             onItemClick: this._buttonGroupItemClick.bind(this),
             width: "100%",
@@ -471,22 +472,22 @@ var DropDownButton = toolbar.Widget.inherit({
         var $content = this._popup.$content();
         var template = this._getTemplateByOption("dropDownContentTemplate");
         $content.empty();
-        this._popupContentId = "dx-" + new toolbar.Guid;
+        this._popupContentId = "dx-" + new ui_popover.Guid;
         this.setAria("id", this._popupContentId, $content);
         return template.render({
-            container: toolbar.getPublicElement($content),
+            container: ui_popover.getPublicElement($content),
             model: this.option("items") || this._dataSource
         })
     },
     _popupOptions() {
         var horizontalAlignment = this.option("rtlEnabled") ? "right" : "left";
-        return toolbar.extend({
+        return ui_popover.extend({
             dragEnabled: false,
             focusStateEnabled: false,
             deferRendering: this.option("deferRendering"),
             hideOnOutsideClick: e => {
                 var $element = this.$element();
-                var $buttonClicked = toolbar.$(e.target).closest(".".concat(DROP_DOWN_BUTTON_CLASS));
+                var $buttonClicked = ui_popover.$(e.target).closest(".".concat(DROP_DOWN_BUTTON_CLASS));
                 return !$buttonClicked.is($element)
             },
             showTitle: false,
@@ -531,7 +532,7 @@ var DropDownButton = toolbar.Widget.inherit({
             hoverStateEnabled: this.option("hoverStateEnabled"),
             useItemTextAsTitle: this.option("useItemTextAsTitle"),
             onContentReady: () => this._fireContentReadyAction(),
-            selectedItemKeys: toolbar.isDefined(selectedItemKey) && useSelectMode ? [selectedItemKey] : [],
+            selectedItemKeys: ui_popover.isDefined(selectedItemKey) && useSelectMode ? [selectedItemKey] : [],
             grouped: this.option("grouped"),
             groupTemplate: this.option("groupTemplate"),
             keyExpr: this._getKey(),
@@ -571,9 +572,9 @@ var DropDownButton = toolbar.Widget.inherit({
         return true
     },
     _renderPopup() {
-        var $popup = toolbar.$("<div>");
+        var $popup = ui_popover.$("<div>");
         this.$element().append($popup);
-        this._popup = this._createComponent($popup, toolbar.Popup, this._popupOptions());
+        this._popup = this._createComponent($popup, ui_popover.Popup, this._popupOptions());
         this._popup.$content().addClass(DROP_DOWN_BUTTON_CONTENT);
         this._popup.$wrapper().addClass(DROP_DOWN_BUTTON_POPUP_WRAPPER_CLASS);
         this._popup.on("hiding", this._popupHidingHandler.bind(this));
@@ -585,7 +586,7 @@ var DropDownButton = toolbar.Widget.inherit({
         this._setAriaExpanded(false);
     },
     _popupOptionChanged: function(args) {
-        var options = toolbar.Widget.getOptionsFromContainer(args);
+        var options = ui_popover.Widget.getOptionsFromContainer(args);
         this._setPopupOption(options);
         var optionsKeys = Object.keys(options);
         if (-1 !== optionsKeys.indexOf("width") || -1 !== optionsKeys.indexOf("height")) {
@@ -610,11 +611,11 @@ var DropDownButton = toolbar.Widget.inherit({
             this.setAria({
                 expanded: value,
                 owns: value ? this._popupContentId : void 0
-            }, toolbar.$(ariaElement));
+            }, ui_popover.$(ariaElement));
         });
     },
     _renderButtonGroup() {
-        var $buttonGroup = this._buttonGroup && this._buttonGroup.$element() || toolbar.$("<div>");
+        var $buttonGroup = this._buttonGroup && this._buttonGroup.$element() || ui_popover.$("<div>");
         if (!this._buttonGroup) {
             this.$element().append($buttonGroup);
         }
@@ -649,15 +650,15 @@ var DropDownButton = toolbar.Widget.inherit({
         this._list && this._list.option(name, value);
     },
     _getDisplayValue(item) {
-        var isPrimitiveItem = !toolbar.isPlainObject(item);
+        var isPrimitiveItem = !ui_popover.isPlainObject(item);
         var displayValue = isPrimitiveItem ? item : this._displayGetter(item);
-        return !toolbar.isPlainObject(displayValue) ? String(toolbar.ensureDefined(displayValue, "")) : ""
+        return !ui_popover.isPlainObject(displayValue) ? String(ui_popover.ensureDefined(displayValue, "")) : ""
     },
     _updateActionButton(selectedItem) {
         if (this.option("useSelectMode")) {
             this.option({
                 text: this._getDisplayValue(selectedItem),
-                icon: toolbar.isPlainObject(selectedItem) ? selectedItem.icon : void 0
+                icon: ui_popover.isPlainObject(selectedItem) ? selectedItem.icon : void 0
             });
         }
         this._setOptionWithoutOptionChange("selectedItem", selectedItem);
@@ -668,7 +669,7 @@ var DropDownButton = toolbar.Widget.inherit({
         this._popup && this._popup.$element().remove();
     },
     _selectedItemKeyChanged(value) {
-        this._setListOption("selectedItemKeys", this.option("useSelectMode") && toolbar.isDefined(value) ? [value] : []);
+        this._setListOption("selectedItemKeys", this.option("useSelectMode") && ui_popover.isDefined(value) ? [value] : []);
         var previousItem = this.option("selectedItem");
         this._loadSelectedItem().done(selectedItem => {
             this._updateActionButton(selectedItem);
@@ -687,14 +688,14 @@ var DropDownButton = toolbar.Widget.inherit({
         } = _ref5;
         var newConfig = {};
         newConfig[name] = value;
-        this._buttonGroup.option("items[0]", toolbar.extend({}, this._actionButtonConfig(), newConfig));
+        this._buttonGroup.option("items[0]", ui_popover.extend({}, this._actionButtonConfig(), newConfig));
         this._popup && this._popup.repaint();
     },
     _selectModeChanged(value) {
         if (value) {
             this._setListOption("selectionMode", "single");
             var selectedItemKey = this.option("selectedItemKey");
-            this._setListOption("selectedItemKeys", toolbar.isDefined(selectedItemKey) ? [selectedItemKey] : []);
+            this._setListOption("selectedItemKeys", ui_popover.isDefined(selectedItemKey) ? [selectedItemKey] : []);
             this._selectedItemKeyChanged(this.option("selectedItemKey"));
         } else {
             this._setListOption("selectionMode", "none");
@@ -711,7 +712,7 @@ var DropDownButton = toolbar.Widget.inherit({
         var selectedItemKey = this.option("selectedItemKey");
         this._setListOption("selectedItem", null);
         this._setWidgetOption("_list", [optionName]);
-        if (toolbar.isDefined(selectedItemKey)) {
+        if (ui_popover.isDefined(selectedItemKey)) {
             this._loadSelectedItem().done(selectedItem => {
                 this._setListOption("selectedItemKeys", [selectedItemKey]);
                 this._setListOption("selectedItem", selectedItem);
@@ -842,8 +843,8 @@ var DropDownButton = toolbar.Widget.inherit({
                 this.callBase(args);
         }
     }
-}).include(toolbar.DataHelperMixin);
-toolbar.registerComponent("dxDropDownButton", DropDownButton);
+}).include(ui_popover.DataHelperMixin);
+ui_popover.registerComponent("dxDropDownButton", DropDownButton);
 
 const tttxPageCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto&display=swap\");*{box-sizing:border-box}.flex-start{justify-content:start}.flex-end{justify-content:end}.flex-centre{justify-content:center}[class^=col-]{display:flex;padding-left:8px !important;padding-right:8px !important}h1,h2,h3,h4,h5,h6,p,label,small{margin:0;padding:0}h1,h2,h3,h4,h5,h6,p,label{display:block}*{font-family:\"Roboto\", sans-serif}html,body{font-weight:normal;font-size:16px}h1{font-weight:700;font-size:24px}h2{font-weight:700;font-size:20px}h3{font-weight:700;font-size:18px}h4{font-weight:normal;font-size:14px;text-transform:uppercase}button{font-weight:500;font-size:14px;text-transform:uppercase}small{font-weight:normal;font-size:14px}label{font-weight:700;font-size:16px}:host{display:block}.page{background-color:#F0F0F0;width:100%;height:100%}.page__platform-bar.dx-toolbar{position:fixed;top:0px;left:0px;right:0px;background-color:#142748;color:#ffffff;font-size:24px;padding:0 8px}.page__title-bar__container,.page__title-bar__container--large,.page__title-bar__container--medium,.page__title-bar__container--small{position:fixed;top:52px;left:0px;right:0px}.page__title-bar__container .dx-toolbar,.page__title-bar__container--large .dx-toolbar,.page__title-bar__container--medium .dx-toolbar,.page__title-bar__container--small .dx-toolbar{color:#212121;background-color:#F0F0F0;font-size:24px}.page__title-bar__container,.page__title-bar__container--medium,.page__title-bar__container--small{margin:0px auto}.page__title-bar__container--large{margin:0px 16px}.page__title-bar__container--medium{width:900px}.page__title-bar__container--small{width:600px}.page__title-bar__after-container__label{font-size:14px;color:#757575;font-weight:300}.page__title-bar__after-container__value{font-size:14px;color:#111111;font-weight:400;margin:0 10px 0 0}.page__platform-bar__button .dx-button-mode-text .dx-icon{color:white}.page__platform-bar__button__dropdown-options .dx-dropdownbutton-content .dx-list .dx-list-item:last-of-type::before{width:90%;margin:auto 5%;height:1px;content:\"\";position:absolute;background:grey}";
 
@@ -894,7 +895,7 @@ const TttxPage = class {
         },
         {
           location: 'after',
-          widget: toolbar.Button,
+          widget: ui_popover.Button,
           options: {
             text: 'help',
             icon: 'help',

package/dist/cjs/tttx-worksheet.cjs.entry.js

@@ -2,8 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-eb8fc323.js');
-const toolbar = require('./toolbar-656be6e6.js');
+const index = require('./index-8a7479e4.js');
+const toolbar = require('./toolbar-02115550.js');
+const ui_popover = require('./ui.popover-27780a1d.js');
 
 const tttxWorksheetCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto&display=swap\");*{box-sizing:border-box}.flex-start{justify-content:start}.flex-end{justify-content:end}.flex-centre{justify-content:center}[class^=col-]{display:flex;padding-left:8px !important;padding-right:8px !important}h1,h2,h3,h4,h5,h6,p,label,small{margin:0;padding:0}h1,h2,h3,h4,h5,h6,p,label{display:block}*{font-family:\"Roboto\", sans-serif}html,body{font-weight:normal;font-size:16px}h1{font-weight:700;font-size:24px}h2{font-weight:700;font-size:20px}h3{font-weight:700;font-size:18px}h4{font-weight:normal;font-size:14px;text-transform:uppercase}button{font-weight:500;font-size:14px;text-transform:uppercase}small{font-weight:normal;font-size:14px}label{font-weight:700;font-size:16px}:host{display:block}.worksheet__container,.worksheet__container--large,.worksheet__container--medium,.worksheet__container--small{position:absolute;top:104px;bottom:8px;left:0px;right:0px;overflow:auto;background-color:#ffffff;clear:both}.worksheet__container,.worksheet__container--medium,.worksheet__container--small,.worksheet__footer--medium,.worksheet__footer--small{margin:0px auto}.worksheet__container--large{margin:0px 16px}.worksheet__container--medium{width:900px}.worksheet__container--small{width:600px}.worksheet__footer--medium.dx-toolbar,.worksheet__footer--small.dx-toolbar{position:fixed;bottom:0px;left:0px;right:0px;padding:0 8px}.worksheet__footer--medium.dx-toolbar{width:900px}.worksheet__footer--small.dx-toolbar{width:600px}";
 
@@ -29,7 +30,7 @@ const TttxWorksheet = class {
       items: [
         {
           location: 'after',
-          widget: toolbar.Button,
+          widget: ui_popover.Button,
           options: {
             text: 'save'
           }

package/dist/cjs/tttx.cjs.js

@@ -1,6 +1,6 @@
 'use strict';
 
-const index = require('./index-eb8fc323.js');
+const index = require('./index-8a7479e4.js');
 
 /*
  Stencil Client Patch Browser v2.20.0 | MIT Licensed | https://stenciljs.com
@@ -15,5 +15,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["tttx-worksheet.cjs",[[4,"tttx-worksheet",{"pageSize":[1,"page-size"]}]]],["tttx-page.cjs",[[4,"tttx-page",{"appName":[1,"app-name"],"pageTitle":[1,"page-title"],"lastUpdated":[1,"last-updated"],"manageAccountsUrl":[1,"manage-accounts-url"],"logoutUrl":[1,"logout-url"],"pageSize":[1,"page-size"],"helpUrl":[1,"help-url"]}]]]], options);
+  return index.bootstrapLazy([["tttx-page.cjs",[[4,"tttx-page",{"appName":[1,"app-name"],"pageTitle":[1,"page-title"],"lastUpdated":[1,"last-updated"],"manageAccountsUrl":[1,"manage-accounts-url"],"logoutUrl":[1,"logout-url"],"pageSize":[1,"page-size"],"helpUrl":[1,"help-url"]}]]],["qualifications-list.cjs",[[0,"qualifications-list"]]],["tttx-icon.cjs",[[0,"tttx-icon",{"name":[1],"color":[1]}]]],["tttx-worksheet.cjs",[[4,"tttx-worksheet",{"pageSize":[1,"page-size"]}]]]], options);
 });