npm - @knocklabs/react - Versions diffs - 0.2.25 → 0.2.26 - Mend

@knocklabs/react 0.2.25 → 0.2.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (170) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,14 @@
 # Changelog
+## 0.2.26
+### Patch Changes
+- 5545f9e: feat: support passing metadata for interactions
+- Updated dependencies [5545f9e]
+  - @knocklabs/client@0.10.12
+  - @knocklabs/react-core@0.2.23
 ## 0.2.25
 ### Patch Changes

package/dist/cjs/index.css CHANGED Viewed

	@@ -1 +1 @@
1	- :root{--rnf-font-size-xs: .75rem;--rnf-font-size-sm: .875rem;--rnf-font-size-md: 1rem;--rnf-font-size-lg: 1.125rem;--rnf-font-size-xl: 1.266rem;--rnf-font-size-2xl: 1.5rem;--rnf-font-size-3xl: 1.75rem;--rnf-spacing-0: 0;--rnf-spacing-1: 4px;--rnf-spacing-2: 8px;--rnf-spacing-3: 12px;--rnf-spacing-4: 16px;--rnf-spacing-5: 20px;--rnf-spacing-6: 24px;--rnf-spacing-7: 32px;--rnf-spacing-8: 42px;--rnf-font-weight-normal: 400;--rnf-font-weight-medium: 500;--rnf-font-weight-semibold: 600;--rnf-font-weight-bold: 700;--rnf-font-family-sanserif: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;--rnf-border-radius-sm: 2px;--rnf-border-radius-md: 4px;--rnf-border-radius-lg: 8px;--rnf-shadow-sm: 0px 5px 10px rgba(0, 0, 0, .12);--rnf-shadow-md: 0px 8px 30px rgba(0, 0, 0, .24);--rnf-color-white: #fff;--rnf-color-white-a-75: rgba(255, 255, 255, .75);--rnf-color-black: #000;--rnf-color-gray-900: #1a1f36;--rnf-color-gray-800: #3c4257;--rnf-color-gray-700: #3c4257;--rnf-color-gray-600: #515669;--rnf-color-gray-500: #697386;--rnf-color-gray-400: #9ea0aa;--rnf-color-gray-300: #a5acb8;--rnf-color-gray-200: #dddee1;--rnf-color-gray-100: #e4e8ee;--rnf-color-brand-500: #e95744;--rnf-color-brand-700: #e4321b;--rnf-color-brand-900: #891e10;--rnf-unread-badge-bg-color: #dd514c;--rnf-avatar-bg-color: #ef8476;--rnf-message-cell-unread-dot-bg-color: #f4ada4;--rnf-message-cell-hover-bg-color: #f1f6fc}:root{--rnf-button-padding-x: 8px;--rnf-button-padding-y: 4px;--rnf-button-border-radius: 4px;--rnf-button-font-weight: var(--rnf-font-weight-medium);--rnf-button-font-size: var(--rnf-font-size-sm);--rnf-button-primary-bg-color: var(--rnf-color-brand-500);--rnf-button-primary-hover-bg-color: var(--rnf-color-brand-700);--rnf-button-primary-border-color: transparent;--rnf-button-primary-text-color: var(--rnf-color-white);--rnf-button-secondary-bg-color: var(--rnf-color-white);--rnf-button-secondary-hover-bg-color: #dddee1;--rnf-button-secondary-border-color: #dddee1;--rnf-button-secondary-text-color: var(--rnf-color-gray-700)}.rnf-button{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;white-space:nowrap;vertical-align:middle;width:auto;padding:var(--rnf-button-padding-y) var(--rnf-button-padding-x);border-radius:var(--rnf-button-border-radius);font-size:var(--rnf-button-font-size);line-height:var(--rnf-font-size-lg);font-weight:var(--rnf-button-font-weight);border:1px solid;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;transition:all .1s ease-in-out}.rnf-button--full-width{width:100%}.rnf-button--primary{background-color:var(--rnf-button-primary-bg-color);color:var(--rnf-button-primary-text-color);border-color:var(--rnf-button-primary-border-color)}.rnf-button--primary:hover:not(:disabled),.rnf-button--primary:active:not(:disabled){background-color:var(--rnf-button-primary-hover-bg-color)}.rnf-button:disabled{opacity:.4;cursor:not-allowed}.rnf-button--secondary{background-color:var(--rnf-button-secondary-bg-color);color:var(--rnf-button-secondary-text-color);border-color:var(--rnf-button-secondary-border-color)}.rnf-button--secondary:hover:not(:disabled),.rnf-button--secondary:active:not(:disabled){background-color:var(--rnf-button-secondary-hover-bg-color)}.rnf-button--dark.rnf-button--secondary{border-color:#43464c;background-color:#43464c;color:var(--rnf-color-white-a-75)}.rnf-button__button-text-hidden{opacity:0}.rnf-button--dark.rnf-button--secondary:hover:not(:disabled),.rnf-button--dark.rnf-button--secondary:active:not(:disabled){background-color:var(--rnf-color-gray-600)}.rnf-button-spinner{display:flex;align-items:center;font-size:1rem;line-height:"normal"}.rnf-button-spinner--without-label{position:absolute}.rnf-button-spinner--with-label{margin-right:6px}.rnf-button--primary .rnf-button-spinner circle{stroke:#fff}.rnf-button--secondary .rnf-button-spinner circle{stroke:var(--rnf-button-secondary-text-color)}.rnf-button--dark.rnf-button--secondary .rnf-button-spinner circle{stroke:var(--rnf-color-white-a-75)}.rnf-button-group>.rnf-button+.rnf-button{margin-left:8px}:root{--rnf-empty-feed-max-w: 240px;--rnf-empty-feed-header-font-size: var(--rnf-font-size-md);--rnf-empty-feed-body-font-size: var(--rnf-font-size-sm)}.rnf-empty-feed{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.rnf-empty-feed__inner{max-width:var(--rnf-empty-feed-max-w);margin:-20px auto 0;text-align:center}.rnf-empty-feed__header{font-size:var(--rnf-empty-feed-header-font-size);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-gray-900);margin:0 0 var(--rnf-spacing-1)}.rnf-empty-feed__body{font-size:var(--rnf-empty-feed-body-font-size);color:var(--rnf-color-gray-300);margin:0}.rnf-empty-feed--dark .rnf-empty-feed__header{color:var(--rnf-color-white-a-75)}.rnf-empty-feed--dark .rnf-empty-feed__body{color:var(--rnf-color-gray-400)}:root{--rnf-avatar-bg-color: #ef8476;--rnf-avatar-size: 32px;--rnf-avatar-initials-font-size: var(--rnf-font-size-md);--rnf-avatar-initials-line-height: var(--rnf-font-size-lg);--rnf-avatar-initials-color: #fff;--rnf-notification-cell-border-bottom-color: #e4e8ee;--rnf-notification-cell-padding: var(--rnf-spacing-3);--rnf-notification-cell-active-bg-color: #f1f6fc;--rnf-notification-cell-unread-dot-size: 6px;--rnf-notification-cell-unread-dot-bg-color: #80c7f5;--rnf-notification-cell-unread-dot-border-color: #3192e3;--rnf-notification-cell-content-color: var(--rnf-color-gray-900);--rnf-notification-cell-content-font-size: var(--rnf-font-size-sm);--rnf-notification-cell-content-line-height: var(--rnf-font-size-lg);--rnf-archive-notification-btn-bg-color: var(--rnf-color-gray-400);--rnf-archive-notification-btn-bg-color-active: var(--rnf-color-gray-500)}.rnf-avatar{background-color:var(--rnf-avatar-bg-color);border-radius:var(--rnf-avatar-size);width:var(--rnf-avatar-size);height:var(--rnf-avatar-size);flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.rnf-avatar__initials{font-size:var(--rnf-avatar-initials-font-size);line-height:var(--rnf-avatar-initials-line-height);color:var(--rnf-avatar-initials-color)}.rnf-avatar__image{object-fit:cover;width:var(--rnf-avatar-size);height:var(--rnf-avatar-size)}.rnf-notification-cell{background-color:transparent;position:relative;border-bottom:1px solid var(--rnf-notification-cell-border-bottom-color)}.rnf-notification-cell:last-child{border-bottom-color:transparent}.rnf-notification-cell:hover,.rnf-notification-cell:focus,.rnf-notification-cell:active{background-color:var(--rnf-notification-cell-active-bg-color);outline:none}.rnf-notification-cell__inner{border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;width:100%;text-decoration:none;display:flex;padding:var(--rnf-notification-cell-padding);cursor:pointer;text-align:left;justify-content:flex-start}.rnf-notification-cell__unread-dot{position:absolute;top:var(--rnf-notification-cell-unread-dot-size);left:var(--rnf-notification-cell-unread-dot-size);width:var(--rnf-notification-cell-unread-dot-size);height:var(--rnf-notification-cell-unread-dot-size);border-radius:var(--rnf-notification-cell-unread-dot-size);background-color:var(--rnf-notification-cell-unread-dot-bg-color);border:1px solid var(--rnf-notification-cell-unread-dot-border-color)}.rnf-notification-cell__content-outer{margin-left:var(--rnf-spacing-3)}.rnf-notification-cell__content{color:var(--rnf-notification-cell-content-color);display:block;font-weight:var(--rnf-font-weight-normal);font-size:var(--rnf-notification-cell-content-font-size);line-height:var(--rnf-notification-cell-content-line-height);margin-bottom:var(--rnf-spacing-1);word-break:break-word;word-wrap:break-word}.rnf-notification-cell__content h1,.rnf-notification-cell__content h2,.rnf-notification-cell__content h3,.rnf-notification-cell__content h4{font-weight:var(--rnf-font-weight-semibold);margin-bottom:.5em}.rnf-notification-cell__content h1{font-size:var(--rnf-font-size-2xl)}.rnf-notification-cell__content h2{font-size:var(--rnf-font-size-xl)}.rnf-notification-cell__content h3{font-size:var(--rnf-font-size-lg)}.rnf-notification-cell__content h4{font-size:var(--rnf-font-size-md)}.rnf-notification-cell__content p{margin:0 0 .75em}.rnf-notification-cell__content p:last-child{margin-bottom:0}.rnf-notification-cell__content blockquote{border-left:3px solid var(--rnf-color-gray-300);padding-left:var(--rnf-spacing-3);line-height:var(--rnf-font-size-xl);margin:0}.rnf-notification-cell__content strong{font-weight:var(--rnf-font-weight-semibold)}.rnf-notification-cell__timestamp{display:block;color:var(--rnf-color-gray-300);font-size:var(--rnf-font-size-sm);font-weight:var(--rnf-font-weight-normal);line-height:var(--rnf-font-size-lg)}.rnf-notification-cell__child-content,.rnf-notification-cell__button-group{margin:.75em 0 .5em}.rnf-archive-notification-btn{background-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-user-select:none;user-select:none;border:none;opacity:0;width:24px;height:24px;cursor:pointer;margin-left:auto;color:var(--rnf-archive-notification-btn-bg-color);padding:var(--rnf-spacing-1) var(--rnf-spacing-2);transition:color .1s ease-in-out,opacity .2s ease-in-out}.rnf-notification-cell:focus .rnf-archive-notification-btn,.rnf-notification-cell:hover .rnf-archive-notification-btn,.rnf-notification-cell:active .rnf-archive-notification-btn{opacity:1}.rnf-archive-notification-btn:focus,.rnf-archive-notification-btn:hover,.rnf-archive-notification-btn:active{outline:none;opacity:1;color:var(--rnf-archive-notification-btn-bg-color-active)}.rnf-tooltip{background-color:var(--rnf-color-gray-700);border-radius:4px;box-shadow:0 2px 4px #0000002e;color:#fff;display:flex;flex-direction:column;padding:var(--rnf-spacing-1) var(--rnf-spacing-2);font-size:var(--rnf-font-size-xs);line-height:var(--rnf-font-size-s);font-weight:var(--rnf-font-weight-medium);transition:opacity .3s;z-index:9999}.rnf-notification-cell--dark{--rnf-notification-cell-border-bottom-color: rgba(105, 115, 134, .65);--rnf-notification-cell-active-bg-color: #393b40;--rnf-notification-cell-content-color: var(--rnf-color-white-a-75)}.rnf-notification-cell--dark:last-child{border-bottom-color:transparent}.rnf-notification-cell--dark .rnf-notification-cell__timestamp{color:var(--rnf-color-gray-500)}.rnf-archive-notification-btn--dark{--rnf-archive-notification-btn-bg-color: var(--rnf-color-gray-500);--rnf-archive-notification-btn-bg-color-active: var(--rnf-color-gray-400)}.rnf-tooltip--dark{background-color:#565a61}@media screen and (hover: none){.rnf-archive-notification-btn{opacity:1}}:root{--rnf-notification-feed-header-height: 45px}.rnf-notification-feed{background-color:var(--rnf-color-white);height:100%;display:flex;flex-direction:column}.rnf-dropdown{font-size:var(--rnf-font-size-md);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-gray-400);position:relative}.rnf-dropdown select{padding-right:var(--rnf-spacing-3);color:currentColor;border:none;background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:var(--rnf-font-size-sm);position:relative;text-align:right;z-index:2}.rnf-dropdown svg{position:absolute;top:50%;margin-top:-2px;right:0;z-index:1}.rnf-mark-all-as-read{border:none;background:transparent;margin-left:auto;display:flex;align-items:center;padding:0;font-size:var(--rnf-font-size-sm);color:var(--rnf-color-gray-400);cursor:pointer}.rnf-mark-all-as-read:disabled{color:var(--rnf-color-gray-200);cursor:not-allowed}.rnf-mark-all-as-read svg{margin-top:1px;margin-left:var(--rnf-spacing-1)}.rnf-notification-feed__header{padding:var(--rnf-spacing-3) var(--rnf-spacing-4);height:var(--rnf-notification-feed-header-height);display:flex;align-items:center}.rnf-notification-feed__selector{display:flex;align-items:center}.rnf-notification-feed__type{font-size:var(--rnf-font-size-sm);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-gray-900);margin-right:var(--rnf-spacing-2)}.rnf-notification-feed__container{overflow-y:auto;flex:1}.rnf-notification-feed__spinner-container{padding:var(--rnf-spacing-3) var(--rnf-spacing-4)}.rnf-notification-feed__spinner-container svg{margin:0 auto;display:block}.rnf-notification-feed__knock-branding{text-align:center}.rnf-notification-feed__knock-branding a{display:block;font-size:var(--rnf-font-size-sm);color:var(--rnf-color-gray-500);padding:6px;border-top:1px solid var(--rnf-color-gray-100)}.rnf-notification-feed__knock-branding a:hover{background-color:#f1f6fc}.rnf-notification-feed--dark{background-color:#2e2f34}.rnf-notification-feed--dark .rnf-notification-feed__type{color:var(--rnf-color-white-a-75)}.rnf-dropdown--dark{color:var(--rnf-color-gray-400)}.rnf-mark-all-as-read--dark:disabled{color:var(--rnf-color-gray-500)}.rnf-notification-feed--dark .rnf-notification-feed__knock-branding a{color:var(--rnf-color-gray-400);border-top-color:#697386a6}.rnf-notification-feed--dark .rnf-notification-feed__knock-branding a:hover{background-color:#393b40}.rnf-feed-provider{font-family:var(--rnf-font-family-sanserif)!important;margin:0!important;padding:0!important}.rnf-feed-provider [class^=rnf-]{font-family:var(--rnf-font-family-sanserif)!important;box-sizing:border-box}:root{--rnf-notification-feed-popover-max-w: 400px;--rnf-notification-feed-popover-min-w: 280px;--rnf-notification-feed-popover-height: 400px;--rnf-notification-feed-popover-shadow: drop-shadow( 0px 5px 15px rgba(0, 0, 0, .2) );--rnf-notification-feed-popover-shadow-color: rgba(0, 0, 0, .2);--rnf-notification-feed-popover-bg-color: #fff;--rnf-notification-feed-popover-z-index: 999;--rnf-notification-feed-popover-arrow-size: 10px;--rnf-notification-feed-popover-border-radius: 4px}.rnf-notification-feed-popover{width:100%;max-width:var(--rnf-notification-feed-popover-max-w);min-width:var(--rnf-notification-feed-popover-min-w);height:var(--rnf-notification-feed-popover-height);z-index:var(--rnf-notification-feed-popover-z-index)}.rnf-notification-feed-popover__inner{overflow:hidden;background-color:var(--rnf-notification-feed-popover-bg-color);border-radius:var(--rnf-notification-feed-popover-border-radius);filter:var(--rnf-notification-feed-popover-shadow);height:100%}.rnf-notification-feed-popover__arrow{position:absolute;width:var(--rnf-notification-feed-popover-arrow-size);height:var(--rnf-notification-feed-popover-arrow-size)}.rnf-notification-feed-popover__arrow:after{content:" ";display:block;background-color:var(--rnf-notification-feed-popover-bg-color);box-shadow:-1px -1px 1px var(--rnf-notification-feed-popover-shadow-color);position:absolute;top:-5px;left:0;transform:rotate(45deg);width:var(--rnf-notification-feed-popover-arrow-size);height:var(--rnf-notification-feed-popover-arrow-size)}.rnf-notification-feed-popover--dark{--rnf-notification-feed-popover-shadow-color: rgba(0, 0, 0, .2)}:root{--rnf-notification-icon-button-size: 32px;--rnf-notification-icon-button-bg-color: transparent}.rnf-notification-icon-button{background-color:var(--rnf-notification-icon-button-bg-color);border:none;position:relative;display:block;margin:0;padding:0;cursor:pointer;width:var(--rnf-notification-icon-button-size);height:var(--rnf-notification-icon-button-size);color:inherit}.rnf-notification-icon-button svg{display:block;margin:0 auto}.rnf-notification-icon-button--dark{color:#fff}:root{--rnf-unseen-badge-bg-color: #eb5757;--rnf-unseen-badge-size: 16px;--rnf-unseed-badge-font-size: 9px}.rnf-unseen-badge{background-color:var(--rnf-unseen-badge-bg-color);width:var(--rnf-unseen-badge-size);height:var(--rnf-unseen-badge-size);border-radius:var(--rnf-unseen-badge-size);position:absolute;display:flex;align-items:center;justify-content:center;top:0;right:0}.rnf-unseen-badge__count{font-size:var(--rnf-unseed-badge-font-size);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-white);margin-top:-1px}.rnf-unseen-badge--dark{--rnf-unseen-badge-bg-color: #ef3434}:root{--rsk-font-size-xs: .75rem;--rsk-font-size-sm: .875rem;--rsk-font-size-md: 1rem;--rsk-font-size-lg: 1.125rem;--rsk-font-size-xl: 1.266rem;--rsk-font-size-2xl: 1.5rem;--rsk-font-size-3xl: 1.75rem;--rsk-spacing-0: 0rem;--rsk-spacing-1: .25rem;--rsk-spacing-2: .5rem;--rsk-spacing-3: .75rem;--rsk-spacing-4: 1rem;--rsk-spacing-5: 1.25rem;--rsk-spacing-6: 1.5rem;--rsk-spacing-7: 2rem;--rsk-font-weight-normal: 400;--rsk-font-weight-medium: 500;--rsk-font-weight-semibold: 600;--rsk-font-weight-bold: 700;--rsk-font-family-sanserif: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;--rsk-border-radius-sm: 2px;--rsk-border-radius-md: 4px;--rsk-border-radius-lg: 8px;--rsk-button-border-radius: 6px;--rsk-color-white: #fff;--rsk-color-white-a-75: rgba(255, 255, 255, .75);--rsk-color-black: #000;--rsk-color-gray-900: #1a1f36;--rsk-color-gray-800: #3c4257;--rsk-color-gray-700: #3c4257;--rsk-color-gray-600: #515669;--rsk-color-gray-500: #697386;--rsk-color-gray-400: #9ea0aa;--rsk-color-gray-300: #a5acb8;--rsk-color-gray-200: #dddee1;--rsk-color-gray-100: #e4e8ee;--rsk-color-brand-500: #e95744;--rsk-color-brand-700: #e4321b;--rsk-color-brand-900: #891e10;--rsk-button-hover-color: rgba(247, 247, 248, 1)}:root{--rsk-connected-color: rgba(51, 163, 102, 1);--rsk-disconnect-border-color: rgba(230, 71, 51, 1);--rsk-disconnect-background-color: rgba(255, 245, 245, 1);--rsk-error-red: rgba(205, 123, 46, 1)}.rsk-connect__button{background-color:var(--rsk-color-white);border:1px solid var(--rsk-color-gray-200);border-radius:var(--rsk-button-border-radius);box-sizing:border-box;color:var(--rsk-color-black);cursor:pointer;display:inline-flex;font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal);gap:var(--rsk-spacing-2);padding:var(--rsk-spacing-1) var(--rsk-spacing-2);text-decoration:none;text-overflow:ellipsis;text-wrap:nowrap;transition:background-color .3s ease,border-color .3s ease,color .3s ease}.rsk-connect__button--connected{border-color:var(--rsk-connected-color);color:var(--rsk-connected-color);width:120px}.rsk-connect__button--error{border-color:var(--rsk-error-red);color:var(--rsk-error-red)}.rsk-connect__button--loading{border-color:var(--rsk-color-gray-100);color:var(--rsk-color-gray-400);pointer-events:none}.rsk-connect__button--disconnected:hover{background-color:var(--rsk-button-hover-color)}.rsk-connect__button--connected:hover,.rsk-connect__button__text--connected:hover{background-color:var(--rsk-disconnect-background-color);border-color:var(--rsk-disconnect-border-color);color:var(--rsk-disconnect-border-color)}.rsk-connect__button--error:hover,.rsk-connect__button__text--error:hover{border-color:var(--rsk-color-black);color:var(--rsk-color-black)}.rsk-connect__button:active{transform:translate(1px,1px)}.rsk-auth{background:var(--rsk-color-white);border:1px solid var(--rsk-color-gray-100);border-radius:var(--rsk-border-radius-lg);font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal);padding:var(--rsk-spacing-5)}.rsk-auth__header{display:flex;flex-direction:row;justify-content:space-between}.rsk-auth__title{color:#1a1f36;font-size:var(--rsk-font-size-md);line-height:var(--rsk-spacing-5);margin-top:var(--rsk-spacing-4)}.rsk-auth__description{color:#515669;font-size:var(--rsk-font-size-sm);line-height:var(--rsk-spacing-5)}:root{--rsk-error-yellow: rgba(247, 212, 102, 1);--rsk-error-yellow-background: rgba(255, 255, 240, 1)}.rsk-combobox,.rsk-combobox__list-box,.rsk-combobox__searchbar,.rsk-combobox__searchbar__input-container{width:286px}.rsk-combobox{font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal)}.rsk-combobox__searchbar__input-container{align-items:center;color:var(--rsk-color-gray-200);display:flex;position:relative}.rsk-combobox__searchbar__input-container__icon,.rsk-combobox__searchbar__input-container__icon--error{left:var(--rsk-spacing-3);position:absolute;top:.65rem;z-index:10}.rsk-combobox__searchbar__input-container__icon--error{color:var(--rsk-error-yellow)}.rsk-combobox__searchbar__input-container__input{border-color:var(--rsk-color-gray-200);border-radius:var(--rsk-border-radius-md);border-style:solid;border-width:1px;height:32px;padding-left:var(--rsk-spacing-7);padding-right:var(--rsk-spacing-1);position:relative;width:100%}.rsk-combobox__searchbar__input-container__input:disabled{background-color:var(--rsk-error-yellow-background);border:1px solid var(--rsk-error-yellow)}.rsk-combobox__searchbar__input-container__input--error{cursor:not-allowed}.rsk-combobox__searchbar__input-container__input--error::placeholder{color:#a95823}.rsk-combobox__list-box{background-color:var(--rsk-color-white);border-radius:var(--rsk-border-radius-sm);box-shadow:0 1px 2px #0000000f,0 1px 3px #0000001a;display:flex;flex-direction:column;height:223px;margin-top:var(--rsk-spacing-1);overflow-x:hidden;overflow-y:auto;width:284px}.rsk-combobox__option__button{background-color:var(--rsk-color-white);border-width:var(--rsk-spacing-0);padding:var(--rsk-spacing-2)}.rsk-combobox__option__button:hover{cursor:pointer}.rsk-combobox__option__button:disabled{color:var(--rsk-color-gray-700);cursor:not-allowed}.rsk-combobox__option__text-container{display:flex}.rsk-combobox__option__text-container__empty-icon,.rsk-combobox__option__text-container__channel-icon,.rsk-combobox__option__text-container__connection-icon{height:15px;width:20px}.rsk-combobox__option__text-container__channel-icon{align-items:center;display:flex;justify-content:center}.rsk-combobox__option__text-container__text{height:15px}.rsk-combobox__error{align-items:flex-start;background-color:var(--rsk-color-gray-100);border-radius:var(--rsk-border-radius-md);display:flex;gap:var(--rsk-spacing-1);justify-content:center;margin-top:var(--rsk-spacing-1);padding:var(--rsk-spacing-2)}.rsk-combobox__error__text{color:var(--rsk-color-gray-700);font-size:var(--rsk-font-size-xs);line-height:normal}.rsk-combobox__connected_channel_tag_list{align-items:center;display:flex;flex-wrap:wrap;gap:var(--rsk-spacing-2);margin-top:var(--rsk-spacing-2);width:286px;font-size:var(--rsk-font-size-sm);font-family:var(--rsk-font-family-sanserif);color:var(--rsk-color-gray-800)}.rsk-combobox__connected_channel_tag{align-items:center;background-color:var(--rsk-color-gray-100);border-radius:var(--rsk-border-radius-md);display:flex;gap:var(--rsk-spacing-1);max-width:286px;padding:var(--rsk-spacing-1) var(--rsk-spacing-2) var(--rsk-spacing-1) var(--rsk-spacing-2)}.rsk-combobox__connected_channel_tag__delete_button,.rsk-combobox__connected_channel_tag__channel_type_icon,.rsk-combobox__connected_channel_tag__text{display:flex}.rsk-combobox__connected_channel_tag__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rsk-combobox__connected_channel_tag__delete_button{background-color:unset;border-style:none;cursor:pointer;padding:.05rem 0rem 0rem}.rsk-combobox__connected_channel_tag__delete_button:hover{background-color:var(--rsk-color-gray-200);border-radius:var(--rsk-border-radius-md)}.rsk-connect-channel{align-items:center;display:flex;gap:var(--rsk-spacing-1)}.rsk-connect-channel__input{border:1px solid var(--rsk-color-gray-200);border-radius:var(--rsk-border-radius-md);height:32px;padding-left:var(--rsk-spacing-2);width:270px}.rsk-connect-channel__button{background-color:var(--rsk-color-white);border-color:var(--rsk-color-gray-200);border-radius:var(--rsk-button-border-radius);color:var(--rsk-color-black);display:inline-flex;font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal);gap:var(--rsk-spacing-2);height:24px;padding:var(--rsk-spacing-2);text-decoration:none}.rsk-connect-channel__button:hover{background-color:var(--rsk-button-hover-color)}
1	+ :root{--rnf-font-size-xs: .75rem;--rnf-font-size-sm: .875rem;--rnf-font-size-md: 1rem;--rnf-font-size-lg: 1.125rem;--rnf-font-size-xl: 1.266rem;--rnf-font-size-2xl: 1.5rem;--rnf-font-size-3xl: 1.75rem;--rnf-spacing-0: 0;--rnf-spacing-1: 4px;--rnf-spacing-2: 8px;--rnf-spacing-3: 12px;--rnf-spacing-4: 16px;--rnf-spacing-5: 20px;--rnf-spacing-6: 24px;--rnf-spacing-7: 32px;--rnf-spacing-8: 42px;--rnf-font-weight-normal: 400;--rnf-font-weight-medium: 500;--rnf-font-weight-semibold: 600;--rnf-font-weight-bold: 700;--rnf-font-family-sanserif: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;--rnf-border-radius-sm: 2px;--rnf-border-radius-md: 4px;--rnf-border-radius-lg: 8px;--rnf-shadow-sm: 0px 5px 10px rgba(0, 0, 0, .12);--rnf-shadow-md: 0px 8px 30px rgba(0, 0, 0, .24);--rnf-color-white: #fff;--rnf-color-white-a-75: rgba(255, 255, 255, .75);--rnf-color-black: #000;--rnf-color-gray-900: #1a1f36;--rnf-color-gray-800: #3c4257;--rnf-color-gray-700: #3c4257;--rnf-color-gray-600: #515669;--rnf-color-gray-500: #697386;--rnf-color-gray-400: #9ea0aa;--rnf-color-gray-300: #a5acb8;--rnf-color-gray-200: #dddee1;--rnf-color-gray-100: #e4e8ee;--rnf-color-brand-500: #e95744;--rnf-color-brand-700: #e4321b;--rnf-color-brand-900: #891e10;--rnf-unread-badge-bg-color: #dd514c;--rnf-avatar-bg-color: #ef8476;--rnf-message-cell-unread-dot-bg-color: #f4ada4;--rnf-message-cell-hover-bg-color: #f1f6fc}:root{--rnf-button-padding-x: 8px;--rnf-button-padding-y: 4px;--rnf-button-border-radius: 4px;--rnf-button-font-weight: var(--rnf-font-weight-medium);--rnf-button-font-size: var(--rnf-font-size-sm);--rnf-button-primary-bg-color: var(--rnf-color-brand-500);--rnf-button-primary-hover-bg-color: var(--rnf-color-brand-700);--rnf-button-primary-border-color: transparent;--rnf-button-primary-text-color: var(--rnf-color-white);--rnf-button-secondary-bg-color: var(--rnf-color-white);--rnf-button-secondary-hover-bg-color: #dddee1;--rnf-button-secondary-border-color: #dddee1;--rnf-button-secondary-text-color: var(--rnf-color-gray-700)}.rnf-button{display:inline-flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;white-space:nowrap;vertical-align:middle;width:auto;padding:var(--rnf-button-padding-y) var(--rnf-button-padding-x);border-radius:var(--rnf-button-border-radius);font-size:var(--rnf-button-font-size);line-height:var(--rnf-font-size-lg);font-weight:var(--rnf-button-font-weight);border:1px solid;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;transition:all .1s ease-in-out}.rnf-button--full-width{width:100%}.rnf-button--primary{background-color:var(--rnf-button-primary-bg-color);color:var(--rnf-button-primary-text-color);border-color:var(--rnf-button-primary-border-color)}.rnf-button--primary:hover:not(:disabled),.rnf-button--primary:active:not(:disabled){background-color:var(--rnf-button-primary-hover-bg-color)}.rnf-button:disabled{opacity:.4;cursor:not-allowed}.rnf-button--secondary{background-color:var(--rnf-button-secondary-bg-color);color:var(--rnf-button-secondary-text-color);border-color:var(--rnf-button-secondary-border-color)}.rnf-button--secondary:hover:not(:disabled),.rnf-button--secondary:active:not(:disabled){background-color:var(--rnf-button-secondary-hover-bg-color)}.rnf-button--dark.rnf-button--secondary{border-color:#43464c;background-color:#43464c;color:var(--rnf-color-white-a-75)}.rnf-button__button-text-hidden{opacity:0}.rnf-button--dark.rnf-button--secondary:hover:not(:disabled),.rnf-button--dark.rnf-button--secondary:active:not(:disabled){background-color:var(--rnf-color-gray-600)}.rnf-button-spinner{display:flex;align-items:center;font-size:1rem;line-height:"normal"}.rnf-button-spinner--without-label{position:absolute}.rnf-button-spinner--with-label{margin-right:6px}.rnf-button--primary .rnf-button-spinner circle{stroke:#fff}.rnf-button--secondary .rnf-button-spinner circle{stroke:var(--rnf-button-secondary-text-color)}.rnf-button--dark.rnf-button--secondary .rnf-button-spinner circle{stroke:var(--rnf-color-white-a-75)}.rnf-button-group>.rnf-button+.rnf-button{margin-left:8px}:root{--rnf-empty-feed-max-w: 240px;--rnf-empty-feed-header-font-size: var(--rnf-font-size-md);--rnf-empty-feed-body-font-size: var(--rnf-font-size-sm)}.rnf-empty-feed{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.rnf-empty-feed__inner{max-width:var(--rnf-empty-feed-max-w);margin:-20px auto 0;text-align:center}.rnf-empty-feed__header{font-size:var(--rnf-empty-feed-header-font-size);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-gray-900);margin:0 0 var(--rnf-spacing-1)}.rnf-empty-feed__body{font-size:var(--rnf-empty-feed-body-font-size);color:var(--rnf-color-gray-300);margin:0}.rnf-empty-feed--dark .rnf-empty-feed__header{color:var(--rnf-color-white-a-75)}.rnf-empty-feed--dark .rnf-empty-feed__body{color:var(--rnf-color-gray-400)}:root{--rnf-avatar-bg-color: #ef8476;--rnf-avatar-size: 32px;--rnf-avatar-initials-font-size: var(--rnf-font-size-md);--rnf-avatar-initials-line-height: var(--rnf-font-size-lg);--rnf-avatar-initials-color: #fff;--rnf-notification-cell-border-bottom-color: #e4e8ee;--rnf-notification-cell-padding: var(--rnf-spacing-3);--rnf-notification-cell-active-bg-color: #f1f6fc;--rnf-notification-cell-unread-dot-size: 6px;--rnf-notification-cell-unread-dot-bg-color: #80c7f5;--rnf-notification-cell-unread-dot-border-color: #3192e3;--rnf-notification-cell-content-color: var(--rnf-color-gray-900);--rnf-notification-cell-content-font-size: var(--rnf-font-size-sm);--rnf-notification-cell-content-line-height: var(--rnf-font-size-lg);--rnf-archive-notification-btn-bg-color: var(--rnf-color-gray-400);--rnf-archive-notification-btn-bg-color-active: var(--rnf-color-gray-500)}.rnf-avatar{background-color:var(--rnf-avatar-bg-color);border-radius:var(--rnf-avatar-size);width:var(--rnf-avatar-size);height:var(--rnf-avatar-size);flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.rnf-avatar__initials{font-size:var(--rnf-avatar-initials-font-size);line-height:var(--rnf-avatar-initials-line-height);color:var(--rnf-avatar-initials-color)}.rnf-avatar__image{object-fit:cover;width:var(--rnf-avatar-size);height:var(--rnf-avatar-size)}.rnf-notification-cell{background-color:transparent;position:relative;border-bottom:1px solid var(--rnf-notification-cell-border-bottom-color)}.rnf-notification-cell:last-child{border-bottom-color:transparent}.rnf-notification-cell:hover,.rnf-notification-cell:focus,.rnf-notification-cell:active{background-color:var(--rnf-notification-cell-active-bg-color);outline:none}.rnf-notification-cell__inner{border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;width:100%;text-decoration:none;display:flex;padding:var(--rnf-notification-cell-padding);cursor:pointer;text-align:left;justify-content:flex-start}.rnf-notification-cell__unread-dot{position:absolute;top:var(--rnf-notification-cell-unread-dot-size);left:var(--rnf-notification-cell-unread-dot-size);width:var(--rnf-notification-cell-unread-dot-size);height:var(--rnf-notification-cell-unread-dot-size);border-radius:var(--rnf-notification-cell-unread-dot-size);background-color:var(--rnf-notification-cell-unread-dot-bg-color);border:1px solid var(--rnf-notification-cell-unread-dot-border-color)}.rnf-notification-cell__content-outer{margin-left:var(--rnf-spacing-3)}.rnf-notification-cell__content{color:var(--rnf-notification-cell-content-color);display:block;font-weight:var(--rnf-font-weight-normal);font-size:var(--rnf-notification-cell-content-font-size);line-height:var(--rnf-notification-cell-content-line-height);margin-bottom:var(--rnf-spacing-1);word-break:break-word;word-wrap:break-word}.rnf-notification-cell__content h1,.rnf-notification-cell__content h2,.rnf-notification-cell__content h3,.rnf-notification-cell__content h4{font-weight:var(--rnf-font-weight-semibold);margin-bottom:.5em}.rnf-notification-cell__content h1{font-size:var(--rnf-font-size-2xl)}.rnf-notification-cell__content h2{font-size:var(--rnf-font-size-xl)}.rnf-notification-cell__content h3{font-size:var(--rnf-font-size-lg)}.rnf-notification-cell__content h4{font-size:var(--rnf-font-size-md)}.rnf-notification-cell__content p{margin:0 0 .75em}.rnf-notification-cell__content p:last-child{margin-bottom:0}.rnf-notification-cell__content blockquote{border-left:3px solid var(--rnf-color-gray-300);padding-left:var(--rnf-spacing-3);line-height:var(--rnf-font-size-xl);margin:0}.rnf-notification-cell__content strong{font-weight:var(--rnf-font-weight-semibold)}.rnf-notification-cell__timestamp{display:block;color:var(--rnf-color-gray-300);font-size:var(--rnf-font-size-sm);font-weight:var(--rnf-font-weight-normal);line-height:var(--rnf-font-size-lg)}.rnf-notification-cell__child-content,.rnf-notification-cell__button-group{margin:.75em 0 .5em}.rnf-archive-notification-btn{background-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-user-select:none;user-select:none;border:none;opacity:0;width:24px;height:24px;cursor:pointer;margin-left:auto;color:var(--rnf-archive-notification-btn-bg-color);padding:var(--rnf-spacing-1) var(--rnf-spacing-2);transition:color .1s ease-in-out,opacity .2s ease-in-out}.rnf-notification-cell:focus .rnf-archive-notification-btn,.rnf-notification-cell:hover .rnf-archive-notification-btn,.rnf-notification-cell:active .rnf-archive-notification-btn{opacity:1}.rnf-archive-notification-btn:focus,.rnf-archive-notification-btn:hover,.rnf-archive-notification-btn:active{outline:none;opacity:1;color:var(--rnf-archive-notification-btn-bg-color-active)}.rnf-tooltip{background-color:var(--rnf-color-gray-700);border-radius:4px;box-shadow:0 2px 4px #0000002e;color:#fff;display:flex;flex-direction:column;padding:var(--rnf-spacing-1) var(--rnf-spacing-2);font-size:var(--rnf-font-size-xs);line-height:var(--rnf-font-size-s);font-weight:var(--rnf-font-weight-medium);transition:opacity .3s;z-index:9999}.rnf-notification-cell--dark{--rnf-notification-cell-border-bottom-color: rgba(105, 115, 134, .65);--rnf-notification-cell-active-bg-color: #393b40;--rnf-notification-cell-content-color: var(--rnf-color-white-a-75)}.rnf-notification-cell--dark:last-child{border-bottom-color:transparent}.rnf-notification-cell--dark .rnf-notification-cell__timestamp{color:var(--rnf-color-gray-500)}.rnf-archive-notification-btn--dark{--rnf-archive-notification-btn-bg-color: var(--rnf-color-gray-500);--rnf-archive-notification-btn-bg-color-active: var(--rnf-color-gray-400)}.rnf-tooltip--dark{background-color:#565a61}@media screen and (hover: none){.rnf-archive-notification-btn{opacity:1}}:root{--rnf-notification-feed-header-height: 45px}.rnf-notification-feed{background-color:var(--rnf-color-white);height:100%;display:flex;flex-direction:column}.rnf-dropdown{font-size:var(--rnf-font-size-md);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-gray-400);position:relative}.rnf-dropdown select{padding-right:var(--rnf-spacing-3);color:currentColor;border:none;background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:var(--rnf-font-size-sm);position:relative;text-align:right;z-index:2}.rnf-dropdown svg{position:absolute;top:50%;margin-top:-2px;right:0;z-index:1}.rnf-mark-all-as-read{border:none;background:transparent;margin-left:auto;display:flex;align-items:center;padding:0;font-size:var(--rnf-font-size-sm);color:var(--rnf-color-gray-400);cursor:pointer}.rnf-mark-all-as-read:disabled{color:var(--rnf-color-gray-200);cursor:not-allowed}.rnf-mark-all-as-read svg{margin-top:1px;margin-left:var(--rnf-spacing-1)}.rnf-notification-feed__header{padding:var(--rnf-spacing-3) var(--rnf-spacing-4);height:var(--rnf-notification-feed-header-height);display:flex;align-items:center}.rnf-notification-feed__selector{display:flex;align-items:center}.rnf-notification-feed__type{font-size:var(--rnf-font-size-sm);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-gray-900);margin-right:var(--rnf-spacing-2)}.rnf-notification-feed__container{overflow-y:auto;flex:1}.rnf-notification-feed__spinner-container{padding:var(--rnf-spacing-3) var(--rnf-spacing-4)}.rnf-notification-feed__spinner-container svg{margin:0 auto;display:block}.rnf-notification-feed__knock-branding{text-align:center}.rnf-notification-feed__knock-branding a{display:block;font-size:var(--rnf-font-size-sm);color:var(--rnf-color-gray-500);padding:6px;border-top:1px solid var(--rnf-color-gray-100)}.rnf-notification-feed__knock-branding a:hover{background-color:#f1f6fc}.rnf-notification-feed--dark{background-color:#2e2f34}.rnf-notification-feed--dark .rnf-notification-feed__type{color:var(--rnf-color-white-a-75)}.rnf-dropdown--dark{color:var(--rnf-color-gray-400)}.rnf-mark-all-as-read--dark:disabled{color:var(--rnf-color-gray-500)}.rnf-notification-feed--dark .rnf-notification-feed__knock-branding a{color:var(--rnf-color-gray-400);border-top-color:#697386a6}.rnf-notification-feed--dark .rnf-notification-feed__knock-branding a:hover{background-color:#393b40}.rnf-feed-provider{font-family:var(--rnf-font-family-sanserif)!important;margin:0!important;padding:0!important}.rnf-feed-provider [class^=rnf-]{font-family:var(--rnf-font-family-sanserif)!important;box-sizing:border-box}:root{--rnf-notification-feed-popover-max-w: 400px;--rnf-notification-feed-popover-min-w: 280px;--rnf-notification-feed-popover-height: 400px;--rnf-notification-feed-popover-shadow: drop-shadow( 0px 5px 15px rgba(0, 0, 0, .2) );--rnf-notification-feed-popover-shadow-color: rgba(0, 0, 0, .2);--rnf-notification-feed-popover-bg-color: #fff;--rnf-notification-feed-popover-z-index: 999;--rnf-notification-feed-popover-arrow-size: 10px;--rnf-notification-feed-popover-border-radius: 4px}.rnf-notification-feed-popover{width:100%;max-width:var(--rnf-notification-feed-popover-max-w);min-width:var(--rnf-notification-feed-popover-min-w);height:var(--rnf-notification-feed-popover-height);z-index:var(--rnf-notification-feed-popover-z-index)}.rnf-notification-feed-popover__inner{overflow:hidden;background-color:var(--rnf-notification-feed-popover-bg-color);border-radius:var(--rnf-notification-feed-popover-border-radius);filter:var(--rnf-notification-feed-popover-shadow);height:100%}.rnf-notification-feed-popover__arrow{position:absolute;width:var(--rnf-notification-feed-popover-arrow-size);height:var(--rnf-notification-feed-popover-arrow-size)}.rnf-notification-feed-popover__arrow:after{content:" ";display:block;background-color:var(--rnf-notification-feed-popover-bg-color);box-shadow:-1px -1px 1px var(--rnf-notification-feed-popover-shadow-color);position:absolute;top:-5px;left:0;transform:rotate(45deg);width:var(--rnf-notification-feed-popover-arrow-size);height:var(--rnf-notification-feed-popover-arrow-size)}.rnf-notification-feed-popover--dark{--rnf-notification-feed-popover-shadow-color: rgba(0, 0, 0, .2)}:root{--rnf-unseen-badge-bg-color: #eb5757;--rnf-unseen-badge-size: 16px;--rnf-unseed-badge-font-size: 9px}.rnf-unseen-badge{background-color:var(--rnf-unseen-badge-bg-color);width:var(--rnf-unseen-badge-size);height:var(--rnf-unseen-badge-size);border-radius:var(--rnf-unseen-badge-size);position:absolute;display:flex;align-items:center;justify-content:center;top:0;right:0}.rnf-unseen-badge__count{font-size:var(--rnf-unseed-badge-font-size);font-weight:var(--rnf-font-weight-medium);color:var(--rnf-color-white);margin-top:-1px}.rnf-unseen-badge--dark{--rnf-unseen-badge-bg-color: #ef3434}:root{--rnf-notification-icon-button-size: 32px;--rnf-notification-icon-button-bg-color: transparent}.rnf-notification-icon-button{background-color:var(--rnf-notification-icon-button-bg-color);border:none;position:relative;display:block;margin:0;padding:0;cursor:pointer;width:var(--rnf-notification-icon-button-size);height:var(--rnf-notification-icon-button-size);color:inherit}.rnf-notification-icon-button svg{display:block;margin:0 auto}.rnf-notification-icon-button--dark{color:#fff}:root{--rsk-font-size-xs: .75rem;--rsk-font-size-sm: .875rem;--rsk-font-size-md: 1rem;--rsk-font-size-lg: 1.125rem;--rsk-font-size-xl: 1.266rem;--rsk-font-size-2xl: 1.5rem;--rsk-font-size-3xl: 1.75rem;--rsk-spacing-0: 0rem;--rsk-spacing-1: .25rem;--rsk-spacing-2: .5rem;--rsk-spacing-3: .75rem;--rsk-spacing-4: 1rem;--rsk-spacing-5: 1.25rem;--rsk-spacing-6: 1.5rem;--rsk-spacing-7: 2rem;--rsk-font-weight-normal: 400;--rsk-font-weight-medium: 500;--rsk-font-weight-semibold: 600;--rsk-font-weight-bold: 700;--rsk-font-family-sanserif: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;--rsk-border-radius-sm: 2px;--rsk-border-radius-md: 4px;--rsk-border-radius-lg: 8px;--rsk-button-border-radius: 6px;--rsk-color-white: #fff;--rsk-color-white-a-75: rgba(255, 255, 255, .75);--rsk-color-black: #000;--rsk-color-gray-900: #1a1f36;--rsk-color-gray-800: #3c4257;--rsk-color-gray-700: #3c4257;--rsk-color-gray-600: #515669;--rsk-color-gray-500: #697386;--rsk-color-gray-400: #9ea0aa;--rsk-color-gray-300: #a5acb8;--rsk-color-gray-200: #dddee1;--rsk-color-gray-100: #e4e8ee;--rsk-color-brand-500: #e95744;--rsk-color-brand-700: #e4321b;--rsk-color-brand-900: #891e10;--rsk-button-hover-color: rgba(247, 247, 248, 1)}:root{--rsk-connected-color: rgba(51, 163, 102, 1);--rsk-disconnect-border-color: rgba(230, 71, 51, 1);--rsk-disconnect-background-color: rgba(255, 245, 245, 1);--rsk-error-red: rgba(205, 123, 46, 1)}.rsk-connect__button{background-color:var(--rsk-color-white);border:1px solid var(--rsk-color-gray-200);border-radius:var(--rsk-button-border-radius);box-sizing:border-box;color:var(--rsk-color-black);cursor:pointer;display:inline-flex;font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal);gap:var(--rsk-spacing-2);padding:var(--rsk-spacing-1) var(--rsk-spacing-2);text-decoration:none;text-overflow:ellipsis;text-wrap:nowrap;transition:background-color .3s ease,border-color .3s ease,color .3s ease}.rsk-connect__button--connected{border-color:var(--rsk-connected-color);color:var(--rsk-connected-color);width:120px}.rsk-connect__button--error{border-color:var(--rsk-error-red);color:var(--rsk-error-red)}.rsk-connect__button--loading{border-color:var(--rsk-color-gray-100);color:var(--rsk-color-gray-400);pointer-events:none}.rsk-connect__button--disconnected:hover{background-color:var(--rsk-button-hover-color)}.rsk-connect__button--connected:hover,.rsk-connect__button__text--connected:hover{background-color:var(--rsk-disconnect-background-color);border-color:var(--rsk-disconnect-border-color);color:var(--rsk-disconnect-border-color)}.rsk-connect__button--error:hover,.rsk-connect__button__text--error:hover{border-color:var(--rsk-color-black);color:var(--rsk-color-black)}.rsk-connect__button:active{transform:translate(1px,1px)}.rsk-auth{background:var(--rsk-color-white);border:1px solid var(--rsk-color-gray-100);border-radius:var(--rsk-border-radius-lg);font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal);padding:var(--rsk-spacing-5)}.rsk-auth__header{display:flex;flex-direction:row;justify-content:space-between}.rsk-auth__title{color:#1a1f36;font-size:var(--rsk-font-size-md);line-height:var(--rsk-spacing-5);margin-top:var(--rsk-spacing-4)}.rsk-auth__description{color:#515669;font-size:var(--rsk-font-size-sm);line-height:var(--rsk-spacing-5)}.rsk-connect-channel{align-items:center;display:flex;gap:var(--rsk-spacing-1)}.rsk-connect-channel__input{border:1px solid var(--rsk-color-gray-200);border-radius:var(--rsk-border-radius-md);height:32px;padding-left:var(--rsk-spacing-2);width:270px}.rsk-connect-channel__button{background-color:var(--rsk-color-white);border-color:var(--rsk-color-gray-200);border-radius:var(--rsk-button-border-radius);color:var(--rsk-color-black);display:inline-flex;font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal);gap:var(--rsk-spacing-2);height:24px;padding:var(--rsk-spacing-2);text-decoration:none}.rsk-connect-channel__button:hover{background-color:var(--rsk-button-hover-color)}:root{--rsk-error-yellow: rgba(247, 212, 102, 1);--rsk-error-yellow-background: rgba(255, 255, 240, 1)}.rsk-combobox,.rsk-combobox__list-box,.rsk-combobox__searchbar,.rsk-combobox__searchbar__input-container{width:286px}.rsk-combobox{font-family:var(--rsk-font-family-sanserif);font-size:var(--rsk-font-size-sm);font-weight:var(--rsk-font-weight-normal)}.rsk-combobox__searchbar__input-container{align-items:center;color:var(--rsk-color-gray-200);display:flex;position:relative}.rsk-combobox__searchbar__input-container__icon,.rsk-combobox__searchbar__input-container__icon--error{left:var(--rsk-spacing-3);position:absolute;top:.65rem;z-index:10}.rsk-combobox__searchbar__input-container__icon--error{color:var(--rsk-error-yellow)}.rsk-combobox__searchbar__input-container__input{border-color:var(--rsk-color-gray-200);border-radius:var(--rsk-border-radius-md);border-style:solid;border-width:1px;height:32px;padding-left:var(--rsk-spacing-7);padding-right:var(--rsk-spacing-1);position:relative;width:100%}.rsk-combobox__searchbar__input-container__input:disabled{background-color:var(--rsk-error-yellow-background);border:1px solid var(--rsk-error-yellow)}.rsk-combobox__searchbar__input-container__input--error{cursor:not-allowed}.rsk-combobox__searchbar__input-container__input--error::placeholder{color:#a95823}.rsk-combobox__list-box{background-color:var(--rsk-color-white);border-radius:var(--rsk-border-radius-sm);box-shadow:0 1px 2px #0000000f,0 1px 3px #0000001a;display:flex;flex-direction:column;height:223px;margin-top:var(--rsk-spacing-1);overflow-x:hidden;overflow-y:auto;width:284px}.rsk-combobox__option__button{background-color:var(--rsk-color-white);border-width:var(--rsk-spacing-0);padding:var(--rsk-spacing-2)}.rsk-combobox__option__button:hover{cursor:pointer}.rsk-combobox__option__button:disabled{color:var(--rsk-color-gray-700);cursor:not-allowed}.rsk-combobox__option__text-container{display:flex}.rsk-combobox__option__text-container__empty-icon,.rsk-combobox__option__text-container__channel-icon,.rsk-combobox__option__text-container__connection-icon{height:15px;width:20px}.rsk-combobox__option__text-container__channel-icon{align-items:center;display:flex;justify-content:center}.rsk-combobox__option__text-container__text{height:15px}.rsk-combobox__error{align-items:flex-start;background-color:var(--rsk-color-gray-100);border-radius:var(--rsk-border-radius-md);display:flex;gap:var(--rsk-spacing-1);justify-content:center;margin-top:var(--rsk-spacing-1);padding:var(--rsk-spacing-2)}.rsk-combobox__error__text{color:var(--rsk-color-gray-700);font-size:var(--rsk-font-size-xs);line-height:normal}.rsk-combobox__connected_channel_tag_list{align-items:center;display:flex;flex-wrap:wrap;gap:var(--rsk-spacing-2);margin-top:var(--rsk-spacing-2);width:286px;font-size:var(--rsk-font-size-sm);font-family:var(--rsk-font-family-sanserif);color:var(--rsk-color-gray-800)}.rsk-combobox__connected_channel_tag{align-items:center;background-color:var(--rsk-color-gray-100);border-radius:var(--rsk-border-radius-md);display:flex;gap:var(--rsk-spacing-1);max-width:286px;padding:var(--rsk-spacing-1) var(--rsk-spacing-2) var(--rsk-spacing-1) var(--rsk-spacing-2)}.rsk-combobox__connected_channel_tag__delete_button,.rsk-combobox__connected_channel_tag__channel_type_icon,.rsk-combobox__connected_channel_tag__text{display:flex}.rsk-combobox__connected_channel_tag__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rsk-combobox__connected_channel_tag__delete_button{background-color:unset;border-style:none;cursor:pointer;padding:.05rem 0rem 0rem}.rsk-combobox__connected_channel_tag__delete_button:hover{background-color:var(--rsk-color-gray-200);border-radius:var(--rsk-border-radius-md)}

package/dist/cjs/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./modules/core/components/Button/Button.js"),i=require("./modules/core/components/Button/ButtonGroup.js"),n=require("./modules/core/components/Icons/Bell.js"),r=require("./modules/core/components/Icons/CheckmarkCircle.js"),c=require("./modules/core/components/Icons/ChevronDown.js"),a=require("./modules/core/components/Icons/CloseCircle.js"),u=require("./modules/core/components/Spinner/Spinner.js"),l=require("./modules/core/hooks/useOnBottomScroll.js"),s=require("./modules/core/hooks/useOutsideClick.js"),C=require("./modules/feed/components/EmptyFeed/EmptyFeed.js"),d=require("./modules/feed/components/NotificationCell/NotificationCell.js"),q=require("./modules/feed/components/NotificationCell/Avatar.js"),f=require("./modules/feed/components/NotificationFeed/NotificationFeed.js"),B=require("./modules/feed/components/NotificationFeed/NotificationFeedHeader.js"),k=require("./modules/feed/components/NotificationFeed/MarkAsRead.js"),N=require("./modules/feed/components/NotificationFeedContainer/NotificationFeedContainer.js"),h=require("./modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.js"),p=require("./modules/feed/components/NotificationIconButton/NotificationIconButton.js"),S=require("./modules/feed/components/UnseenBadge/UnseenBadge.js"),F=require("./modules/slack/components/SlackAuthButton/SlackAuthButton.js"),m=require("./modules/slack/components/SlackAuthContainer/SlackAuthContainer.js"),b=require("./modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.js"),o=require("@knocklabs/react-core");exports.Button=t.Button;exports.ButtonGroup=i.ButtonGroup;exports.BellIcon=n.BellIcon;exports.CheckmarkCircle=r.CheckmarkCircle;exports.ChevronDown=c.ChevronDown;exports.CloseCircle=a.CloseCircle;exports.Spinner=u.Spinner;exports.useOnBottomScroll=l;exports.useOutsideClick=s;exports.EmptyFeed=C.EmptyFeed;exports.NotificationCell=d.NotificationCell;exports.Avatar=q.Avatar;exports.NotificationFeed=f.NotificationFeed;exports.NotificationFeedHeader=B.NotificationFeedHeader;exports.MarkAsRead=k.MarkAsRead;exports.NotificationFeedContainer=N.NotificationFeedContainer;exports.NotificationFeedPopover=h.NotificationFeedPopover;exports.NotificationIconButton=p.NotificationIconButton;exports.UnseenBadge=S.UnseenBadge;exports.SlackAuthButton=F.SlackAuthButton;exports.SlackAuthContainer=m.SlackAuthContainer;exports.SlackChannelCombobox=b.SlackChannelCombobox;Object.keys(o).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>o[e]})});
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css           */const t=require("./modules/core/components/Button/Button.js"),i=require("./modules/core/components/Button/ButtonGroup.js"),n=require("./modules/core/components/Icons/Bell.js"),r=require("./modules/core/components/Icons/CheckmarkCircle.js"),c=require("./modules/core/components/Icons/ChevronDown.js"),a=require("./modules/core/components/Icons/CloseCircle.js"),u=require("./modules/core/components/Spinner/Spinner.js"),l=require("./modules/core/hooks/useOnBottomScroll.js"),s=require("./modules/core/hooks/useOutsideClick.js"),C=require("./modules/feed/components/EmptyFeed/EmptyFeed.js"),d=require("./modules/feed/components/NotificationCell/NotificationCell.js"),q=require("./modules/feed/components/NotificationCell/Avatar.js"),f=require("./modules/feed/components/NotificationFeed/NotificationFeed.js"),B=require("./modules/feed/components/NotificationFeed/NotificationFeedHeader.js"),k=require("./modules/feed/components/NotificationFeed/MarkAsRead.js"),N=require("./modules/feed/components/NotificationFeedContainer/NotificationFeedContainer.js"),h=require("./modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.js"),p=require("./modules/feed/components/NotificationIconButton/NotificationIconButton.js"),S=require("./modules/feed/components/UnseenBadge/UnseenBadge.js"),F=require("./modules/slack/components/SlackAuthButton/SlackAuthButton.js"),m=require("./modules/slack/components/SlackAuthContainer/SlackAuthContainer.js"),b=require("./modules/slack/components/SlackChannelCombobox/SlackChannelCombobox.js"),o=require("@knocklabs/react-core");exports.Button=t.Button;exports.ButtonGroup=i.ButtonGroup;exports.BellIcon=n.BellIcon;exports.CheckmarkCircle=r.CheckmarkCircle;exports.ChevronDown=c.ChevronDown;exports.CloseCircle=a.CloseCircle;exports.Spinner=u.Spinner;exports.useOnBottomScroll=l;exports.useOutsideClick=s;exports.EmptyFeed=C.EmptyFeed;exports.NotificationCell=d.NotificationCell;exports.Avatar=q.Avatar;exports.NotificationFeed=f.NotificationFeed;exports.NotificationFeedHeader=B.NotificationFeedHeader;exports.MarkAsRead=k.MarkAsRead;exports.NotificationFeedContainer=N.NotificationFeedContainer;exports.NotificationFeedPopover=h.NotificationFeedPopover;exports.NotificationIconButton=p.NotificationIconButton;exports.UnseenBadge=S.UnseenBadge;exports.SlackAuthButton=F.SlackAuthButton;exports.SlackAuthContainer=m.SlackAuthContainer;exports.SlackChannelCombobox=b.SlackChannelCombobox;Object.keys(o).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>o[e]})});
 //# sourceMappingURL=index.js.map

