@jetbrains/ring-ui 5.1.1 → 6.0.1-beta.0

package/dist/i18n/i18n-context.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { type Messages } from './i18n';
+export interface I18nContextProps {
+    translate(key: keyof Messages): string;
+    messages: Messages;
+}
+export declare const I18nContext: React.Context<I18nContextProps>;
+interface I18nContextHolderProps {
+    messages: Messages;
+    children?: React.ReactNode;
+}
+export declare const I18nContextHolder: React.FC<I18nContextHolderProps>;
+export {};

package/dist/i18n/i18n-context.js

@@ -0,0 +1,28 @@
+import React, { useEffect } from 'react';
+import { getTranslations, translate, setTranslations } from './i18n.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.set.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+
+var I18nContext = /*#__PURE__*/React.createContext({
+  messages: getTranslations(),
+  translate: translate
+});
+var I18nContextHolder = function I18nContextHolder(_ref) {
+  var children = _ref.children,
+    messages = _ref.messages;
+  useEffect(function () {
+    setTranslations(messages);
+  }, [messages]);
+  return /*#__PURE__*/React.createElement(I18nContext.Provider, {
+    value: {
+      messages: messages,
+      translate: translate
+    }
+  }, children);
+};
+
+export { I18nContext, I18nContextHolder };

package/dist/i18n/i18n.d.ts

@@ -0,0 +1,59 @@
+import defaultMessages from './messages.json';
+export type MessagesStrict = typeof defaultMessages;
+export type Messages = Partial<MessagesStrict>;
+export declare function setTranslations(newMessages: Messages): void;
+export declare function getTranslations(): Partial<{
+    login: string;
+    logout: string;
+    loginTo: string;
+    ok: string;
+    cancel: string;
+    tryAgainLabel: string;
+    postpone: string;
+    youHaveLoggedInAs: string;
+    applyChange: string;
+    backendIsNotAvailable: string;
+    checkAgain: string;
+    nothingHappensLink: string;
+    errorMessage: string;
+    applyChangedUser: string;
+    profile: string;
+    switchUser: string;
+    addFirstDate: string;
+    addSecondDate: string;
+    addTime: string;
+    selectName: string;
+    setDate: string;
+    setDateTime: string;
+    setPeriod: string;
+    clear: string;
+    gotIt: string;
+    dismiss: string;
+    perPage: string;
+    firstPage: string;
+    lastPage: string;
+    nextPage: string;
+    previousPage: string;
+    searchTitle: string;
+    clearTitle: string;
+    userAgreement: string;
+    accept: string;
+    decline: string;
+    close: string;
+    scrollToAccept: string;
+    remindLater: string;
+    filterItems: string;
+    selectOption: string;
+    progress: string;
+    loading: string;
+    noOptionsFound: string;
+    banned: string;
+    online: string;
+    offline: string;
+    copyToClipboard: string;
+    copiedToClipboard: string;
+    copingToClipboardError: string;
+    unverified: string;
+}>;
+export declare function getTranslationsWithFallback(): MessagesStrict;
+export declare function translate(key: keyof MessagesStrict): string;

package/dist/i18n/i18n.js

