@genexus/genexus-ide-ui 1.0.18 → 1.0.20

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genexus/genexus-ide-ui",
   "license": "Apache-2.0",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "description": "GeneXus IDE UI components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -33,14 +33,14 @@
     "validate.ci": "npm run build -- --max-workers 1 --debug"
   },
   "peerDependencies": {
+    "@genexus/chameleon-controls-library": ">=6.0.0-next.50",
     "@genexus/gemini": "*2.0.1",
-    "@genexus/chameleon-controls-library": ">=6.0.0-next.45",
-    "@genexus/mercury": "*0.9.6"
+    "@genexus/mercury": "*0.9.14"
   },
   "devDependencies": {
+    "@genexus/chameleon-controls-library": ">=6.0.0-next.50",
     "@genexus/gemini": "*2.0.1",
-    "@genexus/chameleon-controls-library": ">=6.0.0-next.45",
-    "@genexus/mercury": "*0.9.6",
+    "@genexus/mercury": "*0.9.14",
     "@stencil-community/eslint-plugin": "~0.7.1",
     "@stencil/core": "~4.9.0",
     "@stencil/sass": "~1.4.0",
@@ -57,5 +57,8 @@
     "prettier": "~2.7.0",
     "puppeteer": "~15.2.0",
     "typescript": "~5.2.0"
+  },
+  "dependencies": {
+    "date-fns": "^4.1.0"
   }
 }

package/dist/cjs/form-validation-df39cabb.js.map

@@ -1 +0,0 @@
-{"file":"form-validation-df39cabb.js","mappings":";;AAGA;MACa,oBAAoB,GAAG,CAClC,MAA+C,EAC/C,GAAQ;;IAER,MAAA,MAAM,CAAC,WAAW,0CAAE,OAAO,CAAC,OAAO;QACjC,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC;QACxB,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;QAChC,MAAM,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC;QAElC,MAAM,SAAS,GAAkB,GAAG,CAAC,GAAG,GAAG,IAAI,CAAC,CAAC;QACjD,IAAI,SAAS,IAAI,QAAQ,IAAI,OAAO,CAAC,IAAI,EAAE,EAAE;YAC3C,SAAS,CAAC,gBAAgB,GAAG,OAAO,CAAC;YACrC,SAAS,CAAC,iBAAiB,GAAG,OAAO,CAAC;SACvC;aAAM,IAAI,SAAS,IAAI,CAAC,QAAQ,EAAE;YACjC,SAAS,CAAC,gBAAgB,GAAG,eAAe,CAAC;YAC7C,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC;SACpC;KACF,CAAC,CAAC;AACL,EAAE;AAEF;AACA,MAAM,kCAAkC,GAAG;IACzC,aAAa,EAAE,gBAAgB;IAC/B,qBAAqB,EAAE,iBAAiB;IACxC,SAAS,EAAE,kBAAkB;CACrB,CAAC;AAEX,MAAM,gBAAgB,GAAG,CAAC,QAAiB,EAAE,OAAoB;IAC/D,MAAM,cAAc,GAAG,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;IACrD,MAAM,UAAU,GACd,kCAAkC,CAChC,cAAiE,CAClE,CAAC;IACJ,IAAI,QAAQ,EAAE;QACZ,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;KACnC;SAAM;QACL,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;KACtC;AACH,CAAC,CAAC;MAEW,gBAAgB,GAAG,CAC9B,gBAAkC,EAClC,mBAAmD;IAEnD,MAAM,0BAA0B,GAAG,IAAI,GAAG,CAAC,mBAAmB,CAAC,CAAC;IAChE,gBAAgB,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW;QAC9C,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,CAAC;QACjC,MAAM,aAAa,GAAG,WAAW,CAAC,QAAQ,CAAC;QAC3C,MAAM,gBAAgB,GAAG,0BAA0B,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAClE,IAAI,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,SAAS,EAAE;;YAE/B,gBAAgB,CAAC,aAAa,EAAE,gBAAgB,CAAC,SAAS,CAAC,CAAC;YAC5D,0BAA0B,CAAC,GAAG,CAAC,QAAQ,kCAClC,gBAAgB,KACnB,QAAQ,EAAE,aAAa,EACvB,OAAO,EAAE,WAAW,CAAC,OAAO,IAC5B,CAAC;SACJ;KACF,CAAC,CAAC;;IAEH,OAAO,0BAA0B,CAAC;AACpC;;;;;","names":[],"sources":["src/common/form-validation.ts"],"sourcesContent":["import { FormSubmitResult, ConnectionResultData } from \"../common/types\";\nimport { FormComponent } from \"@genexus/gemini/dist/types/common/interfaces\";\n\n// formSubmitValidation will be deprecated. use \"validateControls\" instead.\nexport const formSubmitValidation = (\n  result: FormSubmitResult | ConnectionResultData,\n  ref: any\n) => {\n  result.fieldErrors?.forEach(element => {\n    const key = element.key;\n    const message = element.message;\n    const hasError = element.hasError;\n\n    const reference: FormComponent = ref[`${key}El`];\n    if (reference && hasError && message.trim()) {\n      reference.validationStatus = \"error\";\n      reference.validationMessage = message;\n    } else if (reference && !hasError) {\n      reference.validationStatus = \"indeterminate\";\n      reference.validationMessage = null;\n    }\n  });\n};\n\n// TODO: Improve the way we mark components with error. We must not use error classes.\nconst formElementsErrorClassesDictionary = {\n  \"ch-checkbox\": \"checkbox-error\",\n  \"ch-combo-box-render\": \"combo-box-error\",\n  \"ch-edit\": \"form-input-error\"\n} as const;\n\nconst toggleErrorClass = (hasError: boolean, element: HTMLElement) => {\n  const elementTagName = element.tagName.toLowerCase();\n  const errorClass =\n    formElementsErrorClassesDictionary[\n      elementTagName as keyof typeof formElementsErrorClassesDictionary\n    ];\n  if (hasError) {\n    element.classList.add(errorClass);\n  } else {\n    element.classList.remove(errorClass);\n  }\n};\n\nexport const validateControls = (\n  formSubmitResult: FormSubmitResult,\n  validatableControls: Map<string, ControlValidation>\n): Map<string, ControlValidation> => {\n  const validatableControlsUpdated = new Map(validatableControls);\n  formSubmitResult.fieldErrors.forEach(fieldResult => {\n    const fieldKey = fieldResult.key;\n    const fieldHasError = fieldResult.hasError;\n    const controlMapRecord = validatableControlsUpdated.get(fieldKey);\n    if (controlMapRecord?.reference) {\n      // toggle class to add or remove error style\n      toggleErrorClass(fieldHasError, controlMapRecord.reference);\n      validatableControlsUpdated.set(fieldKey, {\n        ...controlMapRecord,\n        hasError: fieldHasError,\n        message: fieldResult.message\n      });\n    }\n  });\n  // return validatableControls updated.\n  return validatableControlsUpdated;\n};\n\nexport type ControlValidation = {\n  reference: HTMLElement;\n  hasError: boolean;\n  message: string;\n};\n"],"version":3}