package/dist/cjs/modules/core/components/Button/Button.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("@knocklabs/react-core"),d=require("react"),i=require("./ButtonSpinner.js");const m=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},n=m(d),p=({variant:t="primary",loadingText:o,isLoading:e=!1,isDisabled:u=!1,isFullWidth:a=!1,onClick:l,children:r})=>{const{colorMode:s}=b.useKnockFeed(),c=["rnf-button",`rnf-button--${t}`,a?"rnf-button--full-width":"",e?"rnf-button--is-loading":"",`rnf-button--${s}`].join(" "),f=o||n.default.createElement("span",{className:"rnf-button__button-text-hidden"},r);return n.default.createElement("button",{onClick:l,className:c,disabled:e||u,type:"button"},e&&n.default.createElement(i.ButtonSpinner,{hasLabel:!!o}),e?f:r)};exports.Button=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("@knocklabs/react-core"),d=require("react"),i=require("./ButtonSpinner.js");;/* empty css            */const m=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},n=m(d),p=({variant:t="primary",loadingText:o,isLoading:e=!1,isDisabled:u=!1,isFullWidth:a=!1,onClick:l,children:r})=>{const{colorMode:s}=b.useKnockFeed(),c=["rnf-button",`rnf-button--${t}`,a?"rnf-button--full-width":"",e?"rnf-button--is-loading":"",`rnf-button--${s}`].join(" "),f=o||n.default.createElement("span",{className:"rnf-button__button-text-hidden"},r);return n.default.createElement("button",{onClick:l,className:c,disabled:e||u,type:"button"},e&&n.default.createElement(i.ButtonSpinner,{hasLabel:!!o}),e?f:r)};exports.Button=p;
 //# sourceMappingURL=Button.js.map