@@ -0,0 +1,140 @@
+import { g as _objectSpread2 } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.set.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+
+var login = "Log in";
+var logout = "Log out";
+var loginTo = "Log in to {{serviceName}}";
+var ok = "OK";
+var cancel = "Cancel";
+var tryAgainLabel = "Try again";
+var postpone = "Postpone";
+var youHaveLoggedInAs = "You have logged in as another user: {{userName}}";
+var applyChange = "Apply change";
+var backendIsNotAvailable = "Connection lost";
+var checkAgain = "try again";
+var nothingHappensLink = "Click here if nothing happens";
+var errorMessage = "There may be a problem with your network connection. Make sure that you are online and";
+var applyChangedUser = "Apply changed user";
+var profile = "Profile";
+var switchUser = "Switch user";
+var addFirstDate = "Add first date";
+var addSecondDate = "Add second date";
+var addTime = "Add time";
+var selectName = "Select {{name}}";
+var setDate = "Set a date";
+var setDateTime = "Set date and time";
+var setPeriod = "Set a period";
+var clear = "Clear input";
+var gotIt = "Got it";
+var dismiss = "Dismiss";
+var perPage = "per page";
+var firstPage = "First page";
+var lastPage = "Last page";
+var nextPage = "Next page";
+var previousPage = "Previous";
+var searchTitle = "Search";
+var clearTitle = "Clear search input";
+var userAgreement = "User Agreement";
+var accept = "Accept";
+var decline = "Decline";
+var close = "Close";
+var scrollToAccept = "View the entire agreement to continue";
+var remindLater = "Remind me later";
+var filterItems = "Filter items";
+var selectOption = "Select an option";
+var progress = "Progress";
+var loading = "Loading...";
+var noOptionsFound = "No options found";
+var banned = "banned";
+var online = "online";
+var offline = "offline";
+var copyToClipboard = "Copy email to clipboard";
+var copiedToClipboard = "Email was copied to clipboard";
+var copingToClipboardError = "Failed to copy to clipboard";
+var unverified = "Unverified";
+var defaultMessages = {
+	login: login,
+	logout: logout,
+	loginTo: loginTo,
+	ok: ok,
+	cancel: cancel,
+	tryAgainLabel: tryAgainLabel,
+	postpone: postpone,
+	youHaveLoggedInAs: youHaveLoggedInAs,
+	applyChange: applyChange,
+	backendIsNotAvailable: backendIsNotAvailable,
+	checkAgain: checkAgain,
+	nothingHappensLink: nothingHappensLink,
+	errorMessage: errorMessage,
+	applyChangedUser: applyChangedUser,
+	profile: profile,
+	switchUser: switchUser,
+	addFirstDate: addFirstDate,
+	addSecondDate: addSecondDate,
+	addTime: addTime,
+	selectName: selectName,
+	setDate: setDate,
+	setDateTime: setDateTime,
+	setPeriod: setPeriod,
+	clear: clear,
+	gotIt: gotIt,
+	dismiss: dismiss,
+	perPage: perPage,
+	firstPage: firstPage,
+	lastPage: lastPage,
+	nextPage: nextPage,
+	previousPage: previousPage,
+	searchTitle: searchTitle,
+	clearTitle: clearTitle,
+	userAgreement: userAgreement,
+	accept: accept,
+	decline: decline,
+	close: close,
+	scrollToAccept: scrollToAccept,
+	remindLater: remindLater,
+	filterItems: filterItems,
+	selectOption: selectOption,
+	progress: progress,
+	loading: loading,
+	noOptionsFound: noOptionsFound,
+	banned: banned,
+	online: online,
+	offline: offline,
+	copyToClipboard: copyToClipboard,
+	copiedToClipboard: copiedToClipboard,
+	copingToClipboardError: copingToClipboardError,
+	unverified: unverified
+};
+
+var messages = defaultMessages;
+var warned = new Set();
+function warnMissedKeyOnce(key) {
+  if (warned.has(key)) {
+    return;
+  }
+  warned.add(key);
+  // eslint-disable-next-line no-console
+  console.warn("Missing localisation for key \"".concat(key, "\""));
+}
+function setTranslations(newMessages) {
+  messages = newMessages;
+}
+function getTranslations() {
+  return messages;
+}
+function getTranslationsWithFallback() {
+  return _objectSpread2(_objectSpread2({}, defaultMessages), messages);
+}
+function translate(key) {
+  var _messages$key;
+  if (!(key in messages)) {
+    warnMissedKeyOnce(key);
+  }
+  return (_messages$key = messages[key]) !== null && _messages$key !== void 0 ? _messages$key : defaultMessages[key];
+}
+
+export { getTranslations, getTranslationsWithFallback, setTranslations, translate };

package/dist/icon/icon.d.ts

@@ -1,7 +1,7 @@
 /**
  * @name Icon
  */
-import { PureComponent, ComponentType, SVGAttributes, HTMLAttributes } from 'react';
+import React, { PureComponent, ComponentType, SVGAttributes, HTMLAttributes } from 'react';
 import PropTypes from 'prop-types';
 import { Color, Size } from './icon__constants';
 export type IconType = ComponentType<SVGAttributes<SVGSVGElement>>;
@@ -9,7 +9,7 @@ export interface IconProps extends HTMLAttributes<HTMLElement> {
     color: Color;
     glyph: string | IconType | null;
     height?: number | undefined;
-    size?: Size | null | undefined;
+    size?: Size | number | null | undefined;
     width?: number | undefined;
     loading?: boolean | null | undefined;
     suppressSizeWarning?: boolean | null | undefined;
@@ -37,7 +37,7 @@ export default class Icon extends PureComponent<IconProps> {
         width: number | undefined;
         height: number | undefined;
     } | undefined;
-    render(): JSX.Element | null;
+    render(): React.JSX.Element | null;
 }
 export type IconAttrs = JSX.LibraryManagedAttributes<typeof Icon, IconProps>;
 export { Color, Size };

