@limetech/lime-crm-building-blocks 1.40.0 → 1.41.0

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## [1.41.0](https://github.com/Lundalogik/lime-crm-building-blocks/compare/v1.40.1...v1.41.0) (2024-08-29)
+
+
+### Features
+
+
+* **notification-list:** add new component ([922e372](https://github.com/Lundalogik/lime-crm-building-blocks/commit/922e3724035a5af487fbacfcfa324561a0e62962))
+
+### [1.40.1](https://github.com/Lundalogik/lime-crm-building-blocks/compare/v1.40.0...v1.40.1) (2024-08-26)
+
+
+### Reverts
+
+
+* Revert "feat(feed): make items optionally clickable" ([7ad6487](https://github.com/Lundalogik/lime-crm-building-blocks/commit/7ad648793e28d00e9cca05dc0a10c275615004e9))
+
 ## [1.40.0](https://github.com/Lundalogik/lime-crm-building-blocks/compare/v1.39.0...v1.40.0) (2024-08-26)
 
 

package/dist/cjs/lime-crm-building-blocks.cjs.js

@@ -15,5 +15,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["limebb-kanban.cjs",[[1,"limebb-kanban",{"platform":[16],"context":[16],"items":[16],"paginationSize":[2,"pagination-size"],"groupBy":[513,"group-by"],"groups":[16]}]]],["limebb-date-range.cjs",[[1,"limebb-date-range",{"platform":[16],"context":[16],"startTime":[16],"endTime":[16],"startTimeLabel":[1,"start-time-label"],"endTimeLabel":[1,"end-time-label"],"language":[1],"timeFormat":[1,"time-format"],"type":[1]}]]],["limebb-feed.cjs",[[1,"limebb-feed",{"platform":[16],"context":[16],"items":[16],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"minutesOfProximity":[2,"minutes-of-proximity"],"totalCount":[2,"total-count"],"lastVisitedTimestamp":[1,"last-visited-timestamp"]}]]],["limebb-browser.cjs",[[17,"limebb-browser",{"platform":[16],"context":[16],"items":[16],"layout":[1],"filter":[32]}]]],["limebb-currency-picker.cjs",[[1,"limebb-currency-picker",{"label":[513],"platform":[16],"currencies":[16],"helperText":[513,"helper-text"],"required":[516],"readonly":[516],"invalid":[516],"disabled":[516],"value":[16]}]]],["limebb-dashboard-widget.cjs",[[1,"limebb-dashboard-widget",{"heading":[513],"subheading":[513],"supportingText":[513,"supporting-text"],"icon":[513]}]]],["limebb-icon-picker.cjs",[[1,"limebb-icon-picker",{"value":[1],"required":[4],"readonly":[4],"invalid":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"]}]]],["limebb-info-tile.cjs",[[1,"limebb-info-tile",{"platform":[16],"context":[16],"filterId":[1,"filter-id"],"disabled":[4],"icon":[1],"label":[1],"prefix":[1],"suffix":[1],"propertyName":[1,"property-name"],"aggregateOperator":[1,"aggregate-operator"],"filters":[32],"value":[32],"loading":[32],"error":[32]}]]],["limebb-limeobject-file-viewer.cjs",[[1,"limebb-limeobject-file-viewer",{"platform":[16],"context":[16],"property":[1],"fileTypes":[16],"limeobject":[32],"limetype":[32]}]]],["limebb-locale-picker.cjs",[[1,"limebb-locale-picker",{"platform":[16],"context":[16],"value":[1],"required":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"],"readonly":[4],"multipleChoice":[4,"multiple-choice"],"allLanguages":[32]}]]],["limebb-navigation-button.cjs",[[17,"limebb-navigation-button",{"href":[513],"tooltipLabel":[513,"tooltip-label"],"tooltipHelperLabel":[513,"tooltip-helper-label"],"type":[513]}]]],["limebb-kanban-item.cjs",[[1,"limebb-kanban-item",{"platform":[16],"context":[16],"item":[16]}]]],["limebb-kanban-column.cjs",[[1,"limebb-kanban-column",{"platform":[16],"context":[16],"columnHeading":[1,"column-heading"],"items":[16],"loading":[4],"paginationSize":[2,"pagination-size"],"displayedItemCount":[32]}]]],["limebb-date-picker.cjs",[[1,"limebb-date-picker",{"platform":[16],"context":[16],"disabled":[516],"readonly":[516],"invalid":[516],"label":[513],"placeholder":[513],"helperText":[513,"helper-text"],"required":[516],"value":[1],"type":[513]}]]],["limebb-feed-timeline-item.cjs",[[1,"limebb-feed-timeline-item",{"platform":[16],"context":[16],"item":[16],"ui":[513],"isBundled":[516,"is-bundled"],"headingCanExpand":[32],"isHeadingExpanded":[32],"showMore":[32],"isTall":[32]}]]]], options);
+  return index.bootstrapLazy([["limebb-kanban.cjs",[[1,"limebb-kanban",{"platform":[16],"context":[16],"items":[16],"paginationSize":[2,"pagination-size"],"groupBy":[513,"group-by"],"groups":[16]}]]],["limebb-date-range.cjs",[[1,"limebb-date-range",{"platform":[16],"context":[16],"startTime":[16],"endTime":[16],"startTimeLabel":[1,"start-time-label"],"endTimeLabel":[1,"end-time-label"],"language":[1],"timeFormat":[1,"time-format"],"type":[1]}]]],["limebb-feed.cjs",[[1,"limebb-feed",{"platform":[16],"context":[16],"items":[16],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"minutesOfProximity":[2,"minutes-of-proximity"],"totalCount":[2,"total-count"],"lastVisitedTimestamp":[1,"last-visited-timestamp"]}]]],["limebb-notification-list.cjs",[[1,"limebb-notification-list",{"platform":[16],"context":[16],"items":[16],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"totalCount":[2,"total-count"],"lastVisitedTimestamp":[1,"last-visited-timestamp"]}]]],["limebb-browser.cjs",[[17,"limebb-browser",{"platform":[16],"context":[16],"items":[16],"layout":[1],"filter":[32]}]]],["limebb-currency-picker.cjs",[[1,"limebb-currency-picker",{"label":[513],"platform":[16],"currencies":[16],"helperText":[513,"helper-text"],"required":[516],"readonly":[516],"invalid":[516],"disabled":[516],"value":[16]}]]],["limebb-dashboard-widget.cjs",[[1,"limebb-dashboard-widget",{"heading":[513],"subheading":[513],"supportingText":[513,"supporting-text"],"icon":[513]}]]],["limebb-icon-picker.cjs",[[1,"limebb-icon-picker",{"value":[1],"required":[4],"readonly":[4],"invalid":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"]}]]],["limebb-info-tile.cjs",[[1,"limebb-info-tile",{"platform":[16],"context":[16],"filterId":[1,"filter-id"],"disabled":[4],"icon":[1],"label":[1],"prefix":[1],"suffix":[1],"propertyName":[1,"property-name"],"aggregateOperator":[1,"aggregate-operator"],"filters":[32],"value":[32],"loading":[32],"error":[32]}]]],["limebb-limeobject-file-viewer.cjs",[[1,"limebb-limeobject-file-viewer",{"platform":[16],"context":[16],"property":[1],"fileTypes":[16],"limeobject":[32],"limetype":[32]}]]],["limebb-locale-picker.cjs",[[1,"limebb-locale-picker",{"platform":[16],"context":[16],"value":[1],"required":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"],"readonly":[4],"multipleChoice":[4,"multiple-choice"],"allLanguages":[32]}]]],["limebb-navigation-button.cjs",[[17,"limebb-navigation-button",{"href":[513],"tooltipLabel":[513,"tooltip-label"],"tooltipHelperLabel":[513,"tooltip-helper-label"],"type":[513]}]]],["limebb-kanban-item.cjs",[[1,"limebb-kanban-item",{"platform":[16],"context":[16],"item":[16]}]]],["limebb-kanban-column.cjs",[[1,"limebb-kanban-column",{"platform":[16],"context":[16],"columnHeading":[1,"column-heading"],"items":[16],"loading":[4],"paginationSize":[2,"pagination-size"],"displayedItemCount":[32]}]]],["limebb-date-picker.cjs",[[1,"limebb-date-picker",{"platform":[16],"context":[16],"disabled":[516],"readonly":[516],"invalid":[516],"label":[513],"placeholder":[513],"helperText":[513,"helper-text"],"required":[516],"value":[1],"type":[513]}]]],["limebb-feed-timeline-item.cjs",[[1,"limebb-feed-timeline-item",{"platform":[16],"context":[16],"item":[16],"ui":[513],"isBundled":[516,"is-bundled"],"headingCanExpand":[32],"isHeadingExpanded":[32],"showMore":[32],"isTall":[32]}]]],["limebb-notification-item.cjs",[[1,"limebb-notification-item",{"platform":[16],"context":[16],"item":[16]}]]]], options);
 });