package/dist/cjs/modules/core/components/Button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":["../../../../../../src/modules/core/components/Button/Button.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { PropsWithChildren } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport { ButtonSpinner } from \"./ButtonSpinner\";\nimport \"./styles.css\";\n\nexport type ButtonProps = {\n variant: \"primary\" \| \"secondary\";\n loadingText?: string;\n isLoading?: boolean;\n isDisabled?: boolean;\n isFullWidth?: boolean;\n onClick: (e: React.MouseEvent) => void;\n};\n\nexport const Button: FunctionComponent<PropsWithChildren<ButtonProps>> = ({\n variant = \"primary\",\n loadingText,\n isLoading = false,\n isDisabled = false,\n isFullWidth = false,\n onClick,\n children,\n}) => {\n const { colorMode } = useKnockFeed();\n\n const classNames = [\n \"rnf-button\",\n `rnf-button--${variant}`,\n isFullWidth ? \"rnf-button--full-width\" : \"\",\n isLoading ? \"rnf-button--is-loading\" : \"\",\n `rnf-button--${colorMode}`,\n ].join(\" \");\n\n // In this case when there's no loading text, we still want to display the original\n // content of the button, but make it hidden. That allows us to keep the button width\n // consistent and show the spinner in the middle, meaning no layout shift.\n const textToShowWhileLoading = loadingText \|\| (\n <span className=\"rnf-button__button-text-hidden\">{children}</span>\n );\n\n return (\n <button\n onClick={onClick}\n className={classNames}\n disabled={isLoading \|\| isDisabled}\n type=\"button\"\n >\n {isLoading && <ButtonSpinner hasLabel={!!loadingText} />}\n {isLoading ? textToShowWhileLoading : children}\n </button>\n );\n};\n"],"names":["Button","variant","loadingText","isLoading","isDisabled","isFullWidth","onClick","children","colorMode","useKnockFeed","classNames","join","textToShowWhileLoading","React","ButtonSpinner"],"mappings":"4QAgBaA,EAA4DA,CAAC,CACxEC,QAAAA,EAAU,UACVC,YAAAA,EACAC,UAAAA,EAAY,GACZC,WAAAA,EAAa,GACbC,YAAAA,EAAc,GACdC,QAAAA,EACAC,SAAAA,CACF,IAAM,CACE,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAE7BC,EAAa,CACjB,~~aACC~~,~~eAAcT~~,~~CAAQ~~,~~GACvBI~~,EAAc,yBAA2B,GACzCF,EAAY,yBAA2B,~~GACtC~~,~~eAAcK~~,~~CAAU~~,~~EAAC~~,EAC1BG,KAAK,GAAG,EAKJC,EAAyBV,GAC7BW,EAAAA,QAAA,cAAC,OAAK,CAAA,UAAU,kCAAkCN,CAAS,EAI3D,OAAAM,UAAA,cAAC,UACC,QAAAP,EACA,UAAWI,EACX,SAAUP,GAAaC,EACvB,KAAK,QAAA,EAEJD,GAAcU,UAAA,cAAAC,EAAA,cAAA,CAAc,SAAU,CAAC,CAACZ,EAAe,EACvDC,EAAYS,EAAyBL,CACxC,CAEJ"}
1	+ {"version":3,"file":"Button.js","sources":["../../../../../../src/modules/core/components/Button/Button.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { PropsWithChildren } from \"react\";\nimport { FunctionComponent } from \"react\";\n\nimport { ButtonSpinner } from \"./ButtonSpinner\";\nimport \"./styles.css\";\n\nexport type ButtonProps = {\n variant: \"primary\" \| \"secondary\";\n loadingText?: string;\n isLoading?: boolean;\n isDisabled?: boolean;\n isFullWidth?: boolean;\n onClick: (e: React.MouseEvent) => void;\n};\n\nexport const Button: FunctionComponent<PropsWithChildren<ButtonProps>> = ({\n variant = \"primary\",\n loadingText,\n isLoading = false,\n isDisabled = false,\n isFullWidth = false,\n onClick,\n children,\n}) => {\n const { colorMode } = useKnockFeed();\n\n const classNames = [\n \"rnf-button\",\n `rnf-button--${variant}`,\n isFullWidth ? \"rnf-button--full-width\" : \"\",\n isLoading ? \"rnf-button--is-loading\" : \"\",\n `rnf-button--${colorMode}`,\n ].join(\" \");\n\n // In this case when there's no loading text, we still want to display the original\n // content of the button, but make it hidden. That allows us to keep the button width\n // consistent and show the spinner in the middle, meaning no layout shift.\n const textToShowWhileLoading = loadingText \|\| (\n <span className=\"rnf-button__button-text-hidden\">{children}</span>\n );\n\n return (\n <button\n onClick={onClick}\n className={classNames}\n disabled={isLoading \|\| isDisabled}\n type=\"button\"\n >\n {isLoading && <ButtonSpinner hasLabel={!!loadingText} />}\n {isLoading ? textToShowWhileLoading : children}\n </button>\n );\n};\n"],"names":["Button","variant","loadingText","isLoading","isDisabled","isFullWidth","onClick","children","colorMode","useKnockFeed","classNames","join","textToShowWhileLoading","React","ButtonSpinner"],"mappings":"4QAgBaA,EAA4DA,CAAC,CACxEC,QAAAA,EAAU,UACVC,YAAAA,EACAC,UAAAA,EAAY,GACZC,WAAAA,EAAa,GACbC,YAAAA,EAAc,GACdC,QAAAA,EACAC,SAAAA,CACF,IAAM,CACE,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAE7BC,EAAa,CACjB,aACA,eAAeT,CAAO,GACtBI,EAAc,yBAA2B,GACzCF,EAAY,yBAA2B,GACvC,eAAeK,CAAS,EAAE,EAC1BG,KAAK,GAAG,EAKJC,EAAyBV,GAC7BW,EAAAA,QAAA,cAAC,OAAK,CAAA,UAAU,kCAAkCN,CAAS,EAI3D,OAAAM,UAAA,cAAC,UACC,QAAAP,EACA,UAAWI,EACX,SAAUP,GAAaC,EACvB,KAAK,QAAA,EAEJD,GAAcU,UAAA,cAAAC,EAAA,cAAA,CAAc,SAAU,CAAC,CAACZ,EAAe,EACvDC,EAAYS,EAAyBL,CACxC,CAEJ"}

package/dist/cjs/modules/core/components/Button/ButtonGroup.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react");const o=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},u=o(e),r=({children:t})=>u.default.createElement("div",{className:"rnf-button-group"},t);exports.ButtonGroup=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react");;/* empty css            */const o=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},u=o(e),r=({children:t})=>u.default.createElement("div",{className:"rnf-button-group"},t);exports.ButtonGroup=r;
 //# sourceMappingURL=ButtonGroup.js.map

package/dist/cjs/modules/core/components/Button/ButtonSpinner.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),r=require("../Spinner/Spinner.js");const l=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=l(n),o=({hasLabel:t})=>e.default.createElement("div",{className:`rnf-button-spinner rnf-button-spinner--${t?"with-label":"without-label"}`},e.default.createElement(r.Spinner,null));exports.ButtonSpinner=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),r=require("../Spinner/Spinner.js");;/* empty css            */const l=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=l(n),o=({hasLabel:t})=>e.default.createElement("div",{className:`rnf-button-spinner rnf-button-spinner--${t?"with-label":"without-label"}`},e.default.createElement(r.Spinner,null));exports.ButtonSpinner=o;
 //# sourceMappingURL=ButtonSpinner.js.map

package/dist/cjs/modules/core/components/Button/ButtonSpinner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonSpinner.js","sources":["../../../../../../src/modules/core/components/Button/ButtonSpinner.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\nimport { Spinner } from \"../Spinner\";\n\nimport \"./styles.css\";\n\ntype ButtonSpinnerProps = {\n hasLabel: boolean;\n};\n\nexport const ButtonSpinner: FunctionComponent<ButtonSpinnerProps> = ({\n hasLabel,\n}) => (\n <div\n className={`rnf-button-spinner rnf-button-spinner--${\n hasLabel ? \"with-label\" : \"without-label\"\n }`}\n >\n <Spinner />\n </div>\n);\n"],"names":["ButtonSpinner","hasLabel","React","Spinner"],"mappings":"4OAUaA,EAAuDA,CAAC,CACnEC,SAAAA,CACF,IACEC,EAAAA,QAAA,cAAC,MACC,CAAA,~~UAAY~~,~~0CACVD~~,EAAW,aAAe,~~eAC3B~~,EAAA,~~EAEAC~~,EAAA,QAAA,cAAAC,EAAA,QAAA,IAAO,CACV"}
1	+ {"version":3,"file":"ButtonSpinner.js","sources":["../../../../../../src/modules/core/components/Button/ButtonSpinner.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\nimport { Spinner } from \"../Spinner\";\n\nimport \"./styles.css\";\n\ntype ButtonSpinnerProps = {\n hasLabel: boolean;\n};\n\nexport const ButtonSpinner: FunctionComponent<ButtonSpinnerProps> = ({\n hasLabel,\n}) => (\n <div\n className={`rnf-button-spinner rnf-button-spinner--${\n hasLabel ? \"with-label\" : \"without-label\"\n }`}\n >\n <Spinner />\n </div>\n);\n"],"names":["ButtonSpinner","hasLabel","React","Spinner"],"mappings":"4OAUaA,EAAuDA,CAAC,CACnEC,SAAAA,CACF,IACEC,EAAAA,QAAA,cAAC,MACC,CAAA,UAAW,0CACTD,EAAW,aAAe,eAAe,EAAA,EAG1CC,EAAA,QAAA,cAAAC,EAAA,QAAA,IAAO,CACV"}