package/dist/icon/icon.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty, a as _inherits, b as _createSuper, c as _classCallCheck, d as _createClass, e as _objectWithoutProperties, f as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -6,70 +6,88 @@ import deprecate from 'util-deprecate';
 import { Color, Size } from './icon__constants.js';
 import { m as modules_29747b80 } from '../_helpers/icon.js';
 import IconSVG from './icon__svg.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.starts-with.js';
 import '../global/memoize.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';
 
-const warnSize = deprecate(() => {}, `\`size\`, \`width\` and \`height\` props are not recommended to use in Ring UI \`Icon\` component. The intrinsic sizes of SVG icon (\`width\` and \`height\` SVG attributes) are used instead.
-
-We strongly recommend to use icons handcrafted for particular sizes. If your icon doesn't exist in the desired size, please ask your designer to draw one. "Responsive" checkmark should be unchecked when exporting icon.'`);
-class Icon extends PureComponent {
-  warnSize() {
-    if (this.props.suppressSizeWarning) {
-      return;
-    }
-    warnSize();
+var _excluded = ["className", "size", "color", "loading", "glyph", "width", "height", "suppressSizeWarning"];
+var _warnSize = deprecate(function () {}, "`size`, `width` and `height` props are not recommended to use in Ring UI `Icon` component. The intrinsic sizes of SVG icon (`width` and `height` SVG attributes) are used instead.\n\nWe strongly recommend to use icons handcrafted for particular sizes. If your icon doesn't exist in the desired size, please ask your designer to draw one. \"Responsive\" checkmark should be unchecked when exporting icon.'");
+var Icon = /*#__PURE__*/function (_PureComponent) {
+  _inherits(Icon, _PureComponent);
+  var _super = _createSuper(Icon);
+  function Icon() {
+    _classCallCheck(this, Icon);
+    return _super.apply(this, arguments);
   }
-  getStyle() {
-    const {
-      size,
-      width,
-      height
-    } = this.props;
-    if (width || height) {
-      this.warnSize();
-      return {
-        width,
-        height
-      };
+  _createClass(Icon, [{
+    key: "warnSize",
+    value: function warnSize() {
+      if (this.props.suppressSizeWarning) {
+        return;
+      }
+      _warnSize();
     }
-    if (size) {
-      this.warnSize();
-      return {
-        width: size,
-        height: size
-      };
+  }, {
+    key: "getStyle",
+    value: function getStyle() {
+      var _this$props = this.props,
+        size = _this$props.size,
+        width = _this$props.width,
+        height = _this$props.height;
+      if (width || height) {
+        this.warnSize();
+        return {
+          width: width,
+          height: height
+        };
+      }
+      if (size) {
+        this.warnSize();
+        return {
+          width: size,
+          height: size
+        };
+      }
+      return undefined;
     }
-    return undefined;
-  }
-  render() {
-    const {
-      className,
-      size,
-      color,
-      loading,
-      glyph: Glyph,
-      width,
-      height,
-      suppressSizeWarning,
-      ...restProps
-    } = this.props;
-    if (!Glyph) {
-      return null;
+  }, {
+    key: "render",
+    value: function render() {
+      var _classNames;
+      var _this$props2 = this.props,
+        className = _this$props2.className;
+        _this$props2.size;
+        var color = _this$props2.color,
+        loading = _this$props2.loading,
+        Glyph = _this$props2.glyph;
+        _this$props2.width;
+        _this$props2.height;
+        _this$props2.suppressSizeWarning;
+        var restProps = _objectWithoutProperties(_this$props2, _excluded);
+      if (!Glyph) {
+        return null;
+      }
+      var classes = classNames(modules_29747b80.icon, (_classNames = {}, _defineProperty(_classNames, modules_29747b80[color], !!color), _defineProperty(_classNames, modules_29747b80.loading, loading), _classNames), className);
+      return /*#__PURE__*/React.createElement("span", _extends({}, restProps, {
+        className: classes
+      }), typeof Glyph === 'string' ? /*#__PURE__*/React.createElement(IconSVG, {
+        src: Glyph,
+        style: this.getStyle()
+      }) : /*#__PURE__*/React.createElement(Glyph, {
+        className: modules_29747b80.glyph,
+        style: this.getStyle()
+      }));
     }
-    const classes = classNames(modules_29747b80.icon, {
-      [modules_29747b80[color]]: !!color,
-      [modules_29747b80.loading]: loading
-    }, className);
-    return /*#__PURE__*/React.createElement("span", _extends({}, restProps, {
-      className: classes
-    }), typeof Glyph === 'string' ? /*#__PURE__*/React.createElement(IconSVG, {
-      src: Glyph,
-      style: this.getStyle()
-    }) : /*#__PURE__*/React.createElement(Glyph, {
-      className: modules_29747b80.glyph,
-      style: this.getStyle()
-    }));
-  }
-}
+  }]);
+  return Icon;
+}(PureComponent);
 _defineProperty(Icon, "propTypes", {
   className: PropTypes.string,
   color: PropTypes.string,

package/dist/icon/icon__svg.d.ts

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 export interface IconSVGProps extends SVGAttributes<SVGSVGElement> {
     src: string;
 }
-declare function IconSVG({ src, className, ...rest }: IconSVGProps): JSX.Element;
+declare function IconSVG({ src, className, ...rest }: IconSVGProps): React.JSX.Element;
 declare namespace IconSVG {
     var propTypes: {
         className: PropTypes.Requireable<string>;

package/dist/icon/icon__svg.js

@@ -1,18 +1,30 @@
-import { a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import { e as _objectWithoutProperties, _ as _defineProperty, f as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.starts-with.js';
 import React, { memo } from 'react';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import memoize from '../global/memoize.js';
 import { m as modules_29747b80 } from '../_helpers/icon.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';
 
+var _excluded = ["src", "className"];
 function convertReactSVGDOMProperty(str) {
-  return str.replace(/[-|:]([a-z])/g, g => g[1].toUpperCase());
+  return str.replace(/[-|:]([a-z])/g, function (g) {
+    return g[1].toUpperCase();
+  });
 }
 function serializeAttrs(map) {
-  const res = {};
-  for (let i = 0; i < map.length; i++) {
-    const key = map[i].name;
-    let prop = key;
+  var res = {};
+  for (var i = 0; i < map.length; i++) {
+    var key = map[i].name;
+    var prop = key;
     if (key === 'class') {
       prop = 'className';
     } else if (!key.startsWith('data-')) {
@@ -23,13 +35,13 @@ function serializeAttrs(map) {
   return res;
 }
 function extractSVGProps(svgNode) {
-  const map = svgNode.attributes;
+  var map = svgNode.attributes;
   return map.length > 0 ? serializeAttrs(map) : null;
 }
-const getSVGFromSource = memoize(src => {
-  const svgContainer = document.createElement('div');
+var getSVGFromSource = memoize(function (src) {
+  var svgContainer = document.createElement('div');
   svgContainer.innerHTML = src;
-  const svg = svgContainer.firstElementChild;
+  var svg = svgContainer.firstElementChild;
   svg.remove ? svg.remove() : svgContainer.removeChild(svg);
   return {
     props: extractSVGProps(svg),
@@ -37,23 +49,18 @@ const getSVGFromSource = memoize(src => {
   };
 });
 function isCompatibilityMode(iconSrc) {
-  const hasWidth = /width="[\d\.]+"/ig.test(iconSrc);
-  const hasHeight = /height="[\d\.]+"/ig.test(iconSrc);
+  var hasWidth = /width="[\d\.]+"/ig.test(iconSrc);
+  var hasHeight = /height="[\d\.]+"/ig.test(iconSrc);
   return !hasWidth || !hasHeight;
 }
 function IconSVG(_ref) {
-  let {
-    src,
-    className,
-    ...rest
-  } = _ref;
-  const glyphClasses = classNames(modules_29747b80.glyph, {
-    [modules_29747b80.compatibilityMode]: isCompatibilityMode(src)
-  }, className);
-  const {
-    props,
-    html
-  } = getSVGFromSource(src);
+  var src = _ref.src,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var glyphClasses = classNames(modules_29747b80.glyph, _defineProperty({}, modules_29747b80.compatibilityMode, isCompatibilityMode(src)), className);
+  var _getSVGFromSource = getSVGFromSource(src),
+    props = _getSVGFromSource.props,
+    html = _getSVGFromSource.html;
   return /*#__PURE__*/React.createElement("svg", _extends({}, props, rest, {
     className: glyphClasses,
     dangerouslySetInnerHTML: {

package/dist/icon/index.js

@@ -7,4 +7,13 @@ import 'classnames';
 import 'util-deprecate';
 import '../_helpers/icon.js';
 import './icon__svg.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.starts-with.js';
 import '../global/memoize.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.string.iterator.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';

package/dist/icon-ng/icon-ng.js

@@ -1,16 +1,22 @@
+import { j as _slicedToArray } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.concat.js';
+import 'core-js/modules/es.array.index-of.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
 import angular from 'angular';
 import { Color } from '../icon/icon__constants.js';
 import RingTemplateNg from '../template-ng/template-ng.js';
 import { m as modules_29747b80 } from '../_helpers/icon.js';
-import '../_helpers/_rollupPluginBabelHelpers.js';
 import '../global/ring-angular-component.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/web.dom-collections.for-each.js';
 
 /**
  * @name Icon Ng
  */
 
-const angularModule = angular.module('Ring.icon', [RingTemplateNg]);
-const BASE64_PREFIX = 'data:image/svg+xml;base64,';
+var angularModule = angular.module('Ring.icon', [RingTemplateNg]);
+var BASE64_PREFIX = 'data:image/svg+xml;base64,';
 angularModule.directive('rgIcon', function rgIconDirective() {
   return {
     restrict: 'E',
@@ -22,15 +28,15 @@ angularModule.directive('rgIcon', function rgIconDirective() {
       height: '@?',
       width: '@?'
     },
-    template: `<span class="${modules_29747b80.icon}" rg-template="normalizedGlyph" rg-template-class="${modules_29747b80.glyph}"></span>`,
-    controller: ["$scope", $scope => {
+    template: "<span class=\"".concat(modules_29747b80.icon, "\" rg-template=\"normalizedGlyph\" rg-template-class=\"").concat(modules_29747b80.glyph, "\"></span>"),
+    controller: ["$scope", function controller($scope) {
       function decodeBase64IfNeeded(glyph) {
         // This hack allows passing SVG content as string from angular templates like
         // <rg-icon glyph="data:image/svg+xml;base64,PHN2ZyB4bWx...></rg-icon>
-        const isEncoded = glyph.indexOf(BASE64_PREFIX) === 0;
+        var isEncoded = glyph.indexOf(BASE64_PREFIX) === 0;
         return isEncoded ? window.atob(glyph.replace(BASE64_PREFIX, '')) : glyph;
       }
-      $scope.$watch('glyph', value => {
+      $scope.$watch('glyph', function (value) {
         if (!value) {
           return;
         }
@@ -40,14 +46,16 @@ angularModule.directive('rgIcon', function rgIconDirective() {
     link: function link(scope, iElement, iAttrs) {
       iAttrs.$addClass('ring-icon'); // TODO: We keep this class for now for compatibility reasons (styles overrides)
 
-      scope.$watch('loading', value => {
+      scope.$watch('loading', function (value) {
         if (value) {
           iAttrs.$addClass(modules_29747b80.loading);
         } else {
           iAttrs.$removeClass(modules_29747b80.loading);
         }
       });
-      scope.$watch(() => scope.color && Color[scope.color] && modules_29747b80[Color[scope.color]], (colorClass, prevColorClass) => {
+      scope.$watch(function () {
+        return scope.color && Color[scope.color] && modules_29747b80[Color[scope.color]];
+      }, function (colorClass, prevColorClass) {
         if (colorClass) {
           iAttrs.$addClass(colorClass);
 
@@ -57,23 +65,26 @@ angularModule.directive('rgIcon', function rgIconDirective() {
           }
         }
       });
-      scope.$watchGroup(['size', 'width', 'height'], _ref => {
-        let [size, width, height] = _ref;
-        const svgNode = iElement[0].querySelector('svg');
+      scope.$watchGroup(['size', 'width', 'height'], function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 3),
+          size = _ref2[0],
+          width = _ref2[1],
+          height = _ref2[2];
+        var svgNode = iElement[0].querySelector('svg');
         if (!svgNode) {
           return;
         }
         if (size && !width && !height) {
-          const sizeString = `${size}px`;
-          const style = `width: ${sizeString}; height: ${sizeString};`;
+          var sizeString = "".concat(size, "px");
+          var style = "width: ".concat(sizeString, "; height: ").concat(sizeString, ";");
           svgNode.setAttribute('style', style);
           return;
         }
         if (width) {
-          svgNode.setAttribute('style', `width: ${width}px;`);
+          svgNode.setAttribute('style', "width: ".concat(width, "px;"));
         }
         if (height) {
-          svgNode.setAttribute('style', `height: ${height}px;`);
+          svgNode.setAttribute('style', "height: ".concat(height, "px;"));
         }
       });
     }