package/dist/cjs/gx-ide-empty-state_2.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"gx-ide-empty-state.gx-ide-loader.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,kBAAkB,GAAG,gyZAAgyZ;;ACG3zZ,MAAMA,aAAW,GAAmB;IAClC,mBAAmB;IACnB,mBAAmB;IACnB,iBAAiB;IACjB,kBAAkB;CACnB,CAAC;MAOW,eAAe;;;0BAOa,KAAK;;;;;IAiB5C,MAAM;QACJ,QACEC,QAACC,UAAI,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,IACvCD,sBAAU,KAAK,EAAED,aAAW,GAAa,EACzCC,qBAAS,KAAK,EAAC,gBAAgB,IAC5B,IAAI,CAAC,YAAY,KAChBA,kBAAM,KAAK,EAAC,8BAA8B,IACxCA,sBAAU,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,KAAK,EAAC,SAAS,GAAY,CACxD,CACR,EACDA,iBAAK,KAAK,EAAC,yBAAyB,IACjC,IAAI,CAAC,UAAU,KACdA,gBAAI,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,UAAU,CAAM,CACvD,EACA,IAAI,CAAC,gBAAgB,KACpBA,eAAG,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,gBAAgB,CAAK,CAC3D,CACG,EACNA,qBAAa,CACL,CACL,EACP;KACH;;;;;AC7DH,MAAM,YAAY,GAAG,o+CAAo+C;;;;;;;;;;ACYz/C,MAAM,WAAW,GAAmB;IAClC,mBAAmB;IACnB,mBAAmB;IACnB,kBAAkB;CACnB,CAAC;MAMW,SAAS;;;;QACpB,8CAAiD;QA+CjD,mCAAiB;YACf,IAAI,IAAI,CAAC,cAAc,EAAE;gBACvB,IAAI,CAAC,cAAc,EAAE,CAAC;aACvB;YACD,YAAY,CAAC,uBAAA,IAAI,mCAAkB,CAAC,CAAC;YACrC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;SACnB,EAAC;QAEF,wCAAsB,MACpB,IAAI,CAAC,WAAW,KACdA,qBACEA,oBACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,uBAAA,IAAI,gCAAe,IAE3B,IAAI,CAAC,WAAW,CACV,CACL,CACP,EAAC;QAEJ,uCAAqB,MACnB,IAAI,CAAC,WAAW,IAAIA,eAAG,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,WAAW,CAAK,EAAC;QAE3E,iCAAe,MACb,IAAI,CAAC,WAAW,IAAIA,eAAG,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,WAAW,CAAK,EAAC;2BAnErD,IAAI;yBAKU,CAAC,GAAG,EAAE,GAAG,IAAI;;;;6BAoBS,KAAK;;oBAUhC,KAAK;;IAkCrC,MAAM;QACJ,QACEA,QAACC,UAAI,QACHD,sBAAU,KAAK,EAAE,WAAW,GAAa,EACxC,IAAI,CAAC,IAAI,KACRA,iBACE,KAAK,EAAE;gBACL,CAAC,iBAAiB,GAAG,IAAI;gBACzB,0BAA0B,EAAE,IAAI,CAAC,WAAW;aAC7C,EACD,IAAI,EAAC,gBAAgB,EACrB,OAAO,EAAC,EAAE,IAEVA,iBAAK,KAAK,EAAC,iBAAiB,GAAO,EACnCA,iBACE,KAAK,EAAE;gBACL,yBAAyB,EAAE,IAAI;gBAC/B,iCAAiC,EAC/B,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,WAAW;aAC9D,IAEA,uBAAA,IAAI,8BAAa,MAAjB,IAAI,CAAe,EACnB,uBAAA,IAAI,oCAAmB,MAAvB,IAAI,CAAqB,EACzB,uBAAA,IAAI,qCAAoB,MAAxB,IAAI,CAAsB,CACvB,CACF,CACP,CACI,EACP;KACH;;;;;;;;","names":["CSS_BUNDLES","h","Host"],"sources":["src/components/_helpers/empty-state/gx-ide-empty-state.scss?tag=gx-ide-empty-state&encapsulation=shadow","src/components/_helpers/empty-state/gx-ide-empty-state.tsx","src/components/_helpers/ide-loader/ide-loader.scss?tag=gx-ide-loader&encapsulation=shadow","src/components/_helpers/ide-loader/ide-loader.tsx"],"sourcesContent":["@import \"../../../global/gx-ide-common.scss\";\n\n:host {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  inline-size: 100%;\n  position: relative;\n}\n:host(.animate) {\n  animation: fadeIn var(--mer-timing--fast) forwards;\n  inset-block-start: 0;\n}\n.main-container {\n  max-width: 320px;\n  margin: 0 auto;\n  gap: var(--mer-spacing--md);\n  padding: var(--mer-spacing--md);\n\n  &__icon-wrapper {\n    border: var(--mer-border__width--sm) dashed var(--mer-accent__primary);\n    border-radius: 50%;\n    min-width: 40px;\n    min-height: 40px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    pointer-events: none;\n  }\n\n  &__content {\n    gap: var(--mer-spacing--sm);\n  }\n}\n.main-container,\n.main-container__content {\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n}\n\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n    inset-block-start: 5px;\n  }\n}\n","import { Component, Host, h, Prop, Element } from \"@stencil/core\";\nimport { MercuryBundles } from \"@genexus/mercury\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/typography\"\n];\n\n@Component({\n  tag: \"gx-ide-empty-state\",\n  styleUrl: \"gx-ide-empty-state.scss\",\n  shadow: true\n})\nexport class GxIdeEmptyState {\n  @Element() el: HTMLGxIdeEmptyStateElement;\n\n  /**\n   * Includes a subtle entry animation\n   */\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  @Prop() readonly isAnimated: boolean = false;\n\n  /**\n   * The state description\n   */\n  @Prop() readonly stateDescription?: string;\n\n  /**\n   * The state icon\n   */\n  @Prop() readonly stateIconSrc?: string;\n\n  /**\n   * The state title\n   */\n  @Prop() readonly stateTitle!: string;\n\n  render() {\n    return (\n      <Host class={{ animate: this.isAnimated }}>\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <article class=\"main-container\">\n          {this.stateIconSrc && (\n            <span class=\"main-container__icon-wrapper\">\n              <ch-image src={this.stateIconSrc} class=\"icon-md\"></ch-image>\n            </span>\n          )}\n          <div class=\"main-container__content\">\n            {this.stateTitle && (\n              <h2 class=\"text-body-regular-m\">{this.stateTitle}</h2>\n            )}\n            {this.stateDescription && (\n              <p class=\"text-body-regular-s\">{this.stateDescription}</p>\n            )}\n          </div>\n          <slot></slot>\n        </article>\n      </Host>\n    );\n  }\n}\n",".loader {\n  &__wrapper {\n    position: absolute;\n    border: none;\n    opacity: 0;\n    transition: var(--show-transition) opacity;\n    inline-size: 100%;\n    block-size: 100%;\n    display: flex;\n    background-color: var(--gxg-ide-loader-wrapper__background-color--from);\n    backdrop-filter: var(--gxg-ide-loader-wrapper__backdrop-filter);\n    padding: var(--gxg-ide-loader-wrapper__padding);\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    color: var(--gxg-ide-loader-wrapper__color);\n    z-index: 99; // WA to prevent tree-view chevron arrow to appear above.\n    animation: fadeIn var(--mer-timing--fast) forwards;\n\n    &--visible {\n      opacity: 1;\n    }\n  }\n  &__spinner {\n    border: var(--gxg-ide-loader-spinner__border);\n    border-block-start: var(--gxg-ide-loader-spinner__border-top);\n    border-radius: 50%;\n    animation: spinner 0.6s infinite linear;\n    inline-size: var(--gxg-ide-loader-spinner__width);\n    block-size: var(--gxg-ide-loader-spinner__width);\n    flex-shrink: 0;\n    opacity: 1;\n  }\n\n  &__content-wrapper {\n    display: flex;\n    text-align: center;\n    flex-direction: column;\n    margin-block-start: var(--gxg-ide-loader-content-wrapper__mbs);\n    gap: var(--mer-spacing--md);\n    max-block-size: var(--gxg-ide-loader-content-wrapper__max-width);\n    &--hidden {\n      display: none;\n    }\n    opacity: 1;\n  }\n}\n\n/*background color animation*/\n@keyframes wrapper {\n  0% {\n    background-color: var(--gxg-ide-loader-wrapper__background-color--from);\n  }\n  100% {\n    background-color: var(--gxg-ide-loader-wrapper__background-color--to);\n  }\n}\n@keyframes spinner {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(359deg);\n  }\n}\n\n:host([display-border]) {\n  .loader {\n    &__wrapper {\n      border: 1px solid var(--mer-color__elevation--02);\n    }\n  }\n}\n\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Event,\n  EventEmitter\n} from \"@stencil/core\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"utils/typography\"\n];\n@Component({\n  tag: \"gx-ide-loader\",\n  styleUrl: \"ide-loader.scss\",\n  shadow: true\n})\nexport class IdeLoader {\n  #timeoutReference: ReturnType<typeof setTimeout>;\n\n  /**\n   * shows the '.loader-wrapper'\n   */\n  @State() showWrapper = true;\n\n  /**\n   * The time the loader will await before abort.\n   */\n  @Prop() readonly abortTime: number = 5 * 60 * 1000; // 5 minutes\n\n  /**\n   * The cancel callback\n   */\n  @Prop() readonly cancelCallback: IdeLoaderCancelCallback;\n\n  /**\n   * The cancel button label (optional)\n   */\n  @Prop() readonly cancelLabel: string;\n\n  /**\n   * The loader description (optional)\n   */\n  @Prop() readonly description: string;\n\n  /**\n   * Displays a border all around\n   */\n  @Prop({ reflect: true }) readonly displayBorder: boolean = false;\n\n  /**\n   * The loader title (optional)\n   */\n  @Prop() readonly loaderTitle: string;\n\n  /**\n   * It shows the loader\n   */\n  @Prop({ mutable: true }) show = false;\n\n  /**\n   * This event is emitted when \"show\" is false.\n   */\n  @Event() loaderFinished: EventEmitter<void>;\n\n  #cancelProcess = (): void => {\n    if (this.cancelCallback) {\n      this.cancelCallback();\n    }\n    clearTimeout(this.#timeoutReference);\n    this.show = false;\n  };\n\n  #renderCancelButton = (): HTMLButtonElement | null =>\n    this.cancelLabel && (\n      <div>\n        <button\n          class=\"button-secondary\"\n          type=\"button\"\n          onClick={this.#cancelProcess}\n        >\n          {this.cancelLabel}\n        </button>\n      </div>\n    );\n\n  #renderDescription = (): HTMLParagraphElement | null =>\n    this.description && <p class=\"text-body-italic-s\">{this.description}</p>;\n\n  #renderTitle = (): HTMLParagraphElement | null =>\n    this.loaderTitle && <p class=\"text-body-regular-m\">{this.loaderTitle}</p>;\n\n  render() {\n    return (\n      <Host>\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        {this.show && (\n          <div\n            class={{\n              [`loader__wrapper`]: true,\n              \"loader__wrapper--visible\": this.showWrapper\n            }}\n            part=\"loader-wrapper\"\n            popover=\"\"\n          >\n            <div class=\"loader__spinner\"></div>\n            <div\n              class={{\n                \"loader__content-wrapper\": true,\n                \"loader__content-wrapper--hidden\":\n                  !this.description && !this.loaderTitle && !this.cancelLabel\n              }}\n            >\n              {this.#renderTitle()}\n              {this.#renderDescription()}\n              {this.#renderCancelButton()}\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n\nexport type IdeLoaderCancelCallback = () => void;\n"],"version":3}