package/dist/cjs/modules/core/components/Spinner/Spinner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Spinner.js","sources":["../../../../../../src/modules/core/components/Spinner/Spinner.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\ntype Speed = \"fast\" \| \"slow\" \| \"medium\";\n\nfunction speedSwitch(speed: Speed) {\n if (speed === \"fast\") return 600;\n if (speed === \"slow\") return 900;\n return 750;\n}\n\nexport interface SpinnerProps {\n color?: string;\n speed?: Speed;\n gap?: number;\n thickness?: number;\n size?: string;\n}\n\nexport const Spinner: FunctionComponent<SpinnerProps> = ({\n color = \"rgba(0,0,0,0.4)\",\n speed = \"medium\",\n gap = 4,\n thickness = 4,\n size = \"1em\",\n ...props\n}) => (\n <svg\n height={size}\n width={size}\n {...props}\n style={{ animationDuration: `${speedSwitch(speed)}ms` }}\n className=\"__react-svg-spinner_circle\"\n role=\"img\"\n aria-labelledby=\"title desc\"\n viewBox=\"0 0 32 32\"\n >\n <title id=\"title\">Circle loading spinner</title>\n <desc id=\"desc\">Image of a partial circle indicating \"loading.\"</desc>\n <style\n dangerouslySetInnerHTML={{\n __html: `\n .__react-svg-spinner_circle{\n transition-property: transform;\n animation-name: __react-svg-spinner_infinite-spin;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n }\n @keyframes __react-svg-spinner_infinite-spin {\n from {transform: rotate(0deg)}\n to {transform: rotate(360deg)}\n }\n `,\n }}\n />\n <circle\n role=\"presentation\"\n cx={16}\n cy={16}\n r={14 - thickness / 2}\n stroke={color}\n fill=\"none\"\n strokeWidth={thickness}\n strokeDasharray={Math.PI * 2 * (11 - gap)}\n strokeLinecap=\"round\"\n />\n </svg>\n);\n"],"names":["speedSwitch","speed","Spinner","color","gap","thickness","size","props","React","animationDuration","__html","Math","PI"],"mappings":"wKAIA,SAASA,EAAYC,EAAc,~~CACjC~~,~~OAAIA~~,IAAU,OAAe,IACzBA,IAAU,OAAe,IACtB,GACT,CAUO,MAAMC,EAA2CA,CAAC,CACvDC,MAAAA,EAAQ,kBACRF,MAAAA,EAAQ,SACRG,IAAAA,EAAM,EACNC,UAAAA,EAAY,EACZC,KAAAA,EAAO,MACP,GAAGC,CACL,IACEC,UAAA,cAAC,OACC,OAAQF,EACR,MAAOA,EACP,GAAIC,EACJ,MAAO,CAAEE,~~kBAAoB~~,~~GAAET~~,EAAYC,CAAK,~~CAAE~~,~~IAAI~~,EACtD,UAAU,6BACV,KAAK,MACL,kBAAgB,aAChB,QAAQ,WAER,EAAAO,EAAA,QAAA,cAAC,QAAM,CAAA,GAAG,SAAQ,wBAAsB,0BACvC,OAAK,CAAA,GAAG,QAAO,iDAA+C,EAC9DA,EAAA,QAAA,cAAA,QAAA,CACC,wBAAyB,CACvBE,~~OAAS~~;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~KAYX~~,CAAE,CAAA,EAEHF,EAAA,QAAA,cAAA,SAAA,CACC,KAAK,eACL,GAAI,GACJ,GAAI,GACJ,EAAG,GAAKH,EAAY,EACpB,OAAQF,EACR,KAAK,OACL,YAAaE,EACb,gBAAiBM,KAAKC,GAAK,GAAK,GAAKR,GACrC,cAAc,OAAA,CAAO,CAEzB"}
1	+ {"version":3,"file":"Spinner.js","sources":["../../../../../../src/modules/core/components/Spinner/Spinner.tsx"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\ntype Speed = \"fast\" \| \"slow\" \| \"medium\";\n\nfunction speedSwitch(speed: Speed) {\n if (speed === \"fast\") return 600;\n if (speed === \"slow\") return 900;\n return 750;\n}\n\nexport interface SpinnerProps {\n color?: string;\n speed?: Speed;\n gap?: number;\n thickness?: number;\n size?: string;\n}\n\nexport const Spinner: FunctionComponent<SpinnerProps> = ({\n color = \"rgba(0,0,0,0.4)\",\n speed = \"medium\",\n gap = 4,\n thickness = 4,\n size = \"1em\",\n ...props\n}) => (\n <svg\n height={size}\n width={size}\n {...props}\n style={{ animationDuration: `${speedSwitch(speed)}ms` }}\n className=\"__react-svg-spinner_circle\"\n role=\"img\"\n aria-labelledby=\"title desc\"\n viewBox=\"0 0 32 32\"\n >\n <title id=\"title\">Circle loading spinner</title>\n <desc id=\"desc\">Image of a partial circle indicating \"loading.\"</desc>\n <style\n dangerouslySetInnerHTML={{\n __html: `\n .__react-svg-spinner_circle{\n transition-property: transform;\n animation-name: __react-svg-spinner_infinite-spin;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n }\n @keyframes __react-svg-spinner_infinite-spin {\n from {transform: rotate(0deg)}\n to {transform: rotate(360deg)}\n }\n `,\n }}\n />\n <circle\n role=\"presentation\"\n cx={16}\n cy={16}\n r={14 - thickness / 2}\n stroke={color}\n fill=\"none\"\n strokeWidth={thickness}\n strokeDasharray={Math.PI * 2 * (11 - gap)}\n strokeLinecap=\"round\"\n />\n </svg>\n);\n"],"names":["speedSwitch","speed","Spinner","color","gap","thickness","size","props","React","animationDuration","__html","Math","PI"],"mappings":"wKAIA,SAASA,EAAYC,EAAc,CAC7BA,OAAAA,IAAU,OAAe,IACzBA,IAAU,OAAe,IACtB,GACT,CAUO,MAAMC,EAA2CA,CAAC,CACvDC,MAAAA,EAAQ,kBACRF,MAAAA,EAAQ,SACRG,IAAAA,EAAM,EACNC,UAAAA,EAAY,EACZC,KAAAA,EAAO,MACP,GAAGC,CACL,IACEC,UAAA,cAAC,OACC,OAAQF,EACR,MAAOA,EACP,GAAIC,EACJ,MAAO,CAAEE,kBAAmB,GAAGT,EAAYC,CAAK,CAAC,IAAK,EACtD,UAAU,6BACV,KAAK,MACL,kBAAgB,aAChB,QAAQ,WAER,EAAAO,EAAA,QAAA,cAAC,QAAM,CAAA,GAAG,SAAQ,wBAAsB,0BACvC,OAAK,CAAA,GAAG,QAAO,iDAA+C,EAC9DA,EAAA,QAAA,cAAA,QAAA,CACC,wBAAyB,CACvBE,OAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAYV,CAAE,CAAA,EAEHF,EAAA,QAAA,cAAA,SAAA,CACC,KAAK,eACL,GAAI,GACJ,GAAI,GACJ,EAAG,GAAKH,EAAY,EACpB,OAAQF,EACR,KAAK,OACL,YAAaE,EACb,gBAAiBM,KAAKC,GAAK,GAAK,GAAKR,GACrC,cAAc,OAAA,CAAO,CAEzB"}

package/dist/cjs/modules/core/hooks/useComponentVisible.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useComponentVisible.js","sources":["../../../../../src/modules/core/hooks/useComponentVisible.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nfunction contains(parent: HTMLElement \| null, child: HTMLElement) {\n if (!parent) return false;\n return parent === child \|\| parent.contains(child);\n}\n\ntype Options = {\n closeOnClickOutside: boolean;\n};\n\nexport default function useComponentVisible(\n isVisible: boolean,\n onClose: (event: Event) => void,\n options: Options,\n) {\n const ref = useRef<HTMLDivElement>(null);\n\n const handleKeydown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onClose(event);\n }\n };\n\n const handleClickOutside = (event: Event) => {\n if (\n options.closeOnClickOutside &&\n !contains(ref.current, event.target as HTMLElement)\n ) {\n onClose(event);\n }\n };\n\n useEffect(() => {\n if (isVisible) {\n document.addEventListener(\"keydown\", handleKeydown, true);\n document.addEventListener(\"click\", handleClickOutside, true);\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleKeydown, true);\n document.removeEventListener(\"click\", handleClickOutside, true);\n };\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n return { ref };\n}\n"],"names":["contains","parent","child","useComponentVisible","isVisible","onClose","options","ref","useRef","handleKeydown","event","key","handleClickOutside","closeOnClickOutside","current","target","useEffect","addEventListener","removeEventListener"],"mappings":"sCAEA,SAASA,EAASC,EAA4BC,EAAoB,~~CAChE~~,~~OAAKD~~,EACEA,IAAWC,GAASD,EAAOD,SAASE,CAAK,EAD5B,EAEtB,CAMwBC,SAAAA,EACtBC,EACAC,EACAC,EACA,CACMC,MAAAA,EAAMC,SAAuB,IAAI,EAEjCC,EAAiBC,GAAyB,CAC1CA,EAAMC,MAAQ,UAChBN,EAAQK,CAAK,CACf,EAGIE,EAAsBF,GAAiB,CAEzCJ,EAAQO,qBACR,CAACb,EAASO,EAAIO,QAASJ,EAAMK,~~SAE7BV~~,EAAQK,CAAK,CACf,EAGFM,OAAAA,EAAAA,UAAU,KACJZ,IACOa,SAAAA,iBAAiB,UAAWR,EAAe,EAAI,EAC/CQ,SAAAA,iBAAiB,QAASL,EAAoB,EAAI,GAGtD,IAAM,CACFM,SAAAA,oBAAoB,UAAWT,EAAe,EAAI,EAClDS,SAAAA,oBAAoB,QAASN,EAAoB,EAAI,CAAA,GAI/D,CAACR,CAAS,CAAC,EAEP,CAAEG,IAAAA,CAAAA,CACX"}
1	+ {"version":3,"file":"useComponentVisible.js","sources":["../../../../../src/modules/core/hooks/useComponentVisible.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nfunction contains(parent: HTMLElement \| null, child: HTMLElement) {\n if (!parent) return false;\n return parent === child \|\| parent.contains(child);\n}\n\ntype Options = {\n closeOnClickOutside: boolean;\n};\n\nexport default function useComponentVisible(\n isVisible: boolean,\n onClose: (event: Event) => void,\n options: Options,\n) {\n const ref = useRef<HTMLDivElement>(null);\n\n const handleKeydown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onClose(event);\n }\n };\n\n const handleClickOutside = (event: Event) => {\n if (\n options.closeOnClickOutside &&\n !contains(ref.current, event.target as HTMLElement)\n ) {\n onClose(event);\n }\n };\n\n useEffect(() => {\n if (isVisible) {\n document.addEventListener(\"keydown\", handleKeydown, true);\n document.addEventListener(\"click\", handleClickOutside, true);\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleKeydown, true);\n document.removeEventListener(\"click\", handleClickOutside, true);\n };\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isVisible]);\n\n return { ref };\n}\n"],"names":["contains","parent","child","useComponentVisible","isVisible","onClose","options","ref","useRef","handleKeydown","event","key","handleClickOutside","closeOnClickOutside","current","target","useEffect","addEventListener","removeEventListener"],"mappings":"sCAEA,SAASA,EAASC,EAA4BC,EAAoB,CAC5D,OAACD,EACEA,IAAWC,GAASD,EAAOD,SAASE,CAAK,EAD5B,EAEtB,CAMwBC,SAAAA,EACtBC,EACAC,EACAC,EACA,CACMC,MAAAA,EAAMC,SAAuB,IAAI,EAEjCC,EAAiBC,GAAyB,CAC1CA,EAAMC,MAAQ,UAChBN,EAAQK,CAAK,CACf,EAGIE,EAAsBF,GAAiB,CAEzCJ,EAAQO,qBACR,CAACb,EAASO,EAAIO,QAASJ,EAAMK,MAAqB,GAElDV,EAAQK,CAAK,CACf,EAGFM,OAAAA,EAAAA,UAAU,KACJZ,IACOa,SAAAA,iBAAiB,UAAWR,EAAe,EAAI,EAC/CQ,SAAAA,iBAAiB,QAASL,EAAoB,EAAI,GAGtD,IAAM,CACFM,SAAAA,oBAAoB,UAAWT,EAAe,EAAI,EAClDS,SAAAA,oBAAoB,QAASN,EAAoB,EAAI,CAAA,GAI/D,CAACR,CAAS,CAAC,EAEP,CAAEG,IAAAA,CAAAA,CACX"}

package/dist/cjs/modules/feed/components/EmptyFeed/EmptyFeed.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),r=require("@knocklabs/react-core");const d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(n),c=()=>{const{colorMode:e}=r.useKnockFeed(),{t:a}=r.useTranslations();return t.default.createElement("div",{className:`rnf-empty-feed rnf-empty-feed--${e}`},t.default.createElement("div",{className:"rnf-empty-feed__inner"},t.default.createElement("h2",{className:"rnf-empty-feed__header"},a("emptyFeedTitle")),t.default.createElement("p",{className:"rnf-empty-feed__body"},a("emptyFeedBody"))))};exports.EmptyFeed=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),r=require("@knocklabs/react-core");;/* empty css            */const d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(n),c=()=>{const{colorMode:e}=r.useKnockFeed(),{t:a}=r.useTranslations();return t.default.createElement("div",{className:`rnf-empty-feed rnf-empty-feed--${e}`},t.default.createElement("div",{className:"rnf-empty-feed__inner"},t.default.createElement("h2",{className:"rnf-empty-feed__header"},a("emptyFeedTitle")),t.default.createElement("p",{className:"rnf-empty-feed__body"},a("emptyFeedBody"))))};exports.EmptyFeed=c;
 //# sourceMappingURL=EmptyFeed.js.map

package/dist/cjs/modules/feed/components/EmptyFeed/EmptyFeed.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyFeed.js","sources":["../../../../../../src/modules/feed/components/EmptyFeed/EmptyFeed.tsx"],"sourcesContent":["import { useKnockFeed, useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport \"./styles.css\";\n\nexport const EmptyFeed: FunctionComponent = () => {\n const { colorMode } = useKnockFeed();\n const { t } = useTranslations();\n\n return (\n <div className={`rnf-empty-feed rnf-empty-feed--${colorMode}`}>\n <div className=\"rnf-empty-feed__inner\">\n <h2 className=\"rnf-empty-feed__header\">{t(\"emptyFeedTitle\")}</h2>\n <p className=\"rnf-empty-feed__body\">{t(\"emptyFeedBody\")}</p>\n </div>\n </div>\n );\n};\n"],"names":["EmptyFeed","colorMode","useKnockFeed","t","useTranslations","React"],"mappings":"4OAKaA,EAA+BA,IAAM,CAC1C,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAC7B,CAAEC,EAAAA,GAAMC,EAAgB,gBAAA,EAG5B,OAAAC,EAAAA,QAAA,cAAC,MAAI,CAAA,~~UAAY~~,~~kCAAiCJ~~,~~CAAU~~,~~EAC1D~~,EAAAI,EAAAA,QAAA,cAAC,MAAI,CAAA,UAAU,uBACb,EAAAA,UAAA,cAAC,KAAG,CAAA,UAAU,0BAA0BF,EAAE,gBAAgB,CAAE,EAC3DE,UAAA,cAAA,IAAA,CAAE,UAAU,sBAAA,EAAwBF,EAAE,eAAe,CAAE,CAC1D,CACF,CAEJ"}
1	+ {"version":3,"file":"EmptyFeed.js","sources":["../../../../../../src/modules/feed/components/EmptyFeed/EmptyFeed.tsx"],"sourcesContent":["import { useKnockFeed, useTranslations } from \"@knocklabs/react-core\";\nimport { FunctionComponent } from \"react\";\n\nimport \"./styles.css\";\n\nexport const EmptyFeed: FunctionComponent = () => {\n const { colorMode } = useKnockFeed();\n const { t } = useTranslations();\n\n return (\n <div className={`rnf-empty-feed rnf-empty-feed--${colorMode}`}>\n <div className=\"rnf-empty-feed__inner\">\n <h2 className=\"rnf-empty-feed__header\">{t(\"emptyFeedTitle\")}</h2>\n <p className=\"rnf-empty-feed__body\">{t(\"emptyFeedBody\")}</p>\n </div>\n </div>\n );\n};\n"],"names":["EmptyFeed","colorMode","useKnockFeed","t","useTranslations","React"],"mappings":"4OAKaA,EAA+BA,IAAM,CAC1C,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAC7B,CAAEC,EAAAA,GAAMC,EAAgB,gBAAA,EAG5B,OAAAC,EAAAA,QAAA,cAAC,MAAI,CAAA,UAAW,kCAAkCJ,CAAS,EACzD,EAAAI,EAAAA,QAAA,cAAC,MAAI,CAAA,UAAU,uBACb,EAAAA,UAAA,cAAC,KAAG,CAAA,UAAU,0BAA0BF,EAAE,gBAAgB,CAAE,EAC3DE,UAAA,cAAA,IAAA,CAAE,UAAU,sBAAA,EAAwBF,EAAE,eAAe,CAAE,CAC1D,CACF,CAEJ"}

package/dist/cjs/modules/feed/components/NotificationCell/ArchiveButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArchiveButton.js","sources":["../../../../../../src/modules/feed/components/NotificationCell/ArchiveButton.tsx"],"sourcesContent":["import { FeedItem } from \"@knocklabs/client\";\nimport { useKnockFeed, useTranslations } from \"@knocklabs/react-core\";\nimport React, { MouseEvent, useCallback } from \"react\";\nimport { usePopperTooltip } from \"react-popper-tooltip\";\n\nimport { CloseCircle } from \"../../../core/components/Icons\";\n\nexport interface ArchiveButtonProps {\n item: FeedItem;\n}\n\nconst ArchiveButton: React.FC<ArchiveButtonProps> = ({ item }) => {\n const { colorMode, feedClient } = useKnockFeed();\n const { t } = useTranslations();\n\n const onClick = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n e.stopPropagation();\n\n feedClient.markAsArchived(item);\n },\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [item],\n );\n\n const { getTooltipProps, setTooltipRef, setTriggerRef, visible } =\n usePopperTooltip({ placement: \"top-end\" });\n\n return (\n <button\n ref={setTriggerRef}\n onClick={onClick}\n type=\"button\"\n aria-label={t(\"archiveNotification\")}\n className={`rnf-archive-notification-btn rnf-archive-notification-btn--${colorMode}`}\n >\n <CloseCircle />\n\n {visible && (\n <div\n ref={setTooltipRef}\n {...getTooltipProps({\n className: `rnf-tooltip rnf-tooltip--${colorMode}`,\n })}\n >\n {t(\"archiveNotification\")}\n </div>\n )}\n </button>\n );\n};\n\nexport { ArchiveButton };\n"],"names":["ArchiveButton","item","colorMode","feedClient","useKnockFeed","t","useTranslations","onClick","useCallback","e","preventDefault","stopPropagation","markAsArchived","getTooltipProps","setTooltipRef","setTriggerRef","visible","usePopperTooltip","placement","React","CloseCircle","className"],"mappings":"wSAWMA,EAA8CA,CAAC,CAAEC,KAAAA,CAAK,IAAM,CAC1D,KAAA,CAAEC,UAAAA,EAAWC,WAAAA,GAAeC,EAAa,aAAA,EACzC,CAAEC,EAAAA,GAAMC,EAAgB,gBAAA,EAExBC,EAAUC,EAAAA,YACbC,GAAqC,CACpCA,EAAEC,eAAe,EACjBD,EAAEE,gBAAgB,EAElBR,EAAWS,eAAeX,CAAI,CAChC,EAGA,CAACA,CAAI,CAAA,EAGD,CAAEY,gBAAAA,EAAiBC,cAAAA,EAAeC,cAAAA,EAAeC,QAAAA,GACrDC,mBAAiB,CAAEC,UAAW,SAAA,CAAW,EAGzC,OAAAC,EAAA,QAAA,cAAC,SACC,CAAA,IAAKJ,EACL,QAAAR,EACA,KAAK,SACL,aAAYF,EAAE,qBAAqB,EACnC,~~UAAY~~,~~8DAA6DH~~,~~CAAU~~,EAAA,~~EAElFiB~~,EAAA,QAAA,cAAAC,EAAA,YAAA,IAAW,EAEXJ,2BACE,MACC,CAAA,IAAKF,EACL,GAAID,EAAgB,CAClBQ,~~UAAY~~,~~4BAA2BnB~~,~~CAAU~~,~~EAClD~~,CAAA,GAEAG,EAAE,qBAAqB,CAC1B,CAEJ,CAEJ"}
1	+ {"version":3,"file":"ArchiveButton.js","sources":["../../../../../../src/modules/feed/components/NotificationCell/ArchiveButton.tsx"],"sourcesContent":["import { FeedItem } from \"@knocklabs/client\";\nimport { useKnockFeed, useTranslations } from \"@knocklabs/react-core\";\nimport React, { MouseEvent, useCallback } from \"react\";\nimport { usePopperTooltip } from \"react-popper-tooltip\";\n\nimport { CloseCircle } from \"../../../core/components/Icons\";\n\nexport interface ArchiveButtonProps {\n item: FeedItem;\n}\n\nconst ArchiveButton: React.FC<ArchiveButtonProps> = ({ item }) => {\n const { colorMode, feedClient } = useKnockFeed();\n const { t } = useTranslations();\n\n const onClick = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n e.stopPropagation();\n\n feedClient.markAsArchived(item);\n },\n // TODO: Check if we can remove this disable\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [item],\n );\n\n const { getTooltipProps, setTooltipRef, setTriggerRef, visible } =\n usePopperTooltip({ placement: \"top-end\" });\n\n return (\n <button\n ref={setTriggerRef}\n onClick={onClick}\n type=\"button\"\n aria-label={t(\"archiveNotification\")}\n className={`rnf-archive-notification-btn rnf-archive-notification-btn--${colorMode}`}\n >\n <CloseCircle />\n\n {visible && (\n <div\n ref={setTooltipRef}\n {...getTooltipProps({\n className: `rnf-tooltip rnf-tooltip--${colorMode}`,\n })}\n >\n {t(\"archiveNotification\")}\n </div>\n )}\n </button>\n );\n};\n\nexport { ArchiveButton };\n"],"names":["ArchiveButton","item","colorMode","feedClient","useKnockFeed","t","useTranslations","onClick","useCallback","e","preventDefault","stopPropagation","markAsArchived","getTooltipProps","setTooltipRef","setTriggerRef","visible","usePopperTooltip","placement","React","CloseCircle","className"],"mappings":"wSAWMA,EAA8CA,CAAC,CAAEC,KAAAA,CAAK,IAAM,CAC1D,KAAA,CAAEC,UAAAA,EAAWC,WAAAA,GAAeC,EAAa,aAAA,EACzC,CAAEC,EAAAA,GAAMC,EAAgB,gBAAA,EAExBC,EAAUC,EAAAA,YACbC,GAAqC,CACpCA,EAAEC,eAAe,EACjBD,EAAEE,gBAAgB,EAElBR,EAAWS,eAAeX,CAAI,CAChC,EAGA,CAACA,CAAI,CAAA,EAGD,CAAEY,gBAAAA,EAAiBC,cAAAA,EAAeC,cAAAA,EAAeC,QAAAA,GACrDC,mBAAiB,CAAEC,UAAW,SAAA,CAAW,EAGzC,OAAAC,EAAA,QAAA,cAAC,SACC,CAAA,IAAKJ,EACL,QAAAR,EACA,KAAK,SACL,aAAYF,EAAE,qBAAqB,EACnC,UAAW,8DAA8DH,CAAS,EAAA,EAEjFiB,EAAA,QAAA,cAAAC,EAAA,YAAA,IAAW,EAEXJ,2BACE,MACC,CAAA,IAAKF,EACL,GAAID,EAAgB,CAClBQ,UAAW,4BAA4BnB,CAAS,EACjD,CAAA,GAEAG,EAAE,qBAAqB,CAC1B,CAEJ,CAEJ"}