package/dist/cjs/limebb-feed-timeline-item.cjs.entry.js

@@ -5,12 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-5aaf6970.js');
 const types = require('./types-c7646c23.js');
 
-const feedTimelineItemCss = "@charset \"UTF-8\";*{box-sizing:border-box}:host(limebb-feed-timeline-item){--limebb-feed-item-paddings:0.75rem;display:flex;gap:0.75rem;position:relative;isolation:isolate}:host(limebb-feed-timeline-item:hover) .timestamp{color:rgb(var(--contrast-1100))}:host(limebb-feed-timeline-item[is-bundled]:hover){--limebb-feed-item-timestamp-opacity-delay:0.5s}:host(limebb-feed-timeline-item[is-bundled]:hover) .timestamp{opacity:1}:host(limebb-feed-timeline-item[is-bundled]) .timestamp{opacity:0}.left:before{content:\"\";position:absolute;z-index:0;top:-0.25rem;bottom:-0.25rem;left:1rem;width:1px;background-color:rgb(var(--contrast-600));z-index:-1}.info{position:sticky;top:0.5rem;display:flex;flex-direction:column;align-items:center;gap:0.25rem}.right,.content{display:flex;flex-direction:column;flex-grow:1;min-width:0}.content{border-radius:1rem;gap:0.25rem;padding:var(--limebb-feed-item-paddings)}.header{position:relative;display:flex;gap:0.25rem;padding-bottom:0.25rem;margin-top:-0.25rem;color:rgb(var(--contrast-900));font-size:0.875rem}:host(.has-unpromoted-actions) .header{padding-right:2rem}.header limel-markdown{--markdown-hyperlink-color:var(--mdc-theme-primary);--markdown-hyperlink-color--hovered:rgb(var(--color-teal-light))}.heading{flex-grow:1;overflow:hidden;white-space:nowrap}.heading.expanded-heading{white-space:normal}button.expand-heading{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:rgb(var(--color-blue-default));background-color:transparent;border-radius:1rem;padding:0 0.25rem 0.25rem 0.25rem;height:1rem;white-space:nowrap}button.expand-heading:hover{color:rgb(var(--color-blue-default));background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button.expand-heading:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}button.collapse-heading{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal);flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:1.5rem;width:1rem}button.collapse-heading:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button.collapse-heading:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}button.collapse-heading:focus{outline:none}button.collapse-heading:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button.collapse-heading limel-icon{width:0.75rem}.unpromoted-actions-menu{position:absolute;top:0;right:0;z-index:1}.timestamp{transition:color 0.4s ease, opacity 0.2s ease;transition-delay:var(--limebb-feed-item-timestamp-opacity-delay, 0s);font-size:0.75rem;text-align:center;color:rgb(var(--contrast-800));background-color:var(--limebb-feed-background-color);padding:0.125rem 0;width:2rem}.icon{--icon-background-color:var(--limebb-feed-background-color);width:2rem;padding:0.125rem}:host(.has-author-picture) .icon{width:1.5rem}img{border-radius:50%;width:2rem;height:2rem;object-fit:cover;box-shadow:0 0 0 1px rgb(var(--contrast-600))}.author{font-weight:bold;text-decoration:none;white-space:nowrap}a.author{position:relative;cursor:pointer;transition:color 0.2s ease;color:var(--mdc-theme-primary)}a.author:before{transition:opacity 0.2s ease, transform 0.3s ease-out;content:\"\";position:absolute;inset:auto 0 0 0;width:calc(100% - 0.5rem);margin:auto;height:0.125rem;border-radius:1rem;background-color:currentColor;opacity:0;transform:scale(0.6)}a.author:hover{color:rgb(var(--color-teal-light))}a.author:hover:before{opacity:0.3;transform:scale(1)}limel-chip-set{--button-shadow-normal:none;margin-left:-1rem;margin-bottom:-0.5rem}limel-action-bar{--action-bar-item-height:1.75rem;transition:opacity 0.2s ease;justify-content:flex-start;opacity:0.8}.action-bar{display:grid;transition:grid-template-rows var(--limebb-feed-item-action-bar-grid-template-rows-transition-speed, 0.2s) cubic-bezier(1, 0.09, 0, 0.89) var(--limebb-feed-item-action-bar-grid-template-rows-transition-delay, 0s);grid-template-rows:var(--limebb-feed-item-action-bar-grid-template-rows, 1fr)}.action-bar-hider{overflow:hidden}limel-action-bar{transition:padding var(--limebb-feed-item-action-bar-grid-template-rows-transition-speed) cubic-bezier(1, 0.09, 0, 0.89) var(--limebb-feed-item-action-bar-grid-template-rows-transition-delay);padding-bottom:0.5rem}:host(limebb-feed-timeline-item:hover) .action-bar,:host(limebb-feed-timeline-item:focus-within) .action-bar,:host(limebb-feed-timeline-item:focus-visible) .action-bar{--limebb-feed-item-action-bar-grid-template-rows:1fr;will-change:grid-template-rows}:host(limebb-feed-timeline-item:hover) limel-action-bar,:host(limebb-feed-timeline-item:focus-within) limel-action-bar,:host(limebb-feed-timeline-item:focus-visible) limel-action-bar{will-change:opacity;opacity:1}:host(limebb-feed-timeline-item:hover){--limebb-feed-item-action-bar-grid-template-rows-transition-speed:0.46s;--limebb-feed-item-action-bar-grid-template-rows-transition-delay:0.5s}:host(limebb-feed-timeline-item.is-tall) .markdown-container{margin-bottom:0.5rem}:host(limebb-feed-timeline-item.is-tall) .body-text{--body-text-min-height-set-by-code:10rem;min-height:calc(var(--body-text-min-height-set-by-code) + 0.25rem)}:host(limebb-feed-timeline-item.is-tall) .body-text:after{transition:opacity 0.6s ease;content:\"\";opacity:0.26;pointer-events:none;position:absolute;bottom:-0.125rem;right:-0.125rem;left:-0.125rem;height:2.5rem;background:radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0)) 0 100%, linear-gradient(to bottom, rgb(var(--limebb-feed-item-background-color), 0) 0%, rgb(var(--limebb-feed-item-background-color), 90%) 100%);background-repeat:no-repeat;background-size:100% 0.5rem, 100% 100%}:host(limebb-feed-timeline-item.is-tall.shows-less) .markdown-container{grid-template-rows:0fr}:host(limebb-feed-timeline-item.is-tall.shows-less) .body-text:after{opacity:1}:host(limebb-feed-timeline-item.is-tall.shows-more) .markdown-container{grid-template-rows:1fr}:host(limebb-feed-timeline-item.is-tall.shows-more) #show-more-button limel-icon{rotate:180deg}.markdown-container{position:relative;display:grid}.markdown-container:not(.opened){transition:grid-template-rows min(var(--body-text-height) * 1.2ms, 500ms) cubic-bezier(1, 0.09, 0, 0.89)}.body-text{display:block;overflow:hidden}#show-more-button{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal);z-index:1;position:absolute;right:0;bottom:-0.6rem;left:0;margin:0 auto;display:flex;align-items:center;justify-content:center;border-radius:3rem;width:2rem;height:1rem}#show-more-button:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}#show-more-button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}#show-more-button:focus{outline:none}#show-more-button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}#show-more-button limel-icon{transition:rotate 0.2s ease 0.5s;color:var(--mdc-theme-primary);width:0.75rem}:host(limebb-feed-timeline-item.is-clickable[ui=standard]) .content,:host(limebb-feed-timeline-item[ui=standard]) .content{background-color:rgb(var(--limebb-feed-item-background-color))}:host(limebb-feed-timeline-item[ui=emphasized]) .content{border:1px dashed rgb(var(--contrast-800))}:host(limebb-feed-timeline-item[ui=minimal]) limel-markdown{--markdown-hyperlink-color:rgb(var(--contrast-900))}:host(limebb-feed-timeline-item[ui=minimal]) limel-markdown:hover{--markdown-hyperlink-color:rgb(var(--color-blue-default))}:host(limebb-feed-timeline-item[ui=minimal]) a.author{color:rgb(var(--contrast-900))}:host(limebb-feed-timeline-item[ui=minimal]) .header:hover a.author{color:rgb(var(--color-blue-default))}:host(limebb-feed-timeline-item[ui=minimal]) .icon{color:rgb(var(--contrast-900)) !important}:host(limebb-feed-timeline-item[ui=minimal]) .body-text{color:rgb(var(--contrast-900))}:host(limebb-feed-timeline-item[ui=minimal]) .body-text:hover{color:rgb(var(--contrast-1100))}:host(limebb-feed-timeline-item[ui=thread-message]) .content{border-radius:0;box-shadow:var(--button-shadow-normal);margin-bottom:0.25rem;background-color:var(--lime-elevated-surface-background-color)}:host(limebb-feed-timeline-item[ui=thread-message]) .header{padding-bottom:0.75rem;margin-bottom:0.25rem}:host(limebb-feed-timeline-item[ui=thread-message]) .header:before{content:\"\";position:absolute;top:calc(var(--limebb-feed-item-paddings) * -1 + 0.25rem);left:calc(var(--limebb-feed-item-paddings) * -1);right:calc(var(--limebb-feed-item-paddings) * -1);bottom:0;pointer-events:none;border-bottom:1px dashed rgb(var(--contrast-600))}:host(limebb-feed-timeline-item[ui=thread-message]) .thread-effects{transition:transform 0.2s ease;pointer-events:none;content:\"\";position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;box-shadow:var(--button-shadow-normal);transform:translate3d(-0.225rem, -0.125rem, 0) rotate(1.5deg);background-color:rgb(var(--contrast-300))}:host(limebb-feed-timeline-item[ui=thread-message]) .content:hover .thread-effects{transform:translate3d(-0.325rem, -0.3rem, 0) rotate(1.5deg)}:host(limebb-feed-timeline-item.is-tall[ui=thread-message]) .body-text{--body-text-min-height-set-by-code:3rem;min-height:calc(var(--body-text-min-height-set-by-code) + 0.25rem)}.content{position:relative}.content:before,.content:after{content:\"\";position:absolute;top:1rem;bottom:1rem;left:-0.125rem;width:0.25rem;border-radius:0.25rem}.content:before{background-color:var(--color-code)}:host(limebb-feed-timeline-item[ui=emphasized]) .content:before,:host(limebb-feed-timeline-item[ui=emphasized]) .content:after{left:calc(-0.125rem - 0.5px)}:host(limebb-feed-timeline-item[ui=minimal]) .content:before{opacity:0.25}:host(limebb-feed-timeline-item[ui=minimal]) .content:after{opacity:0.5;background:repeating-linear-gradient(45deg, var(--color-code), var(--color-code) 0.5rem, transparent 0.5rem, transparent 1rem);background-size:0.25rem 100%;background-repeat:repeat-y;background-position:left;rotate:180deg}:host(limebb-feed-timeline-item[ui=thread-message]) .content:before{top:0.25rem;bottom:unset;height:1.75rem}:host(limebb-feed-timeline-item.is-clickable) .content{cursor:pointer;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:transparent}:host(limebb-feed-timeline-item.is-clickable) .content:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}:host(limebb-feed-timeline-item.is-clickable) .content:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}:host(limebb-feed-timeline-item.is-clickable) .content:hover{z-index:1}";
+const feedTimelineItemCss = "@charset \"UTF-8\";*{box-sizing:border-box}:host(limebb-feed-timeline-item){--limebb-feed-item-paddings:0.75rem;display:flex;gap:0.75rem;position:relative;isolation:isolate}:host(limebb-feed-timeline-item:hover) .timestamp{color:rgb(var(--contrast-1100))}:host(limebb-feed-timeline-item[is-bundled]:hover){--limebb-feed-item-timestamp-opacity-delay:0.5s}:host(limebb-feed-timeline-item[is-bundled]:hover) .timestamp{opacity:1}:host(limebb-feed-timeline-item[is-bundled]) .timestamp{opacity:0}.left:before{content:\"\";position:absolute;z-index:0;top:-0.25rem;bottom:-0.25rem;left:1rem;width:1px;background-color:rgb(var(--contrast-600));z-index:-1}.info{position:sticky;top:0.5rem;display:flex;flex-direction:column;align-items:center;gap:0.25rem}.right,.content{display:flex;flex-direction:column;flex-grow:1;min-width:0}.content{border-radius:1rem;gap:0.25rem;padding:var(--limebb-feed-item-paddings)}.header{position:relative;display:flex;gap:0.25rem;padding-bottom:0.25rem;margin-top:-0.25rem;color:rgb(var(--contrast-900));font-size:0.875rem}:host(.has-unpromoted-actions) .header{padding-right:2rem}.header limel-markdown{--markdown-hyperlink-color:var(--mdc-theme-primary);--markdown-hyperlink-color--hovered:rgb(var(--color-teal-light))}.heading{flex-grow:1;overflow:hidden;white-space:nowrap}.heading.expanded-heading{white-space:normal}button.expand-heading{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:rgb(var(--color-blue-default));background-color:transparent;border-radius:1rem;padding:0 0.25rem 0.25rem 0.25rem;height:1rem;white-space:nowrap}button.expand-heading:hover{color:rgb(var(--color-blue-default));background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button.expand-heading:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}button.collapse-heading{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal);flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:1.5rem;width:1rem}button.collapse-heading:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button.collapse-heading:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}button.collapse-heading:focus{outline:none}button.collapse-heading:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button.collapse-heading limel-icon{width:0.75rem}.unpromoted-actions-menu{position:absolute;top:0;right:0;z-index:1}.timestamp{transition:color 0.4s ease, opacity 0.2s ease;transition-delay:var(--limebb-feed-item-timestamp-opacity-delay, 0s);font-size:0.75rem;text-align:center;color:rgb(var(--contrast-800));background-color:var(--limebb-feed-background-color);padding:0.125rem 0;width:2rem}.icon{--icon-background-color:var(--limebb-feed-background-color);width:2rem;padding:0.125rem}:host(.has-author-picture) .icon{width:1.5rem}img{border-radius:50%;width:2rem;height:2rem;object-fit:cover;box-shadow:0 0 0 1px rgb(var(--contrast-600))}.author{font-weight:bold;text-decoration:none;white-space:nowrap}a.author{position:relative;cursor:pointer;transition:color 0.2s ease;color:var(--mdc-theme-primary)}a.author:before{transition:opacity 0.2s ease, transform 0.3s ease-out;content:\"\";position:absolute;inset:auto 0 0 0;width:calc(100% - 0.5rem);margin:auto;height:0.125rem;border-radius:1rem;background-color:currentColor;opacity:0;transform:scale(0.6)}a.author:hover{color:rgb(var(--color-teal-light))}a.author:hover:before{opacity:0.3;transform:scale(1)}limel-chip-set{--button-shadow-normal:none;margin-left:-1rem;margin-bottom:-0.5rem}limel-action-bar{--action-bar-item-height:1.75rem;transition:opacity 0.2s ease;justify-content:flex-start;opacity:0.8}.action-bar{display:grid;transition:grid-template-rows var(--limebb-feed-item-action-bar-grid-template-rows-transition-speed, 0.2s) cubic-bezier(1, 0.09, 0, 0.89) var(--limebb-feed-item-action-bar-grid-template-rows-transition-delay, 0s);grid-template-rows:var(--limebb-feed-item-action-bar-grid-template-rows, 1fr)}.action-bar-hider{overflow:hidden}limel-action-bar{transition:padding var(--limebb-feed-item-action-bar-grid-template-rows-transition-speed) cubic-bezier(1, 0.09, 0, 0.89) var(--limebb-feed-item-action-bar-grid-template-rows-transition-delay);padding-bottom:0.5rem}:host(limebb-feed-timeline-item:hover) .action-bar,:host(limebb-feed-timeline-item:focus-within) .action-bar,:host(limebb-feed-timeline-item:focus-visible) .action-bar{--limebb-feed-item-action-bar-grid-template-rows:1fr;will-change:grid-template-rows}:host(limebb-feed-timeline-item:hover) limel-action-bar,:host(limebb-feed-timeline-item:focus-within) limel-action-bar,:host(limebb-feed-timeline-item:focus-visible) limel-action-bar{will-change:opacity;opacity:1}:host(limebb-feed-timeline-item:hover){--limebb-feed-item-action-bar-grid-template-rows-transition-speed:0.46s;--limebb-feed-item-action-bar-grid-template-rows-transition-delay:0.5s}:host(limebb-feed-timeline-item.is-tall) .markdown-container{margin-bottom:0.5rem}:host(limebb-feed-timeline-item.is-tall) .body-text{--body-text-min-height-set-by-code:10rem;min-height:calc(var(--body-text-min-height-set-by-code) + 0.25rem)}:host(limebb-feed-timeline-item.is-tall) .body-text:after{transition:opacity 0.6s ease;content:\"\";opacity:0.26;pointer-events:none;position:absolute;bottom:-0.125rem;right:-0.125rem;left:-0.125rem;height:2.5rem;background:radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0)) 0 100%, linear-gradient(to bottom, rgb(var(--limebb-feed-item-background-color), 0) 0%, rgb(var(--limebb-feed-item-background-color), 90%) 100%);background-repeat:no-repeat;background-size:100% 0.5rem, 100% 100%}:host(limebb-feed-timeline-item.is-tall.shows-less) .markdown-container{grid-template-rows:0fr}:host(limebb-feed-timeline-item.is-tall.shows-less) .body-text:after{opacity:1}:host(limebb-feed-timeline-item.is-tall.shows-more) .markdown-container{grid-template-rows:1fr}:host(limebb-feed-timeline-item.is-tall.shows-more) #show-more-button limel-icon{rotate:180deg}.markdown-container{position:relative;display:grid}.markdown-container:not(.opened){transition:grid-template-rows min(var(--body-text-height) * 1.2ms, 500ms) cubic-bezier(1, 0.09, 0, 0.89)}.body-text{display:block;overflow:hidden}#show-more-button{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal);z-index:1;position:absolute;right:0;bottom:-0.6rem;left:0;margin:0 auto;display:flex;align-items:center;justify-content:center;border-radius:3rem;width:2rem;height:1rem}#show-more-button:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}#show-more-button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}#show-more-button:focus{outline:none}#show-more-button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}#show-more-button limel-icon{transition:rotate 0.2s ease 0.5s;color:var(--mdc-theme-primary);width:0.75rem}:host(limebb-feed-timeline-item[ui=standard]) .content{background-color:rgb(var(--limebb-feed-item-background-color))}:host(limebb-feed-timeline-item[ui=emphasized]) .content{border:1px dashed rgb(var(--contrast-800))}:host(limebb-feed-timeline-item[ui=minimal]) limel-markdown{--markdown-hyperlink-color:rgb(var(--contrast-900))}:host(limebb-feed-timeline-item[ui=minimal]) limel-markdown:hover{--markdown-hyperlink-color:rgb(var(--color-blue-default))}:host(limebb-feed-timeline-item[ui=minimal]) a.author{color:rgb(var(--contrast-900))}:host(limebb-feed-timeline-item[ui=minimal]) .header:hover a.author{color:rgb(var(--color-blue-default))}:host(limebb-feed-timeline-item[ui=minimal]) .icon{color:rgb(var(--contrast-900)) !important}:host(limebb-feed-timeline-item[ui=minimal]) .body-text{color:rgb(var(--contrast-900))}:host(limebb-feed-timeline-item[ui=minimal]) .body-text:hover{color:rgb(var(--contrast-1100))}:host(limebb-feed-timeline-item[ui=thread-message]) .content{border-radius:0;box-shadow:var(--button-shadow-normal);margin-bottom:0.25rem;background-color:var(--lime-elevated-surface-background-color)}:host(limebb-feed-timeline-item[ui=thread-message]) .header{padding-bottom:0.75rem;margin-bottom:0.25rem}:host(limebb-feed-timeline-item[ui=thread-message]) .header:before{content:\"\";position:absolute;top:calc(var(--limebb-feed-item-paddings) * -1 + 0.25rem);left:calc(var(--limebb-feed-item-paddings) * -1);right:calc(var(--limebb-feed-item-paddings) * -1);bottom:0;pointer-events:none;border-bottom:1px dashed rgb(var(--contrast-600))}:host(limebb-feed-timeline-item[ui=thread-message]) .thread-effects{transition:transform 0.2s ease;pointer-events:none;content:\"\";position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;box-shadow:var(--button-shadow-normal);transform:translate3d(-0.225rem, -0.125rem, 0) rotate(1.5deg);background-color:rgb(var(--contrast-300))}:host(limebb-feed-timeline-item[ui=thread-message]) .content:hover .thread-effects{transform:translate3d(-0.325rem, -0.3rem, 0) rotate(1.5deg)}:host(limebb-feed-timeline-item.is-tall[ui=thread-message]) .body-text{--body-text-min-height-set-by-code:3rem;min-height:calc(var(--body-text-min-height-set-by-code) + 0.25rem)}.content{position:relative}.content:before,.content:after{content:\"\";position:absolute;top:1rem;bottom:1rem;left:-0.125rem;width:0.25rem;border-radius:0.25rem}.content:before{background-color:var(--color-code)}:host(limebb-feed-timeline-item[ui=emphasized]) .content:before,:host(limebb-feed-timeline-item[ui=emphasized]) .content:after{left:calc(-0.125rem - 0.5px)}:host(limebb-feed-timeline-item[ui=minimal]) .content:before{opacity:0.25}:host(limebb-feed-timeline-item[ui=minimal]) .content:after{opacity:0.5;background:repeating-linear-gradient(45deg, var(--color-code), var(--color-code) 0.5rem, transparent 0.5rem, transparent 1rem);background-size:0.25rem 100%;background-repeat:repeat-y;background-position:left;rotate:180deg}:host(limebb-feed-timeline-item[ui=thread-message]) .content:before{top:0.25rem;bottom:unset;height:1.75rem}";
 
 const FeedTimelineItem = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.interact = index.createEvent(this, "interact", 7);
     /**
      * Defines the visualization and features of the feed item.
      */