package/dist/cjs/gx-ide-recent-news.cjs.entry.js

@@ -1,163 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-b87e3ee0.js');
-const assetsManager = require('./assets-manager-4b67360e.js');
-const locale = require('./locale-bf43b87c.js');
-const config = require('./config-b21feeee.js');
-const helpers = require('./helpers-b5b4a659.js');
-
-const recentNewsCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host{display:grid;block-size:100%}.card-regular{background-color:var(--mer-surface__elevation--01);border:var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01);border-radius:var(--mer-border__radius--md);padding:var(--mer-spacing--md) var(--mer-spacing--md);display:grid}.card-small{background-color:var(--mer-surface__elevation--02);border-radius:var(--mer-border__radius--sm);padding:var(--mer-spacing--sm) var(--mer-spacing--sm)}.card-small--actionable:hover{background-color:var(--mer-color__neutral-gray--600)}.card-small--actionable:active{background-color:var(--mer-color__neutral-gray--650)}.card-small:focus-visible{outline:var(--focus__outline-width) var(--focus__outline-style) var(--focus__outline-color);outline-offset:var(--focus__outline-offset)}.empty-state{block-size:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--mer-spacing--sm);text-align:center}.empty-state__title,.empty-state__button,.empty-state__link{max-inline-size:300px}.opacity-0{opacity:0}.opacity-1{opacity:1}.display-contents{display:contents}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-view-primary{font-size:var(--mer-font__size--2xs)}p{margin:0;font-size:var(--mer-font__size--xxs)}.buttons-container{display:flex;gap:var(--mer-spacing--xs)}.hiChar{color:var(--mer-color__primary-blue--200);filter:brightness(1.3)}:host(.empty){overflow:hidden !important}.news-container{display:grid;gap:var(--mer-spacing--xs);grid-auto-rows:max-content}.news-item{opacity:0;transition:150ms opacity}.news-item.visible{opacity:1}.card-news{display:flex;flex-direction:column;align-items:start;gap:var(--mer-spacing--xs)}.card-news__header{display:flex;gap:var(--mer-spacing--sm);align-items:center}gx-ide-loader::part(loader-wrapper){border:var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01);border-radius:var(--mer-border__radius--md)}.text-link{color:var(--mer-accent__primary)}.text-link:hover{text-decoration:underline}";
-
-var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-    if (kind === "a" && !f)
-        throw new TypeError("Private accessor was defined without a getter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
-        throw new TypeError("Cannot read private member from an object whose class did not declare it");
-    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-};
-var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
-    if (kind === "m")
-        throw new TypeError("Private method is not writable");
-    if (kind === "a" && !f)
-        throw new TypeError("Private accessor was defined without a setter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
-        throw new TypeError("Cannot write private member to an object whose class did not declare it");
-    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
-};
-var _GxIdeRecentNews_NEWS_ITEM_CLASS_SELECTOR, _GxIdeRecentNews_newsRendered, _GxIdeRecentNews_setTimeOutNewsDelay, _GxIdeRecentNews_newsContainerEl, _GxIdeRecentNews_displayNews, _GxIdeRecentNews_evaluateNewsDisplay, _GxIdeRecentNews_evaluateNewsRender, _GxIdeRecentNews_getNews, _GxIdeRecentNews_openNewsHandler, _GxIdeRecentNews_refreshFilteredNews, _GxIdeRecentNews_renderNewsItem, _GxIdeRecentNews_renderNewsList;
-const NEWS_ICON = assetsManager.getIconPath({
-    category: "system",
-    name: "news",
-    colorType: "on-elevation"
-});
-const CSS_BUNDLES = [
-    "resets/box-sizing",
-    "components/button",
-    "components/icon",
-    "utils/typography",
-    "utils/layout",
-    "chameleon/scrollbar"
-];
-const GxIdeRecentNews = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        _GxIdeRecentNews_NEWS_ITEM_CLASS_SELECTOR.set(this, "news-item");
-        _GxIdeRecentNews_newsRendered.set(this, false);
-        _GxIdeRecentNews_setTimeOutNewsDelay.set(this, 75);
-        _GxIdeRecentNews_newsContainerEl.set(this, void 0);
-        _GxIdeRecentNews_displayNews.set(this, () => {
-            if (__classPrivateFieldGet(this, _GxIdeRecentNews_newsContainerEl, "f") !== undefined) {
-                const news = Array.from(__classPrivateFieldGet(this, _GxIdeRecentNews_newsContainerEl, "f").querySelectorAll(`.${__classPrivateFieldGet(this, _GxIdeRecentNews_NEWS_ITEM_CLASS_SELECTOR, "f")}`));
-                news.forEach(news => {
-                    // display news with a cascade effect
-                    setTimeout(() => {
-                        news.classList.add("visible");
-                    }, __classPrivateFieldGet(this, _GxIdeRecentNews_setTimeOutNewsDelay, "f"));
-                    __classPrivateFieldSet(this, _GxIdeRecentNews_setTimeOutNewsDelay, __classPrivateFieldGet(this, _GxIdeRecentNews_setTimeOutNewsDelay, "f") + 45, "f");
-                });
-            }
-        });
-        _GxIdeRecentNews_evaluateNewsDisplay.set(this, () => {
-            if (!__classPrivateFieldGet(this, _GxIdeRecentNews_newsRendered, "f") &&
-                this.news.length > 0 &&
-                __classPrivateFieldGet(this, _GxIdeRecentNews_newsContainerEl, "f") !== undefined) {
-                __classPrivateFieldGet(this, _GxIdeRecentNews_displayNews, "f").call(this);
-                __classPrivateFieldSet(this, _GxIdeRecentNews_newsRendered, true, "f");
-            }
-        });
-        _GxIdeRecentNews_evaluateNewsRender.set(this, () => {
-            var _a;
-            if (this.newsLoadFailed) {
-                return (index.h("gx-ide-empty-state", { stateIconSrc: NEWS_ICON, stateTitle: this._componentLocale.recentNews.newsNotFetched.title }, index.h("button", { class: "empty-state__button button-primary", onClick: __classPrivateFieldGet(this, _GxIdeRecentNews_getNews, "f") }, this._componentLocale.recentNews.newsNotFetched
-                    .tryAgainButtonLabel), index.h("a", { class: "text-link text-body-regular-s", href: this._componentLocale.recentNews.newsNotFetched.onlineNewsURL, target: "_blank" }, this._componentLocale.recentNews.newsNotFetched.readThemOnline)));
-            }
-            if (this.news.length === 0) {
-                return (index.h("gx-ide-empty-state", { stateIconSrc: NEWS_ICON, stateTitle: this._componentLocale.recentNews.noNewsToDisplay.title }, index.h("a", { class: "empty-state__link text-body-regular-s", href: this._componentLocale.recentNews.onlineNewsURL, target: "_blank" }, this._componentLocale.recentNews.readThemOnline)));
-            }
-            if (((_a = this.filteredNews) === null || _a === void 0 ? void 0 : _a.length) === 0) {
-                return (index.h("gx-ide-empty-state", { class: "news-empty-state", stateIconSrc: NEWS_ICON, stateTitle: this._componentLocale.recentNews.noNewsFiltered.title }));
-            }
-            return __classPrivateFieldGet(this, _GxIdeRecentNews_renderNewsList, "f").call(this);
-        });
-        _GxIdeRecentNews_getNews.set(this, async () => {
-            this.loadingNews = true;
-            const newsResult = await this.getNewsCallback();
-            this.loadingNews = false;
-            if (newsResult && newsResult.length > 0) {
-                this.news = newsResult;
-                this.newsLoadFailed = false;
-            }
-            else {
-                this.newsLoadFailed = true;
-            }
-        });
-        _GxIdeRecentNews_openNewsHandler.set(this, (newsId) => async () => {
-            await this.openNewsCallback(newsId);
-        });
-        _GxIdeRecentNews_refreshFilteredNews.set(this, (filterValue, news) => {
-            this.filteredNews = news.filter(singleNews => {
-                var _a, _b;
-                return ((_a = singleNews.title) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(filterValue)) ||
-                    ((_b = singleNews.body) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(filterValue));
-            });
-        });
-        _GxIdeRecentNews_renderNewsItem.set(this, (news) => {
-            if (news.id && news.title) {
-                return (index.h("article", null, index.h("button", { class: {
-                        "card-small": true,
-                        "card-small--actionable": true,
-                        "card-news": true,
-                        [__classPrivateFieldGet(this, _GxIdeRecentNews_NEWS_ITEM_CLASS_SELECTOR, "f")]: true,
-                        "visible": __classPrivateFieldGet(this, _GxIdeRecentNews_newsRendered, "f")
-                    }, id: news.id, key: news.id, type: "button", onClick: __classPrivateFieldGet(this, _GxIdeRecentNews_openNewsHandler, "f").call(this, news.id) }, index.h("header", { class: "card-news__header" }, index.h("ch-image", { src: NEWS_ICON, class: "icon-md" }), index.h("h2", { class: config.config.headingsClasses.cardSmall }, helpers.hiChar(news.title, this.filterValue))), news.body && (index.h("p", { class: "text-body-regular-s" }, helpers.hiChar(news.body, this.filterValue))))));
-            }
-            return null;
-        });
-        _GxIdeRecentNews_renderNewsList.set(this, () => {
-            var _a;
-            return (index.h("div", { class: "news-container", ref: el => (__classPrivateFieldSet(this, _GxIdeRecentNews_newsContainerEl, el, "f")) }, (_a = this.filteredNews) === null || _a === void 0 ? void 0 : _a.map(__classPrivateFieldGet(this, _GxIdeRecentNews_renderNewsItem, "f"))));
-        });
-        this.filteredNews = [];
-        this.loadingNews = true;
-        this.news = [];
-        this.newsLoadFailed = false;
-        this.getNewsCallback = undefined;
-        this.openNewsCallback = undefined;
-        this.filterValue = "";
-    }
-    newsChanged(news) {
-        __classPrivateFieldGet(this, _GxIdeRecentNews_refreshFilteredNews, "f").call(this, this.filterValue, news);
-        __classPrivateFieldGet(this, _GxIdeRecentNews_displayNews, "f").call(this);
-    }
-    watchNews(newFilterValue) {
-        __classPrivateFieldGet(this, _GxIdeRecentNews_refreshFilteredNews, "f").call(this, newFilterValue, this.news);
-    }
-    async componentWillLoad() {
-        this._componentLocale = await locale.Locale.getComponentStrings(this.el);
-    }
-    componentDidRender() {
-        __classPrivateFieldGet(this, _GxIdeRecentNews_evaluateNewsDisplay, "f").call(this);
-    }
-    componentDidLoad() {
-        __classPrivateFieldGet(this, _GxIdeRecentNews_getNews, "f").call(this);
-    }
-    render() {
-        return (index.h(index.Host
-        // Improve accessibility by announcing live changes
-        , { "aria-live": "polite", "aria-busy": this.loadingNews ? "true" : "false", class: { empty: this.filteredNews.length === 0, scrollable: true } }, index.h("ch-theme", { model: CSS_BUNDLES }), this.loadingNews ? (index.h("gx-ide-loader", { abortTime: 8000, loaderTitle: this._componentLocale.loader.title, description: this._componentLocale.loader.description, show: true })) : (__classPrivateFieldGet(this, _GxIdeRecentNews_evaluateNewsRender, "f").call(this))));
-    }
-    static get assetsDirs() { return ["gx-ide-assets/recent-news"]; }
-    get el() { return index.getElement(this); }
-    static get watchers() { return {
-        "news": ["newsChanged"],
-        "filterValue": ["watchNews"]
-    }; }
-};
-_GxIdeRecentNews_NEWS_ITEM_CLASS_SELECTOR = new WeakMap(), _GxIdeRecentNews_newsRendered = new WeakMap(), _GxIdeRecentNews_setTimeOutNewsDelay = new WeakMap(), _GxIdeRecentNews_newsContainerEl = new WeakMap(), _GxIdeRecentNews_displayNews = new WeakMap(), _GxIdeRecentNews_evaluateNewsDisplay = new WeakMap(), _GxIdeRecentNews_evaluateNewsRender = new WeakMap(), _GxIdeRecentNews_getNews = new WeakMap(), _GxIdeRecentNews_openNewsHandler = new WeakMap(), _GxIdeRecentNews_refreshFilteredNews = new WeakMap(), _GxIdeRecentNews_renderNewsItem = new WeakMap(), _GxIdeRecentNews_renderNewsList = new WeakMap();
-GxIdeRecentNews.style = recentNewsCss;
-
-exports.gx_ide_recent_news = GxIdeRecentNews;
-
-//# sourceMappingURL=gx-ide-recent-news.cjs.entry.js.map