package/dist/cjs/modules/feed/components/NotificationCell/Avatar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react");const s=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=s(i),f=({name:t,src:r})=>{function n(c){const[a,l]=c.split(" ");return a&&l?`${a.charAt(0)}${l.charAt(0)}`:a?a.charAt(0):""}return e.default.createElement("div",{className:"rnf-avatar"},r?e.default.createElement("img",{src:r,alt:`Image of ${t}`,className:"rnf-avatar__image"}):e.default.createElement("span",{className:"rnf-avatar__initials"},n(t)))};exports.Avatar=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react");;/* empty css            */const s=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=s(i),f=({name:t,src:r})=>{function n(c){const[a,l]=c.split(" ");return a&&l?`${a.charAt(0)}${l.charAt(0)}`:a?a.charAt(0):""}return e.default.createElement("div",{className:"rnf-avatar"},r?e.default.createElement("img",{src:r,alt:`Image of ${t}`,className:"rnf-avatar__image"}):e.default.createElement("span",{className:"rnf-avatar__initials"},n(t)))};exports.Avatar=f;
 //# sourceMappingURL=Avatar.js.map

package/dist/cjs/modules/feed/components/NotificationCell/Avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","sources":["../../../../../../src/modules/feed/components/NotificationCell/Avatar.tsx"],"sourcesContent":["import React from \"react\";\n\nimport \"./styles.css\";\n\nexport interface AvatarProps {\n name: string;\n src?: string \| null;\n}\n\nexport const Avatar: React.FC<AvatarProps> = ({ name, src }) => {\n function getInitials(name: string) {\n const [firstName, lastName] = name.split(\" \");\n return firstName && lastName\n ? `${firstName.charAt(0)}${lastName.charAt(0)}`\n : firstName\n ? firstName.charAt(0)\n : \"\";\n }\n\n return (\n <div className=\"rnf-avatar\">\n {src ? (\n <img src={src} alt={`Image of ${name}`} className=\"rnf-avatar__image\" />\n ) : (\n <span className=\"rnf-avatar__initials\">{getInitials(name)}</span>\n )}\n </div>\n );\n};\n"],"names":["Avatar","name","src","getInitials","firstName","lastName","split","charAt","React"],"mappings":"yMASaA,EAAgCA,CAAC,CAAEC,KAAAA,EAAMC,IAAAA,CAAI,IAAM,CAC9D,SAASC,EAAYF,EAAc,CACjC,KAAM,CAACG,EAAWC,CAAQ,EAAIJ,EAAKK,MAAM,GAAG,EAC5C,OAAOF,GAAaC,~~EACf~~,~~GAAED~~,EAAUG,OAAO,CAAC,~~CAAE~~,~~GAAEF~~,EAASE,OAAO,CAAC,~~CAAE~~,~~GAC5CH~~,EACEA,EAAUG,OAAO,CAAC,EAClB,EACR,CAGE,OAAAC,EAAA,QAAA,cAAC,OAAI,UAAU,YAAA,EACZN,EACEM,EAAAA,QAAA,cAAA,MAAA,CAAI,IAAAN,EAAU,~~IAAM~~,~~YAAWD~~,~~CAAK~~,~~GAAG~~,UAAU,mBAAA,CAAsB,EAEvEO,EAAA,QAAA,cAAA,OAAA,CAAK,UAAU,sBAAwBL,EAAAA,EAAYF,CAAI,CAAE,CAE9D,CAEJ"}
1	+ {"version":3,"file":"Avatar.js","sources":["../../../../../../src/modules/feed/components/NotificationCell/Avatar.tsx"],"sourcesContent":["import React from \"react\";\n\nimport \"./styles.css\";\n\nexport interface AvatarProps {\n name: string;\n src?: string \| null;\n}\n\nexport const Avatar: React.FC<AvatarProps> = ({ name, src }) => {\n function getInitials(name: string) {\n const [firstName, lastName] = name.split(\" \");\n return firstName && lastName\n ? `${firstName.charAt(0)}${lastName.charAt(0)}`\n : firstName\n ? firstName.charAt(0)\n : \"\";\n }\n\n return (\n <div className=\"rnf-avatar\">\n {src ? (\n <img src={src} alt={`Image of ${name}`} className=\"rnf-avatar__image\" />\n ) : (\n <span className=\"rnf-avatar__initials\">{getInitials(name)}</span>\n )}\n </div>\n );\n};\n"],"names":["Avatar","name","src","getInitials","firstName","lastName","split","charAt","React"],"mappings":"yMASaA,EAAgCA,CAAC,CAAEC,KAAAA,EAAMC,IAAAA,CAAI,IAAM,CAC9D,SAASC,EAAYF,EAAc,CACjC,KAAM,CAACG,EAAWC,CAAQ,EAAIJ,EAAKK,MAAM,GAAG,EAC5C,OAAOF,GAAaC,EAChB,GAAGD,EAAUG,OAAO,CAAC,CAAC,GAAGF,EAASE,OAAO,CAAC,CAAC,GAC3CH,EACEA,EAAUG,OAAO,CAAC,EAClB,EACR,CAGE,OAAAC,EAAA,QAAA,cAAC,OAAI,UAAU,YAAA,EACZN,EACEM,EAAAA,QAAA,cAAA,MAAA,CAAI,IAAAN,EAAU,IAAK,YAAYD,CAAI,GAAI,UAAU,mBAAA,CAAsB,EAEvEO,EAAA,QAAA,cAAA,OAAA,CAAK,UAAU,sBAAwBL,EAAAA,EAAYF,CAAI,CAAE,CAE9D,CAEJ"}

package/dist/cjs/modules/feed/components/NotificationCell/NotificationCell.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@knocklabs/react-core"),p=require("react"),A=require("../../../core/components/Button/Button.js"),B=require("../../../core/components/Button/ButtonGroup.js");require("lodash.debounce");const T=require("./ArchiveButton.js"),h=require("./Avatar.js");const w=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=w(p);function b(e){e&&e!==""&&setTimeout(()=>window.location.assign(e),200)}const M=t.default.forwardRef(({item:e,onItemClick:i,onButtonClick:s,avatar:v,children:d,archiveButton:y},N)=>{var _;const{feedClient:c,colorMode:E}=o.useKnockFeed(),{locale:k}=o.useTranslations(),l=p.useMemo(()=>e.blocks.reduce((a,n)=>({...a,[n.name]:n}),{}),[e]),f=(_=l.action_url)==null?void 0:_.rendered,m=l.actions,u=t.default.useCallback(()=>(c.markAsInteracted(e),i?i(e):b(f)),[e,f,i,c]),C=t.default.useCallback((a,n)=>(c.markAsInteracted(e),s?s(e,n):b(n.action)),[s,c,e]),q=t.default.useCallback(a=>{switch(a.key){case"Enter":{a.stopPropagation(),u();break}}},[u]),r=e.actors[0];return t.default.createElement("div",{ref:N,className:`rnf-notification-cell rnf-notification-cell--${E}`,onClick:u,onKeyDown:q,tabIndex:0},t.default.createElement("div",{className:"rnf-notification-cell__inner"},!e.read_at&&t.default.createElement("div",{className:"rnf-notification-cell__unread-dot"}),o.renderNodeOrFallback(v,r&&"name"in r&&r.name&&t.default.createElement(h.Avatar,{name:r.name,src:r.avatar})),t.default.createElement("div",{className:"rnf-notification-cell__content-outer"},l.body&&t.default.createElement("div",{className:"rnf-notification-cell__content",dangerouslySetInnerHTML:{__html:l.body.rendered}}),m&&t.default.createElement("div",{className:"rnf-notification-cell__button-group"},t.default.createElement(B.ButtonGroup,null,m.buttons.map((a,n)=>t.default.createElement(A.Button,{variant:n===0?"primary":"secondary",key:a.name,onClick:g=>C(g,a)},a.label)))),d&&t.default.createElement("div",{className:"rnf-notification-cell__child-content"},d),t.default.createElement("span",{className:"rnf-notification-cell__timestamp"},o.formatTimestamp(e.inserted_at,{locale:k}))),o.renderNodeOrFallback(y,t.default.createElement(T.ArchiveButton,{item:e}))))});exports.NotificationCell=M;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@knocklabs/react-core"),y=require("react"),A=require("../../../core/components/Button/Button.js"),B=require("../../../core/components/Button/ButtonGroup.js");require("lodash.debounce");const T=require("./ArchiveButton.js"),h=require("./Avatar.js");;/* empty css            */const w=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=w(y);function p(e){e&&e!==""&&setTimeout(()=>window.location.assign(e),200)}const M=t.default.forwardRef(({item:e,onItemClick:i,onButtonClick:s,avatar:b,children:f,archiveButton:k},v)=>{var _;const{feedClient:l,colorMode:N}=c.useKnockFeed(),{locale:E}=c.useTranslations(),o=y.useMemo(()=>e.blocks.reduce((n,a)=>({...n,[a.name]:a}),{}),[e]),u=(_=o.action_url)==null?void 0:_.rendered,m=o.actions,d=t.default.useCallback(()=>(l.markAsInteracted(e,{type:"cell_click",action:u}),i?i(e):p(u)),[e,u,i,l]),C=t.default.useCallback((n,a)=>(l.markAsInteracted(e,{type:"button_click",name:a.name,label:a.label,action:a.action}),s?s(e,a):p(a.action)),[s,l,e]),q=t.default.useCallback(n=>{switch(n.key){case"Enter":{n.stopPropagation(),d();break}}},[d]),r=e.actors[0];return t.default.createElement("div",{ref:v,className:`rnf-notification-cell rnf-notification-cell--${N}`,onClick:d,onKeyDown:q,tabIndex:0},t.default.createElement("div",{className:"rnf-notification-cell__inner"},!e.read_at&&t.default.createElement("div",{className:"rnf-notification-cell__unread-dot"}),c.renderNodeOrFallback(b,r&&"name"in r&&r.name&&t.default.createElement(h.Avatar,{name:r.name,src:r.avatar})),t.default.createElement("div",{className:"rnf-notification-cell__content-outer"},o.body&&t.default.createElement("div",{className:"rnf-notification-cell__content",dangerouslySetInnerHTML:{__html:o.body.rendered}}),m&&t.default.createElement("div",{className:"rnf-notification-cell__button-group"},t.default.createElement(B.ButtonGroup,null,m.buttons.map((n,a)=>t.default.createElement(A.Button,{variant:a===0?"primary":"secondary",key:n.name,onClick:g=>C(g,n)},n.label)))),f&&t.default.createElement("div",{className:"rnf-notification-cell__child-content"},f),t.default.createElement("span",{className:"rnf-notification-cell__timestamp"},c.formatTimestamp(e.inserted_at,{locale:E}))),c.renderNodeOrFallback(k,t.default.createElement(T.ArchiveButton,{item:e}))))});exports.NotificationCell=M;
 //# sourceMappingURL=NotificationCell.js.map

package/dist/cjs/modules/feed/components/NotificationCell/NotificationCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationCell.js","sources":["../../../../../../src/modules/feed/components/NotificationCell/NotificationCell.tsx"],"sourcesContent":["import {\n ActionButton,\n ButtonSetContentBlock,\n ContentBlock,\n FeedItem,\n MarkdownContentBlock,\n TextContentBlock,\n} from \"@knocklabs/client\";\nimport {\n formatTimestamp,\n renderNodeOrFallback,\n useKnockFeed,\n useTranslations,\n} from \"@knocklabs/react-core\";\nimport React, { ReactNode, useMemo } from \"react\";\n\nimport { Button, ButtonGroup } from \"../../../core\";\n\nimport { ArchiveButton } from \"./ArchiveButton\";\nimport { Avatar } from \"./Avatar\";\nimport \"./styles.css\";\n\nexport interface NotificationCellProps {\n item: FeedItem;\n // Invoked when the outer container is clicked\n onItemClick?: (item: FeedItem) => void;\n // Invoked when a button in the notification cell is clicked\n onButtonClick?: (item: FeedItem, action: ActionButton) => void;\n avatar?: ReactNode;\n children?: ReactNode;\n archiveButton?: ReactNode;\n}\n\ntype BlockByName = {\n [name: string]: ContentBlock;\n};\n\nfunction maybeNavigateToUrlWithDelay(url?: string) {\n if (url && url !== \"\") {\n setTimeout(() => window.location.assign(url), 200);\n }\n}\n\nexport const NotificationCell = React.forwardRef<\n HTMLDivElement,\n NotificationCellProps\n>(\n (\n { item, onItemClick, onButtonClick, avatar, children, archiveButton },\n ref,\n ) => {\n const { feedClient, colorMode } = useKnockFeed();\n const { locale } = useTranslations();\n\n const blocksByName: BlockByName = useMemo(() => {\n return item.blocks.reduce((acc, block) => {\n return { ...acc, [block.name]: block };\n }, {});\n }, [item]);\n\n const actionUrl = (blocksByName.action_url as TextContentBlock)?.rendered;\n const buttonSet = blocksByName.actions as ButtonSetContentBlock;\n\n const onContainerClickHandler = React.useCallback(() => {\n // Mark as interacted + read once we click the item\n feedClient.markAsInteracted(item);\n\n if (onItemClick) return onItemClick(item);\n\n return maybeNavigateToUrlWithDelay(actionUrl);\n }, [item, actionUrl, onItemClick, feedClient]);\n\n const onButtonClickHandler = React.useCallback(\n (e: React.MouseEvent, button: ActionButton) => {\n feedClient.markAsInteracted(item);\n\n if (onButtonClick) return onButtonClick(item, button);\n\n return maybeNavigateToUrlWithDelay(button.action);\n },\n [onButtonClick, feedClient, item],\n );\n\n const onKeyDown = React.useCallback(\n (ev: React.KeyboardEvent<HTMLDivElement>) => {\n switch (ev.key) {\n case \"Enter\": {\n ev.stopPropagation();\n onContainerClickHandler();\n break;\n }\n default:\n break;\n }\n },\n [onContainerClickHandler],\n );\n\n const actor = item.actors[0];\n\n return (\n <div\n ref={ref}\n className={`rnf-notification-cell rnf-notification-cell--${colorMode}`}\n onClick={onContainerClickHandler}\n onKeyDown={onKeyDown}\n tabIndex={0}\n >\n <div className=\"rnf-notification-cell__inner\">\n {!item.read_at && (\n <div className=\"rnf-notification-cell__unread-dot\" />\n )}\n\n {renderNodeOrFallback(\n avatar,\n actor && \"name\" in actor && actor.name && (\n <Avatar name={actor.name} src={actor.avatar} />\n ),\n )}\n\n <div className=\"rnf-notification-cell__content-outer\">\n {blocksByName.body && (\n <div\n className=\"rnf-notification-cell__content\"\n dangerouslySetInnerHTML={{\n __html: (blocksByName.body as MarkdownContentBlock).rendered,\n }}\n />\n )}\n\n {buttonSet && (\n <div className=\"rnf-notification-cell__button-group\">\n <ButtonGroup>\n {buttonSet.buttons.map((button, i) => (\n <Button\n variant={i === 0 ? \"primary\" : \"secondary\"}\n key={button.name}\n onClick={(e) => onButtonClickHandler(e, button)}\n >\n {button.label}\n </Button>\n ))}\n </ButtonGroup>\n </div>\n )}\n\n {children && (\n <div className=\"rnf-notification-cell__child-content\">\n {children}\n </div>\n )}\n\n <span className=\"rnf-notification-cell__timestamp\">\n {formatTimestamp(item.inserted_at, { locale })}\n </span>\n </div>\n\n {renderNodeOrFallback(archiveButton, <ArchiveButton item={item} />)}\n </div>\n </div>\n );\n },\n);\n"],"names":["maybeNavigateToUrlWithDelay","url","setTimeout","window","location","assign","NotificationCell","React","forwardRef","item","onItemClick","onButtonClick","avatar","children","archiveButton","ref","feedClient","colorMode","useKnockFeed","locale","useTranslations","blocksByName","useMemo","blocks","reduce","acc","block","name","actionUrl","action_url","rendered","buttonSet","actions","onContainerClickHandler","useCallback","markAsInteracted","onButtonClickHandler","e","button","~~action~~","onKeyDown","ev","key","stopPropagation","actor","actors","read_at","renderNodeOrFallback","Avatar","body","__html","ButtonGroup","buttons","map","i","Button","~~label","~~formatTimestamp","inserted_at","ArchiveButton"],"mappings":"ybAqCA,SAASA,EAA4BC,EAAc,CAC7CA,GAAOA,IAAQ,IACjBC,WAAW,IAAMC,OAAOC,SAASC,OAAOJ,CAAG,EAAG,GAAG,CAErD,CAEaK,MAAAA,EAAmBC,EAAAA,QAAMC,WAIpC,CACE,CAAEC,KAAAA,EAAMC,YAAAA,EAAaC,cAAAA,EAAeC,OAAAA,EAAQC,SAAAA,EAAUC,cAAAA,CAAc,EACpEC,IACG,OACG,KAAA,CAAEC,WAAAA,EAAYC,UAAAA,GAAcC,EAAa,aAAA,EACzC,CAAEC,OAAAA,GAAWC,EAAgB,gBAAA,EAE7BC,EAA4BC,EAAAA,QAAQ,IACjCb,EAAKc,OAAOC,OAAO,CAACC,EAAKC,KACvB,CAAE,GAAGD,EAAK,CAACC,EAAMC,IAAI,EAAGD,CAAAA,GAC9B,CAAE,CAAA,EACJ,CAACjB,CAAI,CAAC,EAEHmB,GAAaP,EAAAA,EAAaQ,aAAbR,YAAAA,EAA8CS,SAC3DC,EAAYV,EAAaW,QAEzBC,EAA0B1B,UAAM2B,YAAY,KAEhDlB,EAAWmB,iBAAiB1B,~~CAAI~~,~~EAE5BC~~,EAAoBA,EAAYD,CAAI,EAEjCT,EAA4B4B,CAAS,GAC3C,CAACnB,EAAMmB,EAAWlB,EAAaM,CAAU,CAAC,~~EAEvCoB~~,~~EAAuB7B~~,EAAAA,QAAM2B,YACjC,~~CAACG~~,EAAqBC,~~KACpBtB~~,EAAWmB,iBAAiB1B,~~CAAI~~,~~EAE5BE~~,EAAsBA,EAAcF,~~EAAM6B~~,CAAM,~~EAE7CtC~~,~~EAA4BsC~~,~~EAAOC~~,MAAM,GAElD,~~CAAC5B~~,EAAeK,EAAYP,CAAI,CAClC,~~EAEM+B~~,~~EAAYjC~~,EAAAA,QAAM2B,~~YACrBO~~,GAA4C,CAC3C,OAAQA,EAAGC,IAAG,CACZ,IAAK,QAAS,CACZD,EAAGE,gBAAgB,~~EACKV~~,IACxB,KACF,CAGF,CAAA,EAEF,CAACA,CAAuB,CAC1B,~~EAEMW~~,~~EAAQnC~~,~~EAAKoC~~,OAAO,CAAC,EAGzB,~~OAAAtC~~,EAAAA,QAAA,cAAC,OACC,IAAAQ,EACA,~~UAAY~~,~~gDAA+CE~~,~~CAAU~~,~~GACrE~~,QAASgB,EACT,~~UAAAO~~,EACA,SAAU,~~GAETjC~~,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,8BAAA,EACZ,CAACE,~~EAAKqC~~,~~SACJvC~~,EAAAA,QAAA,cAAA,MAAA,CAAI,UAAU,mCAAA,CAChB,~~EAEAwC~~,EAAAA,~~qBACCnC~~,~~EACAgC~~,GAAS,SAAUA,GAASA,~~EAAMjB~~,MAChCpB,EAAA,QAAA,~~cAACyC~~,UAAO,KAAMJ,~~EAAMjB~~,KAAM,~~IAAKiB~~,~~EAAMhC~~,QAEzC,EAEAL,EAAA,QAAA,cAAC,MAAI,CAAA,UAAU,sCACZc,EAAAA,~~EAAa4B~~,~~MACX1C~~,EAAA,QAAA,cAAA,MAAA,CACC,UAAU,iCACV,wBAAyB,~~CACvB2C~~,~~OAAS7B~~,~~EAAa4B~~,~~KAA8BnB~~,QACtD,CAAA,CAEH,EAEAC,GACCxB,UAAA,cAAC,OAAI,UAAU,qCAAA,EACZA,EAAA,QAAA,~~cAAA4C~~,EAAA,YAAA,~~KACEpB~~,~~EAAUqB~~,QAAQC,IAAI,CAACf,EAAQgB,~~IAC9B/C~~,EAAA,QAAA,~~cAACgD~~,EACC,OAAA,CAAA,QAASD,IAAM,EAAI,UAAY,YAC/B,IAAKhB,~~EAAOX~~,KACZ,~~QAAgBS~~,GAAAA,EAAqBC,EAAGC,CAAM,CAAA,EAE7CA,~~EAAOkB~~,KACV,CACD,CACH,CACF,~~EAGD3C~~,2BACE,MAAI,CAAA,UAAU,sCACZA,EAAAA,CACH,EAGFN,EAAA,QAAA,cAAC,QAAK,UAAU,kCAAA,~~EACbkD~~,EAAAA,~~gBAAgBhD~~,~~EAAKiD~~,YAAa,~~CAAEvC~~,OAAAA,CAAQ,CAAA,CAC/C,CACF,~~EAEC4B~~,~~uBAAqBjC~~,EAAeP,EAAA,QAAA,~~cAACoD~~,EAAAA,cAAc,CAAA,~~KAAAlD~~,GAAc,CACpE,CACF,CAEJ,CACF"}
1	+ {"version":3,"file":"NotificationCell.js","sources":["../../../../../../src/modules/feed/components/NotificationCell/NotificationCell.tsx"],"sourcesContent":["import {\n ActionButton,\n ButtonSetContentBlock,\n ContentBlock,\n FeedItem,\n MarkdownContentBlock,\n TextContentBlock,\n} from \"@knocklabs/client\";\nimport {\n formatTimestamp,\n renderNodeOrFallback,\n useKnockFeed,\n useTranslations,\n} from \"@knocklabs/react-core\";\nimport React, { ReactNode, useMemo } from \"react\";\n\nimport { Button, ButtonGroup } from \"../../../core\";\n\nimport { ArchiveButton } from \"./ArchiveButton\";\nimport { Avatar } from \"./Avatar\";\nimport \"./styles.css\";\n\nexport interface NotificationCellProps {\n item: FeedItem;\n // Invoked when the outer container is clicked\n onItemClick?: (item: FeedItem) => void;\n // Invoked when a button in the notification cell is clicked\n onButtonClick?: (item: FeedItem, action: ActionButton) => void;\n avatar?: ReactNode;\n children?: ReactNode;\n archiveButton?: ReactNode;\n}\n\ntype BlockByName = {\n [name: string]: ContentBlock;\n};\n\nfunction maybeNavigateToUrlWithDelay(url?: string) {\n if (url && url !== \"\") {\n setTimeout(() => window.location.assign(url), 200);\n }\n}\n\nexport const NotificationCell = React.forwardRef<\n HTMLDivElement,\n NotificationCellProps\n>(\n (\n { item, onItemClick, onButtonClick, avatar, children, archiveButton },\n ref,\n ) => {\n const { feedClient, colorMode } = useKnockFeed();\n const { locale } = useTranslations();\n\n const blocksByName: BlockByName = useMemo(() => {\n return item.blocks.reduce((acc, block) => {\n return { ...acc, [block.name]: block };\n }, {});\n }, [item]);\n\n const actionUrl = (blocksByName.action_url as TextContentBlock)?.rendered;\n const buttonSet = blocksByName.actions as ButtonSetContentBlock;\n\n const onContainerClickHandler = React.useCallback(() => {\n // Mark as interacted + read once we click the item\n feedClient.markAsInteracted(item, {\n type: \"cell_click\",\n action: actionUrl,\n });\n\n if (onItemClick) return onItemClick(item);\n\n return maybeNavigateToUrlWithDelay(actionUrl);\n }, [item, actionUrl, onItemClick, feedClient]);\n\n const onButtonClickHandler = React.useCallback(\n (e: React.MouseEvent, button: ActionButton) => {\n // Record the interaction with the metadata for the button that was clicked\n feedClient.markAsInteracted(item, {\n type: \"button_click\",\n name: button.name,\n label: button.label,\n action: button.action,\n });\n\n if (onButtonClick) return onButtonClick(item, button);\n\n return maybeNavigateToUrlWithDelay(button.action);\n },\n [onButtonClick, feedClient, item],\n );\n\n const onKeyDown = React.useCallback(\n (ev: React.KeyboardEvent<HTMLDivElement>) => {\n switch (ev.key) {\n case \"Enter\": {\n ev.stopPropagation();\n onContainerClickHandler();\n break;\n }\n default:\n break;\n }\n },\n [onContainerClickHandler],\n );\n\n const actor = item.actors[0];\n\n return (\n <div\n ref={ref}\n className={`rnf-notification-cell rnf-notification-cell--${colorMode}`}\n onClick={onContainerClickHandler}\n onKeyDown={onKeyDown}\n tabIndex={0}\n >\n <div className=\"rnf-notification-cell__inner\">\n {!item.read_at && (\n <div className=\"rnf-notification-cell__unread-dot\" />\n )}\n\n {renderNodeOrFallback(\n avatar,\n actor && \"name\" in actor && actor.name && (\n <Avatar name={actor.name} src={actor.avatar} />\n ),\n )}\n\n <div className=\"rnf-notification-cell__content-outer\">\n {blocksByName.body && (\n <div\n className=\"rnf-notification-cell__content\"\n dangerouslySetInnerHTML={{\n __html: (blocksByName.body as MarkdownContentBlock).rendered,\n }}\n />\n )}\n\n {buttonSet && (\n <div className=\"rnf-notification-cell__button-group\">\n <ButtonGroup>\n {buttonSet.buttons.map((button, i) => (\n <Button\n variant={i === 0 ? \"primary\" : \"secondary\"}\n key={button.name}\n onClick={(e) => onButtonClickHandler(e, button)}\n >\n {button.label}\n </Button>\n ))}\n </ButtonGroup>\n </div>\n )}\n\n {children && (\n <div className=\"rnf-notification-cell__child-content\">\n {children}\n </div>\n )}\n\n <span className=\"rnf-notification-cell__timestamp\">\n {formatTimestamp(item.inserted_at, { locale })}\n </span>\n </div>\n\n {renderNodeOrFallback(archiveButton, <ArchiveButton item={item} />)}\n </div>\n </div>\n );\n },\n);\n"],"names":["maybeNavigateToUrlWithDelay","url","setTimeout","window","location","assign","NotificationCell","React","forwardRef","item","onItemClick","onButtonClick","avatar","children","archiveButton","ref","feedClient","colorMode","useKnockFeed","locale","useTranslations","blocksByName","useMemo","blocks","reduce","acc","block","name","actionUrl","action_url","rendered","buttonSet","actions","onContainerClickHandler","useCallback","markAsInteracted","type","action","onButtonClickHandler","e","button","label","onKeyDown","ev","key","stopPropagation","actor","actors","read_at","renderNodeOrFallback","Avatar","body","__html","ButtonGroup","buttons","map","i","Button","formatTimestamp","inserted_at","ArchiveButton"],"mappings":"ybAqCA,SAASA,EAA4BC,EAAc,CAC7CA,GAAOA,IAAQ,IACjBC,WAAW,IAAMC,OAAOC,SAASC,OAAOJ,CAAG,EAAG,GAAG,CAErD,CAEaK,MAAAA,EAAmBC,EAAAA,QAAMC,WAIpC,CACE,CAAEC,KAAAA,EAAMC,YAAAA,EAAaC,cAAAA,EAAeC,OAAAA,EAAQC,SAAAA,EAAUC,cAAAA,CAAc,EACpEC,IACG,OACG,KAAA,CAAEC,WAAAA,EAAYC,UAAAA,GAAcC,EAAa,aAAA,EACzC,CAAEC,OAAAA,GAAWC,EAAgB,gBAAA,EAE7BC,EAA4BC,EAAAA,QAAQ,IACjCb,EAAKc,OAAOC,OAAO,CAACC,EAAKC,KACvB,CAAE,GAAGD,EAAK,CAACC,EAAMC,IAAI,EAAGD,CAAAA,GAC9B,CAAE,CAAA,EACJ,CAACjB,CAAI,CAAC,EAEHmB,GAAaP,EAAAA,EAAaQ,aAAbR,YAAAA,EAA8CS,SAC3DC,EAAYV,EAAaW,QAEzBC,EAA0B1B,UAAM2B,YAAY,KAEhDlB,EAAWmB,iBAAiB1B,EAAM,CAChC2B,KAAM,aACNC,OAAQT,CAAAA,CACT,EAEGlB,EAAoBA,EAAYD,CAAI,EAEjCT,EAA4B4B,CAAS,GAC3C,CAACnB,EAAMmB,EAAWlB,EAAaM,CAAU,CAAC,EAEvCsB,EAAuB/B,EAAAA,QAAM2B,YACjC,CAACK,EAAqBC,KAEpBxB,EAAWmB,iBAAiB1B,EAAM,CAChC2B,KAAM,eACNT,KAAMa,EAAOb,KACbc,MAAOD,EAAOC,MACdJ,OAAQG,EAAOH,MAAAA,CAChB,EAEG1B,EAAsBA,EAAcF,EAAM+B,CAAM,EAE7CxC,EAA4BwC,EAAOH,MAAM,GAElD,CAAC1B,EAAeK,EAAYP,CAAI,CAClC,EAEMiC,EAAYnC,EAAAA,QAAM2B,YACrBS,GAA4C,CAC3C,OAAQA,EAAGC,IAAG,CACZ,IAAK,QAAS,CACZD,EAAGE,gBAAgB,EACKZ,IACxB,KACF,CAGF,CAAA,EAEF,CAACA,CAAuB,CAC1B,EAEMa,EAAQrC,EAAKsC,OAAO,CAAC,EAGzB,OAAAxC,EAAAA,QAAA,cAAC,OACC,IAAAQ,EACA,UAAW,gDAAgDE,CAAS,GACpE,QAASgB,EACT,UAAAS,EACA,SAAU,GAETnC,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,8BAAA,EACZ,CAACE,EAAKuC,SACJzC,EAAAA,QAAA,cAAA,MAAA,CAAI,UAAU,mCAAA,CAChB,EAEA0C,EAAAA,qBACCrC,EACAkC,GAAS,SAAUA,GAASA,EAAMnB,MAChCpB,EAAA,QAAA,cAAC2C,UAAO,KAAMJ,EAAMnB,KAAM,IAAKmB,EAAMlC,QAEzC,EAEAL,EAAA,QAAA,cAAC,MAAI,CAAA,UAAU,sCACZc,EAAAA,EAAa8B,MACX5C,EAAA,QAAA,cAAA,MAAA,CACC,UAAU,iCACV,wBAAyB,CACvB6C,OAAS/B,EAAa8B,KAA8BrB,QACtD,CAAA,CAEH,EAEAC,GACCxB,UAAA,cAAC,OAAI,UAAU,qCAAA,EACZA,EAAA,QAAA,cAAA8C,EAAA,YAAA,KACEtB,EAAUuB,QAAQC,IAAI,CAACf,EAAQgB,IAC9BjD,EAAA,QAAA,cAACkD,EACC,OAAA,CAAA,QAASD,IAAM,EAAI,UAAY,YAC/B,IAAKhB,EAAOb,KACZ,QAAgBW,GAAAA,EAAqBC,EAAGC,CAAM,CAAA,EAE7CA,EAAOC,KACV,CACD,CACH,CACF,EAGD5B,2BACE,MAAI,CAAA,UAAU,sCACZA,EAAAA,CACH,EAGFN,EAAA,QAAA,cAAC,QAAK,UAAU,kCAAA,EACbmD,EAAAA,gBAAgBjD,EAAKkD,YAAa,CAAExC,OAAAA,CAAQ,CAAA,CAC/C,CACF,EAEC8B,uBAAqBnC,EAAeP,EAAA,QAAA,cAACqD,EAAAA,cAAc,CAAA,KAAAnD,GAAc,CACpE,CACF,CAEJ,CACF"}

