@wcardinal/wcardinal-ui 0.441.0 → 0.443.0

package/dist/wcardinal-ui.cjs.js

@@ -1,5 +1,5 @@
 /*
- Winter Cardinal UI v0.441.0
+ Winter Cardinal UI v0.443.0
  Copyright (C) 2019 Toshiba Corporation
  SPDX-License-Identifier: Apache-2.0
 
@@ -31777,6 +31777,7 @@ var DImagePieceLayouterPartContainer = /** @class */ (function () {
             var textWidth = 0;
             var textHeight = 0;
             if (text != null) {
+                text.setClippingDelta(leftSize + rightSize, topSize + bottomSize);
                 textWidth = text.width;
                 textHeight = text.height;
             }
@@ -31811,7 +31812,6 @@ var DImagePieceLayouterPartContainer = /** @class */ (function () {
             }
             if (text != null) {
                 text.position.set(textX, textY);
-                text.setClippingDelta(leftSize + rightSize, topSize + bottomSize);
             }
             left.execute(textX - leftSize);
             center.execute(0, 0, textX * 2 + textWidth);
@@ -32856,18 +32856,13 @@ var DDynamicText = /** @class */ (function (_super) {
         if (styleClipping || styleFitting || styleWordWrap) {
             var parent_1 = this.parent;
             if (parent_1 instanceof DBase) {
-                var width = parent_1.width -
-                    parent_1.padding.getLeft() -
-                    parent_1.padding.getRight() -
-                    modifier.delta.width;
+                var padding = parent_1.padding;
+                var width = parent_1.width - padding.getLeft() - padding.getRight() - modifier.delta.width;
                 if (modifier.width !== width) {
                     modifier.width = width;
                     isChanged = true;
                 }
-                var height = parent_1.height -
-                    parent_1.padding.getTop() -
-                    parent_1.padding.getBottom() -
-                    modifier.delta.height;
+                var height = parent_1.height - padding.getTop() - padding.getBottom() - modifier.delta.height;
                 if (modifier.height !== height) {
                     modifier.height = height;
                     isChanged = true;
@@ -34265,8 +34260,16 @@ var DImagePieceImpl = /** @class */ (function () {
                         object.alpha = alpha;
                         result = true;
                     }
+                    if (!object.visible) {
+                        object.visible = true;
+                        result = true;
+                    }
                     return result;
                 }
+                else if (object.visible) {
+                    object.visible = false;
+                    return true;
+                }
             }
         }
         return false;
@@ -57496,6 +57499,10 @@ var DTableState = {
      * Cells of a right-most frozen column.
      */
     FROZEN_END: "FROZEN_END",
+    /**
+     * Rows with data
+     */
+    HAS_DATA: "HAS_DATA",
     /**
      * Header cells of sortable columns.
      */
@@ -57803,16 +57810,27 @@ var loadThemeWhite = function () {
     DThemes.setDefaultThemeClass(DThemeWhite);
 };
 
+var newSvgRoundedRect = function (x, y, width, height, fill, stroke, strokeWidth, strokeOpacity) {
+    var sw = strokeWidth !== null && strokeWidth !== void 0 ? strokeWidth : 0;
+    var o = sw * 0.5;
+    var r = Math.max(0, 3 - o);
+    var w = width - sw - r - r;
+    var h = height - sw - r - r;
+    x += o + r;
+    y += o;
+    return ("<path d=\"M".concat(x, ",").concat(y, " h").concat(w, " a").concat(r, ",").concat(r, " 0 0 1 ").concat(r, ",").concat(r, " v").concat(h, " a").concat(r, ",").concat(r, " 0 0 1 -").concat(r, ",").concat(r, " h-").concat(w, " a").concat(r, ",").concat(r, " 0 0 1 -").concat(r, ",-").concat(r, " v-").concat(h, " a").concat(r, ",").concat(r, " 0 0 1 ").concat(r, ",-").concat(r, "z\" fill=\"").concat(fill, "\"") +
+        (stroke ? " stroke=\"".concat(stroke, "\"") : "") +
+        (strokeWidth != null ? " stroke-width=\"".concat(strokeWidth, "\"") : "") +
+        (strokeOpacity != null ? " stroke-opacity=\"".concat(strokeOpacity, "\"") : "") +
+        " />");
+};
+
 /*
  * Copyright (C) 2019 Toshiba Corporation
  * SPDX-License-Identifier: Apache-2.0
  */
-// Material Design icons by Google.
-// Apache license version 2.0.
 /* eslint-disable prettier/prettier */
-DThemeWhiteAtlas.add("button_color_sample", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
-    "<path d=\"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\" fill=\"#fff\"/>" +
-    "</g>");
+DThemeWhiteAtlas.add("button_color_sample", 21, 21, newSvgRoundedRect(3, 3, 15, 15, "#fff", "#eee", 1));
 /* eslint-enable prettier/prettier */
 var formatter$j = function (colorAndAlpha) {
     return "#".concat(UtilRgb.toCode(colorAndAlpha.color), " A").concat(colorAndAlpha.alpha.toFixed(2));
@@ -57823,7 +57841,7 @@ var DThemeWhiteButtonColor = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     DThemeWhiteButtonColor.prototype.getImageTintColor = function (state) {
-        return null;
+        return 0xffffff;
     };
     DThemeWhiteButtonColor.prototype.getImageSource = function (state) {
         return DThemeWhiteAtlas.mappings.button_color_sample;
@@ -57861,25 +57879,35 @@ var DColorType = {
     STANDARD: 1
 };
 
+var isPatternInjected = false;
+var newSvgRoundedCheckerboard = function (width, height, color1, color2, stroke, strokeWidth, strokeOpacity) {
+    var result = "";
+    if (!isPatternInjected) {
+        isPatternInjected = true;
+        result =
+            "<defs>" +
+                "<pattern id=\"rounded-checkerboard-pattern\" patternUnits=\"userSpaceOnUse\" width=\"18\" height=\"18\">" +
+                "<rect x=\"0\" y=\"0\" width=\"9\" height=\"9\" fill=\"".concat(color1, "\" />") +
+                "<rect x=\"9\" y=\"0\" width=\"9\" height=\"9\" fill=\"".concat(color2, "\" />") +
+                "<rect x=\"0\" y=\"9\" width=\"9\" height=\"9\" fill=\"".concat(color2, "\" />") +
+                "<rect x=\"9\" y=\"9\" width=\"9\" height=\"9\" fill=\"".concat(color1, "\" />") +
+                "</pattern>" +
+                "</defs>";
+    }
+    result += newSvgRoundedRect(0, 0, width, height, "url(#rounded-checkerboard-pattern)", stroke, strokeWidth, strokeOpacity);
+    return result;
+};
+
+var newWhiteSvgRoundedCheckerboard = function (width, height, stroke, strokeWidth, strokeOpacity) {
+    return newSvgRoundedCheckerboard(width, height, "#bfbfbf", "#a5a5a5", stroke, strokeWidth, strokeOpacity);
+};
+
 /*
  * Copyright (C) 2019 Toshiba Corporation
  * SPDX-License-Identifier: Apache-2.0
  */
-var makeCheckerboard$1 = function (width, height) {
-    var LIGHT = "#bfbfbf";
-    var DARK = "#a5a5a5";
-    var result = "<g>";
-    for (var ih = 0; ih < height; ++ih) {
-        for (var iw = 0; iw < width; ++iw) {
-            var color = (iw + ih) % 2 === 0 ? LIGHT : DARK;
-            result += "<rect x=\"".concat(9 * iw, "\" y=\"").concat(9 * ih, "\" width=\"9\" height=\"9\" fill=\"").concat(color, "\" />");
-        }
-    }
-    result += "</g>";
-    return result;
-};
 /* eslint-disable prettier/prettier */
-DThemeWhiteAtlas.add("picker_color_main", 236, 164, "<g>" +
+DThemeWhiteAtlas.add("picker_color_main", 234, 162, "<g>" +
     "<linearGradient id=\"fs7w3iusfdnb\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">" +
     "<stop stop-color=\"#FFFFFF\" stop-opacity=\"0\" offset=\"0\"/>" +
     "<stop stop-color=\"#FFFFFF\" stop-opacity=\"1\" offset=\"1\"/>" +
@@ -57888,13 +57916,11 @@ DThemeWhiteAtlas.add("picker_color_main", 236, 164, "<g>" +
     "<stop stop-color=\"#000000\" stop-opacity=\"0\" offset=\"0\"/>" +
     "<stop stop-color=\"#000000\" stop-opacity=\"1\" offset=\"1\"/>" +
     "</linearGradient>" +
-    "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"url(#fs7w3iusfdnb)\" />" +
-    "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"url(#2rfcfe9874bw)\" />" +
-    "</g>", 1, 1, 234, 162);
-DThemeWhiteAtlas.add("picker_color_main_base", 236, 164, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"#fff\" />" +
-    "</g>", 1, 1, 234, 162);
-DThemeWhiteAtlas.add("picker_color_alpha_checkerboard", 234, 18, makeCheckerboard$1(26, 2));
+    newSvgRoundedRect(0, 0, 234, 162, "url(#fs7w3iusfdnb)") +
+    newSvgRoundedRect(0, 0, 234, 162, "url(#2rfcfe9874bw)") +
+    "</g>");
+DThemeWhiteAtlas.add("picker_color_main_base", 234, 162, "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"#fff\" />");
+DThemeWhiteAtlas.add("picker_color_alpha_checkerboard", 234, 18, newWhiteSvgRoundedCheckerboard(234, 18));
 DThemeWhiteAtlas.add("picker_color_alpha", 234, 18, "<g>" +
     "<linearGradient id=\"s48afbuh44\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">" +
     "<stop stop-color=\"#FFFFFF\" stop-opacity=\"0\" offset=\"0\"/>" +
@@ -57912,20 +57938,15 @@ DThemeWhiteAtlas.add("picker_color_base", 234, 18, "<g>" +
     "<stop stop-color=\"#FF00FF\" offset=\"0.833\"/>" +
     "<stop stop-color=\"#FF0000\" offset=\"1\"/>" +
     "</linearGradient>" +
-    "<rect x=\"0\" y=\"0\" width=\"234\" height=\"18\" fill=\"url(#ni2rbisdf3)\" />" +
+    newSvgRoundedRect(0, 0, 234, 18, "url(#ni2rbisdf3)") +
     "</g>");
 DThemeWhiteAtlas.add("picker_color_base_pointer", 16.2, 31.8, "<rect x=\"4.5\" y=\"4.5\" width=\"7.2\" height=\"22.8\" stroke=\"#5f5f5f\" stroke-width=\"2.4\" fill=\"none\" />");
 DThemeWhiteAtlas.add("picker_color_pointer", 25.8, 25.8, "<circle cx=\"12.9\" cy=\"12.9\" r=\"4.8\" stroke=\"#5f5f5f\" stroke-width=\"2.4\" fill=\"none\" />" +
     "<circle cx=\"12.9\" cy=\"12.9\" r=\"7.2\" stroke=\"#ffffff\" stroke-width=\"2.4\" fill=\"none\" />");
-DThemeWhiteAtlas.add("picker_color_recent_checkerboard", 36, 36, makeCheckerboard$1(4, 4), 9, 9, 18, 18);
-DThemeWhiteAtlas.add("picker_color_recent", 36, 36, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"36\" height=\"36\" fill=\"#fff\" />" +
-    "<path x=\"0\" y=\"0\" d=\"M9 9 h18 v18 h-18 v-18 m1 1 v16 h16 v-16 h-16 z\" fill=\"#eee\" />" +
-    "</g>", 9, 9, 18, 18);
-DThemeWhiteAtlas.add("picker_color_sample_checkerboard", 45, 63, makeCheckerboard$1(5, 7));
-DThemeWhiteAtlas.add("picker_color_sample", 47, 65, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"47\" height=\"65\" fill=\"#fff\" />" +
-    "</g>", 1, 1, 45, 63);
+DThemeWhiteAtlas.add("picker_color_recent_checkerboard", 18, 18, newWhiteSvgRoundedCheckerboard(18, 18));
+DThemeWhiteAtlas.add("picker_color_recent", 18, 18, newSvgRoundedRect(0, 0, 18, 18, "#fff", "#eee", 1));
+DThemeWhiteAtlas.add("picker_color_sample_checkerboard", 42, 66, newWhiteSvgRoundedCheckerboard(42, 66, "#fff", 1, 0));
+DThemeWhiteAtlas.add("picker_color_sample", 42, 66, newSvgRoundedRect(0, 0, 42, 66, "#fff", "#eee", 1));
 DThemeWhiteAtlas.add("picker_color_anchor_outlined", 25.8, 25.8, "<circle cx=\"12.9\" cy=\"12.9\" r=\"8.4\" stroke=\"none\" fill=\"#ffffff\" />" +
     "<circle cx=\"12.9\" cy=\"12.9\" r=\"9.6\" stroke=\"#5f5f5f\" stroke-width=\"2.4\" fill=\"none\" />");
 DThemeWhiteAtlas.add("picker_color_anchor", 28.2, 28.2, "<circle cx=\"14.1\" cy=\"14.1\" r=\"6\" stroke=\"none\" fill=\"#ffffff\" />" +
@@ -57933,9 +57954,7 @@ DThemeWhiteAtlas.add("picker_color_anchor", 28.2, 28.2, "<circle cx=\"14.1\" cy=
 DThemeWhiteAtlas.add("picker_color_direction", 12, 30, "<path d=\"M0.6 25.8 L 12.0375 5.9895\" stroke=\"#5f5f5f\" stroke-width=\"1.2\" fill=\"none\" />" +
     "<path d=\"M8.5125 25.8 A 8.475 8.475 0 0 0 4.275 18.4605\" stroke=\"#5f5f5f\" stroke-width=\"1.2\" fill=\"none\" />" +
     "<rect x=\"0.6\" y=\"24.6\" width=\"11.4375\" height=\"1.2\" rx=\"0.6\" ry=\"0.6\" stroke=\"none\" fill=\"#5f5f5f\" />");
-DThemeWhiteAtlas.add("picker_color_standard", 18, 18, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"18\" height=\"18\" fill=\"#fff\" stroke-width=\"1\" stroke=\"#eee\" />" +
-    "</g>");
+DThemeWhiteAtlas.add("picker_color_standard", 18, 18, newSvgRoundedRect(0, 0, 18, 18, "#fff", "#eee", 1));
 /* eslint-enable prettier/prettier */
 var DThemeWhitePickerColor = /** @class */ (function (_super) {
     __extends(DThemeWhitePickerColor, _super);
@@ -58027,7 +58046,16 @@ var DThemeWhitePickerColor = /** @class */ (function (_super) {
         return this.getBaseMargin();
     };
     DThemeWhitePickerColor.prototype.getInputLabelWidth = function () {
-        return 15;
+        return 18;
+    };
+    DThemeWhitePickerColor.prototype.getSampleWidth = function () {
+        return 42;
+    };
+    DThemeWhitePickerColor.prototype.getSampleHeight = function () {
+        return 66;
+    };
+    DThemeWhitePickerColor.prototype.getSampleMargin = function () {
+        return this.getBaseMargin();
     };
     DThemeWhitePickerColor.prototype.getSampleCheckerboardOldTexture = function () {
         return DThemeWhiteAtlas.mappings.picker_color_sample_checkerboard;
@@ -58441,12 +58469,8 @@ var DColorGradientObservable = /** @class */ (function (_super) {
  * Copyright (C) 2019 Toshiba Corporation
  * SPDX-License-Identifier: Apache-2.0
  */
-// Material Design icons by Google.
-// Apache license version 2.0.
 /* eslint-disable prettier/prettier */
-DThemeWhiteAtlas.add("button_color_gradient_sample", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
-    "<path d=\"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\" fill=\"#fff\"/>" +
-    "</g>");
+DThemeWhiteAtlas.add("button_color_gradient_sample", 21, 21, newSvgRoundedRect(3, 3, 15, 15, "#fff", "#eee", 1));
 /* eslint-enable prettier/prettier */
 var formatter$i = function () {
     return "";
@@ -60627,8 +60651,13 @@ var DThemeWhiteTableBodyCells = /** @class */ (function () {
         return DThemeWhiteConstants.COLOR;
     };
     DThemeWhiteTableBodyCells.getAlpha = function (state) {
-        if (state.inEnabled) {
-            return 1.0;
+        if (state.in(DTableState.HAS_DATA)) {
+            if (state.inEnabled) {
+                return 1.0;
+            }
+            else {
+                return 0.5;
+            }
         }
         return 0;
     };
@@ -68814,12 +68843,8 @@ var loadThemeDark = function () {
  * Copyright (C) 2019 Toshiba Corporation
  * SPDX-License-Identifier: Apache-2.0
  */
-// Material Design icons by Google.
-// Apache license version 2.0.
 /* eslint-disable prettier/prettier */
-DThemeDarkAtlas.add("button_color_sample", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
-    "<path d=\"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\" fill=\"#fff\"/>" +
-    "</g>");
+DThemeDarkAtlas.add("button_color_sample", 21, 21, newSvgRoundedRect(3, 3, 15, 15, "#fff", "#eee", 1));
 /* eslint-enable prettier/prettier */
 var formatter$8 = function (colorAndAlpha) {
     return "#".concat(UtilRgb.toCode(colorAndAlpha.color), " A").concat(colorAndAlpha.alpha.toFixed(2));
@@ -68830,7 +68855,7 @@ var DThemeDarkButtonColor = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     DThemeDarkButtonColor.prototype.getImageTintColor = function (state) {
-        return null;
+        return 0xffffff;
     };
     DThemeDarkButtonColor.prototype.getImageSource = function (state) {
         return DThemeDarkAtlas.mappings.button_color_sample;
@@ -68859,25 +68884,16 @@ var DThemeDarkDialogColor = /** @class */ (function (_super) {
     return DThemeDarkDialogColor;
 }(DThemeDarkDialogFitted));
 
+var newDarkSvgRoundedCheckerboard = function (width, height, stroke, strokeWidth, strokeOpacity) {
+    return newSvgRoundedCheckerboard(width, height, "#5f5f5f", "#454545", stroke, strokeWidth, strokeOpacity);
+};
+
 /*
  * Copyright (C) 2019 Toshiba Corporation
  * SPDX-License-Identifier: Apache-2.0
  */
-var makeCheckerboard = function (width, height) {
-    var LIGHT = "#5f5f5f";
-    var DARK = "#454545";
-    var result = "<g>";
-    for (var ih = 0; ih < height; ++ih) {
-        for (var iw = 0; iw < width; ++iw) {
-            var color = (iw + ih) % 2 === 0 ? LIGHT : DARK;
-            result += "<rect x=\"".concat(9 * iw, "\" y=\"").concat(9 * ih, "\" width=\"9\" height=\"9\" fill=\"").concat(color, "\" />");
-        }
-    }
-    result += "</g>";
-    return result;
-};
 /* eslint-disable prettier/prettier */
-DThemeDarkAtlas.add("picker_color_main", 236, 164, "<g>" +
+DThemeDarkAtlas.add("picker_color_main", 234, 162, "<g>" +
     "<linearGradient id=\"fs7w3iusfdnb\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">" +
     "<stop stop-color=\"#FFFFFF\" stop-opacity=\"0\" offset=\"0\"/>" +
     "<stop stop-color=\"#FFFFFF\" stop-opacity=\"1\" offset=\"1\"/>" +
@@ -68886,13 +68902,11 @@ DThemeDarkAtlas.add("picker_color_main", 236, 164, "<g>" +
     "<stop stop-color=\"#000000\" stop-opacity=\"0\" offset=\"0\"/>" +
     "<stop stop-color=\"#000000\" stop-opacity=\"1\" offset=\"1\"/>" +
     "</linearGradient>" +
-    "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"url(#fs7w3iusfdnb)\" />" +
-    "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"url(#2rfcfe9874bw)\" />" +
-    "</g>", 1, 1, 234, 162);
-DThemeDarkAtlas.add("picker_color_main_base", 236, 164, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"#fff\" />" +
-    "</g>", 1, 1, 234, 162);
-DThemeDarkAtlas.add("picker_color_alpha_checkerboard", 234, 18, makeCheckerboard(26, 2));
+    newSvgRoundedRect(0, 0, 234, 162, "url(#fs7w3iusfdnb)") +
+    newSvgRoundedRect(0, 0, 234, 162, "url(#2rfcfe9874bw)") +
+    "</g>");
+DThemeDarkAtlas.add("picker_color_main_base", 234, 162, "<rect x=\"0\" y=\"0\" width=\"236\" height=\"164\" fill=\"#fff\" />");
+DThemeDarkAtlas.add("picker_color_alpha_checkerboard", 234, 18, newDarkSvgRoundedCheckerboard(234, 18));
 DThemeDarkAtlas.add("picker_color_alpha", 234, 18, "<g>" +
     "<linearGradient id=\"s48afbuh44\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">" +
     "<stop stop-color=\"#FFFFFF\" stop-opacity=\"0\" offset=\"0\"/>" +
@@ -68910,20 +68924,15 @@ DThemeDarkAtlas.add("picker_color_base", 234, 18, "<g>" +
     "<stop stop-color=\"#FF00FF\" offset=\"0.833\"/>" +
     "<stop stop-color=\"#FF0000\" offset=\"1\"/>" +
     "</linearGradient>" +
-    "<rect x=\"0\" y=\"0\" width=\"234\" height=\"18\" fill=\"url(#ni2rbisdf3)\" />" +
+    newSvgRoundedRect(0, 0, 234, 18, "url(#ni2rbisdf3)") +
     "</g>");
 DThemeDarkAtlas.add("picker_color_base_pointer", 16.2, 31.8, "<rect x=\"4.5\" y=\"4.5\" width=\"7.2\" height=\"22.8\" stroke=\"#ffffff\" stroke-width=\"2.4\" fill=\"none\" />");
 DThemeDarkAtlas.add("picker_color_pointer", 25.8, 25.8, "<circle cx=\"12.9\" cy=\"12.9\" r=\"4.8\" stroke=\"#5f5f5f\" stroke-width=\"2.4\" fill=\"none\" />" +
     "<circle cx=\"12.9\" cy=\"12.9\" r=\"7.2\" stroke=\"#ffffff\" stroke-width=\"2.4\" fill=\"none\" />");
-DThemeDarkAtlas.add("picker_color_recent_checkerboard", 36, 36, makeCheckerboard(4, 4), 9, 9, 18, 18);
-DThemeDarkAtlas.add("picker_color_recent", 36, 36, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"36\" height=\"36\" fill=\"#fff\" />" +
-    "<path x=\"0\" y=\"0\" d=\"M9 9 h18 v18 h-18 v-18 m1 1 v16 h16 v-16 h-16 z\" fill=\"#eee\" />" +
-    "</g>", 9, 9, 18, 18);
-DThemeDarkAtlas.add("picker_color_sample_checkerboard", 45, 63, makeCheckerboard(5, 7));
-DThemeDarkAtlas.add("picker_color_sample", 47, 65, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"47\" height=\"65\" fill=\"#fff\" />" +
-    "</g>", 1, 1, 45, 63);
+DThemeDarkAtlas.add("picker_color_recent_checkerboard", 18, 18, newDarkSvgRoundedCheckerboard(18, 18));
+DThemeDarkAtlas.add("picker_color_recent", 18, 18, newSvgRoundedRect(0, 0, 18, 18, "#fff", "#eee", 1));
+DThemeDarkAtlas.add("picker_color_sample_checkerboard", 42, 66, newDarkSvgRoundedCheckerboard(42, 66, "#fff", 1, 0));
+DThemeDarkAtlas.add("picker_color_sample", 42, 66, newSvgRoundedRect(0, 0, 42, 66, "#fff", "#eee", 1));
 DThemeDarkAtlas.add("picker_color_anchor_outlined", 25.8, 25.8, "<circle cx=\"12.9\" cy=\"12.9\" r=\"8.4\" stroke=\"none\" fill=\"#ffffff\" />" +
     "<circle cx=\"12.9\" cy=\"12.9\" r=\"9.6\" stroke=\"#5f5f5f\" stroke-width=\"2.4\" fill=\"none\" />");
 DThemeDarkAtlas.add("picker_color_anchor", 28.2, 28.2, "<circle cx=\"14.1\" cy=\"14.1\" r=\"6\" stroke=\"none\" fill=\"#ffffff\" />" +
@@ -68931,9 +68940,7 @@ DThemeDarkAtlas.add("picker_color_anchor", 28.2, 28.2, "<circle cx=\"14.1\" cy=\
 DThemeDarkAtlas.add("picker_color_direction", 12, 30, "<path d=\"M0.6 25.8 L 12.0375 5.9895\" stroke=\"#5f5f5f\" stroke-width=\"1.2\" fill=\"none\" />" +
     "<path d=\"M8.5125 25.8 A 8.475 8.475 0 0 0 4.275 18.4605\" stroke=\"#5f5f5f\" stroke-width=\"1.2\" fill=\"none\" />" +
     "<rect x=\"0.6\" y=\"24.6\" width=\"11.4375\" height=\"1.2\" rx=\"0.6\" ry=\"0.6\" stroke=\"none\" fill=\"#5f5f5f\" />");
-DThemeDarkAtlas.add("picker_color_standard", 18, 18, "<g>" +
-    "<rect x=\"0\" y=\"0\" width=\"18\" height=\"18\" fill=\"#fff\" stroke-width=\"1\" stroke=\"#eee\" />" +
-    "</g>");
+DThemeDarkAtlas.add("picker_color_standard", 18, 18, newSvgRoundedRect(0, 0, 18, 18, "#fff", "#eee", 1));
 /* eslint-enable prettier/prettier */
 var DThemeDarkPickerColor = /** @class */ (function (_super) {
     __extends(DThemeDarkPickerColor, _super);
@@ -69025,7 +69032,16 @@ var DThemeDarkPickerColor = /** @class */ (function (_super) {
         return this.getBaseMargin();
     };
     DThemeDarkPickerColor.prototype.getInputLabelWidth = function () {
-        return 15;
+        return 18;
+    };
+    DThemeDarkPickerColor.prototype.getSampleWidth = function () {
+        return 42;
+    };
+    DThemeDarkPickerColor.prototype.getSampleHeight = function () {
+        return 66;
+    };
+    DThemeDarkPickerColor.prototype.getSampleMargin = function () {
+        return this.getBaseMargin();
     };
     DThemeDarkPickerColor.prototype.getSampleCheckerboardOldTexture = function () {
         return DThemeDarkAtlas.mappings.picker_color_sample_checkerboard;
@@ -69120,12 +69136,8 @@ var loadThemeDarkEnUsButtonColor = function () {
  * Copyright (C) 2019 Toshiba Corporation
  * SPDX-License-Identifier: Apache-2.0
  */
-// Material Design icons by Google.
-// Apache license version 2.0.
 /* eslint-disable prettier/prettier */
-DThemeDarkAtlas.add("button_color_gradient_sample", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
-    "<path d=\"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\" fill=\"#fff\"/>" +
-    "</g>");
+DThemeDarkAtlas.add("button_color_gradient_sample", 21, 21, newSvgRoundedRect(3, 3, 15, 15, "#fff", "#eee", 1));
 /* eslint-enable prettier/prettier */
 var formatter$7 = function () {
     return "";
@@ -71208,8 +71220,13 @@ var DThemeDarkTableBodyCells = /** @class */ (function () {
         return DThemeDarkConstants.COLOR;
     };
     DThemeDarkTableBodyCells.getAlpha = function (state) {
-        if (state.inEnabled) {
-            return 1.0;
+        if (state.in(DTableState.HAS_DATA)) {
+            if (state.inEnabled) {
+                return 1.0;
+            }
+            else {
+                return 0.5;
+            }
         }
         return 0;
     };
@@ -77366,10 +77383,11 @@ var DPickerColor = /** @class */ (function (_super) {
         });
         this._inputAndLabelAlpha = inputAndLabelAlpha;
         // Samples
-        var sampleWidth = (inputWidth - inputLabelWidth - inputMargin) * 0.5;
-        var sampleHeight = inputHeight + inputMargin + inputHeight;
+        var sampleWidth = theme.getSampleWidth();
+        var sampleHeight = theme.getSampleHeight();
         var sampleX = paddingLeft + (mainWidth - inputMargin) * 0.5 + inputMargin;
         var sampleY = inputY + (inputHeight + inputMargin + inputAndLabelAlpha.height - sampleHeight) * 0.5;
+        var sampleMargin = theme.getSampleMargin();
         var sampleCurrentCheckerboardSprite = new pixi_js.Sprite(theme.getSampleCheckerboardOldTexture());
         this._sampleCurrentCheckerboardSprite = sampleCurrentCheckerboardSprite;
         sampleCurrentCheckerboardSprite.x = sampleX;
@@ -77396,7 +77414,7 @@ var DPickerColor = /** @class */ (function (_super) {
         this.addChild(sampleCurrentSprite);
         var sampleNewCheckerboardSprite = new pixi_js.Sprite(theme.getSampleCheckerboardNewTexture());
         this._sampleNewCheckerboardSprite = sampleNewCheckerboardSprite;
-        sampleNewCheckerboardSprite.x = sampleX + sampleWidth;
+        sampleNewCheckerboardSprite.x = sampleX + sampleWidth + sampleMargin;
         sampleNewCheckerboardSprite.y = sampleY;
         sampleNewCheckerboardSprite.width = sampleWidth;
         sampleNewCheckerboardSprite.height = sampleHeight;
@@ -77404,7 +77422,7 @@ var DPickerColor = /** @class */ (function (_super) {
         this.addChild(sampleNewCheckerboardSprite);
         var sampleNewSprite = new pixi_js.Sprite(theme.getSampleNewTexture());
         this._sampleNewSprite = sampleNewSprite;
-        sampleNewSprite.x = sampleX + sampleWidth;
+        sampleNewSprite.x = sampleX + sampleWidth + sampleMargin;
         sampleNewSprite.y = sampleY;
         sampleNewSprite.tint = this._new.color;
         sampleNewSprite.alpha = this._new.alpha;
@@ -96688,6 +96706,7 @@ var DTableBody = /** @class */ (function (_super) {
             // State
             var rowState = row.state;
             rowState.lock();
+            rowState.add(DTableState.HAS_DATA);
             rowState.set(DTableState.SELECTABLE, isRowSelectable);
             rowState.set(DBaseState.ACTIVE, selection.contains(unmappedIndex));
             rowState.remove(DBaseState.DISABLED);
@@ -96703,7 +96722,7 @@ var DTableBody = /** @class */ (function (_super) {
             var rowState = row.state;
             rowState.lock();
             rowState.add(DBaseState.DISABLED);
-            rowState.removeAll(DTableState.SELECTABLE, DBaseState.ACTIVE);
+            rowState.removeAll(DTableState.HAS_DATA, DTableState.SELECTABLE, DBaseState.ACTIVE);
             rowState.unlock();
             // Data
             row.unset();
@@ -96716,7 +96735,7 @@ var DTableBody = /** @class */ (function (_super) {
             var rowState = row.state;
             rowState.lock();
             rowState.add(DBaseState.DISABLED);
-            rowState.removeAll(DTableState.SELECTABLE, DBaseState.ACTIVE);
+            rowState.removeAll(DTableState.HAS_DATA, DTableState.SELECTABLE, DBaseState.ACTIVE);
             rowState.unlock();
             // Data
             row.unset();

package/dist/wcardinal-ui.js

@@ -1,5 +1,5 @@
 /*
- Winter Cardinal UI v0.441.0
+ Winter Cardinal UI v0.443.0
  Copyright (C) 2019 Toshiba Corporation
  SPDX-License-Identifier: Apache-2.0
 
@@ -31774,6 +31774,7 @@
                 var textWidth = 0;
                 var textHeight = 0;
                 if (text != null) {
+                    text.setClippingDelta(leftSize + rightSize, topSize + bottomSize);
                     textWidth = text.width;
                     textHeight = text.height;
                 }
@@ -31808,7 +31809,6 @@
                 }
                 if (text != null) {
                     text.position.set(textX, textY);
-                    text.setClippingDelta(leftSize + rightSize, topSize + bottomSize);
                 }
                 left.execute(textX - leftSize);
                 center.execute(0, 0, textX * 2 + textWidth);
@@ -32853,18 +32853,13 @@
             if (styleClipping || styleFitting || styleWordWrap) {
                 var parent_1 = this.parent;
                 if (parent_1 instanceof DBase) {
-                    var width = parent_1.width -
-                        parent_1.padding.getLeft() -
-                        parent_1.padding.getRight() -
-                        modifier.delta.width;
+                    var padding = parent_1.padding;
+                    var width = parent_1.width - padding.getLeft() - padding.getRight() - modifier.delta.width;
                     if (modifier.width !== width) {
                         modifier.width = width;
                         isChanged = true;
                     }
-                    var height = parent_1.height -
-                        parent_1.padding.getTop() -
-                        parent_1.padding.getBottom() -
-                        modifier.delta.height;
+                    var height = parent_1.height - padding.getTop() - padding.getBottom() - modifier.delta.height;
                     if (modifier.height !== height) {
                         modifier.height = height;
                         isChanged = true;
@@ -34262,8 +34257,16 @@
                             object.alpha = alpha;
                             result = true;
                         }
+                        if (!object.visible) {
+                            object.visible = true;
+                            result = true;
+                        }
                         return result;
                     }
+                    else if (object.visible) {
+                        object.visible = false;
+                        return true;
+                    }
                 }
             }
             return false;
@@ -56013,10 +56016,11 @@
             });
             this._inputAndLabelAlpha = inputAndLabelAlpha;
             // Samples
-            var sampleWidth = (inputWidth - inputLabelWidth - inputMargin) * 0.5;
-            var sampleHeight = inputHeight + inputMargin + inputHeight;
+            var sampleWidth = theme.getSampleWidth();
+            var sampleHeight = theme.getSampleHeight();
             var sampleX = paddingLeft + (mainWidth - inputMargin) * 0.5 + inputMargin;
             var sampleY = inputY + (inputHeight + inputMargin + inputAndLabelAlpha.height - sampleHeight) * 0.5;
+            var sampleMargin = theme.getSampleMargin();
             var sampleCurrentCheckerboardSprite = new pixi_js.Sprite(theme.getSampleCheckerboardOldTexture());
             this._sampleCurrentCheckerboardSprite = sampleCurrentCheckerboardSprite;
             sampleCurrentCheckerboardSprite.x = sampleX;
@@ -56043,7 +56047,7 @@
             this.addChild(sampleCurrentSprite);
             var sampleNewCheckerboardSprite = new pixi_js.Sprite(theme.getSampleCheckerboardNewTexture());
             this._sampleNewCheckerboardSprite = sampleNewCheckerboardSprite;
-            sampleNewCheckerboardSprite.x = sampleX + sampleWidth;
+            sampleNewCheckerboardSprite.x = sampleX + sampleWidth + sampleMargin;
             sampleNewCheckerboardSprite.y = sampleY;
             sampleNewCheckerboardSprite.width = sampleWidth;
             sampleNewCheckerboardSprite.height = sampleHeight;
@@ -56051,7 +56055,7 @@
             this.addChild(sampleNewCheckerboardSprite);
             var sampleNewSprite = new pixi_js.Sprite(theme.getSampleNewTexture());
             this._sampleNewSprite = sampleNewSprite;
-            sampleNewSprite.x = sampleX + sampleWidth;
+            sampleNewSprite.x = sampleX + sampleWidth + sampleMargin;
             sampleNewSprite.y = sampleY;
             sampleNewSprite.tint = this._new.color;
             sampleNewSprite.alpha = this._new.alpha;
@@ -73319,6 +73323,10 @@
          * Cells of a right-most frozen column.
          */
         FROZEN_END: "FROZEN_END",
+        /**
+         * Rows with data
+         */
+        HAS_DATA: "HAS_DATA",
         /**
          * Header cells of sortable columns.
          */
@@ -75528,6 +75536,7 @@
                 // State
                 var rowState = row.state;
                 rowState.lock();
+                rowState.add(DTableState.HAS_DATA);
                 rowState.set(DTableState.SELECTABLE, isRowSelectable);
                 rowState.set(DBaseState.ACTIVE, selection.contains(unmappedIndex));
                 rowState.remove(DBaseState.DISABLED);
@@ -75543,7 +75552,7 @@
                 var rowState = row.state;
                 rowState.lock();
                 rowState.add(DBaseState.DISABLED);
-                rowState.removeAll(DTableState.SELECTABLE, DBaseState.ACTIVE);
+                rowState.removeAll(DTableState.HAS_DATA, DTableState.SELECTABLE, DBaseState.ACTIVE);
                 rowState.unlock();
                 // Data
                 row.unset();
@@ -75556,7 +75565,7 @@
                 var rowState = row.state;
                 rowState.lock();
                 rowState.add(DBaseState.DISABLED);
-                rowState.removeAll(DTableState.SELECTABLE, DBaseState.ACTIVE);
+                rowState.removeAll(DTableState.HAS_DATA, DTableState.SELECTABLE, DBaseState.ACTIVE);
                 rowState.unlock();
                 // Data
                 row.unset();