package/dist/cjs/gx-ide-recent-news.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"gx-ide-recent-news.entry.cjs.js","mappings":"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","names":["getIconPath","h","config","hiChar","Locale","Host"],"sources":["src/components/start-page/recent-news.scss?tag=gx-ide-recent-news&encapsulation=shadow","src/components/start-page/recent-news.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n@include hiChar();\n\n:host(.empty) {\n  overflow: hidden !important; // WA to avoid scrollbar \"flickering\"\n}\n.news-container {\n  display: grid;\n  gap: var(--mer-spacing--xs);\n  grid-auto-rows: max-content;\n  // padding-inline-end: var(--mer-spacing--xs);\n}\n.news-item {\n  opacity: 0;\n  transition: 150ms opacity;\n\n  &.visible {\n    opacity: 1;\n  }\n}\n.card-news {\n  display: flex;\n  flex-direction: column;\n  align-items: start;\n  gap: var(--mer-spacing--xs);\n\n  &__header {\n    display: flex;\n    gap: var(--mer-spacing--sm);\n    align-items: center;\n  }\n}\n\ngx-ide-loader::part(loader-wrapper) {\n  border: var(--mer-border__width--sm) solid\n    var(--mer-border-color__on-elevation--01);\n  border-radius: var(--mer-border__radius--md);\n}\n\n.text-link {\n  color: var(--mer-accent__primary);\n\n  &:hover {\n    text-decoration: underline;\n  }\n}\n","import { Component, Host, h, Prop, Element, State, Watch } from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\nimport { config } from \"../../common/config\";\nimport { hiChar } from \"../../common/helpers\";\nimport { NewsData, GetNewsCallback, OpenNewsCallback } from \"./start-page\";\n\nconst NEWS_ICON = getIconPath({\n  category: \"system\",\n  name: \"news\",\n  colorType: \"on-elevation\"\n});\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/typography\",\n  \"utils/layout\",\n  \"chameleon/scrollbar\"\n];\n@Component({\n  tag: \"gx-ide-recent-news\",\n  styleUrl: \"recent-news.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/recent-news\"]\n})\nexport class GxIdeRecentNews {\n  /**\n   * The component hard-coded strings translations.\n   */\n  private _componentLocale: any;\n\n  #NEWS_ITEM_CLASS_SELECTOR = \"news-item\";\n  #newsRendered = false;\n  #setTimeOutNewsDelay = 75;\n\n  @Element() el: HTMLGxIdeRecentNewsElement;\n\n  #newsContainerEl: HTMLDivElement;\n\n  /**\n   * The list of news after the filter\n   */\n  @State() filteredNews: NewsData[] = [];\n\n  /**\n   * True if news are being requested\n   */\n  @State() loadingNews = true;\n\n  /**\n   * The list of news\n   */\n  @State() news: NewsData[] = [];\n  @Watch(\"news\")\n  newsChanged(news: NewsData[]) {\n    this.#refreshFilteredNews(this.filterValue, news);\n    this.#displayNews();\n  }\n\n  /**\n   * True if news couldn't be loaded\n   */\n  @State() newsLoadFailed = false;\n\n  /**\n   * Callback invoked to load the news feed (right panel \"Recent News\").\n   */\n  @Prop() readonly getNewsCallback!: GetNewsCallback;\n\n  /**\n   * Callback invoked to open a news article.\n   */\n  @Prop() readonly openNewsCallback!: OpenNewsCallback;\n\n  /**\n   * The news filter value inserted by the user on the news input filter\n   */\n  @Prop() readonly filterValue: string = \"\";\n  @Watch(\"filterValue\")\n  watchNews(newFilterValue: string) {\n    this.#refreshFilteredNews(newFilterValue, this.news);\n  }\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidRender() {\n    this.#evaluateNewsDisplay();\n  }\n\n  componentDidLoad() {\n    this.#getNews();\n  }\n\n  #displayNews = () => {\n    if (this.#newsContainerEl !== undefined) {\n      const news = Array.from(\n        this.#newsContainerEl.querySelectorAll(\n          `.${this.#NEWS_ITEM_CLASS_SELECTOR}`\n        )\n      );\n      news.forEach(news => {\n        // display news with a cascade effect\n        setTimeout(() => {\n          news.classList.add(\"visible\");\n        }, this.#setTimeOutNewsDelay);\n        this.#setTimeOutNewsDelay += 45;\n      });\n    }\n  };\n\n  #evaluateNewsDisplay = () => {\n    if (\n      !this.#newsRendered &&\n      this.news.length > 0 &&\n      this.#newsContainerEl !== undefined\n    ) {\n      this.#displayNews();\n      this.#newsRendered = true;\n    }\n  };\n\n  #evaluateNewsRender = (): HTMLElement => {\n    if (this.newsLoadFailed) {\n      return (\n        <gx-ide-empty-state\n          stateIconSrc={NEWS_ICON}\n          stateTitle={this._componentLocale.recentNews.newsNotFetched.title}\n        >\n          <button\n            class=\"empty-state__button button-primary\"\n            onClick={this.#getNews}\n          >\n            {\n              this._componentLocale.recentNews.newsNotFetched\n                .tryAgainButtonLabel\n            }\n          </button>\n          <a\n            class=\"text-link text-body-regular-s\"\n            href={this._componentLocale.recentNews.newsNotFetched.onlineNewsURL}\n            target=\"_blank\"\n          >\n            {this._componentLocale.recentNews.newsNotFetched.readThemOnline}\n          </a>\n        </gx-ide-empty-state>\n      );\n    }\n    if (this.news.length === 0) {\n      return (\n        <gx-ide-empty-state\n          stateIconSrc={NEWS_ICON}\n          stateTitle={this._componentLocale.recentNews.noNewsToDisplay.title}\n        >\n          <a\n            class=\"empty-state__link text-body-regular-s\"\n            href={this._componentLocale.recentNews.onlineNewsURL}\n            target=\"_blank\"\n          >\n            {this._componentLocale.recentNews.readThemOnline}\n          </a>\n        </gx-ide-empty-state>\n      );\n    }\n    if (this.filteredNews?.length === 0) {\n      return (\n        <gx-ide-empty-state\n          class=\"news-empty-state\"\n          stateIconSrc={NEWS_ICON}\n          stateTitle={this._componentLocale.recentNews.noNewsFiltered.title}\n        ></gx-ide-empty-state>\n      );\n    }\n    return this.#renderNewsList();\n  };\n\n  #getNews = async () => {\n    this.loadingNews = true;\n    const newsResult = await this.getNewsCallback();\n    this.loadingNews = false;\n    if (newsResult && newsResult.length > 0) {\n      this.news = newsResult;\n      this.newsLoadFailed = false;\n    } else {\n      this.newsLoadFailed = true;\n    }\n  };\n\n  #openNewsHandler = (newsId: string) => async () => {\n    await this.openNewsCallback(newsId);\n  };\n\n  #refreshFilteredNews = (filterValue: string, news: NewsData[]) => {\n    this.filteredNews = news.filter(\n      singleNews =>\n        singleNews.title?.toLowerCase().includes(filterValue) ||\n        singleNews.body?.toLowerCase().includes(filterValue)\n    );\n  };\n\n  #renderNewsItem = (news: NewsData): HTMLGxgCardElement | null => {\n    if (news.id && news.title) {\n      return (\n        <article>\n          <button\n            class={{\n              \"card-small\": true,\n              \"card-small--actionable\": true,\n              \"card-news\": true,\n              [this.#NEWS_ITEM_CLASS_SELECTOR]: true,\n              \"visible\": this.#newsRendered\n            }}\n            id={news.id}\n            key={news.id}\n            type=\"button\"\n            onClick={this.#openNewsHandler(news.id)}\n          >\n            <header class=\"card-news__header\">\n              <ch-image src={NEWS_ICON} class=\"icon-md\"></ch-image>\n              <h2 class={config.headingsClasses.cardSmall}>\n                {hiChar(news.title, this.filterValue)}\n              </h2>\n            </header>\n            {news.body && (\n              <p class=\"text-body-regular-s\">\n                {hiChar(news.body, this.filterValue)}\n              </p>\n            )}\n          </button>\n        </article>\n      );\n    }\n    return null;\n  };\n\n  #renderNewsList = (): HTMLElement => (\n    <div\n      class=\"news-container\"\n      ref={el => (this.#newsContainerEl = el as HTMLDivElement)}\n    >\n      {this.filteredNews?.map(this.#renderNewsItem)}\n    </div>\n  );\n\n  render() {\n    return (\n      <Host\n        // Improve accessibility by announcing live changes\n        aria-live=\"polite\"\n        // Wait until all changes are made to prevents assistive\n        // technologies from announcing changes before updates are done\n        aria-busy={this.loadingNews ? \"true\" : \"false\"}\n        class={{ empty: this.filteredNews.length === 0, scrollable: true }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        {this.loadingNews ? (\n          <gx-ide-loader\n            abortTime={8000}\n            loaderTitle={this._componentLocale.loader.title}\n            description={this._componentLocale.loader.description}\n            show={true}\n          ></gx-ide-loader>\n        ) : (\n          this.#evaluateNewsRender()\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/helpers-b5b4a659.js.map

@@ -1 +0,0 @@
-{"file":"helpers-b5b4a659.js","mappings":"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","names":["h"],"sources":["src/common/helpers.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\n\nimport {\n  ChCheckboxCustomEvent,\n  ComboBoxModel,\n  TreeViewItemModel\n} from \"@genexus/chameleon-controls-library\";\nexport type ChCheckboxArray = HTMLChCheckboxElement[] | null;\n\nimport { GxOption } from \"./types\";\n\nconst daysOfWeek = [\n  \"Sunday\",\n  \"Monday\",\n  \"Tuesday\",\n  \"Wednesday\",\n  \"Thursday\",\n  \"Friday\",\n  \"Saturday\"\n];\n\n/**\n * @param element an HTMLElement\n * @returns an alphabetically ordered array of all the parts and exportparts the element contains.\n */\nexport const getElementSelectorParts = (element: HTMLElement) => {\n  const queries: string[] = [];\n  const elementParts = element.shadowRoot?.querySelectorAll(`[part]`);\n  const elementExportParts =\n    element.shadowRoot?.querySelectorAll(`[exportparts]`);\n\n  elementParts?.forEach(el => {\n    queries.push(\n      `${element.tagName.toLowerCase()}::part(${el.getAttribute(\"part\")})`\n    );\n  });\n  elementExportParts?.forEach(el => {\n    queries.push(\n      ...[\n        ...el.getAttribute(\"exportparts\").matchAll(/(?:[\\w-]+:)?([\\w-]+)/g)\n      ].map(item => `${element.tagName.toLowerCase()}::part(${item[1]})`)\n    );\n  });\n\n  return queries.sort();\n};\n\n/**\n * @param selector a part selector\n * @returns A reference to the element the part belongs to.\n */\nexport const querySelectorPart = (selector: string) => {\n  const querySelectorDeep = (\n    element: HTMLElement,\n    parts: string\n  ): HTMLElement => {\n    const shadow = element.shadowRoot;\n    const partList = parts.split(\" \");\n\n    const partElement: HTMLElement = shadow.querySelector(\n      partList.map(partName => `[part~=\"${partName}\"]`).join(\"\")\n    );\n    if (partElement) {\n      return partElement;\n    }\n\n    const exportPartElement: HTMLElement = shadow.querySelector(\n      partList.map(partName => `[exportparts*=\"${partName}\"]`).join(\"\")\n    );\n    if (exportPartElement) {\n      const exportPartList: string[] = [];\n      const exportparts = exportPartElement.getAttribute(\"exportparts\");\n\n      partList.forEach(partItem => {\n        const exportPartName = exportparts.match(\n          `(?:([\\\\w-]+):)?(${partItem})`\n        )[1];\n        if (exportPartName) {\n          exportPartList.push(exportPartName);\n        }\n      });\n\n      if (partList.length === exportPartList.length) {\n        return querySelectorDeep(exportPartElement, exportPartList.join(\" \"));\n      }\n    }\n\n    return null;\n  };\n\n  const selectorItems = selector.match(\"(.*)::part\\\\(([^)]+)\\\\)\");\n  const entity = selectorItems[1];\n  const partName = selectorItems[2];\n\n  return querySelectorDeep(document.querySelector(entity), partName);\n};\n\nconst daysFromToday = (date: Date): number => {\n  const today = new Date();\n  // To calculate the time difference of two dates\n  const timeDifference = today.getTime() - date.getTime();\n  // To calculate the no. of days between two dates\n  const daysDifference = timeDifference / (1000 * 3600 * 24);\n  return Math.floor(daysDifference);\n};\n\n// - - - - - - - - - - - -\n// Date Functions\n// - - - - - - - - - - - -\n\nconst isToday = (date: Date): boolean => {\n  const today = new Date();\n  if (today.toDateString() === date.toDateString()) {\n    return true;\n  }\n  return false;\n};\n\nconst isYesterday = (date: Date): boolean => {\n  const yesterday = new Date();\n  yesterday.setDate(yesterday.getDate() - 1);\n  if (yesterday.toDateString() === date.toDateString()) {\n    return true;\n  }\n  return false;\n};\n\nexport const formatDate = (\n  date: Date,\n  type: FormatDateType = \"date-time\"\n): string => {\n  let formattedDate;\n  // validate date\n  // undefined or null\n  if (date === undefined || date === null) {\n    return \"\";\n  }\n  // If the date object is invalid it will return 'NaN' on getTime() and NaN is never equal to itself\n  const dateIsValid = date.getTime() === date.getTime();\n  if (!dateIsValid) {\n    return \"Invalid date\";\n  }\n  let locale = \"en-US\";\n  const lang = document\n    .getElementsByTagName(\"html\")[0]\n    .getAttribute(\"lang\")\n    ?.valueOf();\n  if (lang === \"es\") {\n    locale = \"es-ES\";\n  }\n  formattedDate = date.toLocaleDateString(locale);\n  const year = date.getFullYear();\n  const month = String(date.getMonth() + 1).padStart(2, \"0\");\n  const day = String(date.getDate()).padStart(2, \"0\");\n  const hours = String(date.getHours()).padStart(2, \"0\");\n  const minutes = String(date.getMinutes()).padStart(2, \"0\");\n  const time = `${hours}:${minutes}`;\n  if (type === \"date-time\") {\n    formattedDate += ` / ${date.toLocaleTimeString()}`;\n  } else if (type === \"date-time-short\") {\n    // No seconds\n    if (locale === \"es-ES\") {\n      formattedDate = `${year}-${month}-${day} ${time}`;\n    } else {\n      formattedDate = `${month}/${day}/${year} ${time}`;\n    }\n  } else if (\"pretty\") {\n    const daysPassedFromToday = daysFromToday(date);\n    const today = new Date();\n    const currentYear = today.getFullYear();\n    if (isToday(date)) {\n      return `Today ${time}`;\n    } else if (isYesterday(date)) {\n      return `Yesterday ${time}`;\n    } else if (daysPassedFromToday <= 7) {\n      // If one week or less, just show the day of the week, and the time\n      const day = daysOfWeek[date.getDay()];\n      return `${day} ${time}`;\n    } else if (currentYear === year) {\n      // If current year, show day number and month name. Example: November 17th\n      if (locale === \"es-ES\") {\n        formattedDate = `${day} de ${date.toLocaleString(\"es-ES\", {\n          month: \"long\"\n        })} ${time}`;\n      } else {\n        formattedDate = `${date.toLocaleString(\"en-US\", {\n          month: \"long\"\n        })} ${day} ${time}`;\n      }\n    } else {\n      // Display date as usual\n      formattedDate = formatDate(date, \"date-time-short\");\n    }\n  }\n  return formattedDate;\n};\n\nexport type FormatDateType =\n  | \"date\"\n  | \"date-time\"\n  | \"date-time-short\"\n  | \"pretty\";\n\n// - - - - - - - - - - - -\n// /End of Date Functions\n// - - - - - - - - - - - -\n\n/* Count the total tree nodes (by default it does not count the first level nodes)*/\nexport const countTreeItems = (\n  treeModel: TreeViewItemModel[],\n  children = false\n): number => {\n  let totalNodes = 0;\n  treeModel.forEach(node => {\n    children && totalNodes++;\n    if (node.items) {\n      totalNodes += countTreeItems(node.items, true);\n    }\n  });\n  return totalNodes;\n};\n\n/**\n * @description it evaluates the initial selected combo item\n * @param options an array of GxOption\n * @returns the initial combo value, which in this case is the id\n */\nexport const setInitialComboValue = (options: GxOption[]): string => {\n  const selected = options.find(option => option.selected);\n  if (selected) {\n    return selected.value || selected.id;\n  } else {\n    return options[0].value || options[0].id;\n  }\n};\n\nexport const escapeRegExp = (str: string) => {\n  return str.replace(/[.*+?^${}()|[\\]\\\\]/g, \"\\\\$&\");\n};\n\n/**\n * @description this function highlights the character(s) that match(es) the filter value.\n * hiChar comes from (hi)light (Char)acters\n * @param text the string to find the filter value on\n * @param filterValue the filter value\n * @returns a span element\n */\nexport const hiChar = function (text: string, filterValue: string) {\n  if (text && filterValue) {\n    const escapedFilterValue = escapeRegExp(filterValue);\n    const re = new RegExp(escapedFilterValue, \"gi\");\n    return (\n      <span\n        innerHTML={text.replace(re, '<span class=\"hiChar\">$&</span>')}\n      ></span>\n    );\n  } else {\n    return text;\n  }\n};\n\nexport const closeOnOutsideClickHandler = (\n  eventInfo: PointerEvent,\n  ref: HTMLElement\n): true | void => {\n  if (!eventInfo.composedPath().includes(ref)) {\n    return true;\n  }\n};\n\nexport const mapOptionsToComboBoxItemModel = (\n  options: GxOption[]\n): ComboBoxModel =>\n  options.map(option => ({\n    value: option.id,\n    caption: option.label\n    // startImgSrc: option.iconName\n  }));\n\nexport const renderChCheckboxItems = (\n  options: GxOption[] | undefined,\n  frontEndCheckboxInputHandler: (\n    event: ChCheckboxCustomEvent<string> | InputEvent\n  ) => void,\n  checkedIds: string[]\n): HTMLChCheckboxElement[] => {\n  return options?.map(option => {\n    const value = checkedIds?.find(\n      id => option.value === id || option.id === id\n    );\n    return (\n      <ch-checkbox\n        name={option.name}\n        class=\"checkbox\"\n        checkedValue={option.value || option.id}\n        caption={option.label}\n        disabled={option.disabled}\n        value={value}\n        onInput={frontEndCheckboxInputHandler}\n        startImgSrc={option.iconName}\n        key={option.value || option.id}\n      ></ch-checkbox>\n    );\n  });\n};\n"],"version":3}

package/dist/collection/components/start-page/gx-ide-assets/recent-news/langs/recent-news.lang.en.json

@@ -1,24 +0,0 @@
-{
-  "componentName": "Recent News",
-  "recentNews": {
-    "title": "Recent News",
-    "linkLabel": "See all news",
-    "linkUrl": "https://www.genexus.com/en/news",
-    "newsNotFetched": {
-      "title": "We are sorry, GeneXus recent news couldn't be retrieved.",
-      "tryAgainButtonLabel": "Try Again",
-      "onlineNewsURL": "https://www.genexus.com/en/news",
-      "readThemOnline": "Or read them on GeneXus.com"
-    },
-    "noNewsToDisplay": {
-      "title": "There are no news to display."
-    },
-    "noNewsFiltered": {
-      "title": "Your search did not match with any GeneXus news"
-    }
-  },
-  "loader": {
-    "title": "Loading GeneXus Recent News...",
-    "description": "Hang on please"
-  }
-}

package/dist/collection/components/start-page/gx-ide-assets/recent-news/langs/recent-news.lang.ja.json

@@ -1,24 +0,0 @@
-{
-  "componentName": "最近のニュース",
-  "recentNews": {
-    "title": "最近のニュース",
-    "linkLabel": "すべてのニュースを確認",
-    "linkUrl": "https://www.genexus.com/en/news",
-    "newsNotFetched": {
-      "title": "申し訳ございません。GeneXus の最近のニュースを取得できませんでした。",
-      "tryAgainButtonLabel": "やり直してください",
-      "onlineNewsURL": "",
-      "readThemOnline": "または GeneXus.com で参照してください"
-    },
-    "noNewsToDisplay": {
-      "title": ""
-    },
-    "noNewsFiltered": {
-      "title": ""
-    }
-  },
-  "loader": {
-    "title": "GeneXus の最近のニュースのロード中...",
-    "description": ""
-  }
-}