package/dist/cjs/modules/feed/components/NotificationFeed/Dropdown.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@knocklabs/react-core"),a=require("react"),l=require("../../../core/components/Icons/ChevronDown.js");const d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(a),u=({children:e,value:o,onChange:r})=>{const{colorMode:n}=c.useKnockFeed();return t.default.createElement("div",{className:`rnf-dropdown rnf-dropdown--${n}`},t.default.createElement("select",{value:o,onChange:r},e),t.default.createElement(l.ChevronDown,null))};exports.Dropdown=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@knocklabs/react-core"),a=require("react"),l=require("../../../core/components/Icons/ChevronDown.js");;/* empty css            */const d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(a),u=({children:e,value:o,onChange:r})=>{const{colorMode:n}=c.useKnockFeed();return t.default.createElement("div",{className:`rnf-dropdown rnf-dropdown--${n}`},t.default.createElement("select",{value:o,onChange:r},e),t.default.createElement(l.ChevronDown,null))};exports.Dropdown=u;
 //# sourceMappingURL=Dropdown.js.map

package/dist/cjs/modules/feed/components/NotificationFeed/Dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dropdown.js","sources":["../../../../../../src/modules/feed/components/NotificationFeed/Dropdown.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { PropsWithChildren } from \"react\";\n\nimport { ChevronDown } from \"../../../core/components/Icons\";\n\nimport \"./styles.css\";\n\nexport type DropdownProps = {\n value: string;\n onChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;\n};\n\nexport const Dropdown: React.FC<PropsWithChildren<DropdownProps>> = ({\n children,\n value,\n onChange,\n}) => {\n const { colorMode } = useKnockFeed();\n\n return (\n <div className={`rnf-dropdown rnf-dropdown--${colorMode}`}>\n <select value={value} onChange={onChange}>\n {children}\n </select>\n <ChevronDown />\n </div>\n );\n};\n"],"names":["Dropdown","children","value","onChange","colorMode","useKnockFeed","React","ChevronDown"],"mappings":"uSAYaA,EAAuDA,CAAC,CACnEC,SAAAA,EACAC,MAAAA,EACAC,SAAAA,CACF,IAAM,CACE,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAEnC,OACGC,EAAA,QAAA,cAAA,MAAA,CAAI,~~UAAY~~,~~8BAA6BF~~,~~CAAU~~,~~EACtD~~,EAAAE,UAAA,cAAC,SAAO,CAAA,MAAAJ,EAAc,SAAAC,CACnBF,EAAAA,CACH,EACAK,EAAA,QAAA,cAACC,EAAAA,gBAAW,CACd,CAEJ"}
1	+ {"version":3,"file":"Dropdown.js","sources":["../../../../../../src/modules/feed/components/NotificationFeed/Dropdown.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { PropsWithChildren } from \"react\";\n\nimport { ChevronDown } from \"../../../core/components/Icons\";\n\nimport \"./styles.css\";\n\nexport type DropdownProps = {\n value: string;\n onChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;\n};\n\nexport const Dropdown: React.FC<PropsWithChildren<DropdownProps>> = ({\n children,\n value,\n onChange,\n}) => {\n const { colorMode } = useKnockFeed();\n\n return (\n <div className={`rnf-dropdown rnf-dropdown--${colorMode}`}>\n <select value={value} onChange={onChange}>\n {children}\n </select>\n <ChevronDown />\n </div>\n );\n};\n"],"names":["Dropdown","children","value","onChange","colorMode","useKnockFeed","React","ChevronDown"],"mappings":"uSAYaA,EAAuDA,CAAC,CACnEC,SAAAA,EACAC,MAAAA,EACAC,SAAAA,CACF,IAAM,CACE,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAEnC,OACGC,EAAA,QAAA,cAAA,MAAA,CAAI,UAAW,8BAA8BF,CAAS,EACrD,EAAAE,UAAA,cAAC,SAAO,CAAA,MAAAJ,EAAc,SAAAC,CACnBF,EAAAA,CACH,EACAK,EAAA,QAAA,cAACC,EAAAA,gBAAW,CACd,CAEJ"}

package/dist/cjs/modules/feed/components/NotificationFeed/MarkAsRead.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@knocklabs/react-core"),m=require("react"),f=require("../../../core/components/Icons/CheckmarkCircle.js");function b(e){if(e&&typeof e=="object"&&"default"in e)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const o=b(m),k=({onClick:e})=>{const{useFeedStore:r,feedClient:t,colorMode:n}=l.useKnockFeed(),{t:s}=l.useTranslations(),c=r(a=>a.items.filter(i=>!i.read_at)),u=r(a=>a.metadata.unread_count),d=o.useCallback(a=>{t.markAllAsRead(),e&&e(a,c)},[t,c,e]);return o.createElement("button",{className:`rnf-mark-all-as-read rnf-mark-all-as-read--${n}`,disabled:u===0,onClick:d,type:"button"},s("markAllAsRead"),o.createElement(f.CheckmarkCircle,null))};exports.MarkAsRead=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@knocklabs/react-core"),m=require("react"),f=require("../../../core/components/Icons/CheckmarkCircle.js");;/* empty css            */function b(e){if(e&&typeof e=="object"&&"default"in e)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const o=b(m),k=({onClick:e})=>{const{useFeedStore:r,feedClient:t,colorMode:n}=l.useKnockFeed(),{t:s}=l.useTranslations(),c=r(a=>a.items.filter(i=>!i.read_at)),u=r(a=>a.metadata.unread_count),d=o.useCallback(a=>{t.markAllAsRead(),e&&e(a,c)},[t,c,e]);return o.createElement("button",{className:`rnf-mark-all-as-read rnf-mark-all-as-read--${n}`,disabled:u===0,onClick:d,type:"button"},s("markAllAsRead"),o.createElement(f.CheckmarkCircle,null))};exports.MarkAsRead=k;
 //# sourceMappingURL=MarkAsRead.js.map

package/dist/cjs/modules/feed/components/NotificationFeed/MarkAsRead.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MarkAsRead.js","sources":["../../../../../../src/modules/feed/components/NotificationFeed/MarkAsRead.tsx"],"sourcesContent":["import { FeedItem } from \"@knocklabs/client\";\nimport { useKnockFeed, useTranslations } from \"@knocklabs/react-core\";\nimport * as React from \"react\";\n\nimport { CheckmarkCircle } from \"../../../core/components/Icons\";\n\nimport \"./styles.css\";\n\nexport type MarkAsReadProps = {\n onClick?: (e: React.MouseEvent, unreadItems: FeedItem[]) => void;\n};\n\nexport const MarkAsRead: React.FC<MarkAsReadProps> = ({ onClick }) => {\n const { useFeedStore, feedClient, colorMode } = useKnockFeed();\n const { t } = useTranslations();\n\n const unreadItems = useFeedStore((state) =>\n state.items.filter((item) => !item.read_at),\n );\n\n const unreadCount = useFeedStore((state) => state.metadata.unread_count);\n\n const onClickHandler = React.useCallback(\n (e: React.MouseEvent) => {\n feedClient.markAllAsRead();\n if (onClick) onClick(e, unreadItems);\n },\n [feedClient, unreadItems, onClick],\n );\n\n return (\n <button\n className={`rnf-mark-all-as-read rnf-mark-all-as-read--${colorMode}`}\n disabled={unreadCount === 0}\n onClick={onClickHandler}\n type=\"button\"\n >\n {t(\"markAllAsRead\")}\n <CheckmarkCircle />\n </button>\n );\n};\n"],"names":["MarkAsRead","onClick","useFeedStore","feedClient","colorMode","useKnockFeed","t","useTranslations","unreadItems","state","items","filter","item","read_at","unreadCount","metadata","unread_count","onClickHandler","React","useCallback","e","markAllAsRead","CheckmarkCircle"],"mappings":"ijBAYaA,EAAwCA,CAAC,CAAEC,QAAAA,CAAQ,IAAM,CAC9D,KAAA,CAAEC,aAAAA,EAAcC,WAAAA,EAAYC,UAAAA,GAAcC,EAAa,aAAA,EACvD,CAAEC,EAAAA,GAAMC,EAAgB,gBAAA,EAExBC,EAAcN,EAAcO,GAChCA,EAAMC,MAAMC,OAAiBC,GAAA,CAACA,EAAKC,OAAO,CAC5C,EAEMC,EAAcZ,EAAwBO,GAAAA,EAAMM,SAASC,YAAY,EAEjEC,EAAiBC,EAAMC,YAC1BC,GAAwB,CACvBjB,EAAWkB,cAAc,EACrBpB,~~GAASA~~,~~EAAQmB~~,EAAGZ,CAAW,CAErC,EAAA,CAACL,EAAYK,EAAaP,CAAO,CACnC,EAEA,uBACG,SACC,CAAA,~~UAAY~~,~~8CAA6CG~~,~~CAAU~~,~~GACnE~~,SAAUU,IAAgB,EAC1B,QAASG,EACT,KAAK,QAEJX,EAAAA,EAAE,eAAe,EAClBY,EAAA,cAACI,sBAAe,CAClB,CAEJ"}
1	+ {"version":3,"file":"MarkAsRead.js","sources":["../../../../../../src/modules/feed/components/NotificationFeed/MarkAsRead.tsx"],"sourcesContent":["import { FeedItem } from \"@knocklabs/client\";\nimport { useKnockFeed, useTranslations } from \"@knocklabs/react-core\";\nimport * as React from \"react\";\n\nimport { CheckmarkCircle } from \"../../../core/components/Icons\";\n\nimport \"./styles.css\";\n\nexport type MarkAsReadProps = {\n onClick?: (e: React.MouseEvent, unreadItems: FeedItem[]) => void;\n};\n\nexport const MarkAsRead: React.FC<MarkAsReadProps> = ({ onClick }) => {\n const { useFeedStore, feedClient, colorMode } = useKnockFeed();\n const { t } = useTranslations();\n\n const unreadItems = useFeedStore((state) =>\n state.items.filter((item) => !item.read_at),\n );\n\n const unreadCount = useFeedStore((state) => state.metadata.unread_count);\n\n const onClickHandler = React.useCallback(\n (e: React.MouseEvent) => {\n feedClient.markAllAsRead();\n if (onClick) onClick(e, unreadItems);\n },\n [feedClient, unreadItems, onClick],\n );\n\n return (\n <button\n className={`rnf-mark-all-as-read rnf-mark-all-as-read--${colorMode}`}\n disabled={unreadCount === 0}\n onClick={onClickHandler}\n type=\"button\"\n >\n {t(\"markAllAsRead\")}\n <CheckmarkCircle />\n </button>\n );\n};\n"],"names":["MarkAsRead","onClick","useFeedStore","feedClient","colorMode","useKnockFeed","t","useTranslations","unreadItems","state","items","filter","item","read_at","unreadCount","metadata","unread_count","onClickHandler","React","useCallback","e","markAllAsRead","CheckmarkCircle"],"mappings":"ijBAYaA,EAAwCA,CAAC,CAAEC,QAAAA,CAAQ,IAAM,CAC9D,KAAA,CAAEC,aAAAA,EAAcC,WAAAA,EAAYC,UAAAA,GAAcC,EAAa,aAAA,EACvD,CAAEC,EAAAA,GAAMC,EAAgB,gBAAA,EAExBC,EAAcN,EAAcO,GAChCA,EAAMC,MAAMC,OAAiBC,GAAA,CAACA,EAAKC,OAAO,CAC5C,EAEMC,EAAcZ,EAAwBO,GAAAA,EAAMM,SAASC,YAAY,EAEjEC,EAAiBC,EAAMC,YAC1BC,GAAwB,CACvBjB,EAAWkB,cAAc,EACrBpB,GAAiBmB,EAAAA,EAAGZ,CAAW,CAErC,EAAA,CAACL,EAAYK,EAAaP,CAAO,CACnC,EAEA,uBACG,SACC,CAAA,UAAW,8CAA8CG,CAAS,GAClE,SAAUU,IAAgB,EAC1B,QAASG,EACT,KAAK,QAEJX,EAAAA,EAAE,eAAe,EAClBY,EAAA,cAACI,sBAAe,CAClB,CAEJ"}

package/dist/cjs/modules/feed/components/NotificationFeed/NotificationFeed.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@knocklabs/client"),c=require("@knocklabs/react-core"),n=require("react"),w=require("../../../core/components/Spinner/Spinner.js"),R=require("../../../core/hooks/useOnBottomScroll.js"),I=require("../EmptyFeed/EmptyFeed.js"),B=require("../NotificationCell/NotificationCell.js");const H=require("./NotificationFeedHeader.js");const M=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=M(n),j=e=>t.default.createElement(B.NotificationCell,{key:e.item.id,...e}),x=e=>t.default.createElement(H.NotificationFeedHeader,{...e}),g=({colorMode:e})=>t.default.createElement("div",{className:"rnf-notification-feed__spinner-container"},t.default.createElement(w.Spinner,{thickness:3,size:"16px",color:e==="dark"?"rgba(255, 255, 255, 0.65)":void 0})),K="https://knock.app?utm_source=powered-by-knock&utm_medium=referral&utm_campaign=knock-branding-feed",O=({EmptyComponent:e=t.default.createElement(I.EmptyFeed,null),renderItem:E=j,onNotificationClick:_,onNotificationButtonClick:N,onMarkAllAsReadClick:S,initialFilterStatus:i=c.FilterStatus.All,header:q,renderHeader:b=x})=>{const[l,u]=n.useState(i),{feedClient:a,useFeedStore:F,colorMode:s}=c.useKnockFeed(),{settings:f}=c.useFeedSettings(a),{t:h}=c.useTranslations(),{pageInfo:m,items:k,networkStatus:o}=F(),p=n.useRef(null);n.useEffect(()=>{u(i)},[i]),n.useEffect(()=>{a.fetch({status:l})},[a,l]);const y=k.length===0,d=r.isRequestInFlight(o),C=n.useCallback(()=>{!d&&m.after&&a.fetchNextPage()},[d,m,a]);return R({ref:p,callback:C,offset:70}),t.default.createElement("div",{className:`rnf-notification-feed rnf-notification-feed--${s}`},q||b({setFilterStatus:u,filterStatus:l,onMarkAllAsReadClick:S}),t.default.createElement("div",{className:"rnf-notification-feed__container",ref:p},o===r.NetworkStatus.loading&&t.default.createElement(g,{colorMode:s}),t.default.createElement("div",{className:"rnf-notification-feed__feed-items-container"},o!==r.NetworkStatus.loading&&k.map(v=>E({item:v,onItemClick:_,onButtonClick:N}))),o===r.NetworkStatus.fetchMore&&t.default.createElement(g,{colorMode:s}),!d&&y&&e),(f==null?void 0:f.features.branding_required)&&t.default.createElement("div",{className:"rnf-notification-feed__knock-branding"},t.default.createElement("a",{href:K,target:"_blank"},h("poweredBy"))))};exports.NotificationFeed=O;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@knocklabs/client"),c=require("@knocklabs/react-core"),n=require("react"),w=require("../../../core/components/Spinner/Spinner.js"),R=require("../../../core/hooks/useOnBottomScroll.js"),I=require("../EmptyFeed/EmptyFeed.js"),B=require("../NotificationCell/NotificationCell.js");;/* empty css                              */const H=require("./NotificationFeedHeader.js");;/* empty css            */const M=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=M(n),j=e=>t.default.createElement(B.NotificationCell,{key:e.item.id,...e}),x=e=>t.default.createElement(H.NotificationFeedHeader,{...e}),g=({colorMode:e})=>t.default.createElement("div",{className:"rnf-notification-feed__spinner-container"},t.default.createElement(w.Spinner,{thickness:3,size:"16px",color:e==="dark"?"rgba(255, 255, 255, 0.65)":void 0})),K="https://knock.app?utm_source=powered-by-knock&utm_medium=referral&utm_campaign=knock-branding-feed",O=({EmptyComponent:e=t.default.createElement(I.EmptyFeed,null),renderItem:E=j,onNotificationClick:_,onNotificationButtonClick:N,onMarkAllAsReadClick:S,initialFilterStatus:i=c.FilterStatus.All,header:q,renderHeader:b=x})=>{const[l,u]=n.useState(i),{feedClient:a,useFeedStore:F,colorMode:s}=c.useKnockFeed(),{settings:f}=c.useFeedSettings(a),{t:h}=c.useTranslations(),{pageInfo:m,items:k,networkStatus:o}=F(),p=n.useRef(null);n.useEffect(()=>{u(i)},[i]),n.useEffect(()=>{a.fetch({status:l})},[a,l]);const y=k.length===0,d=r.isRequestInFlight(o),C=n.useCallback(()=>{!d&&m.after&&a.fetchNextPage()},[d,m,a]);return R({ref:p,callback:C,offset:70}),t.default.createElement("div",{className:`rnf-notification-feed rnf-notification-feed--${s}`},q||b({setFilterStatus:u,filterStatus:l,onMarkAllAsReadClick:S}),t.default.createElement("div",{className:"rnf-notification-feed__container",ref:p},o===r.NetworkStatus.loading&&t.default.createElement(g,{colorMode:s}),t.default.createElement("div",{className:"rnf-notification-feed__feed-items-container"},o!==r.NetworkStatus.loading&&k.map(v=>E({item:v,onItemClick:_,onButtonClick:N}))),o===r.NetworkStatus.fetchMore&&t.default.createElement(g,{colorMode:s}),!d&&y&&e),(f==null?void 0:f.features.branding_required)&&t.default.createElement("div",{className:"rnf-notification-feed__knock-branding"},t.default.createElement("a",{href:K,target:"_blank"},h("poweredBy"))))};exports.NotificationFeed=O;
 //# sourceMappingURL=NotificationFeed.js.map

