@wcardinal/wcardinal-ui 0.383.0 → 0.384.0

package/dist/wcardinal-ui-theme-white-en-us.js

@@ -1,5 +1,5 @@
 /*
- Winter Cardinal UI v0.383.0
+ Winter Cardinal UI v0.384.0
  Copyright (C) 2019 Toshiba Corporation
  SPDX-License-Identifier: Apache-2.0
 
@@ -791,7 +791,61 @@
         DThemeWhite.set("DButtonCheck", DThemeWhiteButtonCheck);
     };
 
-    const DColorGradientObservable = wcardinal.ui.DColorGradientObservable;
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteButtonDanger = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonDanger, _super);
+        function DThemeWhiteButtonDanger() {
+            return _super.call(this, 0xff5566, 0.1, 0.2) || this;
+        }
+        DThemeWhiteButtonDanger.prototype.getBackgroundColor = function (state) {
+            if (state.inDisabled) {
+                return null;
+            }
+            else if (state.isPressed || state.isActive) {
+                return this.BACKGROUND_COLOR_PRESSED;
+            }
+            else if (state.isHovered) {
+                return this.BACKGROUND_COLOR_HOVERED;
+            }
+            else {
+                return this.BACKGROUND_COLOR;
+            }
+        };
+        DThemeWhiteButtonDanger.prototype.getBorderColor = function (state) {
+            if (state.inDisabled) {
+                return DThemeWhiteConstants.BORDER_COLOR;
+            }
+            else {
+                return null;
+            }
+        };
+        DThemeWhiteButtonDanger.prototype.getOutlineColor = function (state) {
+            return this.getOutlineColorActive(state);
+        };
+        DThemeWhiteButtonDanger.prototype.getOutlineOffset = function (state) {
+            return this.getOutlineOffsetActive(state);
+        };
+        DThemeWhiteButtonDanger.prototype.getColor = function (state) {
+            if (state.inDisabled) {
+                return _super.prototype.getColor.call(this, state);
+            }
+            else {
+                return DThemeWhiteConstants.ACTIVE_COLOR;
+            }
+        };
+        return DThemeWhiteButtonDanger;
+    }(DThemeWhiteButtonBase));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteButtonDanger = function () {
+        DThemeWhite.set("DButtonDanger", DThemeWhiteButtonDanger);
+    };
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
@@ -809,974 +863,337 @@
      * 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>");
-    /* eslint-enable prettier/prettier */
-    var formatter$a = function () {
-        return "";
-    };
-    var DThemeWhiteButtonColorGradient = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonColorGradient, _super);
-        function DThemeWhiteButtonColorGradient() {
+    var DThemeWhiteButtonFile = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonFile, _super);
+        function DThemeWhiteButtonFile() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteButtonColorGradient.prototype.getViewBaseTexture = function () {
-            return DThemeWhiteAtlas.mappings.button_color_gradient_sample;
-        };
-        DThemeWhiteButtonColorGradient.prototype.getTextFormatter = function () {
-            return formatter$a;
-        };
-        DThemeWhiteButtonColorGradient.prototype.newTextValue = function () {
-            return new DColorGradientObservable();
-        };
-        DThemeWhiteButtonColorGradient.prototype.getCheckerColors = function () {
-            return [0.75, 0.65];
-        };
-        return DThemeWhiteButtonColorGradient;
+        return DThemeWhiteButtonFile;
     }(DThemeWhiteButton));
 
-    const DAnimationFadeIn = wcardinal.ui.DAnimationFadeIn;
-
-    const DDialogAlign = wcardinal.ui.DDialogAlign;
-
-    const DDialogCloseOn = wcardinal.ui.DDialogCloseOn;
-
-    const DDialogGestureMode = wcardinal.ui.DDialogGestureMode;
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteButtonFile = function () {
+        DThemeWhite.set("DButtonFile", DThemeWhiteButtonFile);
+    };
 
-    const DDialogMode = wcardinal.ui.DDialogMode;
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteButtonLink = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonLink, _super);
+        function DThemeWhiteButtonLink() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        return DThemeWhiteButtonLink;
+    }(DThemeWhiteButtonAmbient));
 