@@ -61,9 +60,6 @@ const FeedTimelineItem = class {
         this.bodyTextHeight = height;
       }
     };
-    this.handleFeedItemClick = () => {
-      this.interact.emit(this.item);
-    };
     this.renderHeader = () => {
       if ((this.isBundled && !this.item.heading) ||
         (!this.item.author && !this.item.heading)) {
@@ -180,7 +176,7 @@ const FeedTimelineItem = class {
     (_a = this.bodyResizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
   }
   render() {
-    var _a, _b, _c;
+    var _a, _b;
     return (index.h(index.Host, { id: this.item.id, class: {
         'has-unpromoted-actions': !!((_a = this.item.unpromotedActions) === null || _a === void 0 ? void 0 : _a.length),
         'has-author-picture': !!((_b = this.item.author) === null || _b === void 0 ? void 0 : _b.picture),
@@ -188,7 +184,6 @@ const FeedTimelineItem = class {
         'expanded-heading': this.isHeadingExpanded,
         'shows-more': this.showMore,
         'is-tall': this.isTall,
-        'is-clickable': !!((_c = this.item) === null || _c === void 0 ? void 0 : _c.clickable),
       }, style: {
         '--body-text-height': `${this.bodyTextHeight}`,
         '--color-code': `${this.item.color}`,
@@ -211,14 +206,7 @@ const FeedTimelineItem = class {
       } }));
   }
   renderContent() {
-    let handleClick;
-    if (this.item.clickable) {
-      handleClick = this.handleFeedItemClick;
-    }
-    else {
-      handleClick = undefined;
-    }
-    return (index.h("div", { class: "right" }, index.h("div", { class: "content", onClick: handleClick }, this.renderThreadEffects(), this.renderHeader(), this.renderUnpromotedActionsMenu(), this.renderValue(), this.renderRelations()), this.renderPromotedActions()));
+    return (index.h("div", { class: "right" }, index.h("div", { class: "content" }, this.renderThreadEffects(), this.renderHeader(), this.renderUnpromotedActionsMenu(), this.renderValue(), this.renderRelations()), this.renderPromotedActions()));
   }
   renderThreadEffects() {
     if (!this.isThreadMessage) {

package/dist/cjs/limebb-feed.cjs.entry.js

@@ -171,7 +171,6 @@ const Feed = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.loadMore = index.createEvent(this, "loadMore", 7);
-    this.itemClick = index.createEvent(this, "itemClick", 7);
     /**
      * List of items to display in the feed.
      */
@@ -185,9 +184,6 @@ const Feed = class {
      * The total number of items available
      */
     this.totalCount = 0;
-    this.handleItemClick = (event) => {
-      this.itemClick.emit(event.detail);
-    };
     this.isBundled = (item, index) => {
       var _a, _b, _c, _d, _e, _f;
       if (index === 0) {
@@ -241,7 +237,7 @@ const Feed = class {
       return [
         this.renderNewItemsIndicator(item.timestamp, index$1),
         this.renderDateHeader(item.timestamp, index$1),
-        index.h("limebb-feed-timeline-item", { platform: this.platform, context: this.context, item: item, key: item.id, ui: item === null || item === void 0 ? void 0 : item.ui, isBundled: this.isBundled(item, index$1), onInteract: this.handleItemClick }),
+        index.h("limebb-feed-timeline-item", { platform: this.platform, context: this.context, item: item, key: item.id, ui: item === null || item === void 0 ? void 0 : item.ui, isBundled: this.isBundled(item, index$1) }),
       ];
     });
   }

package/dist/cjs/limebb-notification-item.cjs.entry.js

@@ -0,0 +1,142 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-5aaf6970.js');
+const types = require('./types-c7646c23.js');
+
+const notificationItemCss = "@charset \"UTF-8\";*{box-sizing:border-box}:host(limebb-notification-item){isolation:isolate;padding:0 0.5rem}.notification-item{position:relative;box-sizing:border-box;display:flex;flex-direction:column;gap:0.25rem;border-radius:0.75rem;border:1px solid transparent}.notification-item:before{content:\"\";display:block;position:absolute;left:-1rem;top:1rem;border-radius:50%;height:0.5rem;width:0.5rem;transition:background-color 0.2s ease;background-color:var(--limebb-notification-item-unread-badge-color, transparent)}:host(limebb-notification-item.is-clickable) .notification-item{transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:transparent}:host(limebb-notification-item.is-clickable) .notification-item:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}:host(limebb-notification-item.is-clickable) .notification-item:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}:host(limebb-notification-item.is-read) .notification-item{--limebb-notification-header-border-color:rgb(var(--contrast-400));border-color:rgb(var(--contrast-400))}:host(limebb-notification-item.is-read.is-clickable) .notification-item:hover{border-color:transparent}:host(limebb-notification-item:not(.is-read)) .notification-item{--limebb-notification-header-border-color:rgb(var(--contrast-500));--limebb-notification-item-unread-badge-color:rgb(\n      var(--color-red-default)\n  );background-color:rgb(var(--contrast-300))}:host(limebb-notification-item:hover) .timestamp{color:rgb(var(--contrast-1100))}:host(limebb-notification-item:hover) .body-text{opacity:1}.header{display:flex;align-items:center;gap:0.25rem;min-height:2rem;padding:0 0 0 0.25rem;margin-bottom:0.25rem;border-bottom:1px solid var(--limebb-notification-header-border-color)}.header:not(:has(.icon)){padding-left:0.75rem}.header:not(:has(.unpromoted-actions-menu)){padding-right:0.5rem}.caption,.timestamp{font-size:0.75rem}.caption{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:0;flex-grow:1;font-weight:600;color:rgb(var(--contrast-900))}.timestamp{transition:color 0.4s ease, opacity 0.2s ease;color:rgb(var(--contrast-800))}.headline{display:flex;gap:0.25rem;align-items:center}.content{display:flex;min-width:0;gap:0.5rem;padding:0 0.75rem 0.5rem 0.75rem}.heading{font-size:0.875rem;--markdown-hyperlink-color:var(--mdc-theme-primary);--markdown-hyperlink-color--hovered:rgb(var(--color-teal-light))}.body{display:flex;flex-direction:column;gap:0.5rem}.body-text{transition:opacity 0.2s ease;opacity:0.7;display:flex;gap:0.25rem}.icon{--icon-background-color:var(--limebb-feed-background-color);flex-shrink:0;width:1.5rem;padding:0.125rem}.author-avatar{border-radius:50%;width:2rem;height:2rem;object-fit:cover;margin-top:auto;margin-right:-0.25rem;margin-left:auto;box-shadow:0 0 0 1px rgb(var(--contrast-600))}.author{font-weight:bold;text-decoration:none;white-space:nowrap}a.author{position:relative;cursor:pointer;transition:color 0.2s ease;color:var(--mdc-theme-primary)}a.author:before{transition:opacity 0.2s ease, transform 0.3s ease-out;content:\"\";position:absolute;inset:auto 0 0 0;width:calc(100% - 0.5rem);margin:auto;height:0.125rem;border-radius:1rem;background-color:currentColor;opacity:0;transform:scale(0.6)}a.author:hover{color:rgb(var(--color-teal-light))}a.author:hover:before{opacity:0.3;transform:scale(1)}limel-chip-set{--button-shadow-normal:none;margin-left:-1rem;margin-bottom:-0.5rem}";
+
+const NotificationListItem = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.interact = index.createEvent(this, "interact", 7);
+    this.renderHeading = () => {
+      if (!this.item.heading) {
+        return;
+      }
+      return index.h("limel-markdown", { class: "heading", value: this.item.heading });
+    };
+    this.createMenuItem = (action) => {
+      var _a, _b;
+      if ('separator' in action) {
+        return action;
+      }
+      return {
+        value: action,
+        text: (_a = action.label) !== null && _a !== void 0 ? _a : '',
+        secondaryText: action.description,
+        disabled: action.disabled,
+        icon: (_b = action.icon) !== null && _b !== void 0 ? _b : '',
+      };
+    };
+    this.handleMenuItemSelect = (event) => {
+      var _a;
+      event.stopPropagation();
+      const command = (_a = event.detail.value) === null || _a === void 0 ? void 0 : _a.command;
+      if (command) {
+        this.commandbus.handle(command);
+      }
+    };
+    this.handleNotificationListItemClick = () => {
+      this.interact.emit(this.item);
+    };
+  }
+  render() {
+    var _a, _b;
+    let handleClick;
+    if (this.item.clickable) {
+      handleClick = this.handleNotificationListItemClick;
+    }
+    else {
+      handleClick = undefined;
+    }
+    return (index.h(index.Host, { id: this.item.id, class: {
+        'is-clickable': !!((_a = this.item) === null || _a === void 0 ? void 0 : _a.clickable),
+        'is-read': !!((_b = this.item) === null || _b === void 0 ? void 0 : _b.read),
+      }, onClick: handleClick }, index.h("div", { class: "notification-item" }, this.renderSource(), this.renderContent())));
+  }
+  renderSource() {
+    return (index.h("div", { class: "header" }, this.renderIcon(), this.renderCaption(), this.renderTimestamp(), this.renderUnpromotedActionsMenu()));
+  }
+  renderIcon() {
+    var _a, _b, _c, _d;
+    if (!this.item.icon) {
+      return;
+    }
+    return (index.h("limel-icon", { class: "icon", badge: true, name: (_b = (_a = this.item.icon) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : 'dot_circle', style: {
+        color: `${(_c = this.item.icon) === null || _c === void 0 ? void 0 : _c.color}`,
+        'background-color': `${(_d = this.item.icon) === null || _d === void 0 ? void 0 : _d.backgroundColor}`,
+      } }));
+  }
+  renderContent() {
+    return (index.h("div", { class: "content" }, index.h("div", { class: "body" }, this.renderHeadline(), this.renderValue()), this.renderAuthorPicture()));
+  }
+  renderHeadline() {
+    if (!this.item.heading && !this.item.author) {
+      return;
+    }
+    return (index.h("div", { class: "headline" }, this.renderAuthorName(), this.renderHeading()));
+  }
+  renderAuthorName() {
+    if (!this.item.author) {
+      return;
+    }
+    if (typeof this.item.author.name === 'string') {
+      return index.h("span", { class: "author" }, this.item.author.name);
+    }
+    if (typeof this.item.author.name === 'object') {
+      const { href, title, text } = this.item.author.name;
+      return (index.h("a", { class: "author", href: href, title: title }, text));
+    }
+  }
+  renderAuthorPicture() {
+    var _a;
+    if (!((_a = this.item.author) === null || _a === void 0 ? void 0 : _a.picture)) {
+      return;
+    }
+    return (index.h("img", { class: "author-avatar", loading: "lazy", src: this.item.author.picture }));
+  }
+  renderCaption() {
+    if (!this.item.caption) {
+      return;
+    }
+    return index.h("h2", { class: "caption" }, this.item.caption);
+  }
+  renderValue() {
+    if (!this.item.value) {
+      return;
+    }
+    return index.h("limel-markdown", { class: "body-text", value: this.item.value });
+  }
+  renderUnpromotedActionsMenu() {
+    var _a, _b;
+    if (!((_a = this.item.unpromotedActions) === null || _a === void 0 ? void 0 : _a.length)) {
+      return;
+    }
+    const items = this.item.unpromotedActions.map(this.createMenuItem);
+    return (index.h("limel-menu", { class: "unpromoted-actions-menu", items: items, openDirection: "bottom-end", onSelect: this.handleMenuItemSelect }, index.h("limel-icon-button", { icon: "menu_2", slot: "trigger", label: (_b = this.translator) === null || _b === void 0 ? void 0 : _b.get('webclient.more-actions') })));
+  }
+  renderTimestamp() {
+    const timestamp = this.item.timestamp;
+    if (!timestamp) {
+      return;
+    }
+    return (index.h("span", { class: "timestamp" }, this.dateTimeFormatter.format(timestamp, 'timeofday')));
+  }
+  get dateTimeFormatter() {
+    return this.platform.get(types.PlatformServiceName.DateTimeFormatter);
+  }
+  get translator() {
+    var _a;
+    return (_a = this.platform) === null || _a === void 0 ? void 0 : _a.get(types.PlatformServiceName.Translate);
+  }
+  get commandbus() {
+    var _a;
+    return (_a = this.platform) === null || _a === void 0 ? void 0 : _a.get(types.PlatformServiceName.CommandBus);
+  }
+  get el() { return index.getElement(this); }
+};
+NotificationListItem.style = notificationItemCss;
+
+exports.limebb_notification_item = NotificationListItem;

package/dist/cjs/limebb-notification-list.cjs.entry.js

@@ -0,0 +1,101 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-5aaf6970.js');
+const types = require('./types-c7646c23.js');
+
+const notificationListCss = ":host(limebb-notification-list){--limebb-notification-list-background-color:var(\n      --feed-background-color,\n      rgb(var(--contrast-100))\n  );--limebb-notification-list-item-background-color:var(--contrast-300);display:flex;flex-direction:column;gap:0.5rem;max-width:45rem;background-color:var(--limebb-notification-list-background-color)}.empty-state{text-align:center}limel-spinner{align-self:center;justify-self:center;margin:auto}.date-heading{font-size:0.75rem;margin:0.5rem 0 0 0;color:rgb(var(--contrast-800))}.load-more-button{margin-top:0.5rem}.new-items-indicator{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:flex-end}.new-items-indicator hr{border:none;position:absolute;width:100%;height:1px;background-color:rgb(var(--color-red-lighter))}.new-items-indicator h3{z-index:1;padding:0 0.5rem;border-radius:1rem;margin:0.5rem 1rem;font-size:small;text-transform:lowercase;color:rgb(var(--color-red-default));background-color:var(--limebb-notification-list-background-color)}.new-items-indicator+.date-heading{margin-top:-0.5rem}";
+
+const NotificationList = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.loadMore = index.createEvent(this, "loadMore", 7);
+    this.itemClick = index.createEvent(this, "itemClick", 7);
+    /**
+     * List of items to display in the feed.
+     */
+    this.items = [];
+    /**
+     * The number of items rendered in the feed,
+     * before the "Load more" button is displayed.
+     */
+    this.totalCount = 0;
+    this.handleItemClick = (event) => {
+      this.itemClick.emit(event.detail);
+    };
+  }
+  render() {
+    return [
+      this.renderEmptyFeedMessage(),
+      this.renderSpinner(),
+      this.renderNotificationItems(),
+    ];
+  }
+  renderSpinner() {
+    if (this.loading) {
+      return index.h("limel-spinner", { size: "small" });
+    }
+  }
+  renderEmptyFeedMessage() {
+    if (this.loading) {
+      return;
+    }
+    if (this.items.length === 0) {
+      return index.h("p", { class: "empty-state" }, this.emptyStateMessage);
+    }
+  }
+  renderNotificationItems() {
+    return this.items.map((item, index$1) => {
+      return [
+        this.renderDateHeader(item.timestamp, index$1),
+        index.h("limebb-notification-item", { platform: this.platform, context: this.context, item: item, key: item.id, onInteract: this.handleItemClick }),
+        this.renderNewItemsIndicator(item.timestamp, index$1),
+      ];
+    });
+  }
+  renderNewItemsIndicator(timestamp, index) {
+    if (!this.lastVisitedTimestamp) {
+      return;
+    }
+    const totalCount = this.items.length;
+    const lastVisitedTimestamp = new Date(this.lastVisitedTimestamp);
+    const currentItemTimestamp = new Date(timestamp);
+    const isCurrentItemNewer = lastVisitedTimestamp < currentItemTimestamp;
+    if (!isCurrentItemNewer) {
+      return;
+    }
+    if (totalCount === 1 || index === 0) {
+      return this.renderIndicator();
+    }
+    const previousItemTimestamp = new Date(this.items[index - 1].timestamp);
+    const isPreviousItemNewer = lastVisitedTimestamp < previousItemTimestamp;
+    if (isPreviousItemNewer) {
+      return;
+    }
+    return this.renderIndicator();
+  }
+  renderIndicator() {
+    return (index.h("div", { class: "new-items-indicator" }, index.h("hr", null), index.h("h3", null, this.translator.get('webclient.new'))));
+  }
+  renderDateHeader(timestamp, index$1) {
+    const currentIndexDate = this.dateTimeFormatter.format(timestamp, 'date');
+    if (index$1 === 0) {
+      return index.h("a", { class: "date-heading" }, currentIndexDate);
+    }
+    const previousIndexDate = this.dateTimeFormatter.format(this.items[index$1 - 1].timestamp, 'date');
+    if (previousIndexDate === currentIndexDate) {
+      return;
+    }
+    return index.h("a", { class: "date-heading" }, currentIndexDate);
+  }
+  get dateTimeFormatter() {
+    return this.platform.get(types.PlatformServiceName.DateTimeFormatter);
+  }
+  get translator() {
+    return this.platform.get(types.PlatformServiceName.Translate);
+  }
+};
+NotificationList.style = notificationListCss;
+
+exports.limebb_notification_list = NotificationList;

package/dist/cjs/loader.cjs.js

@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["limebb-kanban.cjs",[[1,"limebb-kanban",{"platform":[16],"context":[16],"items":[16],"paginationSize":[2,"pagination-size"],"groupBy":[513,"group-by"],"groups":[16]}]]],["limebb-date-range.cjs",[[1,"limebb-date-range",{"platform":[16],"context":[16],"startTime":[16],"endTime":[16],"startTimeLabel":[1,"start-time-label"],"endTimeLabel":[1,"end-time-label"],"language":[1],"timeFormat":[1,"time-format"],"type":[1]}]]],["limebb-feed.cjs",[[1,"limebb-feed",{"platform":[16],"context":[16],"items":[16],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"minutesOfProximity":[2,"minutes-of-proximity"],"totalCount":[2,"total-count"],"lastVisitedTimestamp":[1,"last-visited-timestamp"]}]]],["limebb-browser.cjs",[[17,"limebb-browser",{"platform":[16],"context":[16],"items":[16],"layout":[1],"filter":[32]}]]],["limebb-currency-picker.cjs",[[1,"limebb-currency-picker",{"label":[513],"platform":[16],"currencies":[16],"helperText":[513,"helper-text"],"required":[516],"readonly":[516],"invalid":[516],"disabled":[516],"value":[16]}]]],["limebb-dashboard-widget.cjs",[[1,"limebb-dashboard-widget",{"heading":[513],"subheading":[513],"supportingText":[513,"supporting-text"],"icon":[513]}]]],["limebb-icon-picker.cjs",[[1,"limebb-icon-picker",{"value":[1],"required":[4],"readonly":[4],"invalid":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"]}]]],["limebb-info-tile.cjs",[[1,"limebb-info-tile",{"platform":[16],"context":[16],"filterId":[1,"filter-id"],"disabled":[4],"icon":[1],"label":[1],"prefix":[1],"suffix":[1],"propertyName":[1,"property-name"],"aggregateOperator":[1,"aggregate-operator"],"filters":[32],"value":[32],"loading":[32],"error":[32]}]]],["limebb-limeobject-file-viewer.cjs",[[1,"limebb-limeobject-file-viewer",{"platform":[16],"context":[16],"property":[1],"fileTypes":[16],"limeobject":[32],"limetype":[32]}]]],["limebb-locale-picker.cjs",[[1,"limebb-locale-picker",{"platform":[16],"context":[16],"value":[1],"required":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"],"readonly":[4],"multipleChoice":[4,"multiple-choice"],"allLanguages":[32]}]]],["limebb-navigation-button.cjs",[[17,"limebb-navigation-button",{"href":[513],"tooltipLabel":[513,"tooltip-label"],"tooltipHelperLabel":[513,"tooltip-helper-label"],"type":[513]}]]],["limebb-kanban-item.cjs",[[1,"limebb-kanban-item",{"platform":[16],"context":[16],"item":[16]}]]],["limebb-kanban-column.cjs",[[1,"limebb-kanban-column",{"platform":[16],"context":[16],"columnHeading":[1,"column-heading"],"items":[16],"loading":[4],"paginationSize":[2,"pagination-size"],"displayedItemCount":[32]}]]],["limebb-date-picker.cjs",[[1,"limebb-date-picker",{"platform":[16],"context":[16],"disabled":[516],"readonly":[516],"invalid":[516],"label":[513],"placeholder":[513],"helperText":[513,"helper-text"],"required":[516],"value":[1],"type":[513]}]]],["limebb-feed-timeline-item.cjs",[[1,"limebb-feed-timeline-item",{"platform":[16],"context":[16],"item":[16],"ui":[513],"isBundled":[516,"is-bundled"],"headingCanExpand":[32],"isHeadingExpanded":[32],"showMore":[32],"isTall":[32]}]]]], options);
+  return index.bootstrapLazy([["limebb-kanban.cjs",[[1,"limebb-kanban",{"platform":[16],"context":[16],"items":[16],"paginationSize":[2,"pagination-size"],"groupBy":[513,"group-by"],"groups":[16]}]]],["limebb-date-range.cjs",[[1,"limebb-date-range",{"platform":[16],"context":[16],"startTime":[16],"endTime":[16],"startTimeLabel":[1,"start-time-label"],"endTimeLabel":[1,"end-time-label"],"language":[1],"timeFormat":[1,"time-format"],"type":[1]}]]],["limebb-feed.cjs",[[1,"limebb-feed",{"platform":[16],"context":[16],"items":[16],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"minutesOfProximity":[2,"minutes-of-proximity"],"totalCount":[2,"total-count"],"lastVisitedTimestamp":[1,"last-visited-timestamp"]}]]],["limebb-notification-list.cjs",[[1,"limebb-notification-list",{"platform":[16],"context":[16],"items":[16],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"totalCount":[2,"total-count"],"lastVisitedTimestamp":[1,"last-visited-timestamp"]}]]],["limebb-browser.cjs",[[17,"limebb-browser",{"platform":[16],"context":[16],"items":[16],"layout":[1],"filter":[32]}]]],["limebb-currency-picker.cjs",[[1,"limebb-currency-picker",{"label":[513],"platform":[16],"currencies":[16],"helperText":[513,"helper-text"],"required":[516],"readonly":[516],"invalid":[516],"disabled":[516],"value":[16]}]]],["limebb-dashboard-widget.cjs",[[1,"limebb-dashboard-widget",{"heading":[513],"subheading":[513],"supportingText":[513,"supporting-text"],"icon":[513]}]]],["limebb-icon-picker.cjs",[[1,"limebb-icon-picker",{"value":[1],"required":[4],"readonly":[4],"invalid":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"]}]]],["limebb-info-tile.cjs",[[1,"limebb-info-tile",{"platform":[16],"context":[16],"filterId":[1,"filter-id"],"disabled":[4],"icon":[1],"label":[1],"prefix":[1],"suffix":[1],"propertyName":[1,"property-name"],"aggregateOperator":[1,"aggregate-operator"],"filters":[32],"value":[32],"loading":[32],"error":[32]}]]],["limebb-limeobject-file-viewer.cjs",[[1,"limebb-limeobject-file-viewer",{"platform":[16],"context":[16],"property":[1],"fileTypes":[16],"limeobject":[32],"limetype":[32]}]]],["limebb-locale-picker.cjs",[[1,"limebb-locale-picker",{"platform":[16],"context":[16],"value":[1],"required":[4],"disabled":[4],"label":[1],"helperText":[1,"helper-text"],"readonly":[4],"multipleChoice":[4,"multiple-choice"],"allLanguages":[32]}]]],["limebb-navigation-button.cjs",[[17,"limebb-navigation-button",{"href":[513],"tooltipLabel":[513,"tooltip-label"],"tooltipHelperLabel":[513,"tooltip-helper-label"],"type":[513]}]]],["limebb-kanban-item.cjs",[[1,"limebb-kanban-item",{"platform":[16],"context":[16],"item":[16]}]]],["limebb-kanban-column.cjs",[[1,"limebb-kanban-column",{"platform":[16],"context":[16],"columnHeading":[1,"column-heading"],"items":[16],"loading":[4],"paginationSize":[2,"pagination-size"],"displayedItemCount":[32]}]]],["limebb-date-picker.cjs",[[1,"limebb-date-picker",{"platform":[16],"context":[16],"disabled":[516],"readonly":[516],"invalid":[516],"label":[513],"placeholder":[513],"helperText":[513,"helper-text"],"required":[516],"value":[1],"type":[513]}]]],["limebb-feed-timeline-item.cjs",[[1,"limebb-feed-timeline-item",{"platform":[16],"context":[16],"item":[16],"ui":[513],"isBundled":[516,"is-bundled"],"headingCanExpand":[32],"isHeadingExpanded":[32],"showMore":[32],"isTall":[32]}]]],["limebb-notification-item.cjs",[[1,"limebb-notification-item",{"platform":[16],"context":[16],"item":[16]}]]]], options);
   });
 };
 

package/dist/collection/collection-manifest.json

@@ -14,7 +14,9 @@
     "./components/kanban/kanban-item/kanban-item.js",
     "./components/limeobject/file-viewer/file-viewer.js",
     "./components/locale-picker/locale-picker.js",
-    "./components/navigation-button/navigation-button.js"
+    "./components/navigation-button/navigation-button.js",
+    "./components/notification-list/notification-list.js",
+    "./components/notification-list/notification-item/notification-item.js"
   ],
   "compiler": {
     "name": "@stencil/core",

package/dist/collection/components/feed/feed-item/feed-timeline-item.css

@@ -400,7 +400,6 @@ limel-action-bar {
   width: 0.75rem;
 }
 
-:host(limebb-feed-timeline-item.is-clickable[ui=standard]) .content,
 :host(limebb-feed-timeline-item[ui=standard]) .content {
   background-color: rgb(var(--limebb-feed-item-background-color));
 }
@@ -510,24 +509,4 @@ limel-action-bar {
   top: 0.25rem;
   bottom: unset;
   height: 1.75rem;
-}
-
-:host(limebb-feed-timeline-item.is-clickable) .content {
-  cursor: pointer;
-  transition: color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;
-  cursor: pointer;
-  color: var(--mdc-theme-on-surface);
-  background-color: transparent;
-}
-:host(limebb-feed-timeline-item.is-clickable) .content:hover {
-  color: var(--mdc-theme-on-surface);
-  background-color: var(--lime-elevated-surface-background-color);
-  box-shadow: var(--button-shadow-hovered);
-}
-:host(limebb-feed-timeline-item.is-clickable) .content:active {
-  box-shadow: var(--button-shadow-pressed);
-  transform: translate3d(0, 0.08rem, 0);
-}
-:host(limebb-feed-timeline-item.is-clickable) .content:hover {
-  z-index: 1;
 }

package/dist/collection/components/feed/feed-item/feed-timeline-item.js

@@ -1,4 +1,4 @@
-import { h, Host, } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 import { PlatformServiceName, } from '@limetech/lime-web-components';
 /**
  * Feed item
@@ -57,9 +57,6 @@ export class FeedTimelineItem {
         this.bodyTextHeight = height;
       }
     };
-    this.handleFeedItemClick = () => {
-      this.interact.emit(this.item);
-    };
     this.renderHeader = () => {
       if ((this.isBundled && !this.item.heading) ||
         (!this.item.author && !this.item.heading)) {
@@ -176,7 +173,7 @@ export class FeedTimelineItem {
     (_a = this.bodyResizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
   }
   render() {
-    var _a, _b, _c;
+    var _a, _b;
     return (h(Host, { id: this.item.id, class: {
         'has-unpromoted-actions': !!((_a = this.item.unpromotedActions) === null || _a === void 0 ? void 0 : _a.length),
         'has-author-picture': !!((_b = this.item.author) === null || _b === void 0 ? void 0 : _b.picture),
@@ -184,7 +181,6 @@ export class FeedTimelineItem {
         'expanded-heading': this.isHeadingExpanded,
         'shows-more': this.showMore,
         'is-tall': this.isTall,
-        'is-clickable': !!((_c = this.item) === null || _c === void 0 ? void 0 : _c.clickable),
       }, style: {
         '--body-text-height': `${this.bodyTextHeight}`,
         '--color-code': `${this.item.color}`,
@@ -207,14 +203,7 @@ export class FeedTimelineItem {
       } }));
   }
   renderContent() {
-    let handleClick;
-    if (this.item.clickable) {
-      handleClick = this.handleFeedItemClick;
-    }
-    else {
-      handleClick = undefined;
-    }
-    return (h("div", { class: "right" }, h("div", { class: "content", onClick: handleClick }, this.renderThreadEffects(), this.renderHeader(), this.renderUnpromotedActionsMenu(), this.renderValue(), this.renderRelations()), this.renderPromotedActions()));
+    return (h("div", { class: "right" }, h("div", { class: "content" }, this.renderThreadEffects(), this.renderHeader(), this.renderUnpromotedActionsMenu(), this.renderValue(), this.renderRelations()), this.renderPromotedActions()));
   }
   renderThreadEffects() {
     if (!this.isThreadMessage) {
@@ -449,28 +438,5 @@ export class FeedTimelineItem {
       "isTall": {}
     };
   }
-  static get events() {
-    return [{
-        "method": "interact",
-        "name": "interact",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Fired when clicking on the Feed item"
-        },
-        "complexType": {
-          "original": "FeedItem",
-          "resolved": "FeedItem",
-          "references": {
-            "FeedItem": {
-              "location": "import",
-              "path": "./feed-item.types"
-            }
-          }
-        }
-      }];
-  }
   static get elementRef() { return "el"; }
 }

package/dist/collection/components/feed/feed.js

@@ -26,7 +26,6 @@ const MINUTES_OF_PROXIMITY = 5;
  * @exampleComponent limebb-example-feed-item-types
  * @exampleComponent limebb-example-feed-item-color-coding
  * @exampleComponent limebb-example-feed-new-items
- * @exampleComponent limebb-example-feed-item-clickable
  * @beta
  */
 export class Feed {
@@ -44,9 +43,6 @@ export class Feed {
      * The total number of items available
      */
     this.totalCount = 0;
-    this.handleItemClick = (event) => {
-      this.itemClick.emit(event.detail);
-    };
     this.isBundled = (item, index) => {
       var _a, _b, _c, _d, _e, _f;
       if (index === 0) {
@@ -100,7 +96,7 @@ export class Feed {
       return [
         this.renderNewItemsIndicator(item.timestamp, index),
         this.renderDateHeader(item.timestamp, index),
-        h("limebb-feed-timeline-item", { platform: this.platform, context: this.context, item: item, key: item.id, ui: item === null || item === void 0 ? void 0 : item.ui, isBundled: this.isBundled(item, index), onInteract: this.handleItemClick }),
+        h("limebb-feed-timeline-item", { platform: this.platform, context: this.context, item: item, key: item.id, ui: item === null || item === void 0 ? void 0 : item.ui, isBundled: this.isBundled(item, index) }),
       ];
     });
   }
@@ -344,26 +340,6 @@ export class Feed {
           "resolved": "void",
           "references": {}
         }
-      }, {
-        "method": "itemClick",
-        "name": "itemClick",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Fired when a feed item with `clickable` set to `true` is clicked"
-        },
-        "complexType": {
-          "original": "FeedItem",
-          "resolved": "FeedItem",
-          "references": {
-            "FeedItem": {
-              "location": "import",
-              "path": "./feed-item/feed-item.types"
-            }
-          }
-        }
       }];
   }
 }