package/dist/cjs/modules/feed/components/NotificationFeed/NotificationFeed.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationFeed.js","sources":["../../../../../../src/modules/feed/components/NotificationFeed/NotificationFeed.tsx"],"sourcesContent":["import { FeedItem, NetworkStatus, isRequestInFlight } from \"@knocklabs/client\";\nimport {\n ColorMode,\n FilterStatus,\n useFeedSettings,\n useKnockFeed,\n useTranslations,\n} from \"@knocklabs/react-core\";\nimport { GenericData } from \"@knocklabs/types\";\nimport React, {\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport { Spinner } from \"../../../core/components/Spinner\";\nimport useOnBottomScroll from \"../../../core/hooks/useOnBottomScroll\";\nimport { EmptyFeed } from \"../EmptyFeed\";\nimport { NotificationCell, NotificationCellProps } from \"../NotificationCell\";\n\nimport {\n NotificationFeedHeader,\n NotificationFeedHeaderProps,\n} from \"./NotificationFeedHeader\";\nimport \"./styles.css\";\n\nexport type RenderItemProps<T = GenericData> = {\n item: FeedItem<T>;\n onItemClick?: NotificationCellProps[\"onItemClick\"];\n onButtonClick?: NotificationCellProps[\"onButtonClick\"];\n};\n\nexport type RenderItem = (props: RenderItemProps) => ReactNode;\n\nexport interface NotificationFeedProps {\n EmptyComponent?: ReactNode;\n /*\n @deprecated Use `renderHeader` instead to accept `NotificationFeedHeaderProps`\n */\n header?: ReactNode;\n renderItem?: RenderItem;\n renderHeader?: (props: NotificationFeedHeaderProps) => ReactNode;\n onNotificationClick?: NotificationCellProps[\"onItemClick\"];\n onNotificationButtonClick?: NotificationCellProps[\"onButtonClick\"];\n onMarkAllAsReadClick?: (e: React.MouseEvent, unreadItems: FeedItem[]) => void;\n initialFilterStatus?: FilterStatus;\n}\n\nconst defaultRenderItem = (props: RenderItemProps) => (\n <NotificationCell key={props.item.id} {...props} />\n);\n\nconst defaultRenderHeader = (props: NotificationFeedHeaderProps) => (\n <NotificationFeedHeader {...props} />\n);\n\nconst LoadingSpinner = ({ colorMode }: { colorMode: ColorMode }) => (\n <div className=\"rnf-notification-feed__spinner-container\">\n <Spinner\n thickness={3}\n size=\"16px\"\n color={colorMode === \"dark\" ? \"rgba(255, 255, 255, 0.65)\" : undefined}\n />\n </div>\n);\n\nconst poweredByKnockUrl =\n \"https://knock.app?utm_source=powered-by-knock&utm_medium=referral&utm_campaign=knock-branding-feed\";\n\nexport const NotificationFeed: React.FC<NotificationFeedProps> = ({\n EmptyComponent = <EmptyFeed />,\n renderItem = defaultRenderItem,\n onNotificationClick,\n onNotificationButtonClick,\n onMarkAllAsReadClick,\n initialFilterStatus = FilterStatus.All,\n header,\n renderHeader = defaultRenderHeader,\n}) => {\n const [status, setStatus] = useState(initialFilterStatus);\n const { feedClient, useFeedStore, colorMode } = useKnockFeed();\n const { settings } = useFeedSettings(feedClient);\n const { t } = useTranslations();\n\n const { pageInfo, items, networkStatus } = useFeedStore();\n const containerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n setStatus(initialFilterStatus);\n }, [initialFilterStatus]);\n\n useEffect(() => {\n // When the feed client changes, or the status changes issue a re-fetch\n feedClient.fetch({ status });\n }, [feedClient, status]);\n\n const noItems = items.length === 0;\n const requestInFlight = isRequestInFlight(networkStatus);\n\n // Handle fetching more once we reach the bottom of the list\n const onBottomCallback = useCallback(() => {\n if (!requestInFlight && pageInfo.after) {\n feedClient.fetchNextPage();\n }\n }, [requestInFlight, pageInfo, feedClient]);\n\n // Once we scroll to the bottom of the view we want to automatically fetch\n // more items for the feed and bring them into the list\n useOnBottomScroll({\n ref: containerRef,\n callback: onBottomCallback,\n offset: 70,\n });\n\n return (\n <div\n className={`rnf-notification-feed rnf-notification-feed--${colorMode}`}\n >\n {header \|\|\n renderHeader({\n setFilterStatus: setStatus,\n filterStatus: status,\n onMarkAllAsReadClick,\n })}\n\n <div className=\"rnf-notification-feed__container\" ref={containerRef}>\n {networkStatus === NetworkStatus.loading && (\n <LoadingSpinner colorMode={colorMode} />\n )}\n\n <div className=\"rnf-notification-feed__feed-items-container\">\n {networkStatus !== NetworkStatus.loading &&\n items.map((item: FeedItem) =>\n renderItem({\n item,\n onItemClick: onNotificationClick,\n onButtonClick: onNotificationButtonClick,\n }),\n )}\n </div>\n\n {networkStatus === NetworkStatus.fetchMore && (\n <LoadingSpinner colorMode={colorMode} />\n )}\n\n {!requestInFlight && noItems && EmptyComponent}\n </div>\n\n {settings?.features.branding_required && (\n <div className=\"rnf-notification-feed__knock-branding\">\n <a href={poweredByKnockUrl} target=\"_blank\">\n {t(\"poweredBy\")}\n </a>\n </div>\n )}\n </div>\n );\n};\n"],"names":["defaultRenderItem","props","React","NotificationCell","item","id","defaultRenderHeader","NotificationFeedHeader","LoadingSpinner","colorMode","Spinner","undefined","poweredByKnockUrl","NotificationFeed","EmptyComponent","EmptyFeed","renderItem","onNotificationClick","onNotificationButtonClick","onMarkAllAsReadClick","initialFilterStatus","FilterStatus","All","header","renderHeader","status","setStatus","useState","feedClient","useFeedStore","useKnockFeed","settings","useFeedSettings","t","useTranslations","pageInfo","items","networkStatus","containerRef","useRef","useEffect","fetch","noItems","length","requestInFlight","isRequestInFlight","onBottomCallback","useCallback","after","fetchNextPage","useOnBottomScroll","ref","callback","offset","setFilterStatus","filterStatus","NetworkStatus","loading","map","onItemClick","onButtonClick","fetchMore","features","branding_required"],"mappings":"kjBAkDMA,EAAqBC,GACxBC,UAAA,cAAAC,EAAAA,iBAAA,CAAiB,IAAKF,EAAMG,KAAKC,GAAI,GAAIJ,CAC3C,CAAA,EAEKK,EAAuBL,GAC1BC,UAAA,cAAAK,EAAAA,uBAAA,CAA2BN,GAAAA,CAC7B,CAAA,EAEKO,EAAiBA,CAAC,CAAEC,UAAAA,CAAoC,IAC3DP,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,oEACZQ,UACC,CAAA,UAAW,EACX,KAAK,OACL,MAAOD,IAAc,OAAS,4BAA8BE,MAAU,CAAA,CAE1E,EAGIC,EACJ,qGAEWC,EAAoDA,CAAC,CAChEC,eAAAA,0BAAkBC,EAAAA,UAAY,IAAA,EAC9BC,WAAAA,EAAahB,EACbiB,oBAAAA,EACAC,0BAAAA,EACAC,qBAAAA,EACAC,oBAAAA,EAAsBC,EAAaC,aAAAA,IACnCC,OAAAA,EACAC,aAAAA,EAAelB,CACjB,IAAM,CACJ,KAAM,CAACmB,EAAQC,CAAS,EAAIC,WAASP,CAAmB,EAClD,CAAEQ,WAAAA,EAAYC,aAAAA,EAAcpB,UAAAA,GAAcqB,EAAa,aAAA,EACvD,CAAEC,SAAAA,CAAAA,EAAaC,EAAAA,gBAAgBJ,CAAU,EACzC,CAAEK,EAAAA,GAAMC,EAAgB,gBAAA,EAExB,CAAEC,SAAAA,EAAUC,MAAAA,EAAOC,cAAAA,GAAkBR,EAAa,EAClDS,EAAeC,SAAuB,IAAI,EAEhDC,EAAAA,UAAU,IAAM,CACdd,EAAUN,CAAmB,CAAA,EAC5B,CAACA,CAAmB,CAAC,EAExBoB,EAAAA,UAAU,IAAM,CAEdZ,EAAWa,MAAM,CAAEhB,OAAAA,CAAAA,CAAQ,CAAA,EAC1B,CAACG,EAAYH,CAAM,CAAC,EAEjBiB,MAAAA,EAAUN,EAAMO,SAAW,EAC3BC,EAAkBC,oBAAkBR,CAAa,EAGjDS,EAAmBC,EAAAA,YAAY,IAAM,CACrC,CAACH,GAAmBT,EAASa,OAC/BpB,EAAWqB,cAAc,CAE1B,EAAA,CAACL,EAAiBT,EAAUP,CAAU,CAAC,EAIxB,OAAAsB,EAAA,CAChBC,IAAKb,EACLc,SAAUN,EACVO,OAAQ,EAAA,CACT,0BAGE,MACC,CAAA,~~UAAY~~,~~gDAA+C5C~~,~~CAAU~~,~~IAEpEc~~,GACCC,EAAa,CACX8B,gBAAiB5B,EACjB6B,aAAc9B,EACdN,qBAAAA,CAAAA,CACD,EAEHjB,EAAA,QAAA,cAAC,MAAI,CAAA,UAAU,mCAAmC,IAAKoC,CACpDD,EAAAA,IAAkBmB,EAAcC,cAAAA,SAC9BvD,EAAA,QAAA,cAAAM,EAAA,CAAe,UAAAC,CACjB,CAAA,EAEDP,EAAAA,QAAA,cAAC,MAAI,CAAA,UAAU,6CACZmC,EAAAA,IAAkBmB,EAAAA,cAAcC,SAC/BrB,EAAMsB,IAAKtD,GACTY,EAAW,CACTZ,KAAAA,EACAuD,YAAa1C,EACb2C,cAAe1C,CAAAA,CAChB,CACH,CACJ,EAECmB,IAAkBmB,EAAAA,cAAcK,WAC9B3D,EAAAA,QAAA,cAAAM,EAAA,CAAe,UAAAC,CACjB,CAAA,EAEA,CAACmC,GAAmBF,GAAW5B,CAClC,GAECiB,GAAAA,YAAAA,EAAU+B,SAASC,oBAClB7D,EAAA,QAAA,cAAC,MAAI,CAAA,UAAU,yCACZA,EAAAA,QAAA,cAAA,IAAA,CAAE,KAAMU,EAAmB,OAAO,QAChCqB,EAAAA,EAAE,WAAW,CAChB,CACF,CAEJ,CAEJ"}
1	+ {"version":3,"file":"NotificationFeed.js","sources":["../../../../../../src/modules/feed/components/NotificationFeed/NotificationFeed.tsx"],"sourcesContent":["import { FeedItem, NetworkStatus, isRequestInFlight } from \"@knocklabs/client\";\nimport {\n ColorMode,\n FilterStatus,\n useFeedSettings,\n useKnockFeed,\n useTranslations,\n} from \"@knocklabs/react-core\";\nimport { GenericData } from \"@knocklabs/types\";\nimport React, {\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport { Spinner } from \"../../../core/components/Spinner\";\nimport useOnBottomScroll from \"../../../core/hooks/useOnBottomScroll\";\nimport { EmptyFeed } from \"../EmptyFeed\";\nimport { NotificationCell, NotificationCellProps } from \"../NotificationCell\";\n\nimport {\n NotificationFeedHeader,\n NotificationFeedHeaderProps,\n} from \"./NotificationFeedHeader\";\nimport \"./styles.css\";\n\nexport type RenderItemProps<T = GenericData> = {\n item: FeedItem<T>;\n onItemClick?: NotificationCellProps[\"onItemClick\"];\n onButtonClick?: NotificationCellProps[\"onButtonClick\"];\n};\n\nexport type RenderItem = (props: RenderItemProps) => ReactNode;\n\nexport interface NotificationFeedProps {\n EmptyComponent?: ReactNode;\n /*\n @deprecated Use `renderHeader` instead to accept `NotificationFeedHeaderProps`\n */\n header?: ReactNode;\n renderItem?: RenderItem;\n renderHeader?: (props: NotificationFeedHeaderProps) => ReactNode;\n onNotificationClick?: NotificationCellProps[\"onItemClick\"];\n onNotificationButtonClick?: NotificationCellProps[\"onButtonClick\"];\n onMarkAllAsReadClick?: (e: React.MouseEvent, unreadItems: FeedItem[]) => void;\n initialFilterStatus?: FilterStatus;\n}\n\nconst defaultRenderItem = (props: RenderItemProps) => (\n <NotificationCell key={props.item.id} {...props} />\n);\n\nconst defaultRenderHeader = (props: NotificationFeedHeaderProps) => (\n <NotificationFeedHeader {...props} />\n);\n\nconst LoadingSpinner = ({ colorMode }: { colorMode: ColorMode }) => (\n <div className=\"rnf-notification-feed__spinner-container\">\n <Spinner\n thickness={3}\n size=\"16px\"\n color={colorMode === \"dark\" ? \"rgba(255, 255, 255, 0.65)\" : undefined}\n />\n </div>\n);\n\nconst poweredByKnockUrl =\n \"https://knock.app?utm_source=powered-by-knock&utm_medium=referral&utm_campaign=knock-branding-feed\";\n\nexport const NotificationFeed: React.FC<NotificationFeedProps> = ({\n EmptyComponent = <EmptyFeed />,\n renderItem = defaultRenderItem,\n onNotificationClick,\n onNotificationButtonClick,\n onMarkAllAsReadClick,\n initialFilterStatus = FilterStatus.All,\n header,\n renderHeader = defaultRenderHeader,\n}) => {\n const [status, setStatus] = useState(initialFilterStatus);\n const { feedClient, useFeedStore, colorMode } = useKnockFeed();\n const { settings } = useFeedSettings(feedClient);\n const { t } = useTranslations();\n\n const { pageInfo, items, networkStatus } = useFeedStore();\n const containerRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n setStatus(initialFilterStatus);\n }, [initialFilterStatus]);\n\n useEffect(() => {\n // When the feed client changes, or the status changes issue a re-fetch\n feedClient.fetch({ status });\n }, [feedClient, status]);\n\n const noItems = items.length === 0;\n const requestInFlight = isRequestInFlight(networkStatus);\n\n // Handle fetching more once we reach the bottom of the list\n const onBottomCallback = useCallback(() => {\n if (!requestInFlight && pageInfo.after) {\n feedClient.fetchNextPage();\n }\n }, [requestInFlight, pageInfo, feedClient]);\n\n // Once we scroll to the bottom of the view we want to automatically fetch\n // more items for the feed and bring them into the list\n useOnBottomScroll({\n ref: containerRef,\n callback: onBottomCallback,\n offset: 70,\n });\n\n return (\n <div\n className={`rnf-notification-feed rnf-notification-feed--${colorMode}`}\n >\n {header \|\|\n renderHeader({\n setFilterStatus: setStatus,\n filterStatus: status,\n onMarkAllAsReadClick,\n })}\n\n <div className=\"rnf-notification-feed__container\" ref={containerRef}>\n {networkStatus === NetworkStatus.loading && (\n <LoadingSpinner colorMode={colorMode} />\n )}\n\n <div className=\"rnf-notification-feed__feed-items-container\">\n {networkStatus !== NetworkStatus.loading &&\n items.map((item: FeedItem) =>\n renderItem({\n item,\n onItemClick: onNotificationClick,\n onButtonClick: onNotificationButtonClick,\n }),\n )}\n </div>\n\n {networkStatus === NetworkStatus.fetchMore && (\n <LoadingSpinner colorMode={colorMode} />\n )}\n\n {!requestInFlight && noItems && EmptyComponent}\n </div>\n\n {settings?.features.branding_required && (\n <div className=\"rnf-notification-feed__knock-branding\">\n <a href={poweredByKnockUrl} target=\"_blank\">\n {t(\"poweredBy\")}\n </a>\n </div>\n )}\n </div>\n );\n};\n"],"names":["defaultRenderItem","props","React","NotificationCell","item","id","defaultRenderHeader","NotificationFeedHeader","LoadingSpinner","colorMode","Spinner","undefined","poweredByKnockUrl","NotificationFeed","EmptyComponent","EmptyFeed","renderItem","onNotificationClick","onNotificationButtonClick","onMarkAllAsReadClick","initialFilterStatus","FilterStatus","All","header","renderHeader","status","setStatus","useState","feedClient","useFeedStore","useKnockFeed","settings","useFeedSettings","t","useTranslations","pageInfo","items","networkStatus","containerRef","useRef","useEffect","fetch","noItems","length","requestInFlight","isRequestInFlight","onBottomCallback","useCallback","after","fetchNextPage","useOnBottomScroll","ref","callback","offset","setFilterStatus","filterStatus","NetworkStatus","loading","map","onItemClick","onButtonClick","fetchMore","features","branding_required"],"mappings":"kjBAkDMA,EAAqBC,GACxBC,UAAA,cAAAC,EAAAA,iBAAA,CAAiB,IAAKF,EAAMG,KAAKC,GAAI,GAAIJ,CAC3C,CAAA,EAEKK,EAAuBL,GAC1BC,UAAA,cAAAK,EAAAA,uBAAA,CAA2BN,GAAAA,CAC7B,CAAA,EAEKO,EAAiBA,CAAC,CAAEC,UAAAA,CAAoC,IAC3DP,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,oEACZQ,UACC,CAAA,UAAW,EACX,KAAK,OACL,MAAOD,IAAc,OAAS,4BAA8BE,MAAU,CAAA,CAE1E,EAGIC,EACJ,qGAEWC,EAAoDA,CAAC,CAChEC,eAAAA,0BAAkBC,EAAAA,UAAY,IAAA,EAC9BC,WAAAA,EAAahB,EACbiB,oBAAAA,EACAC,0BAAAA,EACAC,qBAAAA,EACAC,oBAAAA,EAAsBC,EAAaC,aAAAA,IACnCC,OAAAA,EACAC,aAAAA,EAAelB,CACjB,IAAM,CACJ,KAAM,CAACmB,EAAQC,CAAS,EAAIC,WAASP,CAAmB,EAClD,CAAEQ,WAAAA,EAAYC,aAAAA,EAAcpB,UAAAA,GAAcqB,EAAa,aAAA,EACvD,CAAEC,SAAAA,CAAAA,EAAaC,EAAAA,gBAAgBJ,CAAU,EACzC,CAAEK,EAAAA,GAAMC,EAAgB,gBAAA,EAExB,CAAEC,SAAAA,EAAUC,MAAAA,EAAOC,cAAAA,GAAkBR,EAAa,EAClDS,EAAeC,SAAuB,IAAI,EAEhDC,EAAAA,UAAU,IAAM,CACdd,EAAUN,CAAmB,CAAA,EAC5B,CAACA,CAAmB,CAAC,EAExBoB,EAAAA,UAAU,IAAM,CAEdZ,EAAWa,MAAM,CAAEhB,OAAAA,CAAAA,CAAQ,CAAA,EAC1B,CAACG,EAAYH,CAAM,CAAC,EAEjBiB,MAAAA,EAAUN,EAAMO,SAAW,EAC3BC,EAAkBC,oBAAkBR,CAAa,EAGjDS,EAAmBC,EAAAA,YAAY,IAAM,CACrC,CAACH,GAAmBT,EAASa,OAC/BpB,EAAWqB,cAAc,CAE1B,EAAA,CAACL,EAAiBT,EAAUP,CAAU,CAAC,EAIxB,OAAAsB,EAAA,CAChBC,IAAKb,EACLc,SAAUN,EACVO,OAAQ,EAAA,CACT,0BAGE,MACC,CAAA,UAAW,gDAAgD5C,CAAS,IAEnEc,GACCC,EAAa,CACX8B,gBAAiB5B,EACjB6B,aAAc9B,EACdN,qBAAAA,CAAAA,CACD,EAEHjB,EAAA,QAAA,cAAC,MAAI,CAAA,UAAU,mCAAmC,IAAKoC,CACpDD,EAAAA,IAAkBmB,EAAcC,cAAAA,SAC9BvD,EAAA,QAAA,cAAAM,EAAA,CAAe,UAAAC,CACjB,CAAA,EAEDP,EAAAA,QAAA,cAAC,MAAI,CAAA,UAAU,6CACZmC,EAAAA,IAAkBmB,EAAAA,cAAcC,SAC/BrB,EAAMsB,IAAKtD,GACTY,EAAW,CACTZ,KAAAA,EACAuD,YAAa1C,EACb2C,cAAe1C,CAAAA,CAChB,CACH,CACJ,EAECmB,IAAkBmB,EAAAA,cAAcK,WAC9B3D,EAAAA,QAAA,cAAAM,EAAA,CAAe,UAAAC,CACjB,CAAA,EAEA,CAACmC,GAAmBF,GAAW5B,CAClC,GAECiB,GAAAA,YAAAA,EAAU+B,SAASC,oBAClB7D,EAAA,QAAA,cAAC,MAAI,CAAA,UAAU,yCACZA,EAAAA,QAAA,cAAA,IAAA,CAAE,KAAMU,EAAmB,OAAO,QAChCqB,EAAAA,EAAE,WAAW,CAChB,CACF,CAEJ,CAEJ"}

package/dist/cjs/modules/feed/components/NotificationFeedContainer/NotificationFeedContainer.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react");const o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=o(t),i=({children:e})=>a.default.createElement("div",{className:"rnf-feed-provider"},e);exports.NotificationFeedContainer=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react");;/* empty css            */const o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=o(t),i=({children:e})=>a.default.createElement("div",{className:"rnf-feed-provider"},e);exports.NotificationFeedContainer=i;
 //# sourceMappingURL=NotificationFeedContainer.js.map