-    const DDialogState = wcardinal.ui.DDialogState;
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteButtonLink = function () {
+        DThemeWhite.set("DButtonLink", DThemeWhiteButtonLink);
+    };
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteDialog = /** @class */ (function (_super) {
-        __extends(DThemeWhiteDialog, _super);
-        function DThemeWhiteDialog() {
-            return _super !== null && _super.apply(this, arguments) || this;
+    var DThemeWhiteButtonPrimary = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonPrimary, _super);
+        function DThemeWhiteButtonPrimary() {
+            return _super.call(this, DThemeWhiteConstants.HIGHLIGHT_COLOR, 0.1, 0.2) || this;
         }
-        DThemeWhiteDialog.prototype.getMode = function () {
-            return DDialogMode.MODAL;
-        };
-        DThemeWhiteDialog.prototype.closeOn = function (mode) {
-            switch (mode) {
-                case DDialogMode.MODAL:
-                case DDialogMode.MENU:
-                    return DDialogCloseOn.ESC | DDialogCloseOn.CLICK_OUTSIDE;
-                case DDialogMode.MODELESS:
-                    return DDialogCloseOn.NONE;
-            }
-        };
-        DThemeWhiteDialog.prototype.isSticky = function (mode) {
-            return false;
-        };
-        DThemeWhiteDialog.prototype.isGestureEnabled = function (mode) {
-            switch (mode) {
-                case DDialogMode.MODAL:
-                case DDialogMode.MODELESS:
-                    return true;
-                case DDialogMode.MENU:
-                    return false;
+        DThemeWhiteButtonPrimary.prototype.getBackgroundColor = function (state) {
+            if (state.inDisabled) {
+                return null;
             }
-        };
-        DThemeWhiteDialog.prototype.getGestureMode = function (mode) {
-            return DDialogGestureMode.DIRTY;
-        };
-        DThemeWhiteDialog.prototype.getOffsetX = function (mode) {
-            return 5;
-        };
-        DThemeWhiteDialog.prototype.getOffsetY = function (mode) {
-            return 5;
-        };
-        DThemeWhiteDialog.prototype.getAlign = function (mode) {
-            return DDialogAlign.BOTTOM;
-        };
-        DThemeWhiteDialog.prototype.newAnimation = function (mode) {
-            switch (mode) {
-                case DDialogMode.MODAL:
-                    return new DAnimationFadeIn();
-                case DDialogMode.MODELESS:
-                    return null;
-                case DDialogMode.MENU:
-                    return null;
+            else if (state.isPressed || state.isActive) {
+                return this.BACKGROUND_COLOR_PRESSED;
             }
-        };
-        DThemeWhiteDialog.prototype.getBackgroundColor = function (state) {
-            if (state.is(DDialogState.MENU)) {
-                return DThemeWhiteConstants.BACKGROUND_COLOR_ON_BOARD;
+            else if (state.isHovered) {
+                return this.BACKGROUND_COLOR_HOVERED;
             }
             else {
-                return DThemeWhiteConstants.BACKGROUND_COLOR;
+                return this.BACKGROUND_COLOR;
             }
         };
-        DThemeWhiteDialog.prototype.getBorderColor = function (state) {
-            if (state.is(DDialogState.MENU)) {
-                return null;
+        DThemeWhiteButtonPrimary.prototype.getBorderColor = function (state) {
+            if (state.inDisabled) {
+                return DThemeWhiteConstants.BORDER_COLOR;
             }
             else {
-                return 0xfafafa;
+                return null;
             }
         };
-        DThemeWhiteDialog.prototype.getOutlineColor = function (state) {
-            return null;
-        };
-        DThemeWhiteDialog.prototype.getPaddingLeft = function () {
-            return 0;
-        };
-        DThemeWhiteDialog.prototype.getPaddingTop = function () {
-            return 0;
-        };
-        DThemeWhiteDialog.prototype.getPaddingRight = function () {
-            return 0;
-        };
-        DThemeWhiteDialog.prototype.getPaddingBottom = function () {
-            return 0;
-        };
-        DThemeWhiteDialog.prototype.getX = function () {
-            return 0;
-        };
-        DThemeWhiteDialog.prototype.getY = function () {
-            return 0;
-        };
-        DThemeWhiteDialog.prototype.getWidth = function () {
-            return 400;
-        };
-        DThemeWhiteDialog.prototype.getHeight = function () {
-            return "auto";
+        DThemeWhiteButtonPrimary.prototype.getOutlineColor = function (state) {
+            return this.getOutlineColorActive(state);
         };
-        DThemeWhiteDialog.prototype.getShadow = function () {
-            return this.newShadow();
+        DThemeWhiteButtonPrimary.prototype.getOutlineOffset = function (state) {
+            return this.getOutlineOffsetActive(state);
         };
-        DThemeWhiteDialog.prototype.getInteractive = function () {
-            return DBaseInteractive.BOTH;
+        DThemeWhiteButtonPrimary.prototype.getColor = function (state) {
+            if (state.inDisabled) {
+                return _super.prototype.getColor.call(this, state);
+            }
+            else {
+                return DThemeWhiteConstants.ACTIVE_COLOR;
+            }
         };
-        return DThemeWhiteDialog;
-    }(DThemeWhiteBase));
+        return DThemeWhiteButtonPrimary;
+    }(DThemeWhiteButtonBase));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteDialogLayered = /** @class */ (function (_super) {
-        __extends(DThemeWhiteDialogLayered, _super);
-        function DThemeWhiteDialogLayered() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteDialogLayered.prototype.getLayout = function () {
-            return undefined;
-        };
-        DThemeWhiteDialogLayered.prototype.getHeader = function () {
-            return null;
-        };
-        DThemeWhiteDialogLayered.prototype.getContent = function () {
-            return undefined;
-        };
-        DThemeWhiteDialogLayered.prototype.getFooter = function () {
-            return undefined;
-        };
-        return DThemeWhiteDialogLayered;
-    }(DThemeWhiteDialog));
-
+    var loadThemeWhiteButtonPrimary = function () {
+        DThemeWhite.set("DButtonPrimary", DThemeWhiteButtonPrimary);
+    };
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteDialogFitted = /** @class */ (function (_super) {
-        __extends(DThemeWhiteDialogFitted, _super);
-        function DThemeWhiteDialogFitted() {
+    // Material Design icons by Google.
+    // Apache license version 2.0.
+    /* eslint-disable prettier/prettier */
+    DThemeWhiteAtlas.add("button_radio_mark_on", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
+        "<path d=\"M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48" +
+        " 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8" +
+        " 8 3.58 8 8-3.58 8-8 8z\" fill=\"#fff\" />" +
+        "</g>");
+    DThemeWhiteAtlas.add("button_radio_mark_off", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
+        "<path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42" +
+        " 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z\" fill=\"#fff\" />" +
+        "</g>");
+    /* eslint-enable prettier/prettier */
+    var DThemeWhiteButtonRadio = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonRadio, _super);
+        function DThemeWhiteButtonRadio() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteDialogFitted.prototype.getWidth = function () {
-            return "auto";
+        DThemeWhiteButtonRadio.prototype.getBackgroundColor = function (state) {
+            return DThemeWhiteConstants.WEAK_HIGHLIGHT_COLOR;
         };
-        return DThemeWhiteDialogFitted;
-    }(DThemeWhiteDialogLayered));
+        DThemeWhiteButtonRadio.prototype.getColor = function (state) {
+            return DThemeWhiteConstants.COLOR;
+        };
+        DThemeWhiteButtonRadio.prototype.getBackgroundAlpha = function (state) {
+            if (state.inEnabled) {
+                if (state.isHovered) {
+                    return DThemeWhiteConstants.WEAK_HIGHLIGHT_ALPHA;
+                }
+            }
+            return 0;
+        };
+        DThemeWhiteButtonRadio.prototype.getOutlineColor = function (state) {
+            return this.getOutlineColorNonActive(state);
+        };
+        DThemeWhiteButtonRadio.prototype.getOutlineOffset = function (state) {
+            return this.getOutlineOffsetNonActive(state);
+        };
+        DThemeWhiteButtonRadio.prototype.getImageTintColor = function (state) {
+            if (state.inDisabled || !state.isActive) {
+                return DThemeWhiteConstants.WEAK_HIGHLIGHT_COLOR;
+            }
+            else {
+                return DThemeWhiteConstants.HIGHLIGHT_COLOR;
+            }
+        };
+        DThemeWhiteButtonRadio.prototype.isToggle = function () {
+            return true;
+        };
+        DThemeWhiteButtonRadio.prototype.getImageSource = function (state) {
+            if (state.isActive) {
+                return DThemeWhiteAtlas.mappings.button_radio_mark_on;
+            }
+            else {
+                return DThemeWhiteAtlas.mappings.button_radio_mark_off;
+            }
+        };
+        return DThemeWhiteButtonRadio;
+    }(DThemeWhiteButtonAmbient));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteDialogColorGradient = /** @class */ (function (_super) {
-        __extends(DThemeWhiteDialogColorGradient, _super);
-        function DThemeWhiteDialogColorGradient() {
+    var DThemeWhiteButtonRadioRight = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonRadioRight, _super);
+        function DThemeWhiteButtonRadioRight() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        return DThemeWhiteDialogColorGradient;
-    }(DThemeWhiteDialogFitted));
+        DThemeWhiteButtonRadioRight.prototype.getImageAlignWith = function () {
+            return DAlignWith.PADDING;
+        };
+        DThemeWhiteButtonRadioRight.prototype.getImageAlignHorizontal = function () {
+            return DAlignHorizontal.RIGHT;
+        };
+        DThemeWhiteButtonRadioRight.prototype.getImageMarginHorizontal = function () {
+            return 0;
+        };
+        DThemeWhiteButtonRadioRight.prototype.getTextAlignHorizontal = function () {
+            return DAlignHorizontal.LEFT;
+        };
+        return DThemeWhiteButtonRadioRight;
+    }(DThemeWhiteButtonRadio));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhitePickerColorGradient = /** @class */ (function (_super) {
-        __extends(DThemeWhitePickerColorGradient, _super);
-        function DThemeWhitePickerColorGradient() {
+    var loadThemeWhiteButtonRadioRight = function () {
+        DThemeWhite.set("DButtonRadioRight", DThemeWhiteButtonRadioRight);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteButtonRadio = function () {
+        DThemeWhite.set("DButtonRadio", DThemeWhiteButtonRadio);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteButtonSecondary = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonSecondary, _super);
+        function DThemeWhiteButtonSecondary() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhitePickerColorGradient.prototype.getGradientPointsWidth = function () {
-            return 30;
+        return DThemeWhiteButtonSecondary;
+    }(DThemeWhiteButtonBase));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteButtonSecondary = function () {
+        DThemeWhite.set("DButtonSecondary", DThemeWhiteButtonSecondary);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteButton = function () {
+        DThemeWhite.set("DButton", DThemeWhiteButton);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteCanvas = /** @class */ (function (_super) {
+        __extends(DThemeWhiteCanvas, _super);
+        function DThemeWhiteCanvas() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteCanvas.prototype.getBackgroundColor = function () {
+            return 0xffffff;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientPointsMargin = function () {
-            return 24;
+        DThemeWhiteCanvas.prototype.getBorderColor = function (state) {
+            return null;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientAnchorTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_anchor;
+        DThemeWhiteCanvas.prototype.getCornerMask = function () {
+            return DCornerMask.ALL;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientAnchorOutlinedTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_anchor_outlined;
+        DThemeWhiteCanvas.prototype.getInteractive = function () {
+            return DBaseInteractive.BOTH;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientAnchorOutlineTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_anchor_outline;
+        return DThemeWhiteCanvas;
+    }(DThemeWhiteBase));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteCanvasContainer = /** @class */ (function (_super) {
+        __extends(DThemeWhiteCanvasContainer, _super);
+        function DThemeWhiteCanvasContainer() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteCanvasContainer.prototype.getBackgroundColor = function (state) {
+            return null;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientDirectionMargin = function () {
-            return 5;
+        DThemeWhiteCanvasContainer.prototype.getBorderColor = function (state) {
+            return null;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientDirectionTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_direction;
+        DThemeWhiteCanvasContainer.prototype.getPaddingLeft = function () {
+            return 32;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientRecentColumn = function () {
-            return 4;
+        DThemeWhiteCanvasContainer.prototype.getPaddingTop = function () {
+            return 32;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientRecentWidth = function () {
-            return 30;
+        DThemeWhiteCanvasContainer.prototype.getPaddingRight = function () {
+            return 32;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientRecentMargin = function () {
-            return 5;
+        DThemeWhiteCanvasContainer.prototype.getPaddingBottom = function () {
+            return 32;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientRecentCount = function () {
-            return 16;
+        DThemeWhiteCanvasContainer.prototype.isOverflowMaskEnabled = function () {
+            return false;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientRecents = function () {
-            return [];
+        DThemeWhiteCanvasContainer.prototype.getInteractive = function () {
+            return DBaseInteractive.BOTH;
         };
-        DThemeWhitePickerColorGradient.prototype.getGradientCheckerColors = function () {
-            return [0.75, 0.65];
+        DThemeWhiteCanvasContainer.prototype.getCornerMask = function () {
+            return DCornerMask.ALL;
         };
-        DThemeWhitePickerColorGradient.prototype.getBackgroundColor = function (state) {
-            return null;
+        return DThemeWhiteCanvasContainer;
+    }(DThemeWhiteBase));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteCanvasContainer = function () {
+        DThemeWhite.set("DCanvasContainer", DThemeWhiteCanvasContainer);
+        DThemeWhite.set("DCanvas", DThemeWhiteCanvas);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteChart = /** @class */ (function (_super) {
+        __extends(DThemeWhiteChart, _super);
+        function DThemeWhiteChart() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteChart.prototype.getPaddingLeft = function () {
+            return 80;
         };
-        DThemeWhitePickerColorGradient.prototype.getBorderColor = function (state) {
+        DThemeWhiteChart.prototype.getPaddingRight = function () {
+            return 10;
+        };
+        DThemeWhiteChart.prototype.getPaddingTop = function () {
+            return 10;
+        };
+        DThemeWhiteChart.prototype.getPaddingBottom = function () {
+            return 70;
+        };
+        DThemeWhiteChart.prototype.getBorderColor = function (state) {
             return null;
         };
-        DThemeWhitePickerColorGradient.prototype.getInteractive = function () {
-            return DBaseInteractive.CHILDREN;
+        DThemeWhiteChart.prototype.getInteractive = function () {
+            return DBaseInteractive.BOTH;
         };
-        DThemeWhitePickerColorGradient.prototype.newState = function (state) {
+        DThemeWhiteChart.prototype.newState = function (state) {
             _super.prototype.newState.call(this, state);
             state.isFocusable = false;
         };
-        return DThemeWhitePickerColorGradient;
-    }(DThemeWhiteBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var makeCheckerboard = 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>" +
-        "<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\"/>" +
-        "</linearGradient>" +
-        "<linearGradient id=\"2rfcfe9874bw\" x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">" +
-        "<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(26, 2));
-    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\"/>" +
-        "<stop stop-color=\"#FFFFFF\" stop-opacity=\"1\" offset=\"1\"/>" +
-        "</linearGradient>" +
-        "<rect x=\"0\" y=\"0\" width=\"234\" height=\"18\" fill=\"url(#s48afbuh44)\" />" +
-        "</g>");
-    DThemeWhiteAtlas.add("picker_color_base", 234, 18, "<g>" +
-        "<linearGradient id=\"ni2rbisdf3\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">" +
-        "<stop stop-color=\"#FF0000\" offset=\"0\"/>" +
-        "<stop stop-color=\"#FFFF00\" offset=\"0.167\"/>" +
-        "<stop stop-color=\"#00FF00\" offset=\"0.333\"/>" +
-        "<stop stop-color=\"#00FFFF\" offset=\"0.5\"/>" +
-        "<stop stop-color=\"#0000FF\" offset=\"0.667\"/>" +
-        "<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)\" />" +
-        "</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(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(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_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\" />" +
-        "<circle cx=\"14.1\" cy=\"14.1\" r=\"7.2\" stroke=\"#5f5f5f\" stroke-width=\"2.4\" fill=\"none\" />");
-    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>");
-    /* eslint-enable prettier/prettier */
-    var DThemeWhitePickerColor = /** @class */ (function (_super) {
-        __extends(DThemeWhitePickerColor, _super);
-        function DThemeWhitePickerColor() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhitePickerColor.prototype.getMainWidth = function () {
-            return 234;
-        };
-        DThemeWhitePickerColor.prototype.getMainHeight = function () {
-            return 162;
-        };
-        DThemeWhitePickerColor.prototype.getMainTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_main;
-        };
-        DThemeWhitePickerColor.prototype.getMainBaseTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_main_base;
-        };
-        DThemeWhitePickerColor.prototype.getMainPointerTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_pointer;
-        };
-        DThemeWhitePickerColor.prototype.getMainPointerColor = function () {
-            return 0xffffff;
-        };
-        DThemeWhitePickerColor.prototype.getMainPointerAlpha = function () {
-            return 1;
-        };
-        DThemeWhitePickerColor.prototype.getBaseHeight = function () {
-            return 18;
-        };
-        DThemeWhitePickerColor.prototype.getBaseMargin = function () {
-            return 6;
-        };
-        DThemeWhitePickerColor.prototype.getBaseTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_base;
-        };
-        DThemeWhitePickerColor.prototype.getBasePointerTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_base_pointer;
-        };
-        DThemeWhitePickerColor.prototype.getBasePointerColor = function () {
-            return 0xffffff;
-        };
-        DThemeWhitePickerColor.prototype.getBasePointerAlpha = function () {
-            return this.getMainPointerAlpha();
-        };
-        DThemeWhitePickerColor.prototype.getAlphaHeight = function () {
-            return this.getBaseHeight();
-        };
-        DThemeWhitePickerColor.prototype.getAlphaMargin = function () {
-            return this.getBaseMargin();
-        };
-        DThemeWhitePickerColor.prototype.getAlphaTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_alpha;
-        };
-        DThemeWhitePickerColor.prototype.getAlphaCheckerboardTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_alpha_checkerboard;
-        };
-        DThemeWhitePickerColor.prototype.getAlphaPointerTexture = function () {
-            return this.getBasePointerTexture();
-        };
-        DThemeWhitePickerColor.prototype.getAlphaPointerColor = function () {
-            return this.getBasePointerColor();
-        };
-        DThemeWhitePickerColor.prototype.getAlphaPointerAlpha = function () {
-            return this.getMainPointerAlpha();
-        };
-        DThemeWhitePickerColor.prototype.getRecentMargin = function () {
-            return this.getBaseMargin();
-        };
-        DThemeWhitePickerColor.prototype.getRecentColorWidth = function () {
-            return this.getBaseHeight();
-        };
-        DThemeWhitePickerColor.prototype.getRecentColorHeight = function () {
-            return this.getRecentColorWidth();
-        };
-        DThemeWhitePickerColor.prototype.getRecentColorMargin = function () {
-            return this.getRecentMargin();
-        };
-        DThemeWhitePickerColor.prototype.getRecentColorCount = function () {
-            return 10;
-        };
-        DThemeWhitePickerColor.prototype.getRecentCheckerboardTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_recent_checkerboard;
-        };
-        DThemeWhitePickerColor.prototype.getRecentTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_recent;
-        };
-        DThemeWhitePickerColor.prototype.getInputMargin = function () {
-            return this.getBaseMargin();
-        };
-        DThemeWhitePickerColor.prototype.getInputLabelWidth = function () {
-            return 15;
-        };
-        DThemeWhitePickerColor.prototype.getSampleCheckerboardOldTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_sample_checkerboard;
-        };
-        DThemeWhitePickerColor.prototype.getSampleCheckerboardNewTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_sample_checkerboard;
-        };
-        DThemeWhitePickerColor.prototype.getSampleOldTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_sample;
-        };
-        DThemeWhitePickerColor.prototype.getSampleNewTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_sample;
-        };
-        DThemeWhitePickerColor.prototype.getStandardColorCount = function () {
-            return 80;
-        };
-        DThemeWhitePickerColor.prototype.getStandardColorWidth = function () {
-            return this.getBaseHeight();
-        };
-        DThemeWhitePickerColor.prototype.getStandardColorHeight = function () {
-            return this.getStandardColorWidth();
-        };
-        DThemeWhitePickerColor.prototype.getStandardColorMargin = function () {
-            return this.getBaseMargin();
-        };
-        DThemeWhitePickerColor.prototype.getStandardTexture = function () {
-            return DThemeWhiteAtlas.mappings.picker_color_standard;
-        };
-        DThemeWhitePickerColor.prototype.getBackgroundColor = function (state) {
-            return null;
-        };
-        DThemeWhitePickerColor.prototype.getBorderColor = function (state) {
-            return null;
-        };
-        DThemeWhitePickerColor.prototype.getInteractive = function () {
-            return DBaseInteractive.CHILDREN;
-        };
-        DThemeWhitePickerColor.prototype.newState = function (state) {
-            _super.prototype.newState.call(this, state);
-            state.isFocusable = false;
-        };
-        return DThemeWhitePickerColor;
-    }(DThemeWhiteBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhitePickerColor = function () {
-        DThemeWhite.set("DPickerColor", DThemeWhitePickerColor);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhitePickerColorGradient = function () {
-        DThemeWhite.set("DPickerColorGradient", DThemeWhitePickerColorGradient);
-        loadThemeWhitePickerColor();
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteDialogColorGradient = function () {
-        DThemeWhite.set("DDialogColorGradient", DThemeWhiteDialogColorGradient);
-        loadThemeWhitePickerColorGradient();
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonColorGradient = function () {
-        DThemeWhite.set("DButtonColorGradient", DThemeWhiteButtonColorGradient);
-        loadThemeWhiteDialogColorGradient();
-    };
-
-    /*
-     * 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>");
-    /* eslint-enable prettier/prettier */
-    var formatter$9 = function (colorAndAlpha) {
-        return "#".concat(UtilRgb.toCode(colorAndAlpha.color), " A").concat(colorAndAlpha.alpha.toFixed(2));
-    };
-    var DThemeWhiteButtonColor = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonColor, _super);
-        function DThemeWhiteButtonColor() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteButtonColor.prototype.getImageTintColor = function (state) {
-            return null;
-        };
-        DThemeWhiteButtonColor.prototype.getImageSource = function (state) {
-            return DThemeWhiteAtlas.mappings.button_color_sample;
-        };
-        DThemeWhiteButtonColor.prototype.getTextFormatter = function () {
-            return formatter$9;
-        };
-        DThemeWhiteButtonColor.prototype.newTextValue = function () {
-            return {
-                color: 0xffffff,
-                alpha: 1
-            };
-        };
-        return DThemeWhiteButtonColor;
-    }(DThemeWhiteButton));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteDialogColor = /** @class */ (function (_super) {
-        __extends(DThemeWhiteDialogColor, _super);
-        function DThemeWhiteDialogColor() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        return DThemeWhiteDialogColor;
-    }(DThemeWhiteDialogFitted));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteDialogColor = function () {
-        DThemeWhite.set("DDialogColor", DThemeWhiteDialogColor);
-        loadThemeWhitePickerColor();
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonColor = function () {
-        DThemeWhite.set("DButtonColor", DThemeWhiteButtonColor);
-        loadThemeWhiteDialogColor();
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteButtonDanger = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonDanger, _super);
-        function DThemeWhiteButtonDanger() {
-            return _super.call(this, 0xff5566, 0.1, 0.2) || this;
-        }
-        DThemeWhiteButtonDanger.prototype.getBackgroundColor = function (state) {
-            if (state.inDisabled) {
-                return null;
-            }
-            else if (state.isPressed || state.isActive) {
-                return this.BACKGROUND_COLOR_PRESSED;
-            }
-            else if (state.isHovered) {
-                return this.BACKGROUND_COLOR_HOVERED;
-            }
-            else {
-                return this.BACKGROUND_COLOR;
-            }
-        };
-        DThemeWhiteButtonDanger.prototype.getBorderColor = function (state) {
-            if (state.inDisabled) {
-                return DThemeWhiteConstants.BORDER_COLOR;
-            }
-            else {
-                return null;
-            }
-        };
-        DThemeWhiteButtonDanger.prototype.getOutlineColor = function (state) {
-            return this.getOutlineColorActive(state);
-        };
-        DThemeWhiteButtonDanger.prototype.getOutlineOffset = function (state) {
-            return this.getOutlineOffsetActive(state);
-        };
-        DThemeWhiteButtonDanger.prototype.getColor = function (state) {
-            if (state.inDisabled) {
-                return _super.prototype.getColor.call(this, state);
-            }
-            else {
-                return DThemeWhiteConstants.ACTIVE_COLOR;
-            }
-        };
-        return DThemeWhiteButtonDanger;
-    }(DThemeWhiteButtonBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonDanger = function () {
-        DThemeWhite.set("DButtonDanger", DThemeWhiteButtonDanger);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteButtonFile = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonFile, _super);
-        function DThemeWhiteButtonFile() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        return DThemeWhiteButtonFile;
-    }(DThemeWhiteButton));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonFile = function () {
-        DThemeWhite.set("DButtonFile", DThemeWhiteButtonFile);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteButtonLink = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonLink, _super);
-        function DThemeWhiteButtonLink() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        return DThemeWhiteButtonLink;
-    }(DThemeWhiteButtonAmbient));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonLink = function () {
-        DThemeWhite.set("DButtonLink", DThemeWhiteButtonLink);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteButtonPrimary = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonPrimary, _super);
-        function DThemeWhiteButtonPrimary() {
-            return _super.call(this, DThemeWhiteConstants.HIGHLIGHT_COLOR, 0.1, 0.2) || this;
-        }
-        DThemeWhiteButtonPrimary.prototype.getBackgroundColor = function (state) {
-            if (state.inDisabled) {
-                return null;
-            }
-            else if (state.isPressed || state.isActive) {
-                return this.BACKGROUND_COLOR_PRESSED;
-            }
-            else if (state.isHovered) {
-                return this.BACKGROUND_COLOR_HOVERED;
-            }
-            else {
-                return this.BACKGROUND_COLOR;
-            }
-        };
-        DThemeWhiteButtonPrimary.prototype.getBorderColor = function (state) {
-            if (state.inDisabled) {
-                return DThemeWhiteConstants.BORDER_COLOR;
-            }
-            else {
-                return null;
-            }
-        };
-        DThemeWhiteButtonPrimary.prototype.getOutlineColor = function (state) {
-            return this.getOutlineColorActive(state);
-        };
-        DThemeWhiteButtonPrimary.prototype.getOutlineOffset = function (state) {
-            return this.getOutlineOffsetActive(state);
-        };
-        DThemeWhiteButtonPrimary.prototype.getColor = function (state) {
-            if (state.inDisabled) {
-                return _super.prototype.getColor.call(this, state);
-            }
-            else {
-                return DThemeWhiteConstants.ACTIVE_COLOR;
-            }
-        };
-        return DThemeWhiteButtonPrimary;
-    }(DThemeWhiteButtonBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonPrimary = function () {
-        DThemeWhite.set("DButtonPrimary", DThemeWhiteButtonPrimary);
-    };
-
-    /*
-     * 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_radio_mark_on", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
-        "<path d=\"M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48" +
-        " 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8" +
-        " 8 3.58 8 8-3.58 8-8 8z\" fill=\"#fff\" />" +
-        "</g>");
-    DThemeWhiteAtlas.add("button_radio_mark_off", 21, 21, "<g transform=\"scale(0.875,0.875)\">" +
-        "<path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42" +
-        " 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z\" fill=\"#fff\" />" +
-        "</g>");
-    /* eslint-enable prettier/prettier */
-    var DThemeWhiteButtonRadio = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonRadio, _super);
-        function DThemeWhiteButtonRadio() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteButtonRadio.prototype.getBackgroundColor = function (state) {
-            return DThemeWhiteConstants.WEAK_HIGHLIGHT_COLOR;
-        };
-        DThemeWhiteButtonRadio.prototype.getColor = function (state) {
-            return DThemeWhiteConstants.COLOR;
-        };
-        DThemeWhiteButtonRadio.prototype.getBackgroundAlpha = function (state) {
-            if (state.inEnabled) {
-                if (state.isHovered) {
-                    return DThemeWhiteConstants.WEAK_HIGHLIGHT_ALPHA;
-                }
-            }
-            return 0;
-        };
-        DThemeWhiteButtonRadio.prototype.getOutlineColor = function (state) {
-            return this.getOutlineColorNonActive(state);
-        };
-        DThemeWhiteButtonRadio.prototype.getOutlineOffset = function (state) {
-            return this.getOutlineOffsetNonActive(state);
-        };
-        DThemeWhiteButtonRadio.prototype.getImageTintColor = function (state) {
-            if (state.inDisabled || !state.isActive) {
-                return DThemeWhiteConstants.WEAK_HIGHLIGHT_COLOR;
-            }
-            else {
-                return DThemeWhiteConstants.HIGHLIGHT_COLOR;
-            }
-        };
-        DThemeWhiteButtonRadio.prototype.isToggle = function () {
-            return true;
-        };
-        DThemeWhiteButtonRadio.prototype.getImageSource = function (state) {
-            if (state.isActive) {
-                return DThemeWhiteAtlas.mappings.button_radio_mark_on;
-            }
-            else {
-                return DThemeWhiteAtlas.mappings.button_radio_mark_off;
-            }
-        };
-        return DThemeWhiteButtonRadio;
-    }(DThemeWhiteButtonAmbient));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteButtonRadioRight = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonRadioRight, _super);
-        function DThemeWhiteButtonRadioRight() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteButtonRadioRight.prototype.getImageAlignWith = function () {
-            return DAlignWith.PADDING;
-        };
-        DThemeWhiteButtonRadioRight.prototype.getImageAlignHorizontal = function () {
-            return DAlignHorizontal.RIGHT;
-        };
-        DThemeWhiteButtonRadioRight.prototype.getImageMarginHorizontal = function () {
-            return 0;
-        };
-        DThemeWhiteButtonRadioRight.prototype.getTextAlignHorizontal = function () {
-            return DAlignHorizontal.LEFT;
-        };
-        return DThemeWhiteButtonRadioRight;
-    }(DThemeWhiteButtonRadio));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonRadioRight = function () {
-        DThemeWhite.set("DButtonRadioRight", DThemeWhiteButtonRadioRight);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonRadio = function () {
-        DThemeWhite.set("DButtonRadio", DThemeWhiteButtonRadio);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteButtonSecondary = /** @class */ (function (_super) {
-        __extends(DThemeWhiteButtonSecondary, _super);
-        function DThemeWhiteButtonSecondary() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        return DThemeWhiteButtonSecondary;
-    }(DThemeWhiteButtonBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButtonSecondary = function () {
-        DThemeWhite.set("DButtonSecondary", DThemeWhiteButtonSecondary);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteButton = function () {
-        DThemeWhite.set("DButton", DThemeWhiteButton);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteCanvas = /** @class */ (function (_super) {
-        __extends(DThemeWhiteCanvas, _super);
-        function DThemeWhiteCanvas() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteCanvas.prototype.getBackgroundColor = function () {
-            return 0xffffff;
-        };
-        DThemeWhiteCanvas.prototype.getBorderColor = function (state) {
-            return null;
-        };
-        DThemeWhiteCanvas.prototype.getCornerMask = function () {
-            return DCornerMask.ALL;
-        };
-        DThemeWhiteCanvas.prototype.getInteractive = function () {
-            return DBaseInteractive.BOTH;
-        };
-        return DThemeWhiteCanvas;
-    }(DThemeWhiteBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteCanvasContainer = /** @class */ (function (_super) {
-        __extends(DThemeWhiteCanvasContainer, _super);
-        function DThemeWhiteCanvasContainer() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteCanvasContainer.prototype.getBackgroundColor = function (state) {
-            return null;
-        };
-        DThemeWhiteCanvasContainer.prototype.getBorderColor = function (state) {
-            return null;
-        };
-        DThemeWhiteCanvasContainer.prototype.getPaddingLeft = function () {
-            return 32;
-        };
-        DThemeWhiteCanvasContainer.prototype.getPaddingTop = function () {
-            return 32;
-        };
-        DThemeWhiteCanvasContainer.prototype.getPaddingRight = function () {
-            return 32;
-        };
-        DThemeWhiteCanvasContainer.prototype.getPaddingBottom = function () {
-            return 32;
-        };
-        DThemeWhiteCanvasContainer.prototype.isOverflowMaskEnabled = function () {
-            return false;
-        };
-        DThemeWhiteCanvasContainer.prototype.getInteractive = function () {
-            return DBaseInteractive.BOTH;
-        };
-        DThemeWhiteCanvasContainer.prototype.getCornerMask = function () {
-            return DCornerMask.ALL;
-        };
-        return DThemeWhiteCanvasContainer;
-    }(DThemeWhiteBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var loadThemeWhiteCanvasContainer = function () {
-        DThemeWhite.set("DCanvasContainer", DThemeWhiteCanvasContainer);
-        DThemeWhite.set("DCanvas", DThemeWhiteCanvas);
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteChart = /** @class */ (function (_super) {
-        __extends(DThemeWhiteChart, _super);
-        function DThemeWhiteChart() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteChart.prototype.getPaddingLeft = function () {
-            return 80;
-        };
-        DThemeWhiteChart.prototype.getPaddingRight = function () {
-            return 10;
-        };
-        DThemeWhiteChart.prototype.getPaddingTop = function () {
-            return 10;
-        };
-        DThemeWhiteChart.prototype.getPaddingBottom = function () {
-            return 70;
-        };
-        DThemeWhiteChart.prototype.getBorderColor = function (state) {
-            return null;
-        };
-        DThemeWhiteChart.prototype.getInteractive = function () {
-            return DBaseInteractive.BOTH;
-        };
-        DThemeWhiteChart.prototype.newState = function (state) {
-            _super.prototype.newState.call(this, state);
-            state.isFocusable = false;
-        };
-        DThemeWhiteChart.prototype.isOverflowMaskEnabled = function () {
-            return true;
-        };
-        return DThemeWhiteChart;
+        DThemeWhiteChart.prototype.isOverflowMaskEnabled = function () {
+            return true;
+        };
+        return DThemeWhiteChart;
     }(DThemeWhiteBase));
 
     const DChartAxisPosition = wcardinal.ui.DChartAxisPosition;
@@ -2617,71 +2034,229 @@
         EThemeWhiteShape.prototype.getStrokeColor = function () {
             return 0x4f4f4f;
         };
-        EThemeWhiteShape.prototype.getStrokeAlpha = function () {
-            return 1;
+        EThemeWhiteShape.prototype.getStrokeAlpha = function () {
+            return 1;
+        };
+        EThemeWhiteShape.prototype.getStrokeWidth = function () {
+            return 2;
+        };
+        EThemeWhiteShape.prototype.getStrokeAlign = function () {
+            return 0;
+        };
+        EThemeWhiteShape.prototype.getStrokeSide = function () {
+            return EShapeStrokeSide.ALL;
+        };
+        EThemeWhiteShape.prototype.getStrokeStyle = function () {
+            return EShapeStrokeStyle.NONE;
+        };
+        EThemeWhiteShape.prototype.getTextValue = function () {
+            return "";
+        };
+        EThemeWhiteShape.prototype.getTextColor = function () {
+            return this.getStrokeColor();
+        };
+        EThemeWhiteShape.prototype.getTextAlpha = function () {
+            return this.getStrokeAlpha();
+        };
+        EThemeWhiteShape.prototype.getTextFamily = function () {
+            return "auto";
+        };
+        EThemeWhiteShape.prototype.getTextSize = function () {
+            return 14;
+        };
+        EThemeWhiteShape.prototype.getRadius = function () {
+            return 0.25;
+        };
+        EThemeWhiteShape.prototype.getSizeX = function () {
+            return 100;
+        };
+        EThemeWhiteShape.prototype.getSizeY = function () {
+            return 100;
+        };
+        EThemeWhiteShape.prototype.getHighlightColor = function () {
+            return 0x1e87f0;
+        };
+        EThemeWhiteShape.prototype.getCurveSegmentCount = function () {
+            return 24;
+        };
+        return EThemeWhiteShape;
+    }());
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteShape = function () {
+        DThemeWhite.set("EShape", EThemeWhiteShape);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteDiagram = function () {
+        DThemeWhite.set("DDiagram", DThemeWhiteDiagram);
+        DThemeWhite.set("DDiagramCanvas", DThemeWhiteDiagramCanvas);
+        loadThemeWhiteShape();
+    };
+
+    const DAnimationFadeIn = wcardinal.ui.DAnimationFadeIn;
+
+    const DDialogAlign = wcardinal.ui.DDialogAlign;
+
+    const DDialogCloseOn = wcardinal.ui.DDialogCloseOn;
+
+    const DDialogGestureMode = wcardinal.ui.DDialogGestureMode;
+
+    const DDialogMode = wcardinal.ui.DDialogMode;
+
+    const DDialogState = wcardinal.ui.DDialogState;
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteDialog = /** @class */ (function (_super) {
+        __extends(DThemeWhiteDialog, _super);
+        function DThemeWhiteDialog() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteDialog.prototype.getMode = function () {
+            return DDialogMode.MODAL;
+        };
+        DThemeWhiteDialog.prototype.closeOn = function (mode) {
+            switch (mode) {
+                case DDialogMode.MODAL:
+                case DDialogMode.MENU:
+                    return DDialogCloseOn.ESC | DDialogCloseOn.CLICK_OUTSIDE;
+                case DDialogMode.MODELESS:
+                    return DDialogCloseOn.NONE;
+            }
+        };
+        DThemeWhiteDialog.prototype.isSticky = function (mode) {
+            return false;
+        };
+        DThemeWhiteDialog.prototype.isGestureEnabled = function (mode) {
+            switch (mode) {
+                case DDialogMode.MODAL:
+                case DDialogMode.MODELESS:
+                    return true;
+                case DDialogMode.MENU:
+                    return false;
+            }
+        };
+        DThemeWhiteDialog.prototype.getGestureMode = function (mode) {
+            return DDialogGestureMode.DIRTY;
+        };
+        DThemeWhiteDialog.prototype.getOffsetX = function (mode) {
+            return 5;
+        };
+        DThemeWhiteDialog.prototype.getOffsetY = function (mode) {
+            return 5;
+        };
+        DThemeWhiteDialog.prototype.getAlign = function (mode) {
+            return DDialogAlign.BOTTOM;
+        };
+        DThemeWhiteDialog.prototype.newAnimation = function (mode) {
+            switch (mode) {
+                case DDialogMode.MODAL:
+                    return new DAnimationFadeIn();
+                case DDialogMode.MODELESS:
+                    return null;
+                case DDialogMode.MENU:
+                    return null;
+            }
+        };
+        DThemeWhiteDialog.prototype.getBackgroundColor = function (state) {
+            if (state.is(DDialogState.MENU)) {
+                return DThemeWhiteConstants.BACKGROUND_COLOR_ON_BOARD;
+            }
+            else {
+                return DThemeWhiteConstants.BACKGROUND_COLOR;
+            }
+        };
+        DThemeWhiteDialog.prototype.getBorderColor = function (state) {
+            if (state.is(DDialogState.MENU)) {
+                return null;
+            }
+            else {
+                return 0xfafafa;
+            }
+        };
+        DThemeWhiteDialog.prototype.getOutlineColor = function (state) {
+            return null;
         };
-        EThemeWhiteShape.prototype.getStrokeWidth = function () {
-            return 2;
+        DThemeWhiteDialog.prototype.getPaddingLeft = function () {
+            return 0;
         };
-        EThemeWhiteShape.prototype.getStrokeAlign = function () {
+        DThemeWhiteDialog.prototype.getPaddingTop = function () {
             return 0;
         };
-        EThemeWhiteShape.prototype.getStrokeSide = function () {
-            return EShapeStrokeSide.ALL;
+        DThemeWhiteDialog.prototype.getPaddingRight = function () {
+            return 0;
         };
-        EThemeWhiteShape.prototype.getStrokeStyle = function () {
-            return EShapeStrokeStyle.NONE;
+        DThemeWhiteDialog.prototype.getPaddingBottom = function () {
+            return 0;
         };
-        EThemeWhiteShape.prototype.getTextValue = function () {
-            return "";
+        DThemeWhiteDialog.prototype.getX = function () {
+            return 0;
         };
-        EThemeWhiteShape.prototype.getTextColor = function () {
-            return this.getStrokeColor();
+        DThemeWhiteDialog.prototype.getY = function () {
+            return 0;
         };
-        EThemeWhiteShape.prototype.getTextAlpha = function () {
-            return this.getStrokeAlpha();
+        DThemeWhiteDialog.prototype.getWidth = function () {
+            return 400;
         };
-        EThemeWhiteShape.prototype.getTextFamily = function () {
+        DThemeWhiteDialog.prototype.getHeight = function () {
             return "auto";
         };
-        EThemeWhiteShape.prototype.getTextSize = function () {
-            return 14;
-        };
-        EThemeWhiteShape.prototype.getRadius = function () {
-            return 0.25;
-        };
-        EThemeWhiteShape.prototype.getSizeX = function () {
-            return 100;
-        };
-        EThemeWhiteShape.prototype.getSizeY = function () {
-            return 100;
-        };
-        EThemeWhiteShape.prototype.getHighlightColor = function () {
-            return 0x1e87f0;
+        DThemeWhiteDialog.prototype.getShadow = function () {
+            return this.newShadow();
         };
-        EThemeWhiteShape.prototype.getCurveSegmentCount = function () {
-            return 24;
+        DThemeWhiteDialog.prototype.getInteractive = function () {
+            return DBaseInteractive.BOTH;
         };
-        return EThemeWhiteShape;
-    }());
+        return DThemeWhiteDialog;
+    }(DThemeWhiteBase));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var loadThemeWhiteShape = function () {
-        DThemeWhite.set("EShape", EThemeWhiteShape);
-    };
+    var DThemeWhiteDialogLayered = /** @class */ (function (_super) {
+        __extends(DThemeWhiteDialogLayered, _super);
+        function DThemeWhiteDialogLayered() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteDialogLayered.prototype.getLayout = function () {
+            return undefined;
+        };
+        DThemeWhiteDialogLayered.prototype.getHeader = function () {
+            return null;
+        };
+        DThemeWhiteDialogLayered.prototype.getContent = function () {
+            return undefined;
+        };
+        DThemeWhiteDialogLayered.prototype.getFooter = function () {
+            return undefined;
+        };
+        return DThemeWhiteDialogLayered;
+    }(DThemeWhiteDialog));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var loadThemeWhiteDiagram = function () {
-        DThemeWhite.set("DDiagram", DThemeWhiteDiagram);
-        DThemeWhite.set("DDiagramCanvas", DThemeWhiteDiagramCanvas);
-        loadThemeWhiteShape();
-    };
+    var DThemeWhiteDialogFitted = /** @class */ (function (_super) {
+        __extends(DThemeWhiteDialogFitted, _super);
+        function DThemeWhiteDialogFitted() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteDialogFitted.prototype.getWidth = function () {
+            return "auto";
+        };
+        return DThemeWhiteDialogFitted;
+    }(DThemeWhiteDialogLayered));
 
     const DLayoutDirection = wcardinal.ui.DLayoutDirection;
 
@@ -5353,7 +4928,7 @@
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var formatter$8 = function (value) {
+    var formatter$a = function (value) {
         if (value) {
             var text = value.text;
             if (isString(text)) {
@@ -5374,7 +4949,7 @@
             return _super !== null && _super.apply(this, arguments) || this;
         }
         DThemeWhiteSelect.prototype.getTextFormatter = function () {
-            return formatter$8;
+            return formatter$a;
         };
         DThemeWhiteSelect.prototype.newTextValue = function () {
             return null;
@@ -5386,7 +4961,7 @@
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var formatter$7 = function (values) {
+    var formatter$9 = function (values) {
         if (values) {
             var result = "";
             var delimiter = "";
@@ -5415,7 +4990,7 @@
             return _super !== null && _super.apply(this, arguments) || this;
         }
         DThemeWhiteSelectMultiple.prototype.getTextFormatter = function () {
-            return formatter$7;
+            return formatter$9;
         };
         DThemeWhiteSelectMultiple.prototype.newTextValue = function () {
             return [];
@@ -5858,598 +5433,1045 @@
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteSlider = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSlider, _super);
-        function DThemeWhiteSlider() {
+    var DThemeWhiteSlider = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSlider, _super);
+        function DThemeWhiteSlider() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteSlider.prototype.getInteractive = function () {
+            return DBaseInteractive.CHILDREN;
+        };
+        DThemeWhiteSlider.prototype.getOutlineColor = function (state) {
+            return null;
+        };
+        return DThemeWhiteSlider;
+    }(DThemeWhiteBase));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteSliderHorizontal = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderHorizontal, _super);
+        function DThemeWhiteSliderHorizontal() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteSliderHorizontal.prototype.getHeight = function () {
+            return 33;
+        };
+        DThemeWhiteSliderHorizontal.prototype.getWidth = function () {
+            return 300;
+        };
+        DThemeWhiteSliderHorizontal.prototype.getX = function () {
+            return "CENTER";
+        };
+        return DThemeWhiteSliderHorizontal;
+    }(DThemeWhiteSlider));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteSliderLabel = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderLabel, _super);
+        function DThemeWhiteSliderLabel() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteSliderLabel.prototype.getHeight = function () {
+            return 15;
+        };
+        DThemeWhiteSliderLabel.prototype.getWidth = function () {
+            return 30;
+        };
+        DThemeWhiteSliderLabel.prototype.getTextAlignHorizontal = function () {
+            return DAlignHorizontal.CENTER;
+        };
+        DThemeWhiteSliderLabel.prototype.getTextAlignVertical = function () {
+            return DAlignVertical.MIDDLE;
+        };
+        DThemeWhiteSliderLabel.prototype.newState = function (state) {
+            _super.prototype.newState.call(this, state);
+            state.isFocusable = false;
+        };
+        return DThemeWhiteSliderLabel;
+    }(DThemeWhiteTextBase));
+
+    var DThemeWhiteSliders = /** @class */ (function () {
+        function DThemeWhiteSliders() {
+        }
+        DThemeWhiteSliders.getBackgroundColor = function (state, isActive) {
+            if (state.isActive || isActive) {
+                if (state.inDisabled) {
+                    return this.BACKGROUND_COLOR;
+                }
+                else if (state.isPressed && state.isHovered) {
+                    return this.BACKGROUND_COLOR_ACTIVE_PRESSED;
+                }
+                else if (state.isPressed || state.isHovered) {
+                    return this.BACKGROUND_COLOR_ACTIVE_HOVERED;
+                }
+                else {
+                    return this.BACKGROUND_COLOR_ACTIVE;
+                }
+            }
+            else {
+                if (state.inDisabled) {
+                    return this.BACKGROUND_COLOR_DISABLED;
+                }
+                else if (state.isPressed && state.isHovered) {
+                    return this.BACKGROUND_COLOR_PRESSED;
+                }
+                else if (state.isPressed || state.isHovered) {
+                    return this.BACKGROUND_COLOR_HOVERED;
+                }
+                else {
+                    return this.BACKGROUND_COLOR;
+                }
+            }
+        };
+        DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE = DThemeWhiteConstants.HIGHLIGHT_COLOR;
+        DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE_HOVERED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE, 0.1);
+        DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE_PRESSED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE, 0.2);
+        DThemeWhiteSliders.BACKGROUND_COLOR = DThemeWhiteConstants.WEAK_HIGHLIGHT_COLOR;
+        DThemeWhiteSliders.BACKGROUND_COLOR_HOVERED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR, 0.1);
+        DThemeWhiteSliders.BACKGROUND_COLOR_PRESSED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR, 0.2);
+        DThemeWhiteSliders.BACKGROUND_COLOR_DISABLED = UtilRgb.blend(DThemeWhiteSliders.BACKGROUND_COLOR, DThemeWhiteConstants.BACKGROUND_COLOR_ON_BOARD, 0.5);
+        return DThemeWhiteSliders;
+    }());
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    /* eslint-disable prettier/prettier */
+    DThemeWhiteAtlas.add("slider_thumb", 16, 16, "<circle cx=\"8\" cy=\"8\" r=\"7.5\" stroke=\"none\" fill=\"#ffffff\" />");
+    /* eslint-enable prettier/prettier */
+    var DThemeWhiteSliderThumb = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderThumb, _super);
+        function DThemeWhiteSliderThumb() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteSliderThumb.prototype.getX = function () {
+            return "CENTER";
+        };
+        DThemeWhiteSliderThumb.prototype.getY = function () {
+            return "CENTER";
+        };
+        DThemeWhiteSliderThumb.prototype.getWidth = function () {
+            return 16;
+        };
+        DThemeWhiteSliderThumb.prototype.getHeight = function () {
+            return 16;
+        };
+        DThemeWhiteSliderThumb.prototype.getBackgroundColor = function (state) {
+            return null;
+        };
+        DThemeWhiteSliderThumb.prototype.getBorderColor = function (state) {
+            return null;
+        };
+        DThemeWhiteSliderThumb.prototype.getImageSource = function (state) {
+            return DThemeWhiteAtlas.mappings.slider_thumb;
+        };
+        DThemeWhiteSliderThumb.prototype.getImageTintColor = function (state) {
+            return DThemeWhiteSliders.getBackgroundColor(state, true);
+        };
+        DThemeWhiteSliderThumb.prototype.getImageTintAlpha = function (state) {
+            return 1;
+        };
+        DThemeWhiteSliderThumb.prototype.getImageAlignHorizontal = function () {
+            return DAlignHorizontal.CENTER;
+        };
+        DThemeWhiteSliderThumb.prototype.getOutlineColor = function (state) {
+            return null;
+        };
+        return DThemeWhiteSliderThumb;
+    }(DThemeWhiteButton));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteSliderTrack = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderTrack, _super);
+        function DThemeWhiteSliderTrack() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteSlider.prototype.getInteractive = function () {
-            return DBaseInteractive.CHILDREN;
+        DThemeWhiteSliderTrack.prototype.getBackgroundColor = function (state) {
+            return DThemeWhiteSliders.getBackgroundColor(state);
         };
-        DThemeWhiteSlider.prototype.getOutlineColor = function (state) {
+        DThemeWhiteSliderTrack.prototype.getBorderColor = function (state) {
             return null;
         };
-        return DThemeWhiteSlider;
-    }(DThemeWhiteBase));
+        DThemeWhiteSliderTrack.prototype.getOutlineColor = function (state) {
+            return _super.prototype.getOutlineColorNonActive.call(this, state);
+        };
+        DThemeWhiteSliderTrack.prototype.getOutlineOffset = function (state) {
+            return _super.prototype.getOutlineOffsetNonActive.call(this, state);
+        };
+        DThemeWhiteSliderTrack.prototype.newState = function (state) {
+            _super.prototype.newState.call(this, state);
+            state.isFocusable = false;
+        };
+        return DThemeWhiteSliderTrack;
+    }(DThemeWhiteButton));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteSliderHorizontal = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderHorizontal, _super);
-        function DThemeWhiteSliderHorizontal() {
+    var DThemeWhiteSliderTrackHorizontal = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderTrackHorizontal, _super);
+        function DThemeWhiteSliderTrackHorizontal() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteSliderHorizontal.prototype.getHeight = function () {
-            return 33;
+        DThemeWhiteSliderTrackHorizontal.prototype.getX = function () {
+            return 0;
         };
-        DThemeWhiteSliderHorizontal.prototype.getWidth = function () {
-            return 300;
+        DThemeWhiteSliderTrackHorizontal.prototype.getY = function () {
+            return "CENTER";
         };
-        DThemeWhiteSliderHorizontal.prototype.getX = function () {
+        DThemeWhiteSliderTrackHorizontal.prototype.getWidth = function () {
+            return "100%";
+        };
+        DThemeWhiteSliderTrackHorizontal.prototype.getHeight = function () {
+            return 5;
+        };
+        return DThemeWhiteSliderTrackHorizontal;
+    }(DThemeWhiteSliderTrack));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteSliderTrackVertical = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderTrackVertical, _super);
+        function DThemeWhiteSliderTrackVertical() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteSliderTrackVertical.prototype.getX = function () {
             return "CENTER";
         };
-        return DThemeWhiteSliderHorizontal;
-    }(DThemeWhiteSlider));
+        DThemeWhiteSliderTrackVertical.prototype.getY = function () {
+            return 0;
+        };
+        DThemeWhiteSliderTrackVertical.prototype.getWidth = function () {
+            return 5;
+        };
+        DThemeWhiteSliderTrackVertical.prototype.getHeight = function () {
+            return "100%";
+        };
+        return DThemeWhiteSliderTrackVertical;
+    }(DThemeWhiteSliderTrack));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteSliderLabel = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderLabel, _super);
-        function DThemeWhiteSliderLabel() {
+    var DThemeWhiteSliderValue = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderValue, _super);
+        function DThemeWhiteSliderValue() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteSliderLabel.prototype.getHeight = function () {
-            return 15;
+        DThemeWhiteSliderValue.prototype.getX = function () {
+            return "CENTER";
         };
-        DThemeWhiteSliderLabel.prototype.getWidth = function () {
-            return 30;
+        DThemeWhiteSliderValue.prototype.getY = function () {
+            return "CENTER";
         };
-        DThemeWhiteSliderLabel.prototype.getTextAlignHorizontal = function () {
+        DThemeWhiteSliderValue.prototype.getWidth = function () {
+            return this.getLineHeight() * 2;
+        };
+        DThemeWhiteSliderValue.prototype.getHeight = function () {
+            return this.getLineHeight();
+        };
+        DThemeWhiteSliderValue.prototype.getBackgroundColor = function (state) {
+            if (state.inDisabled) {
+                return 0xaaaaaa;
+            }
+            return DThemeWhiteConstants.HIGHLIGHT_COLOR;
+        };
+        DThemeWhiteSliderValue.prototype.getBorderColor = function (state) {
+            return null;
+        };
+        DThemeWhiteSliderValue.prototype.getColor = function (state) {
+            return DThemeWhiteConstants.ACTIVE_COLOR;
+        };
+        DThemeWhiteSliderValue.prototype.getTextAlignHorizontal = function () {
             return DAlignHorizontal.CENTER;
         };
-        DThemeWhiteSliderLabel.prototype.getTextAlignVertical = function () {
-            return DAlignVertical.MIDDLE;
+        DThemeWhiteSliderValue.prototype.getTextAlignVertical = function () {
+            return DAlignVertical.TOP;
         };
-        DThemeWhiteSliderLabel.prototype.newState = function (state) {
+        DThemeWhiteSliderValue.prototype.getPrecision = function () {
+            return 0;
+        };
+        DThemeWhiteSliderValue.prototype.newState = function (state) {
             _super.prototype.newState.call(this, state);
             state.isFocusable = false;
         };
-        return DThemeWhiteSliderLabel;
+        return DThemeWhiteSliderValue;
     }(DThemeWhiteTextBase));
 
-    var DThemeWhiteSliders = /** @class */ (function () {
-        function DThemeWhiteSliders() {
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteSliderVertical = /** @class */ (function (_super) {
+        __extends(DThemeWhiteSliderVertical, _super);
+        function DThemeWhiteSliderVertical() {
+            return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteSliders.getBackgroundColor = function (state, isActive) {
-            if (state.isActive || isActive) {
-                if (state.inDisabled) {
-                    return this.BACKGROUND_COLOR;
-                }
-                else if (state.isPressed && state.isHovered) {
-                    return this.BACKGROUND_COLOR_ACTIVE_PRESSED;
-                }
-                else if (state.isPressed || state.isHovered) {
-                    return this.BACKGROUND_COLOR_ACTIVE_HOVERED;
-                }
-                else {
-                    return this.BACKGROUND_COLOR_ACTIVE;
-                }
-            }
-            else {
-                if (state.inDisabled) {
-                    return this.BACKGROUND_COLOR_DISABLED;
-                }
-                else if (state.isPressed && state.isHovered) {
-                    return this.BACKGROUND_COLOR_PRESSED;
-                }
-                else if (state.isPressed || state.isHovered) {
-                    return this.BACKGROUND_COLOR_HOVERED;
+        DThemeWhiteSliderVertical.prototype.getHeight = function () {
+            return 322;
+        };
+        DThemeWhiteSliderVertical.prototype.getWidth = function () {
+            return 35;
+        };
+        return DThemeWhiteSliderVertical;
+    }(DThemeWhiteSlider));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteSlider = function () {
+        DThemeWhite.set("DSlider", DThemeWhiteSlider);
+        DThemeWhite.set("DSliderValue", DThemeWhiteSliderValue);
+        DThemeWhite.set("DSliderLabel", DThemeWhiteSliderLabel);
+        DThemeWhite.set("DSliderThumb", DThemeWhiteSliderThumb);
+        DThemeWhite.set("DSliderVertical", DThemeWhiteSliderVertical);
+        DThemeWhite.set("DSliderHorizontal", DThemeWhiteSliderHorizontal);
+        DThemeWhite.set("DSliderTrack", DThemeWhiteSliderTrack);
+        DThemeWhite.set("DSliderTrackVertical", DThemeWhiteSliderTrackVertical);
+        DThemeWhite.set("DSliderTrackHorizontal", DThemeWhiteSliderTrackHorizontal);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteText = function () {
+        DThemeWhite.set("DText", DThemeWhiteText);
+    };
+
+    const DTableState = wcardinal.ui.DTableState;
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteTableBodyCellTrees = /** @class */ (function () {
+        function DThemeWhiteTableBodyCellTrees() {
+        }
+        DThemeWhiteTableBodyCellTrees.init = function () {
+            DThemeWhiteExpandables.init();
+        };
+        DThemeWhiteTableBodyCellTrees.getImageSource = function (state) {
+            if (state.is(DTableState.HAS_CHILDREN)) {
+                if (state.is(DTableState.OPENED)) {
+                    return DThemeWhiteExpandables.getImageOpened();
                 }
                 else {
-                    return this.BACKGROUND_COLOR;
+                    return DThemeWhiteExpandables.getImageClosed();
                 }
             }
+            return null;
         };
-        DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE = DThemeWhiteConstants.HIGHLIGHT_COLOR;
-        DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE_HOVERED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE, 0.1);
-        DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE_PRESSED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR_ACTIVE, 0.2);
-        DThemeWhiteSliders.BACKGROUND_COLOR = DThemeWhiteConstants.WEAK_HIGHLIGHT_COLOR;
-        DThemeWhiteSliders.BACKGROUND_COLOR_HOVERED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR, 0.1);
-        DThemeWhiteSliders.BACKGROUND_COLOR_PRESSED = UtilRgb.darken(DThemeWhiteSliders.BACKGROUND_COLOR, 0.2);
-        DThemeWhiteSliders.BACKGROUND_COLOR_DISABLED = UtilRgb.blend(DThemeWhiteSliders.BACKGROUND_COLOR, DThemeWhiteConstants.BACKGROUND_COLOR_ON_BOARD, 0.5);
-        return DThemeWhiteSliders;
+        return DThemeWhiteTableBodyCellTrees;
     }());
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    /* eslint-disable prettier/prettier */
-    DThemeWhiteAtlas.add("slider_thumb", 16, 16, "<circle cx=\"8\" cy=\"8\" r=\"7.5\" stroke=\"none\" fill=\"#ffffff\" />");
-    /* eslint-enable prettier/prettier */
-    var DThemeWhiteSliderThumb = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderThumb, _super);
-        function DThemeWhiteSliderThumb() {
-            return _super !== null && _super.apply(this, arguments) || this;
+    DThemeWhiteTableBodyCellTrees.init();
+    var DThemeWhiteTreeItems = /** @class */ (function (_super) {
+        __extends(DThemeWhiteTreeItems, _super);
+        function DThemeWhiteTreeItems() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhiteTreeItems.prototype.getSecondaryImageSource = function (state) {
+            return DThemeWhiteTableBodyCellTrees.getImageSource(state);
+        };
+        DThemeWhiteTreeItems.prototype.getSecondaryImageTintColor = function (state) {
+            return this.getColor(state);
+        };
+        DThemeWhiteTreeItems.prototype.getSecondaryImageTintAlpha = function (state) {
+            return this.getAlpha(state) * 0.5;
+        };
+        DThemeWhiteTreeItems.prototype.getSecondaryImageAlignWith = function () {
+            return DAlignWith.PADDING;
+        };
+        DThemeWhiteTreeItems.prototype.getSecondaryImageMarginHorizontal = function () {
+            return -19;
+        };
+        return DThemeWhiteTreeItems;
+    }(DThemeWhiteListItems));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteTree = /** @class */ (function (_super) {
+        __extends(DThemeWhiteTree, _super);
+        function DThemeWhiteTree() {
+            var _this = _super.call(this) || this;
+            _this._style = _this.newStyle();
+            return _this;
+        }
+        DThemeWhiteTree.prototype.newStyle = function () {
+            return new DThemeWhiteTreeItems(null, true, false);
+        };
+        DThemeWhiteTree.prototype.getBackgroundColor = function (state) {
+            return DThemeWhiteConstants.BACKGROUND_COLOR_ON_BOARD;
+        };
+        return DThemeWhiteTree;
+    }(DThemeWhitePane));
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteTreeItemText = /** @class */ (function (_super) {
+        __extends(DThemeWhiteTreeItemText, _super);
+        function DThemeWhiteTreeItemText() {
+            var _this = _super.call(this) || this;
+            _this._style = _this.newStyle();
+            return _this;
         }
-        DThemeWhiteSliderThumb.prototype.getX = function () {
-            return "CENTER";
+        DThemeWhiteTreeItemText.prototype.newStyle = function () {
+            return new DThemeWhiteTreeItems(null, true, false);
         };
-        DThemeWhiteSliderThumb.prototype.getY = function () {
-            return "CENTER";
+        DThemeWhiteTreeItemText.prototype.getBackgroundColor = function (state) {
+            return this._style.getBackgroundColor(state);
         };
-        DThemeWhiteSliderThumb.prototype.getWidth = function () {
-            return 16;
+        DThemeWhiteTreeItemText.prototype.getBackgroundAlpha = function (state) {
+            return this._style.getBackgroundAlpha(state);
         };
-        DThemeWhiteSliderThumb.prototype.getHeight = function () {
-            return 16;
+        DThemeWhiteTreeItemText.prototype.getBorderColor = function (state) {
+            return this._style.getBorderColor(state);
         };
-        DThemeWhiteSliderThumb.prototype.getBackgroundColor = function (state) {
-            return null;
+        DThemeWhiteTreeItemText.prototype.getBorderMask = function (state) {
+            return this._style.getBorderMask(state);
         };
-        DThemeWhiteSliderThumb.prototype.getBorderColor = function (state) {
-            return null;
+        DThemeWhiteTreeItemText.prototype.getColor = function (state) {
+            return this._style.getColor(state);
         };
-        DThemeWhiteSliderThumb.prototype.getImageSource = function (state) {
-            return DThemeWhiteAtlas.mappings.slider_thumb;
+        DThemeWhiteTreeItemText.prototype.getAlpha = function (state) {
+            return this._style.getAlpha(state);
         };
-        DThemeWhiteSliderThumb.prototype.getImageTintColor = function (state) {
-            return DThemeWhiteSliders.getBackgroundColor(state, true);
+        DThemeWhiteTreeItemText.prototype.getHeight = function () {
+            return this._style.getHeight();
         };
-        DThemeWhiteSliderThumb.prototype.getImageTintAlpha = function (state) {
-            return 1;
+        DThemeWhiteTreeItemText.prototype.getCornerMask = function () {
+            return this._style.getCornerMask();
         };
-        DThemeWhiteSliderThumb.prototype.getImageAlignHorizontal = function () {
-            return DAlignHorizontal.CENTER;
+        DThemeWhiteTreeItemText.prototype.getImageTintColor = function (state) {
+            return this._style.getImageTintColor(state);
         };
-        DThemeWhiteSliderThumb.prototype.getOutlineColor = function (state) {
-            return null;
+        DThemeWhiteTreeItemText.prototype.getCursor = function (state) {
+            return this._style.getCursor(state);
         };
-        return DThemeWhiteSliderThumb;
-    }(DThemeWhiteButton));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteSliderTrack = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderTrack, _super);
-        function DThemeWhiteSliderTrack() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteSliderTrack.prototype.getBackgroundColor = function (state) {
-            return DThemeWhiteSliders.getBackgroundColor(state);
+        DThemeWhiteTreeItemText.prototype.getPaddingLeft = function () {
+            return 10;
         };
-        DThemeWhiteSliderTrack.prototype.getBorderColor = function (state) {
-            return null;
+        DThemeWhiteTreeItemText.prototype.getPaddingRight = function () {
+            return 10;
         };
-        DThemeWhiteSliderTrack.prototype.getOutlineColor = function (state) {
-            return _super.prototype.getOutlineColorNonActive.call(this, state);
+        DThemeWhiteTreeItemText.prototype.newTextValue = function () {
+            return undefined;
         };
-        DThemeWhiteSliderTrack.prototype.getOutlineOffset = function (state) {
-            return _super.prototype.getOutlineOffsetNonActive.call(this, state);
+        DThemeWhiteTreeItemText.prototype.getWidth = function () {
+            return "padding";
         };
-        DThemeWhiteSliderTrack.prototype.newState = function (state) {
+        DThemeWhiteTreeItemText.prototype.getLevelPadding = function (level) {
+            return 24 + level * 20 - this.getPaddingLeft();
+        };
+        DThemeWhiteTreeItemText.prototype.newState = function (state) {
             _super.prototype.newState.call(this, state);
-            state.isFocusable = false;
+            state.isDisabled = true;
         };
-        return DThemeWhiteSliderTrack;
-    }(DThemeWhiteButton));
+        return DThemeWhiteTreeItemText;
+    }(DThemeWhiteImageBase));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteSliderTrackHorizontal = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderTrackHorizontal, _super);
-        function DThemeWhiteSliderTrackHorizontal() {
+    var DThemeWhiteTreeItemButton = /** @class */ (function (_super) {
+        __extends(DThemeWhiteTreeItemButton, _super);
+        function DThemeWhiteTreeItemButton() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteSliderTrackHorizontal.prototype.getX = function () {
-            return 0;
-        };
-        DThemeWhiteSliderTrackHorizontal.prototype.getY = function () {
-            return "CENTER";
-        };
-        DThemeWhiteSliderTrackHorizontal.prototype.getWidth = function () {
-            return "100%";
-        };
-        DThemeWhiteSliderTrackHorizontal.prototype.getHeight = function () {
-            return 5;
+        DThemeWhiteTreeItemButton.prototype.getCursor = function (state) {
+            if (!state.isActionable) {
+                return "";
+            }
+            return "pointer";
         };
-        return DThemeWhiteSliderTrackHorizontal;
-    }(DThemeWhiteSliderTrack));
+        return DThemeWhiteTreeItemButton;
+    }(DThemeWhiteTreeItemText));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteSliderTrackVertical = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderTrackVertical, _super);
-        function DThemeWhiteSliderTrackVertical() {
+    DThemeWhiteTableBodyCellTrees.init();
+    var DThemeWhiteTreeItemNonEditable = /** @class */ (function (_super) {
+        __extends(DThemeWhiteTreeItemNonEditable, _super);
+        function DThemeWhiteTreeItemNonEditable() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteSliderTrackVertical.prototype.getX = function () {
-            return "CENTER";
+        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageSource = function (state) {
+            return this._style.getSecondaryImageSource(state);
         };
-        DThemeWhiteSliderTrackVertical.prototype.getY = function () {
-            return 0;
+        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageTintColor = function (state) {
+            return this._style.getSecondaryImageTintColor(state);
         };
-        DThemeWhiteSliderTrackVertical.prototype.getWidth = function () {
-            return 5;
+        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageTintAlpha = function (state) {
+            return this._style.getSecondaryImageTintAlpha(state);
         };
-        DThemeWhiteSliderTrackVertical.prototype.getHeight = function () {
-            return "100%";
+        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageAlignWith = function () {
+            return this._style.getSecondaryImageAlignWith();
         };
-        return DThemeWhiteSliderTrackVertical;
-    }(DThemeWhiteSliderTrack));
+        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageMarginHorizontal = function () {
+            return this._style.getSecondaryImageMarginHorizontal();
+        };
+        return DThemeWhiteTreeItemNonEditable;
+    }(DThemeWhiteTreeItemButton));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteSliderValue = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderValue, _super);
-        function DThemeWhiteSliderValue() {
-            return _super !== null && _super.apply(this, arguments) || this;
+    var loadThemeWhiteTree = function () {
+        DThemeWhite.set("DTree", DThemeWhiteTree);
+        DThemeWhite.set("DTreeItemText", DThemeWhiteTreeItemText);
+        DThemeWhite.set("DTreeItemButton", DThemeWhiteTreeItemButton);
+        DThemeWhite.set("DTreeItemNonEditable", DThemeWhiteTreeItemNonEditable);
+    };
+
+    const UtilGestureModifier = wcardinal.ui.UtilGestureModifier;
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var DThemeWhiteView = /** @class */ (function () {
+        function DThemeWhiteView() {
         }
-        DThemeWhiteSliderValue.prototype.getX = function () {
-            return "CENTER";
+        DThemeWhiteView.prototype.isWheelZoomEnabled = function () {
+            return true;
         };
-        DThemeWhiteSliderValue.prototype.getY = function () {
-            return "CENTER";
+        DThemeWhiteView.prototype.getWheelZoomSpeed = function () {
+            return 0.004;
         };
-        DThemeWhiteSliderValue.prototype.getWidth = function () {
-            return this.getLineHeight() * 2;
+        DThemeWhiteView.prototype.getWheelZoomModifier = function () {
+            return UtilGestureModifier.NOT_NONE;
         };
-        DThemeWhiteSliderValue.prototype.getHeight = function () {
-            return this.getLineHeight();
+        DThemeWhiteView.prototype.isWheelTranslationEnabled = function () {
+            return true;
         };
-        DThemeWhiteSliderValue.prototype.getBackgroundColor = function (state) {
-            if (state.inDisabled) {
-                return 0xaaaaaa;
-            }
-            return DThemeWhiteConstants.HIGHLIGHT_COLOR;
+        DThemeWhiteView.prototype.getWheelTranslationSpeed = function () {
+            return 14 * 0.16;
         };
-        DThemeWhiteSliderValue.prototype.getBorderColor = function (state) {
-            return null;
+        DThemeWhiteView.prototype.getWheelTranslationModifier = function () {
+            return UtilGestureModifier.NONE;
         };
-        DThemeWhiteSliderValue.prototype.getColor = function (state) {
-            return DThemeWhiteConstants.ACTIVE_COLOR;
+        DThemeWhiteView.prototype.isDblClickZoomEnabled = function () {
+            return true;
         };
-        DThemeWhiteSliderValue.prototype.getTextAlignHorizontal = function () {
-            return DAlignHorizontal.CENTER;
+        DThemeWhiteView.prototype.getDblClickZoomSpeed = function () {
+            return 2;
         };
-        DThemeWhiteSliderValue.prototype.getTextAlignVertical = function () {
-            return DAlignVertical.TOP;
+        DThemeWhiteView.prototype.getDblClickZoomModifier = function () {
+            return UtilGestureModifier.NONE;
         };
-        DThemeWhiteSliderValue.prototype.getPrecision = function () {
-            return 0;
+        DThemeWhiteView.prototype.getDblClickZoomDuration = function () {
+            return 333;
         };
-        DThemeWhiteSliderValue.prototype.newState = function (state) {
-            _super.prototype.newState.call(this, state);
-            state.isFocusable = false;
+        DThemeWhiteView.prototype.getZoomMin = function () {
+            return 0.01;
         };
-        return DThemeWhiteSliderValue;
-    }(DThemeWhiteTextBase));
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteSliderVertical = /** @class */ (function (_super) {
-        __extends(DThemeWhiteSliderVertical, _super);
-        function DThemeWhiteSliderVertical() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        DThemeWhiteSliderVertical.prototype.getHeight = function () {
-            return 322;
+        DThemeWhiteView.prototype.getZoomMax = function () {
+            return 100;
         };
-        DThemeWhiteSliderVertical.prototype.getWidth = function () {
-            return 35;
+        DThemeWhiteView.prototype.getZoomKeepRatio = function () {
+            return true;
         };
-        return DThemeWhiteSliderVertical;
-    }(DThemeWhiteSlider));
+        DThemeWhiteView.prototype.getGestureMode = function () {
+            return UtilGestureMode.ON;
+        };
+        DThemeWhiteView.prototype.getGestureModifier = function () {
+            return UtilGestureModifier.NONE;
+        };
+        DThemeWhiteView.prototype.getGestureDuration = function () {
+            return 1;
+        };
+        return DThemeWhiteView;
+    }());
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var loadThemeWhiteSlider = function () {
-        DThemeWhite.set("DSlider", DThemeWhiteSlider);
-        DThemeWhite.set("DSliderValue", DThemeWhiteSliderValue);
-        DThemeWhite.set("DSliderLabel", DThemeWhiteSliderLabel);
-        DThemeWhite.set("DSliderThumb", DThemeWhiteSliderThumb);
-        DThemeWhite.set("DSliderVertical", DThemeWhiteSliderVertical);
-        DThemeWhite.set("DSliderHorizontal", DThemeWhiteSliderHorizontal);
-        DThemeWhite.set("DSliderTrack", DThemeWhiteSliderTrack);
-        DThemeWhite.set("DSliderTrackVertical", DThemeWhiteSliderTrackVertical);
-        DThemeWhite.set("DSliderTrackHorizontal", DThemeWhiteSliderTrackHorizontal);
+    var loadThemeWhiteView = function () {
+        DThemeWhite.set("DView", DThemeWhiteView);
     };
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var loadThemeWhiteText = function () {
-        DThemeWhite.set("DText", DThemeWhiteText);
+    var loadThemeWhite = function () {
+        DThemes.setDefaultThemeClass(DThemeWhite);
     };
 
-    const DTableState = wcardinal.ui.DTableState;
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var DThemeWhiteTableBodyCellTrees = /** @class */ (function () {
-        function DThemeWhiteTableBodyCellTrees() {
-        }
-        DThemeWhiteTableBodyCellTrees.init = function () {
-            DThemeWhiteExpandables.init();
-        };
-        DThemeWhiteTableBodyCellTrees.getImageSource = function (state) {
-            if (state.is(DTableState.HAS_CHILDREN)) {
-                if (state.is(DTableState.OPENED)) {
-                    return DThemeWhiteExpandables.getImageOpened();
-                }
-                else {
-                    return DThemeWhiteExpandables.getImageClosed();
-                }
-            }
-            return null;
-        };
-        return DThemeWhiteTableBodyCellTrees;
-    }());
-
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    DThemeWhiteTableBodyCellTrees.init();
-    var DThemeWhiteTreeItems = /** @class */ (function (_super) {
-        __extends(DThemeWhiteTreeItems, _super);
-        function DThemeWhiteTreeItems() {
+    // 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>");
+    /* eslint-enable prettier/prettier */
+    var formatter$8 = function (colorAndAlpha) {
+        return "#".concat(UtilRgb.toCode(colorAndAlpha.color), " A").concat(colorAndAlpha.alpha.toFixed(2));
+    };
+    var DThemeWhiteButtonColor = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonColor, _super);
+        function DThemeWhiteButtonColor() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteTreeItems.prototype.getSecondaryImageSource = function (state) {
-            return DThemeWhiteTableBodyCellTrees.getImageSource(state);
-        };
-        DThemeWhiteTreeItems.prototype.getSecondaryImageTintColor = function (state) {
-            return this.getColor(state);
+        DThemeWhiteButtonColor.prototype.getImageTintColor = function (state) {
+            return null;
         };
-        DThemeWhiteTreeItems.prototype.getSecondaryImageTintAlpha = function (state) {
-            return this.getAlpha(state) * 0.5;
+        DThemeWhiteButtonColor.prototype.getImageSource = function (state) {
+            return DThemeWhiteAtlas.mappings.button_color_sample;
         };
-        DThemeWhiteTreeItems.prototype.getSecondaryImageAlignWith = function () {
-            return DAlignWith.PADDING;
+        DThemeWhiteButtonColor.prototype.getTextFormatter = function () {
+            return formatter$8;
         };
-        DThemeWhiteTreeItems.prototype.getSecondaryImageMarginHorizontal = function () {
-            return -19;
+        DThemeWhiteButtonColor.prototype.newTextValue = function () {
+            return {
+                color: 0xffffff,
+                alpha: 1
+            };
         };
-        return DThemeWhiteTreeItems;
-    }(DThemeWhiteListItems));
+        return DThemeWhiteButtonColor;
+    }(DThemeWhiteButton));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteTree = /** @class */ (function (_super) {
-        __extends(DThemeWhiteTree, _super);
-        function DThemeWhiteTree() {
-            var _this = _super.call(this) || this;
-            _this._style = _this.newStyle();
-            return _this;
+    var DThemeWhiteDialogColor = /** @class */ (function (_super) {
+        __extends(DThemeWhiteDialogColor, _super);
+        function DThemeWhiteDialogColor() {
+            return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteTree.prototype.newStyle = function () {
-            return new DThemeWhiteTreeItems(null, true, false);
-        };
-        DThemeWhiteTree.prototype.getBackgroundColor = function (state) {
-            return DThemeWhiteConstants.BACKGROUND_COLOR_ON_BOARD;
-        };
-        return DThemeWhiteTree;
-    }(DThemeWhitePane));
+        return DThemeWhiteDialogColor;
+    }(DThemeWhiteDialogFitted));
+
+    const DColorType = wcardinal.ui.DColorType;
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteTreeItemText = /** @class */ (function (_super) {
-        __extends(DThemeWhiteTreeItemText, _super);
-        function DThemeWhiteTreeItemText() {
-            var _this = _super.call(this) || this;
-            _this._style = _this.newStyle();
-            return _this;
+    var makeCheckerboard = 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, "\" />");
+            }
         }
-        DThemeWhiteTreeItemText.prototype.newStyle = function () {
-            return new DThemeWhiteTreeItems(null, true, false);
+        result += "</g>";
+        return result;
+    };
+    /* eslint-disable prettier/prettier */
+    DThemeWhiteAtlas.add("picker_color_main", 236, 164, "<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\"/>" +
+        "</linearGradient>" +
+        "<linearGradient id=\"2rfcfe9874bw\" x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">" +
+        "<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(26, 2));
+    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\"/>" +
+        "<stop stop-color=\"#FFFFFF\" stop-opacity=\"1\" offset=\"1\"/>" +
+        "</linearGradient>" +
+        "<rect x=\"0\" y=\"0\" width=\"234\" height=\"18\" fill=\"url(#s48afbuh44)\" />" +
+        "</g>");
+    DThemeWhiteAtlas.add("picker_color_base", 234, 18, "<g>" +
+        "<linearGradient id=\"ni2rbisdf3\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">" +
+        "<stop stop-color=\"#FF0000\" offset=\"0\"/>" +
+        "<stop stop-color=\"#FFFF00\" offset=\"0.167\"/>" +
+        "<stop stop-color=\"#00FF00\" offset=\"0.333\"/>" +
+        "<stop stop-color=\"#00FFFF\" offset=\"0.5\"/>" +
+        "<stop stop-color=\"#0000FF\" offset=\"0.667\"/>" +
+        "<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)\" />" +
+        "</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(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(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_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\" />" +
+        "<circle cx=\"14.1\" cy=\"14.1\" r=\"7.2\" stroke=\"#5f5f5f\" stroke-width=\"2.4\" fill=\"none\" />");
+    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>");
+    /* eslint-enable prettier/prettier */
+    var DThemeWhitePickerColor = /** @class */ (function (_super) {
+        __extends(DThemeWhitePickerColor, _super);
+        function DThemeWhitePickerColor() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DThemeWhitePickerColor.prototype.getMainWidth = function () {
+            return 234;
+        };
+        DThemeWhitePickerColor.prototype.getMainHeight = function () {
+            return 162;
+        };
+        DThemeWhitePickerColor.prototype.getMainTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_main;
+        };
+        DThemeWhitePickerColor.prototype.getMainBaseTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_main_base;
+        };
+        DThemeWhitePickerColor.prototype.getMainPointerTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_pointer;
+        };
+        DThemeWhitePickerColor.prototype.getMainPointerColor = function () {
+            return 0xffffff;
+        };
+        DThemeWhitePickerColor.prototype.getMainPointerAlpha = function () {
+            return 1;
+        };
+        DThemeWhitePickerColor.prototype.getBaseHeight = function () {
+            return 18;
+        };
+        DThemeWhitePickerColor.prototype.getBaseMargin = function () {
+            return 6;
+        };
+        DThemeWhitePickerColor.prototype.getBaseTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_base;
+        };
+        DThemeWhitePickerColor.prototype.getBasePointerTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_base_pointer;
+        };
+        DThemeWhitePickerColor.prototype.getBasePointerColor = function () {
+            return 0xffffff;
+        };
+        DThemeWhitePickerColor.prototype.getBasePointerAlpha = function () {
+            return this.getMainPointerAlpha();
+        };
+        DThemeWhitePickerColor.prototype.getAlphaHeight = function () {
+            return this.getBaseHeight();
+        };
+        DThemeWhitePickerColor.prototype.getAlphaMargin = function () {
+            return this.getBaseMargin();
+        };
+        DThemeWhitePickerColor.prototype.getAlphaTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_alpha;
+        };
+        DThemeWhitePickerColor.prototype.getAlphaCheckerboardTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_alpha_checkerboard;
+        };
+        DThemeWhitePickerColor.prototype.getAlphaPointerTexture = function () {
+            return this.getBasePointerTexture();
+        };
+        DThemeWhitePickerColor.prototype.getAlphaPointerColor = function () {
+            return this.getBasePointerColor();
+        };
+        DThemeWhitePickerColor.prototype.getAlphaPointerAlpha = function () {
+            return this.getMainPointerAlpha();
+        };
+        DThemeWhitePickerColor.prototype.getRecentMargin = function () {
+            return this.getBaseMargin();
+        };
+        DThemeWhitePickerColor.prototype.getRecentColorWidth = function () {
+            return this.getBaseHeight();
+        };
+        DThemeWhitePickerColor.prototype.getRecentColorHeight = function () {
+            return this.getRecentColorWidth();
         };
-        DThemeWhiteTreeItemText.prototype.getBackgroundColor = function (state) {
-            return this._style.getBackgroundColor(state);
+        DThemeWhitePickerColor.prototype.getRecentColorMargin = function () {
+            return this.getRecentMargin();
         };
-        DThemeWhiteTreeItemText.prototype.getBackgroundAlpha = function (state) {
-            return this._style.getBackgroundAlpha(state);
+        DThemeWhitePickerColor.prototype.getRecentColorCount = function () {
+            return 10;
         };
-        DThemeWhiteTreeItemText.prototype.getBorderColor = function (state) {
-            return this._style.getBorderColor(state);
+        DThemeWhitePickerColor.prototype.getRecentCheckerboardTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_recent_checkerboard;
         };
-        DThemeWhiteTreeItemText.prototype.getBorderMask = function (state) {
-            return this._style.getBorderMask(state);
+        DThemeWhitePickerColor.prototype.getRecentTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_recent;
         };
-        DThemeWhiteTreeItemText.prototype.getColor = function (state) {
-            return this._style.getColor(state);
+        DThemeWhitePickerColor.prototype.getInputMargin = function () {
+            return this.getBaseMargin();
         };
-        DThemeWhiteTreeItemText.prototype.getAlpha = function (state) {
-            return this._style.getAlpha(state);
+        DThemeWhitePickerColor.prototype.getInputLabelWidth = function () {
+            return 15;
         };
-        DThemeWhiteTreeItemText.prototype.getHeight = function () {
-            return this._style.getHeight();
+        DThemeWhitePickerColor.prototype.getSampleCheckerboardOldTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_sample_checkerboard;
         };
-        DThemeWhiteTreeItemText.prototype.getCornerMask = function () {
-            return this._style.getCornerMask();
+        DThemeWhitePickerColor.prototype.getSampleCheckerboardNewTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_sample_checkerboard;
         };
-        DThemeWhiteTreeItemText.prototype.getImageTintColor = function (state) {
-            return this._style.getImageTintColor(state);
+        DThemeWhitePickerColor.prototype.getSampleOldTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_sample;
         };
-        DThemeWhiteTreeItemText.prototype.getCursor = function (state) {
-            return this._style.getCursor(state);
+        DThemeWhitePickerColor.prototype.getSampleNewTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_sample;
         };
-        DThemeWhiteTreeItemText.prototype.getPaddingLeft = function () {
-            return 10;
+        DThemeWhitePickerColor.prototype.getStandardColorCount = function () {
+            return 80;
         };
-        DThemeWhiteTreeItemText.prototype.getPaddingRight = function () {
-            return 10;
+        DThemeWhitePickerColor.prototype.getStandardColorWidth = function () {
+            return this.getBaseHeight();
         };
-        DThemeWhiteTreeItemText.prototype.newTextValue = function () {
-            return undefined;
+        DThemeWhitePickerColor.prototype.getStandardColorHeight = function () {
+            return this.getStandardColorWidth();
         };
-        DThemeWhiteTreeItemText.prototype.getWidth = function () {
-            return "padding";
+        DThemeWhitePickerColor.prototype.getStandardColorMargin = function () {
+            return this.getBaseMargin();
         };
-        DThemeWhiteTreeItemText.prototype.getLevelPadding = function (level) {
-            return 24 + level * 20 - this.getPaddingLeft();
+        DThemeWhitePickerColor.prototype.getStandardTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_standard;
         };
-        DThemeWhiteTreeItemText.prototype.newState = function (state) {
+        DThemeWhitePickerColor.prototype.getBackgroundColor = function (state) {
+            return null;
+        };
+        DThemeWhitePickerColor.prototype.getBorderColor = function (state) {
+            return null;
+        };
+        DThemeWhitePickerColor.prototype.getInteractive = function () {
+            return DBaseInteractive.CHILDREN;
+        };
+        DThemeWhitePickerColor.prototype.newState = function (state) {
             _super.prototype.newState.call(this, state);
-            state.isDisabled = true;
+            state.isFocusable = false;
         };
-        return DThemeWhiteTreeItemText;
-    }(DThemeWhiteImageBase));
+        return DThemeWhitePickerColor;
+    }(DThemeWhiteBase));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteTreeItemButton = /** @class */ (function (_super) {
-        __extends(DThemeWhiteTreeItemButton, _super);
-        function DThemeWhiteTreeItemButton() {
+    var DThemeWhiteEnUsPickerColor = /** @class */ (function (_super) {
+        __extends(DThemeWhiteEnUsPickerColor, _super);
+        function DThemeWhiteEnUsPickerColor() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteTreeItemButton.prototype.getCursor = function (state) {
-            if (!state.isActionable) {
-                return "";
+        DThemeWhiteEnUsPickerColor.prototype.toColorTypeLabel = function (type) {
+            switch (type) {
+                case DColorType.STANDARD:
+                    return "Standard";
+                case DColorType.CUSTOM:
+                    return "Custom";
             }
-            return "pointer";
         };
-        return DThemeWhiteTreeItemButton;
-    }(DThemeWhiteTreeItemText));
+        return DThemeWhiteEnUsPickerColor;
+    }(DThemeWhitePickerColor));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    DThemeWhiteTableBodyCellTrees.init();
-    var DThemeWhiteTreeItemNonEditable = /** @class */ (function (_super) {
-        __extends(DThemeWhiteTreeItemNonEditable, _super);
-        function DThemeWhiteTreeItemNonEditable() {
+    var loadThemeWhiteEnUsPickerColor = function () {
+        DThemeWhite.set("DPickerColor", DThemeWhiteEnUsPickerColor);
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteEnUsDialogColor = function () {
+        DThemeWhite.set("DDialogColor", DThemeWhiteDialogColor);
+        loadThemeWhiteEnUsPickerColor();
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteEnUsButtonColor = function () {
+        DThemeWhite.set("DButtonColor", DThemeWhiteButtonColor);
+        loadThemeWhiteEnUsDialogColor();
+    };
+
+    const DColorGradientObservable = wcardinal.ui.DColorGradientObservable;
+
+    /*
+     * 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>");
+    /* eslint-enable prettier/prettier */
+    var formatter$7 = function () {
+        return "";
+    };
+    var DThemeWhiteButtonColorGradient = /** @class */ (function (_super) {
+        __extends(DThemeWhiteButtonColorGradient, _super);
+        function DThemeWhiteButtonColorGradient() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageSource = function (state) {
-            return this._style.getSecondaryImageSource(state);
-        };
-        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageTintColor = function (state) {
-            return this._style.getSecondaryImageTintColor(state);
+        DThemeWhiteButtonColorGradient.prototype.getViewBaseTexture = function () {
+            return DThemeWhiteAtlas.mappings.button_color_gradient_sample;
         };
-        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageTintAlpha = function (state) {
-            return this._style.getSecondaryImageTintAlpha(state);
+        DThemeWhiteButtonColorGradient.prototype.getTextFormatter = function () {
+            return formatter$7;
         };
-        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageAlignWith = function () {
-            return this._style.getSecondaryImageAlignWith();
+        DThemeWhiteButtonColorGradient.prototype.newTextValue = function () {
+            return new DColorGradientObservable();
         };
-        DThemeWhiteTreeItemNonEditable.prototype.getSecondaryImageMarginHorizontal = function () {
-            return this._style.getSecondaryImageMarginHorizontal();
+        DThemeWhiteButtonColorGradient.prototype.getCheckerColors = function () {
+            return [0.75, 0.65];
         };
-        return DThemeWhiteTreeItemNonEditable;
-    }(DThemeWhiteTreeItemButton));
+        return DThemeWhiteButtonColorGradient;
+    }(DThemeWhiteButton));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var loadThemeWhiteTree = function () {
-        DThemeWhite.set("DTree", DThemeWhiteTree);
-        DThemeWhite.set("DTreeItemText", DThemeWhiteTreeItemText);
-        DThemeWhite.set("DTreeItemButton", DThemeWhiteTreeItemButton);
-        DThemeWhite.set("DTreeItemNonEditable", DThemeWhiteTreeItemNonEditable);
-    };
-
-    const UtilGestureModifier = wcardinal.ui.UtilGestureModifier;
+    var DThemeWhiteDialogColorGradient = /** @class */ (function (_super) {
+        __extends(DThemeWhiteDialogColorGradient, _super);
+        function DThemeWhiteDialogColorGradient() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        return DThemeWhiteDialogColorGradient;
+    }(DThemeWhiteDialogFitted));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DThemeWhiteView = /** @class */ (function () {
-        function DThemeWhiteView() {
+    var DThemeWhitePickerColorGradient = /** @class */ (function (_super) {
+        __extends(DThemeWhitePickerColorGradient, _super);
+        function DThemeWhitePickerColorGradient() {
+            return _super !== null && _super.apply(this, arguments) || this;
         }
-        DThemeWhiteView.prototype.isWheelZoomEnabled = function () {
-            return true;
+        DThemeWhitePickerColorGradient.prototype.getGradientPointsWidth = function () {
+            return 30;
         };
-        DThemeWhiteView.prototype.getWheelZoomSpeed = function () {
-            return 0.004;
+        DThemeWhitePickerColorGradient.prototype.getGradientPointsMargin = function () {
+            return 24;
         };
-        DThemeWhiteView.prototype.getWheelZoomModifier = function () {
-            return UtilGestureModifier.NOT_NONE;
+        DThemeWhitePickerColorGradient.prototype.getGradientAnchorTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_anchor;
         };
-        DThemeWhiteView.prototype.isWheelTranslationEnabled = function () {
-            return true;
+        DThemeWhitePickerColorGradient.prototype.getGradientAnchorOutlinedTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_anchor_outlined;
         };
-        DThemeWhiteView.prototype.getWheelTranslationSpeed = function () {
-            return 14 * 0.16;
+        DThemeWhitePickerColorGradient.prototype.getGradientAnchorOutlineTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_anchor_outline;
         };
-        DThemeWhiteView.prototype.getWheelTranslationModifier = function () {
-            return UtilGestureModifier.NONE;
+        DThemeWhitePickerColorGradient.prototype.getGradientDirectionMargin = function () {
+            return 5;
         };
-        DThemeWhiteView.prototype.isDblClickZoomEnabled = function () {
-            return true;
+        DThemeWhitePickerColorGradient.prototype.getGradientDirectionTexture = function () {
+            return DThemeWhiteAtlas.mappings.picker_color_direction;
         };
-        DThemeWhiteView.prototype.getDblClickZoomSpeed = function () {
-            return 2;
+        DThemeWhitePickerColorGradient.prototype.getGradientRecentColumn = function () {
+            return 4;
         };
-        DThemeWhiteView.prototype.getDblClickZoomModifier = function () {
-            return UtilGestureModifier.NONE;
+        DThemeWhitePickerColorGradient.prototype.getGradientRecentWidth = function () {
+            return 30;
         };
-        DThemeWhiteView.prototype.getDblClickZoomDuration = function () {
-            return 333;
+        DThemeWhitePickerColorGradient.prototype.getGradientRecentMargin = function () {
+            return 5;
         };
-        DThemeWhiteView.prototype.getZoomMin = function () {
-            return 0.01;
+        DThemeWhitePickerColorGradient.prototype.getGradientRecentCount = function () {
+            return 16;
         };
-        DThemeWhiteView.prototype.getZoomMax = function () {
-            return 100;
+        DThemeWhitePickerColorGradient.prototype.getGradientRecents = function () {
+            return [];
         };
-        DThemeWhiteView.prototype.getZoomKeepRatio = function () {
-            return true;
+        DThemeWhitePickerColorGradient.prototype.getGradientCheckerColors = function () {
+            return [0.75, 0.65];
         };
-        DThemeWhiteView.prototype.getGestureMode = function () {
-            return UtilGestureMode.ON;
+        DThemeWhitePickerColorGradient.prototype.getBackgroundColor = function (state) {
+            return null;
         };
-        DThemeWhiteView.prototype.getGestureModifier = function () {
-            return UtilGestureModifier.NONE;
+        DThemeWhitePickerColorGradient.prototype.getBorderColor = function (state) {
+            return null;
         };
-        DThemeWhiteView.prototype.getGestureDuration = function () {
-            return 1;
+        DThemeWhitePickerColorGradient.prototype.getInteractive = function () {
+            return DBaseInteractive.CHILDREN;
         };
-        return DThemeWhiteView;
-    }());
+        DThemeWhitePickerColorGradient.prototype.newState = function (state) {
+            _super.prototype.newState.call(this, state);
+            state.isFocusable = false;
+        };
+        return DThemeWhitePickerColorGradient;
+    }(DThemeWhiteBase));
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var loadThemeWhiteView = function () {
-        DThemeWhite.set("DView", DThemeWhiteView);
+    var loadThemeWhiteEnUsPickerColorGradient = function () {
+        DThemeWhite.set("DPickerColorGradient", DThemeWhitePickerColorGradient);
+        loadThemeWhiteEnUsPickerColor();
     };
 
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var loadThemeWhite = function () {
-        DThemes.setDefaultThemeClass(DThemeWhite);
+    var loadThemeWhiteEnUsDialogColorGradient = function () {
+        DThemeWhite.set("DDialogColorGradient", DThemeWhiteDialogColorGradient);
+        loadThemeWhiteEnUsPickerColorGradient();
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var loadThemeWhiteEnUsButtonColorGradient = function () {
+        DThemeWhite.set("DButtonColorGradient", DThemeWhiteButtonColorGradient);
+        loadThemeWhiteEnUsDialogColorGradient();
     };
 
     const DPickerDates = wcardinal.ui.DPickerDates;
@@ -7123,8 +7145,8 @@
         loadThemeWhiteButtonAmbient();
         loadThemeWhiteButtonCheckRight();
         loadThemeWhiteButtonCheck();
-        loadThemeWhiteButtonColorGradient();
-        loadThemeWhiteButtonColor();
+        loadThemeWhiteEnUsButtonColorGradient();
+        loadThemeWhiteEnUsButtonColor();
         loadThemeWhiteEnUsButtonSelect();
         loadThemeWhiteButtonDanger();
         loadThemeWhiteEnUsButtonDate();
@@ -7764,8 +7786,8 @@
      * SPDX-License-Identifier: Apache-2.0
      */
     var loadThemeWhiteEnUsDialogAll = function () {
-        loadThemeWhiteDialogColorGradient();
-        loadThemeWhiteDialogColor();
+        loadThemeWhiteEnUsDialogColorGradient();
+        loadThemeWhiteEnUsDialogColor();
         loadThemeWhiteEnUsDialogConfirmDelete();
         loadThemeWhiteEnUsDialogConfirmDiscard();
         loadThemeWhiteEnUsDialogConfirm();
@@ -9583,7 +9605,7 @@
         DThemeWhite.set("DTableRow", DThemeWhiteTableRow);
         DThemeWhite.set("DTable", DThemeWhiteTable);
         loadThemeWhiteButtonCheck();
-        loadThemeWhiteButtonColor();
+        loadThemeWhiteEnUsButtonColor();
         loadThemeWhiteEnUsButtonDate();
         loadThemeWhiteEnUsButtonDatetime();
         loadThemeWhiteInputInteger();
@@ -9624,8 +9646,8 @@
         loadThemeWhiteEnUsNote();
         loadThemeWhitePane();
         loadThemeWhitePagination();
-        loadThemeWhitePickerColorGradient();
-        loadThemeWhitePickerColor();
+        loadThemeWhiteEnUsPickerColorGradient();
+        loadThemeWhiteEnUsPickerColor();
         loadThemeWhiteEnUsPickerDate();
         loadThemeWhiteEnUsPickerDatetime();
         loadThemeWhiteEnUsPickerTime();
@@ -9659,8 +9681,6 @@
         loadThemeWhiteButtonAmbient: loadThemeWhiteButtonAmbient,
         loadThemeWhiteButtonCheckRight: loadThemeWhiteButtonCheckRight,
         loadThemeWhiteButtonCheck: loadThemeWhiteButtonCheck,
-        loadThemeWhiteButtonColorGradient: loadThemeWhiteButtonColorGradient,
-        loadThemeWhiteButtonColor: loadThemeWhiteButtonColor,
         loadThemeWhiteButtonDanger: loadThemeWhiteButtonDanger,
         loadThemeWhiteButtonFile: loadThemeWhiteButtonFile,
         loadThemeWhiteButtonLink: loadThemeWhiteButtonLink,
@@ -9673,8 +9693,6 @@
         loadThemeWhiteChart: loadThemeWhiteChart,
         loadThemeWhiteColor: loadThemeWhiteColor,
         loadThemeWhiteDiagram: loadThemeWhiteDiagram,
-        loadThemeWhiteDialogColorGradient: loadThemeWhiteDialogColorGradient,
-        loadThemeWhiteDialogColor: loadThemeWhiteDialogColor,
         loadThemeWhiteDialogFitted: loadThemeWhiteDialogFitted,
         loadThemeWhiteDialogInputBoolean: loadThemeWhiteDialogInputBoolean,
         loadThemeWhiteDialogInputInteger: loadThemeWhiteDialogInputInteger,
@@ -9699,8 +9717,6 @@
         loadThemeWhiteMenu: loadThemeWhiteMenu,
         loadThemeWhitePagination: loadThemeWhitePagination,
         loadThemeWhitePane: loadThemeWhitePane,
-        loadThemeWhitePickerColorGradient: loadThemeWhitePickerColorGradient,
-        loadThemeWhitePickerColor: loadThemeWhitePickerColor,
         loadThemeWhiteScrollBar: loadThemeWhiteScrollBar,
         loadThemeWhiteSelect: loadThemeWhiteSelect,
         loadThemeWhiteShapeActionValue: loadThemeWhiteShapeActionValue,
@@ -9712,12 +9728,16 @@
         loadThemeWhite: loadThemeWhite,
         loadThemeWhiteEnUsAll: loadThemeWhiteEnUsAll,
         loadThemeWhiteEnUsButtonAll: loadThemeWhiteEnUsButtonAll,
+        loadThemeWhiteEnUsButtonColorGradient: loadThemeWhiteEnUsButtonColorGradient,
+        loadThemeWhiteEnUsButtonColor: loadThemeWhiteEnUsButtonColor,
         loadThemeWhiteEnUsButtonDate: loadThemeWhiteEnUsButtonDate,
         loadThemeWhiteEnUsButtonDatetime: loadThemeWhiteEnUsButtonDatetime,
         loadThemeWhiteEnUsButtonSelect: loadThemeWhiteEnUsButtonSelect,
         loadThemeWhiteEnUsButtonTime: loadThemeWhiteEnUsButtonTime,
         loadThemeWhiteEnUsDiagramEditor: loadThemeWhiteEnUsDiagramEditor,
         loadThemeWhiteEnUsDialogAll: loadThemeWhiteEnUsDialogAll,
+        loadThemeWhiteEnUsDialogColorGradient: loadThemeWhiteEnUsDialogColorGradient,
+        loadThemeWhiteEnUsDialogColor: loadThemeWhiteEnUsDialogColor,
         loadThemeWhiteEnUsDialogConfirmDelete: loadThemeWhiteEnUsDialogConfirmDelete,
         loadThemeWhiteEnUsDialogConfirmDiscard: loadThemeWhiteEnUsDialogConfirmDiscard,
         loadThemeWhiteEnUsDialogConfirm: loadThemeWhiteEnUsDialogConfirm,
@@ -9733,6 +9753,8 @@
         loadThemeWhiteEnUsInputBoolean: loadThemeWhiteEnUsInputBoolean,
         loadThemeWhiteEnUsLink: loadThemeWhiteEnUsLink,
         loadThemeWhiteEnUsNote: loadThemeWhiteEnUsNote,
+        loadThemeWhiteEnUsPickerColorGradient: loadThemeWhiteEnUsPickerColorGradient,
+        loadThemeWhiteEnUsPickerColor: loadThemeWhiteEnUsPickerColor,
         loadThemeWhiteEnUsPickerDate: loadThemeWhiteEnUsPickerDate,
         loadThemeWhiteEnUsPickerDatetime: loadThemeWhiteEnUsPickerDatetime,
         loadThemeWhiteEnUsPickerTime: loadThemeWhiteEnUsPickerTime,
@@ -9984,6 +10006,7 @@
         DThemeWhiteEnUsNoteError: DThemeWhiteEnUsNoteError,
         DThemeWhiteEnUsNoteNoItemsFound: DThemeWhiteEnUsNoteNoItemsFound,
         DThemeWhiteEnUsNoteSearching: DThemeWhiteEnUsNoteSearching,
+        DThemeWhiteEnUsPickerColor: DThemeWhiteEnUsPickerColor,
         DThemeWhiteEnUsPickerDate: DThemeWhiteEnUsPickerDate,
         DThemeWhiteEnUsPickerDatetime: DThemeWhiteEnUsPickerDatetime,
         DThemeWhiteEnUsPickerTime: DThemeWhiteEnUsPickerTime