package/dist/cjs/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("@knocklabs/react-core"),a=require("react"),y=require("react-popper"),F=require("../../../core/hooks/useComponentVisible.js"),N=require("../NotificationFeed/NotificationFeed.js");require("../NotificationFeed/NotificationFeedHeader.js");const _=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=_(a),b=({store:e,feedClient:t})=>{e.metadata.unseen_count>0&&t.markAllAsSeen()},P=({isVisible:e,onOpen:t=b,onClose:c,buttonRef:f,closeOnClickOutside:s=!0,placement:u="bottom-end",...d})=>{const{colorMode:p,feedClient:r,useFeedStore:l}=q.useKnockFeed(),n=l(),{ref:i}=F(e,c,{closeOnClickOutside:s}),{styles:m,attributes:v}=y.usePopper(f.current,i.current,{strategy:"fixed",placement:u,modifiers:[{name:"offset",options:{offset:[0,8]}}]});return a.useEffect(()=>{e&&t&&t({store:n,feedClient:r})},[e,t,n,r]),o.default.createElement("div",{className:`rnf-notification-feed-popover rnf-notification-feed-popover--${p}`,style:{...m.popper,visibility:e?"visible":"hidden",opacity:e?1:0},ref:i,...v.popper,role:"dialog",tabIndex:-1},o.default.createElement("div",{className:"rnf-notification-feed-popover__inner"},o.default.createElement(N.NotificationFeed,{...d})))};exports.NotificationFeedPopover=P;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("@knocklabs/react-core"),a=require("react"),y=require("react-popper"),F=require("../../../core/hooks/useComponentVisible.js"),N=require("../NotificationFeed/NotificationFeed.js");require("../NotificationFeed/NotificationFeedHeader.js");;/* empty css                              */;/* empty css            */const _=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=_(a),b=({store:e,feedClient:t})=>{e.metadata.unseen_count>0&&t.markAllAsSeen()},P=({isVisible:e,onOpen:t=b,onClose:c,buttonRef:f,closeOnClickOutside:s=!0,placement:u="bottom-end",...d})=>{const{colorMode:p,feedClient:r,useFeedStore:l}=q.useKnockFeed(),n=l(),{ref:i}=F(e,c,{closeOnClickOutside:s}),{styles:m,attributes:v}=y.usePopper(f.current,i.current,{strategy:"fixed",placement:u,modifiers:[{name:"offset",options:{offset:[0,8]}}]});return a.useEffect(()=>{e&&t&&t({store:n,feedClient:r})},[e,t,n,r]),o.default.createElement("div",{className:`rnf-notification-feed-popover rnf-notification-feed-popover--${p}`,style:{...m.popper,visibility:e?"visible":"hidden",opacity:e?1:0},ref:i,...v.popper,role:"dialog",tabIndex:-1},o.default.createElement("div",{className:"rnf-notification-feed-popover__inner"},o.default.createElement(N.NotificationFeed,{...d})))};exports.NotificationFeedPopover=P;
 //# sourceMappingURL=NotificationFeedPopover.js.map

package/dist/cjs/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationFeedPopover.js","sources":["../../../../../../src/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.tsx"],"sourcesContent":["import { Feed, FeedStoreState } from \"@knocklabs/client\";\nimport { useKnockFeed } from \"@knocklabs/react-core\";\nimport { Placement } from \"@popperjs/core\";\nimport React, { RefObject, useEffect } from \"react\";\nimport { usePopper } from \"react-popper\";\n\nimport useComponentVisible from \"../../../core/hooks/useComponentVisible\";\nimport { NotificationFeed, NotificationFeedProps } from \"../NotificationFeed\";\n\nimport \"./styles.css\";\n\ntype OnOpenOptions = {\n store: FeedStoreState;\n feedClient: Feed;\n};\n\nconst defaultOnOpen = ({ store, feedClient }: OnOpenOptions) => {\n if (store.metadata.unseen_count > 0) {\n feedClient.markAllAsSeen();\n }\n};\n\nexport interface NotificationFeedPopoverProps extends NotificationFeedProps {\n isVisible: boolean;\n onOpen?: (arg: OnOpenOptions) => void;\n onClose: (e: Event) => void;\n buttonRef: RefObject<HTMLElement>;\n closeOnClickOutside?: boolean;\n placement?: Placement;\n}\n\nexport const NotificationFeedPopover: React.FC<\n NotificationFeedPopoverProps\n> = ({\n isVisible,\n onOpen = defaultOnOpen,\n onClose,\n buttonRef,\n closeOnClickOutside = true,\n placement = \"bottom-end\",\n ...feedProps\n}) => {\n const { colorMode, feedClient, useFeedStore } = useKnockFeed();\n const store = useFeedStore();\n\n const { ref: popperRef } = useComponentVisible(isVisible, onClose, {\n closeOnClickOutside,\n });\n\n const { styles, attributes } = usePopper(\n buttonRef.current,\n popperRef.current,\n {\n strategy: \"fixed\",\n placement,\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 8],\n },\n },\n ],\n },\n );\n\n useEffect(() => {\n // Whenever the feed is opened, we want to invoke the `onOpen` callback\n // function to handle any side effects.\n if (isVisible && onOpen) {\n onOpen({ store, feedClient });\n }\n }, [isVisible, onOpen, store, feedClient]);\n\n return (\n <div\n className={`rnf-notification-feed-popover rnf-notification-feed-popover--${colorMode}`}\n style={{\n ...styles.popper,\n visibility: isVisible ? \"visible\" : \"hidden\",\n opacity: isVisible ? 1 : 0,\n }}\n ref={popperRef}\n {...attributes.popper}\n role=\"dialog\"\n tabIndex={-1}\n >\n <div className=\"rnf-notification-feed-popover__inner\">\n <NotificationFeed {...feedProps} />\n </div>\n </div>\n );\n};\n"],"names":["defaultOnOpen","store","feedClient","metadata","unseen_count","markAllAsSeen","NotificationFeedPopover","isVisible","onOpen","onClose","buttonRef","closeOnClickOutside","placement","feedProps","colorMode","useFeedStore","useKnockFeed","ref","popperRef","useComponentVisible","styles","attributes","usePopper","current","strategy","modifiers","name","options","offset","useEffect","popper","visibility","opacity","React","NotificationFeed"],"mappings":"ydAgBMA,EAAgBA,CAAC,CAAEC,MAAAA,EAAOC,WAAAA,CAA0B,IAAM,CAC1DD,EAAME,SAASC,aAAe,GAChCF,EAAWG,cAAc,CAE7B,EAWaC,EAETA,CAAC,CACHC,UAAAA,EACAC,OAAAA,EAASR,EACTS,QAAAA,EACAC,UAAAA,EACAC,oBAAAA,EAAsB,GACtBC,UAAAA,EAAY,aACZ,GAAGC,CACL,IAAM,CACE,KAAA,CAAEC,UAAAA,EAAWZ,WAAAA,EAAYa,aAAAA,GAAiBC,EAAa,aAAA,EACvDf,EAAQc,IAER,CAAEE,IAAKC,CAAAA,EAAcC,EAAoBZ,EAAWE,EAAS,CACjEE,oBAAAA,CAAAA,CACD,EAEK,CAAES,OAAAA,EAAQC,WAAAA,CAAeC,EAAAA,EAAAA,UAC7BZ,EAAUa,QACVL,EAAUK,QACV,CACEC,SAAU,QACVZ,UAAAA,EACAa,UAAW,CACT,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,CAAC,CACf,CAAA,CACD,CAAA,CAGP,EAEAC,OAAAA,EAAAA,UAAU,IAAM,CAGVtB,GAAaC,GACRA,EAAA,CAAEP,MAAAA,EAAOC,WAAAA,CAAAA,CAAY,GAE7B,CAACK,EAAWC,EAAQP,EAAOC,CAAU,CAAC,0BAGtC,MACC,CAAA,~~UAAY~~,~~gEAA+DY~~,~~CAAU~~,~~GACrF~~,MAAO,CACL,GAAGM,EAAOU,OACVC,WAAYxB,EAAY,UAAY,SACpCyB,QAASzB,EAAY,EAAI,GAE3B,IAAKW,EACL,GAAIG,EAAWS,OACf,KAAK,SACL,SAAU,IAETG,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,sCACb,EAAAA,EAAA,QAAA,cAACC,EAAAA,kBAAiB,GAAIrB,CAAU,CAAA,CAClC,CACF,CAEJ"}
1	+ {"version":3,"file":"NotificationFeedPopover.js","sources":["../../../../../../src/modules/feed/components/NotificationFeedPopover/NotificationFeedPopover.tsx"],"sourcesContent":["import { Feed, FeedStoreState } from \"@knocklabs/client\";\nimport { useKnockFeed } from \"@knocklabs/react-core\";\nimport { Placement } from \"@popperjs/core\";\nimport React, { RefObject, useEffect } from \"react\";\nimport { usePopper } from \"react-popper\";\n\nimport useComponentVisible from \"../../../core/hooks/useComponentVisible\";\nimport { NotificationFeed, NotificationFeedProps } from \"../NotificationFeed\";\n\nimport \"./styles.css\";\n\ntype OnOpenOptions = {\n store: FeedStoreState;\n feedClient: Feed;\n};\n\nconst defaultOnOpen = ({ store, feedClient }: OnOpenOptions) => {\n if (store.metadata.unseen_count > 0) {\n feedClient.markAllAsSeen();\n }\n};\n\nexport interface NotificationFeedPopoverProps extends NotificationFeedProps {\n isVisible: boolean;\n onOpen?: (arg: OnOpenOptions) => void;\n onClose: (e: Event) => void;\n buttonRef: RefObject<HTMLElement>;\n closeOnClickOutside?: boolean;\n placement?: Placement;\n}\n\nexport const NotificationFeedPopover: React.FC<\n NotificationFeedPopoverProps\n> = ({\n isVisible,\n onOpen = defaultOnOpen,\n onClose,\n buttonRef,\n closeOnClickOutside = true,\n placement = \"bottom-end\",\n ...feedProps\n}) => {\n const { colorMode, feedClient, useFeedStore } = useKnockFeed();\n const store = useFeedStore();\n\n const { ref: popperRef } = useComponentVisible(isVisible, onClose, {\n closeOnClickOutside,\n });\n\n const { styles, attributes } = usePopper(\n buttonRef.current,\n popperRef.current,\n {\n strategy: \"fixed\",\n placement,\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 8],\n },\n },\n ],\n },\n );\n\n useEffect(() => {\n // Whenever the feed is opened, we want to invoke the `onOpen` callback\n // function to handle any side effects.\n if (isVisible && onOpen) {\n onOpen({ store, feedClient });\n }\n }, [isVisible, onOpen, store, feedClient]);\n\n return (\n <div\n className={`rnf-notification-feed-popover rnf-notification-feed-popover--${colorMode}`}\n style={{\n ...styles.popper,\n visibility: isVisible ? \"visible\" : \"hidden\",\n opacity: isVisible ? 1 : 0,\n }}\n ref={popperRef}\n {...attributes.popper}\n role=\"dialog\"\n tabIndex={-1}\n >\n <div className=\"rnf-notification-feed-popover__inner\">\n <NotificationFeed {...feedProps} />\n </div>\n </div>\n );\n};\n"],"names":["defaultOnOpen","store","feedClient","metadata","unseen_count","markAllAsSeen","NotificationFeedPopover","isVisible","onOpen","onClose","buttonRef","closeOnClickOutside","placement","feedProps","colorMode","useFeedStore","useKnockFeed","ref","popperRef","useComponentVisible","styles","attributes","usePopper","current","strategy","modifiers","name","options","offset","useEffect","popper","visibility","opacity","React","NotificationFeed"],"mappings":"ydAgBMA,EAAgBA,CAAC,CAAEC,MAAAA,EAAOC,WAAAA,CAA0B,IAAM,CAC1DD,EAAME,SAASC,aAAe,GAChCF,EAAWG,cAAc,CAE7B,EAWaC,EAETA,CAAC,CACHC,UAAAA,EACAC,OAAAA,EAASR,EACTS,QAAAA,EACAC,UAAAA,EACAC,oBAAAA,EAAsB,GACtBC,UAAAA,EAAY,aACZ,GAAGC,CACL,IAAM,CACE,KAAA,CAAEC,UAAAA,EAAWZ,WAAAA,EAAYa,aAAAA,GAAiBC,EAAa,aAAA,EACvDf,EAAQc,IAER,CAAEE,IAAKC,CAAAA,EAAcC,EAAoBZ,EAAWE,EAAS,CACjEE,oBAAAA,CAAAA,CACD,EAEK,CAAES,OAAAA,EAAQC,WAAAA,CAAeC,EAAAA,EAAAA,UAC7BZ,EAAUa,QACVL,EAAUK,QACV,CACEC,SAAU,QACVZ,UAAAA,EACAa,UAAW,CACT,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,CAAC,CACf,CAAA,CACD,CAAA,CAGP,EAEAC,OAAAA,EAAAA,UAAU,IAAM,CAGVtB,GAAaC,GACRA,EAAA,CAAEP,MAAAA,EAAOC,WAAAA,CAAAA,CAAY,GAE7B,CAACK,EAAWC,EAAQP,EAAOC,CAAU,CAAC,0BAGtC,MACC,CAAA,UAAW,gEAAgEY,CAAS,GACpF,MAAO,CACL,GAAGM,EAAOU,OACVC,WAAYxB,EAAY,UAAY,SACpCyB,QAASzB,EAAY,EAAI,GAE3B,IAAKW,EACL,GAAIG,EAAWS,OACf,KAAK,SACL,SAAU,IAETG,EAAA,QAAA,cAAA,MAAA,CAAI,UAAU,sCACb,EAAAA,EAAA,QAAA,cAACC,EAAAA,kBAAiB,GAAIrB,CAAU,CAAA,CAClC,CACF,CAEJ"}

package/dist/cjs/modules/feed/components/NotificationIconButton/NotificationIconButton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@knocklabs/react-core"),r=require("react"),i=require("../../../core/components/Icons/Bell.js"),l=require("../UnseenBadge/UnseenBadge.js");const u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=u(r),f=t.default.forwardRef(({onClick:e,badgeCountType:n},o)=>{const{colorMode:a}=c.useKnockFeed();return t.default.createElement("button",{className:`rnf-notification-icon-button rnf-notification-icon-button--${a}`,role:"button","aria-label":"Open notification feed",ref:o,onClick:e},t.default.createElement(i.BellIcon,null),t.default.createElement(l.UnseenBadge,{badgeCountType:n}))});exports.NotificationIconButton=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@knocklabs/react-core"),r=require("react"),i=require("../../../core/components/Icons/Bell.js"),l=require("../UnseenBadge/UnseenBadge.js");;/* empty css            */const u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=u(r),f=t.default.forwardRef(({onClick:e,badgeCountType:n},o)=>{const{colorMode:a}=c.useKnockFeed();return t.default.createElement("button",{className:`rnf-notification-icon-button rnf-notification-icon-button--${a}`,role:"button","aria-label":"Open notification feed",ref:o,onClick:e},t.default.createElement(i.BellIcon,null),t.default.createElement(l.UnseenBadge,{badgeCountType:n}))});exports.NotificationIconButton=f;
 //# sourceMappingURL=NotificationIconButton.js.map

package/dist/cjs/modules/feed/components/NotificationIconButton/NotificationIconButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationIconButton.js","sources":["../../../../../../src/modules/feed/components/NotificationIconButton/NotificationIconButton.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { SyntheticEvent } from \"react\";\n\nimport { BellIcon } from \"../../../core/components/Icons\";\nimport { BadgeCountType, UnseenBadge } from \"../UnseenBadge\";\n\nimport \"./styles.css\";\n\nexport interface NotificationIconButtonProps {\n // What value should we use to drive the badge count?\n badgeCountType?: BadgeCountType;\n onClick: (e: SyntheticEvent) => void;\n}\n\nexport const NotificationIconButton = React.forwardRef<\n HTMLButtonElement,\n NotificationIconButtonProps\n>(({ onClick, badgeCountType }, ref) => {\n const { colorMode } = useKnockFeed();\n\n return (\n <button\n className={`rnf-notification-icon-button rnf-notification-icon-button--${colorMode}`}\n role=\"button\"\n aria-label=\"Open notification feed\"\n ref={ref}\n onClick={onClick}\n >\n <BellIcon />\n <UnseenBadge badgeCountType={badgeCountType} />\n </button>\n );\n});\n"],"names":["NotificationIconButton","React","forwardRef","onClick","badgeCountType","ref","colorMode","useKnockFeed","BellIcon","UnseenBadge"],"mappings":"2UAcaA,EAAyBC,EAAAA,QAAMC,WAG1C,CAAC,CAAEC,QAAAA,EAASC,eAAAA,CAAe,EAAGC,IAAQ,CAChC,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAEnC,+BACG,SACC,CAAA,~~UAAY~~,~~8DAA6DD~~,~~CAAU~~,~~GACnF~~,KAAK,SACL,aAAW,yBACX,IAAAD,EACA,QAAAF,GAECF,EAAAA,QAAA,cAAAO,EAAA,SAAA,IAAQ,EACRP,EAAA,QAAA,cAAAQ,EAAA,YAAA,CAAY,eAAAL,EAA+B,CAC9C,CAEJ,CAAC"}
1	+ {"version":3,"file":"NotificationIconButton.js","sources":["../../../../../../src/modules/feed/components/NotificationIconButton/NotificationIconButton.tsx"],"sourcesContent":["import { useKnockFeed } from \"@knocklabs/react-core\";\nimport React, { SyntheticEvent } from \"react\";\n\nimport { BellIcon } from \"../../../core/components/Icons\";\nimport { BadgeCountType, UnseenBadge } from \"../UnseenBadge\";\n\nimport \"./styles.css\";\n\nexport interface NotificationIconButtonProps {\n // What value should we use to drive the badge count?\n badgeCountType?: BadgeCountType;\n onClick: (e: SyntheticEvent) => void;\n}\n\nexport const NotificationIconButton = React.forwardRef<\n HTMLButtonElement,\n NotificationIconButtonProps\n>(({ onClick, badgeCountType }, ref) => {\n const { colorMode } = useKnockFeed();\n\n return (\n <button\n className={`rnf-notification-icon-button rnf-notification-icon-button--${colorMode}`}\n role=\"button\"\n aria-label=\"Open notification feed\"\n ref={ref}\n onClick={onClick}\n >\n <BellIcon />\n <UnseenBadge badgeCountType={badgeCountType} />\n </button>\n );\n});\n"],"names":["NotificationIconButton","React","forwardRef","onClick","badgeCountType","ref","colorMode","useKnockFeed","BellIcon","UnseenBadge"],"mappings":"2UAcaA,EAAyBC,EAAAA,QAAMC,WAG1C,CAAC,CAAEC,QAAAA,EAASC,eAAAA,CAAe,EAAGC,IAAQ,CAChC,KAAA,CAAEC,UAAAA,GAAcC,EAAa,aAAA,EAEnC,+BACG,SACC,CAAA,UAAW,8DAA8DD,CAAS,GAClF,KAAK,SACL,aAAW,yBACX,IAAAD,EACA,QAAAF,GAECF,EAAAA,QAAA,cAAAO,EAAA,SAAA,IAAQ,EACRP,EAAA,QAAA,cAAAQ,EAAA,YAAA,CAAY,eAAAL,EAA+B,CAC9C,CAEJ,CAAC"}

package/dist/cjs/modules/feed/components/UnseenBadge/UnseenBadge.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@knocklabs/react-core"),c=require("react");const o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=o(c);function s(e,n){switch(e){case"all":return n.total_count;case"unread":return n.unread_count;case"unseen":return n.unseen_count}}const l=({badgeCountType:e="unseen"})=>{const{useFeedStore:n}=u.useKnockFeed(),t=n(r=>s(e,r.metadata));return t!==0?a.default.createElement("div",{className:"rnf-unseen-badge"},a.default.createElement("span",{className:"rnf-unseen-badge__count"},u.formatBadgeCount(t))):null};exports.UnseenBadge=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@knocklabs/react-core"),c=require("react");;/* empty css            */const o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=o(c);function s(e,n){switch(e){case"all":return n.total_count;case"unread":return n.unread_count;case"unseen":return n.unseen_count}}const l=({badgeCountType:e="unseen"})=>{const{useFeedStore:n}=u.useKnockFeed(),t=n(r=>s(e,r.metadata));return t!==0?a.default.createElement("div",{className:"rnf-unseen-badge"},a.default.createElement("span",{className:"rnf-unseen-badge__count"},u.formatBadgeCount(t))):null};exports.UnseenBadge=l;
 //# sourceMappingURL=UnseenBadge.js.map

package/dist/cjs/modules/slack/components/SlackAddChannelInput/SlackAddChannelInput.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const r=require("react"),C=require("@knocklabs/react-core"),m=require("../../../core/components/Spinner/Spinner.js");require("lodash.debounce");const _=require("../SlackChannelCombobox/SlackConnectionError.js"),q=require("../SlackIcon/SlackIcon.js");const E=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=E(r),S=({inErrorState:e,connectedChannels:o=[],updateConnectedChannels:i,connectedChannelsError:d,connectedChannelsUpdating:h})=>{const{t:a}=C.useTranslations(),[t,c]=r.useState(null),[l,s]=r.useState(null),f=()=>{if(!t)return;if(l&&s(null),o.find(p=>p.channel_id===t))return c(""),s(a("slackChannelAlreadyConnected")||"");const k=[...o,{channel_id:t}];i(k),c("")};return n.default.createElement("div",{className:"rsk-connect-channel"},n.default.createElement("input",{className:`rsk-connect-channel__input ${(e||!!l)&&!t&&"rsk-connect-channel__input--error"}`,tabIndex:-1,id:"slack-channel-search",type:"text",placeholder:l||d||a("slackChannelId"),onChange:u=>c(u.target.value),value:t||""}),n.default.createElement("button",{className:"rsk-connect-channel__button",onClick:f},h?n.default.createElement(m.Spinner,{size:"15px",thickness:3}):n.default.createElement(q.SlackIcon,{height:"16px",width:"16px"}),a("slackConnectChannel")),n.default.createElement(_,null))};module.exports=S;
+"use strict";const r=require("react"),C=require("@knocklabs/react-core"),m=require("../../../core/components/Spinner/Spinner.js");;/* empty css                                          */require("lodash.debounce");;/* empty css               */const _=require("../SlackChannelCombobox/SlackConnectionError.js"),q=require("../SlackIcon/SlackIcon.js");;/* empty css            */const E=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=E(r),S=({inErrorState:e,connectedChannels:o=[],updateConnectedChannels:i,connectedChannelsError:d,connectedChannelsUpdating:h})=>{const{t:a}=C.useTranslations(),[t,c]=r.useState(null),[l,s]=r.useState(null),f=()=>{if(!t)return;if(l&&s(null),o.find(p=>p.channel_id===t))return c(""),s(a("slackChannelAlreadyConnected")||"");const k=[...o,{channel_id:t}];i(k),c("")};return n.default.createElement("div",{className:"rsk-connect-channel"},n.default.createElement("input",{className:`rsk-connect-channel__input ${(e||!!l)&&!t&&"rsk-connect-channel__input--error"}`,tabIndex:-1,id:"slack-channel-search",type:"text",placeholder:l||d||a("slackChannelId"),onChange:u=>c(u.target.value),value:t||""}),n.default.createElement("button",{className:"rsk-connect-channel__button",onClick:f},h?n.default.createElement(m.Spinner,{size:"15px",thickness:3}):n.default.createElement(q.SlackIcon,{height:"16px",width:"16px"}),a("slackConnectChannel")),n.default.createElement(_,null))};module.exports=S;
 //# sourceMappingURL=SlackAddChannelInput.js.map