@feedlog-ai/webcomponents 0.0.25 → 0.0.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 (45) hide show
  1. package/dist/cjs/feedlog-badge.cjs.entry.js +1 -1
  2. package/dist/cjs/feedlog-button_3.cjs.entry.js +58 -5
  3. package/dist/cjs/feedlog-card.cjs.entry.js +1 -1
  4. package/dist/cjs/feedlog-issues-client.cjs.entry.js +2 -2
  5. package/dist/cjs/feedlog-issues.cjs.entry.js +4 -4
  6. package/dist/cjs/feedlog-toolkit.cjs.js +2 -2
  7. package/dist/cjs/{index-SWDeFUqw.js → index-Bk1-M_w_.js} +48 -1
  8. package/dist/cjs/loader.cjs.js +2 -2
  9. package/dist/collection/__mocks__/feedlog-core.js +10 -0
  10. package/dist/collection/components/feedlog-issues/feedlog-issues.css +3 -1
  11. package/dist/collection/components/feedlog-issues/feedlog-issues.js +21 -2
  12. package/dist/collection/components/feedlog-issues/feedlog-issues.stories.js +28 -0
  13. package/dist/collection/components/feedlog-issues-client/feedlog-issues-client.js +1 -1
  14. package/dist/collection/components/feedlog-issues-list/feedlog-issues-list.css +57 -0
  15. package/dist/collection/components/feedlog-issues-list/feedlog-issues-list.js +80 -2
  16. package/dist/components/feedlog-issues-client.js +1 -1
  17. package/dist/components/feedlog-issues-list.js +1 -1
  18. package/dist/components/feedlog-issues.js +1 -1
  19. package/dist/components/index.js +1 -1
  20. package/dist/components/p-CLFvFGWa.js +1 -0
  21. package/dist/components/p-DeVUfQ0-.js +1 -0
  22. package/dist/esm/feedlog-badge.entry.js +1 -1
  23. package/dist/esm/feedlog-button_3.entry.js +58 -5
  24. package/dist/esm/feedlog-card.entry.js +1 -1
  25. package/dist/esm/feedlog-issues-client.entry.js +2 -2
  26. package/dist/esm/feedlog-issues.entry.js +4 -4
  27. package/dist/esm/feedlog-toolkit.js +3 -3
  28. package/dist/esm/{index-B0OkcXfW.js → index-CHawAwGP.js} +48 -1
  29. package/dist/esm/loader.js +3 -3
  30. package/dist/feedlog-toolkit/feedlog-toolkit.esm.js +1 -1
  31. package/dist/feedlog-toolkit/{p-6576aefa.entry.js → p-13089dc5.entry.js} +1 -1
  32. package/dist/feedlog-toolkit/p-7f8133b3.entry.js +1 -0
  33. package/dist/feedlog-toolkit/{p-B0OkcXfW.js → p-CHawAwGP.js} +2 -2
  34. package/dist/feedlog-toolkit/{p-1e3dd1c6.entry.js → p-bc48ec0d.entry.js} +1 -1
  35. package/dist/feedlog-toolkit/{p-25d89169.entry.js → p-c974a35e.entry.js} +1 -1
  36. package/dist/feedlog-toolkit/{p-0733934f.entry.js → p-d029db94.entry.js} +2 -2
  37. package/dist/types/__mocks__/feedlog-core.d.ts +5 -0
  38. package/dist/types/components/feedlog-issues/feedlog-issues.d.ts +4 -0
  39. package/dist/types/components/feedlog-issues/feedlog-issues.stories.d.ts +1 -0
  40. package/dist/types/components/feedlog-issues-list/feedlog-issues-list.d.ts +10 -0
  41. package/dist/types/components.d.ts +16 -0
  42. package/package.json +2 -2
  43. package/dist/components/p-BR3ookRG.js +0 -1
  44. package/dist/components/p-DKGIKLzX.js +0 -1
  45. package/dist/feedlog-toolkit/p-191fc966.entry.js +0 -1
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-SWDeFUqw.js');
3
+ var index = require('./index-Bk1-M_w_.js');
4
4
 
5
5
  const feedlogBadgeCss = () => `:host{display:inline-block;--feedlog-badge-font-size:0.75rem;--feedlog-badge-font-weight:500;--feedlog-badge-padding-x:0.5rem;--feedlog-badge-padding-y:0.125rem;--feedlog-badge-border-radius:calc(0.625rem - 2px);--feedlog-blue-500:oklch(0.623 0.214 259.815);--feedlog-blue-600:oklch(0.546 0.245 262.881);--feedlog-blue-700:oklch(0.488 0.243 264.376);--feedlog-destructive:#d4183d;--feedlog-destructive-hover:#b91c1c}:host(.dark){--feedlog-blue-500:oklch(0.623 0.214 259.815);--feedlog-blue-600:oklch(0.546 0.245 262.881);--feedlog-destructive:oklch(0.396 0.141 25.723);--feedlog-destructive-hover:oklch(0.45 0.16 25.723)}.badge{display:inline-flex;align-items:center;justify-content:center;gap:0.25rem;font-size:var(--feedlog-badge-font-size);font-weight:var(--feedlog-badge-font-weight);padding:var(--feedlog-badge-padding-y) var(--feedlog-badge-padding-x);border-radius:var(--feedlog-badge-border-radius);white-space:nowrap;transition:background-color 0.15s ease;font-family:inherit}.badge-default{background-color:var(--feedlog-blue-600);color:#ffffff}.badge-default:hover{background-color:var(--feedlog-blue-700)}:host(.dark) .badge-default{background-color:var(--feedlog-blue-500)}:host(.dark) .badge-default:hover{background-color:var(--feedlog-blue-600)}.badge-enhancement{background-color:var(--feedlog-blue-600);color:#ffffff}.badge-enhancement:hover{background-color:var(--feedlog-blue-700)}:host(.dark) .badge-enhancement{background-color:var(--feedlog-blue-500)}:host(.dark) .badge-enhancement:hover{background-color:var(--feedlog-blue-600)}.badge-destructive{background-color:var(--feedlog-destructive);color:#ffffff}.badge-destructive:hover{background-color:var(--feedlog-destructive-hover)}.badge-secondary{background-color:var(--feedlog-muted, #f1f5f9);color:var(--feedlog-muted-foreground, #64748b)}:host(.dark) .badge-secondary{background-color:var(--feedlog-muted, oklch(0.32 0.01 260));color:var(--feedlog-muted-foreground, oklch(0.72 0.02 260))}`;
6
6
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-SWDeFUqw.js');
3
+ var index = require('./index-Bk1-M_w_.js');
4
4
 
5
5
  const feedlogButtonCss = () => `:host{display:inline-block;font-family:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;--feedlog-background:#ffffff;--feedlog-foreground:oklch(0.145 0 0);--feedlog-primary:#030213;--feedlog-primary-foreground:oklch(1 0 0);--feedlog-secondary:oklch(0.95 0.0058 264.53);--feedlog-secondary-foreground:#030213;--feedlog-muted:#ececf0;--feedlog-accent:#e9ebef;--feedlog-accent-foreground:#030213;--feedlog-border:rgba(0, 0, 0, 0.1);--feedlog-input:transparent;--feedlog-ring:oklch(0.708 0 0);--feedlog-destructive:#d4183d;--feedlog-radius:0.625rem}:host(.dark){--feedlog-background:oklch(0.145 0 0);--feedlog-foreground:oklch(0.985 0 0);--feedlog-primary:oklch(0.985 0 0);--feedlog-primary-foreground:oklch(0.205 0 0);--feedlog-secondary:oklch(0.269 0 0);--feedlog-secondary-foreground:oklch(0.985 0 0);--feedlog-muted:oklch(0.269 0 0);--feedlog-accent:oklch(0.269 0 0);--feedlog-accent-foreground:oklch(0.985 0 0);--feedlog-border:oklch(0.269 0 0);--feedlog-input:oklch(0.269 0 0);--feedlog-ring:oklch(0.439 0 0);--feedlog-destructive:oklch(0.396 0.141 25.723)}button{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;white-space:nowrap;font-size:0.875rem;font-weight:500;border-radius:calc(var(--feedlog-radius) - 2px);border:1px solid transparent;cursor:pointer;transition:all 0.15s ease;outline:none;font-family:inherit}button:disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}button:focus-visible{border-color:var(--feedlog-ring);box-shadow:0 0 0 3px color-mix(in oklab, var(--feedlog-ring) 50%, transparent)}.button-default{background-color:var(--feedlog-primary);color:var(--feedlog-primary-foreground);border-color:transparent}.button-default:hover:not(:disabled){background-color:color-mix(in oklab, var(--feedlog-primary) 90%, transparent)}.button-outline{background-color:var(--feedlog-background);color:var(--feedlog-foreground);border-color:var(--feedlog-border)}.button-outline:hover:not(:disabled){background-color:var(--feedlog-accent);color:var(--feedlog-accent-foreground)}:host(.dark) .button-outline{background-color:transparent;border-color:var(--feedlog-input)}:host(.dark) .button-outline:hover:not(:disabled){background-color:color-mix(in oklab, var(--feedlog-accent) 50%, transparent)}.button-ghost{background-color:transparent;color:var(--feedlog-foreground);border-color:transparent}.button-ghost:hover:not(:disabled){background-color:var(--feedlog-accent);color:var(--feedlog-accent-foreground)}.button-destructive{background-color:var(--feedlog-destructive);color:#ffffff;border-color:transparent}.button-destructive:hover:not(:disabled){background-color:color-mix(in oklab, var(--feedlog-destructive) 90%, transparent)}:host(.dark) .button-destructive{background-color:color-mix(in oklab, var(--feedlog-destructive) 60%, transparent)}.button-size-sm{height:2rem;padding:0 0.75rem;font-size:0.75rem}.button-size-sm:has(svg:only-child){width:2rem;padding:0}.button-size-default{height:2.25rem;padding:0.5rem 1rem}.button-size-lg{height:2.5rem;padding:0.625rem 1.5rem;font-size:1rem}button svg{pointer-events:none;flex-shrink:0;width:1rem;height:1rem}`;
6
6
 
@@ -1637,7 +1637,7 @@ const FeedlogIssueComponent = class {
1637
1637
  };
1638
1638
  FeedlogIssueComponent.style = feedlogIssueCss();
1639
1639
 
1640
- const feedlogIssuesListCss = () => `:host{display:block;--feedlog-muted-foreground:#64748b;--feedlog-foreground:oklch(0.145 0 0);--feedlog-empty-illustration-bg:oklch(0.96 0.01 260);--feedlog-empty-illustration-stroke:oklch(0.75 0.02 260);--feedlog-empty-illustration-muted:oklch(0.82 0.01 260)}:host(.dark){--feedlog-muted-foreground:oklch(0.72 0.02 260);--feedlog-foreground:oklch(0.985 0 0);--feedlog-empty-illustration-bg:oklch(0.28 0.02 260);--feedlog-empty-illustration-stroke:oklch(0.45 0.02 260);--feedlog-empty-illustration-muted:oklch(0.38 0.01 260)}.issues-list{display:flex;flex-direction:column;gap:0.5rem}.empty-state{text-align:center;padding:3rem 1.5rem;color:var(--feedlog-muted-foreground);font-size:0.875rem}.empty-state-content{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:20rem}.empty-state-illustration{margin-bottom:1.5rem;opacity:0.9}.empty-state-title{margin:0 0 0.5rem 0;font-size:1.125rem;font-weight:600;color:var(--feedlog-foreground);line-height:1.4}.empty-state-message{margin:0;font-size:0.875rem;color:var(--feedlog-muted-foreground);line-height:1.5}`;
1640
+ const feedlogIssuesListCss = () => `:host{display:block;--feedlog-muted-foreground:#64748b;--feedlog-foreground:oklch(0.145 0 0);--feedlog-empty-illustration-bg:oklch(0.96 0.01 260);--feedlog-empty-illustration-stroke:oklch(0.75 0.02 260);--feedlog-empty-illustration-muted:oklch(0.82 0.01 260)}:host(.dark){--feedlog-muted-foreground:oklch(0.72 0.02 260);--feedlog-foreground:oklch(0.985 0 0);--feedlog-empty-illustration-bg:oklch(0.28 0.02 260);--feedlog-empty-illustration-stroke:oklch(0.45 0.02 260);--feedlog-empty-illustration-muted:oklch(0.38 0.01 260)}.issues-list{display:flex;flex-direction:column;gap:0.5rem}.empty-state{text-align:center;padding:3rem 1.5rem;color:var(--feedlog-muted-foreground);font-size:0.875rem}.empty-state-content{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:20rem}.empty-state-illustration{margin-bottom:1.5rem;opacity:0.9}.empty-state-title{margin:0 0 0.5rem 0;font-size:1.125rem;font-weight:600;color:var(--feedlog-foreground);line-height:1.4}.empty-state-message{margin:0;font-size:0.875rem;color:var(--feedlog-muted-foreground);line-height:1.5}.pagination{display:flex;align-items:center;justify-content:center;gap:0.25rem;margin-top:1.5rem;flex-wrap:wrap}.pagination-btn{min-width:2rem;height:2rem;padding:0 0.5rem;color:var(--feedlog-foreground);background:transparent;border:1px solid var(--feedlog-border, oklch(0.9 0 0));border-radius:var(--feedlog-radius, 0.375rem);font-size:0.875rem;font-weight:500;cursor:pointer;transition:background-color 0.15s, border-color 0.15s}.pagination-btn:hover:not(:disabled){background:var(--feedlog-muted, oklch(0.96 0 0))}.pagination-btn[aria-current='page']{background:var(--feedlog-accent-color, oklch(0.55 0.2 250));color:white;border-color:var(--feedlog-accent-color, oklch(0.55 0.2 250))}.pagination-btn:disabled{opacity:0.5;cursor:not-allowed}.pagination-arrow{font-size:1.25rem;line-height:1}.pagination-ellipsis{padding:0 0.25rem;color:var(--feedlog-muted-foreground);font-size:0.875rem}:host(.dark) .pagination-btn{border-color:oklch(0.4 0.02 260)}:host(.dark) .pagination-btn:hover:not(:disabled){background:oklch(0.35 0.02 260)}`;
1641
1641
 
1642
1642
  const FeedlogIssuesList = class {
1643
1643
  constructor(hostRef) {
@@ -1651,20 +1651,73 @@ const FeedlogIssuesList = class {
1651
1651
  * Theme variant: 'light' or 'dark'
1652
1652
  */
1653
1653
  this.theme = 'light';
1654
+ this.currentPage = 1;
1654
1655
  this.handleUpvote = (event) => {
1655
1656
  event.stopPropagation();
1656
1657
  this.feedlogUpvote.emit(event.detail);
1657
1658
  };
1658
1659
  }
1660
+ resetPage() {
1661
+ this.currentPage = 1;
1662
+ }
1659
1663
  renderEmptyStateIllustration() {
1660
1664
  return (index.h("svg", { class: "empty-state-illustration", xmlns: "http://www.w3.org/2000/svg", width: "120", height: "96", viewBox: "0 0 120 96", fill: "none", "aria-hidden": "true" }, index.h("path", { d: "M20 36h80v44c0 4.4-3.6 8-8 8H28c-4.4 0-8-3.6-8-8V36z", fill: "var(--feedlog-empty-illustration-bg)", stroke: "var(--feedlog-empty-illustration-stroke)", "stroke-width": "1.5", "stroke-linejoin": "round" }), index.h("path", { d: "M20 36l20-24h40l20 24", fill: "none", stroke: "var(--feedlog-empty-illustration-stroke)", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { d: "M44 52h32M44 60h24M44 68h28", stroke: "var(--feedlog-empty-illustration-muted)", "stroke-width": "1.25", "stroke-linecap": "round" })));
1661
1665
  }
1666
+ getVisibleIssues() {
1667
+ if (this.issues.length === 0)
1668
+ return [];
1669
+ if (this.limit == null || this.issues.length <= this.limit) {
1670
+ return this.issues;
1671
+ }
1672
+ const offset = (this.currentPage - 1) * this.limit;
1673
+ return this.issues.slice(offset, offset + this.limit);
1674
+ }
1675
+ getPageNumbers() {
1676
+ if (this.limit == null)
1677
+ return [];
1678
+ const totalPages = Math.ceil(this.issues.length / this.limit);
1679
+ if (totalPages <= 1)
1680
+ return [];
1681
+ const toShow = new Set([1, totalPages]);
1682
+ const start = Math.max(1, this.currentPage - 1);
1683
+ const end = Math.min(totalPages, this.currentPage + 1);
1684
+ for (let i = start; i <= end; i++)
1685
+ toShow.add(i);
1686
+ const sorted = Array.from(toShow).sort((a, b) => a - b);
1687
+ const result = [];
1688
+ for (let i = 0; i < sorted.length; i++) {
1689
+ if (i > 0 && sorted[i] - sorted[i - 1] > 1)
1690
+ result.push('ellipsis');
1691
+ result.push(sorted[i]);
1692
+ }
1693
+ return result;
1694
+ }
1695
+ goToPage(page) {
1696
+ const totalPages = this.limit != null ? Math.ceil(this.issues.length / this.limit) : 1;
1697
+ this.currentPage = Math.max(1, Math.min(page, totalPages));
1698
+ }
1699
+ renderPagination() {
1700
+ if (this.limit == null || this.issues.length <= this.limit)
1701
+ return null;
1702
+ const totalPages = Math.ceil(this.issues.length / this.limit);
1703
+ const pageNumbers = this.getPageNumbers();
1704
+ return (index.h("nav", { class: "pagination", "aria-label": "Issues pagination" }, index.h("button", { type: "button", class: "pagination-btn pagination-arrow", "aria-label": "Previous page", disabled: this.currentPage <= 1, onClick: () => this.goToPage(this.currentPage - 1) }, "\u2039"), pageNumbers.map((p, i) => p === 'ellipsis' ? (index.h("span", { key: i, class: "pagination-ellipsis", "aria-hidden": "true" }, "\u2026")) : (index.h("button", { key: i, type: "button", class: "pagination-btn", "aria-current": p === this.currentPage ? 'page' : undefined, onClick: () => this.goToPage(p) }, p))), index.h("button", { type: "button", class: "pagination-btn pagination-arrow", "aria-label": "Next page", disabled: this.currentPage >= totalPages, onClick: () => this.goToPage(this.currentPage + 1) }, "\u203A")));
1705
+ }
1662
1706
  render() {
1663
- return (index.h(index.Host, { key: 'd797fd4978179c9081678e2fb3e7e2be756b4ea2', class: this.theme === 'dark' ? 'dark' : '' }, index.h("div", { key: '1fe373bbad55cf718d65279ae718f9b95e89e37f', class: "issues-list" }, this.issues.length === 0 ? (index.h("div", { class: "empty-state" }, this.emptyStateTitle && this.emptyStateMessage ? (index.h("div", { class: "empty-state-content" }, this.renderEmptyStateIllustration(), index.h("h2", { class: "empty-state-title" }, this.emptyStateTitle), index.h("p", { class: "empty-state-message" }, this.emptyStateMessage))) : (index.h("p", null, "No issues found")))) : (this.issues.map(issue => {
1707
+ const visibleIssues = this.getVisibleIssues();
1708
+ return (index.h(index.Host, { key: '474f5ca0d8edc94a8e9a03d83c6a977270391d65', class: this.theme === 'dark' ? 'dark' : '' }, index.h("div", { key: '8f2f8125653ec5f80b167945a33cefe483c1a001', class: "issues-list" }, visibleIssues.length === 0 ? (index.h("div", { class: "empty-state" }, this.emptyStateTitle && this.emptyStateMessage ? (index.h("div", { class: "empty-state-content" }, this.renderEmptyStateIllustration(), index.h("h2", { class: "empty-state-title" }, this.emptyStateTitle), index.h("p", { class: "empty-state-message" }, this.emptyStateMessage))) : (index.h("p", null, "No issues found")))) : (visibleIssues.map(issue => {
1664
1709
  var _a, _b;
1665
1710
  return (index.h("feedlog-issue", { key: issue.id, issue: issue, issueUrl: (_b = (_a = this.getIssueUrl) === null || _a === void 0 ? void 0 : _a.call(this, issue)) !== null && _b !== void 0 ? _b : undefined, theme: this.theme, onFeedlogUpvote: (e) => this.handleUpvote(e) }));
1666
- })))));
1667
- }
1711
+ }))), this.renderPagination()));
1712
+ }
1713
+ static get watchers() { return {
1714
+ "issues": [{
1715
+ "resetPage": 0
1716
+ }],
1717
+ "limit": [{
1718
+ "resetPage": 0
1719
+ }]
1720
+ }; }
1668
1721
  };
1669
1722
  FeedlogIssuesList.style = feedlogIssuesListCss();
1670
1723
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-SWDeFUqw.js');
3
+ var index = require('./index-Bk1-M_w_.js');
4
4
 
5
5
  const feedlogCardCss = () => `:host{display:block;font-family:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;--feedlog-card:#ffffff;--feedlog-card-foreground:oklch(0.145 0 0);--feedlog-border:rgba(0, 0, 0, 0.1);--feedlog-radius:0.625rem;--feedlog-card-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);--feedlog-card-hover-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)}:host(.dark){--feedlog-card:oklch(0.145 0 0);--feedlog-card-foreground:oklch(0.985 0 0);--feedlog-border:oklch(0.269 0 0);--feedlog-card-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.3);--feedlog-card-hover-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.3)}.feedlog-card{background-color:var(--feedlog-card);color:var(--feedlog-card-foreground);border:1px solid var(--feedlog-border);border-radius:var(--feedlog-radius);box-shadow:var(--feedlog-card-shadow);transition:box-shadow 0.15s ease;position:relative}.feedlog-card:hover{box-shadow:var(--feedlog-card-hover-shadow)}::slotted([slot="header"]){display:block}::slotted([slot="content"]){display:block}::slotted([slot="footer"]){display:block}`;
6
6
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-SWDeFUqw.js');
3
+ var index = require('./index-Bk1-M_w_.js');
4
4
 
5
5
  /**
6
6
  * HTML and XSS sanitization utilities
@@ -559,7 +559,7 @@ const FeedlogIssuesClient = class {
559
559
  const style = hostBg
560
560
  ? { '--feedlog-background': hostBg }
561
561
  : undefined;
562
- return (index.h("feedlog-issues", { key: '85e92e5ad7b556d97f4d6b94e308c08070e1ff0f', style: style, issues: this.issues, maxWidth: this.maxWidth, theme: this.theme, heading: this.heading, subtitle: this.subtitle, emptyStateTitle: this.emptyStateTitle, emptyStateMessage: this.emptyStateMessage, getIssueUrl: this.getIssueUrl, loading: this.loading, error: this.error, hasMore: this.hasMore, isLoadingMore: this.isLoadingMore, onFeedlogUpvote: this.handleUpvote, onFeedlogLoadMore: async () => this.loadMore() }));
562
+ return (index.h("feedlog-issues", { key: '15ae96d7d7b51964026f873f8b97e10530ed02b4', style: style, issues: this.issues, limit: this.limit, maxWidth: this.maxWidth, theme: this.theme, heading: this.heading, subtitle: this.subtitle, emptyStateTitle: this.emptyStateTitle, emptyStateMessage: this.emptyStateMessage, getIssueUrl: this.getIssueUrl, loading: this.loading, error: this.error, hasMore: this.hasMore, isLoadingMore: this.isLoadingMore, onFeedlogUpvote: this.handleUpvote, onFeedlogLoadMore: async () => this.loadMore() }));
563
563
  }
564
564
  get el() { return index.getElement(this); }
565
565
  };
@@ -1,8 +1,8 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-SWDeFUqw.js');
3
+ var index = require('./index-Bk1-M_w_.js');
4
4
 
5
- const feedlogIssuesCss = () => `:host{display:block;font-family:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;--feedlog-theme-bg:#ffffff;--feedlog-foreground:oklch(0.145 0 0);--feedlog-card:#ffffff;--feedlog-card-foreground:oklch(0.145 0 0);--feedlog-muted:#ececf0;--feedlog-muted-foreground:#717182;--feedlog-border:rgba(0, 0, 0, 0.1);--feedlog-accent-color:#2563eb;--feedlog-destructive:#d4183d;--feedlog-blue-400:oklch(0.707 0.165 254.624);--feedlog-blue-600:oklch(0.546 0.245 262.881);--feedlog-blue-100:oklch(0.932 0.032 255.585);--feedlog-red-100:#fce7f3;--feedlog-red-400:#f472b6;--feedlog-red-600:#db2777;--feedlog-radius:0.625rem;--feedlog-gap:0.5rem;--feedlog-padding:2rem;--feedlog-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.08), 0 1px 2px -1px rgba(0, 0, 0, 0.08)}:host(.dark){--feedlog-theme-bg:oklch(0.18 0.01 260);--feedlog-foreground:oklch(0.985 0 0);--feedlog-card:oklch(0.24 0.01 260);--feedlog-card-foreground:oklch(0.985 0 0);--feedlog-muted:oklch(0.32 0.01 260);--feedlog-muted-foreground:oklch(0.72 0.02 260);--feedlog-border:oklch(0.34 0.01 260);--feedlog-accent-color:#3b82f6;--feedlog-destructive:oklch(0.396 0.141 25.723);--feedlog-blue-400:oklch(0.707 0.165 254.624);--feedlog-blue-600:oklch(0.546 0.245 262.881);--feedlog-blue-900-30:color-mix(in oklab, oklch(0.379 0.146 265.522) 30%, transparent);--feedlog-red-900-30:color-mix(in oklab, oklch(0.396 0.141 25.723) 30%, transparent);--feedlog-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.3)}.issues-container{min-height:100vh;background-color:var(--feedlog-background, var(--feedlog-theme-bg, #ffffff));padding:var(--feedlog-padding);margin:0 auto}.issues-header{margin-bottom:1.5rem;display:flex;align-items:flex-start;justify-content:space-between}.header-content{flex:1}.issues-title{color:var(--feedlog-foreground);margin:0 0 0.25rem 0;font-size:1.5rem;font-weight:500;line-height:1.5}.issues-subtitle{color:var(--feedlog-muted-foreground);font-size:0.875rem;margin:0}.loading-state{padding:0}.loading-skeletons{display:flex;flex-direction:column;gap:var(--feedlog-gap)}.skeleton-card{background-color:var(--feedlog-card);border:1px solid var(--feedlog-border);border-radius:var(--feedlog-radius);box-shadow:var(--feedlog-shadow);position:relative;overflow:hidden}.skeleton-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--feedlog-muted)}.skeleton-content{padding:1.25rem;padding-left:calc(1.25rem + 3px);display:flex;flex-direction:column;gap:0.875rem}.skeleton-header{display:flex;align-items:center;justify-content:space-between;gap:0.75rem}.skeleton-badge{width:4.5rem;height:1.25rem;border-radius:0.375rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite}.skeleton-timestamp{width:3rem;height:0.75rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.2s}.skeleton-main{display:flex;flex-direction:column;gap:0.5rem}.skeleton-title{height:0.9375rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.1s;width:85%}.skeleton-body{display:flex;flex-direction:column;gap:0.375rem}.skeleton-line{height:0.8125rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.15s;width:100%}.skeleton-line.short{width:70%}.skeleton-repo{width:6rem;height:0.75rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.25s}.skeleton-footer{display:flex;justify-content:flex-end}.skeleton-upvote{width:2.5rem;height:2rem;border-radius:0.5rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.3s}@keyframes skeleton-pulse{0%,100%{opacity:1}50%{opacity:0.5}}.error-state{display:flex;align-items:center;justify-content:center;padding:3rem 2rem;min-height:12rem}.error-state-content{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:20rem;padding:2rem}.error-icon{color:var(--feedlog-muted-foreground);opacity:0.8;margin-bottom:1rem}.error-state-title{margin:0 0 0.5rem 0;font-size:1.125rem;font-weight:600;color:var(--feedlog-foreground);line-height:1.4}.error-state-message{margin:0 0 1.25rem 0;font-size:0.875rem;color:var(--feedlog-muted-foreground);line-height:1.5}.load-more-container{display:flex;justify-content:center;padding:2rem 0;gap:1rem}`;
5
+ const feedlogIssuesCss = () => `:host{display:block;font-family:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;--feedlog-theme-bg:#ffffff;--feedlog-foreground:oklch(0.145 0 0);--feedlog-card:#ffffff;--feedlog-card-foreground:oklch(0.145 0 0);--feedlog-muted:#ececf0;--feedlog-muted-foreground:#717182;--feedlog-border:rgba(0, 0, 0, 0.1);--feedlog-accent-color:#2563eb;--feedlog-destructive:#d4183d;--feedlog-blue-400:oklch(0.707 0.165 254.624);--feedlog-blue-600:oklch(0.546 0.245 262.881);--feedlog-blue-100:oklch(0.932 0.032 255.585);--feedlog-red-100:#fce7f3;--feedlog-red-400:#f472b6;--feedlog-red-600:#db2777;--feedlog-radius:0.625rem;--feedlog-gap:0.5rem;--feedlog-padding:2rem;--feedlog-min-height:100%;--feedlog-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.08), 0 1px 2px -1px rgba(0, 0, 0, 0.08)}:host(.dark){--feedlog-theme-bg:oklch(0.18 0.01 260);--feedlog-foreground:oklch(0.985 0 0);--feedlog-card:oklch(0.24 0.01 260);--feedlog-card-foreground:oklch(0.985 0 0);--feedlog-muted:oklch(0.32 0.01 260);--feedlog-muted-foreground:oklch(0.72 0.02 260);--feedlog-border:oklch(0.34 0.01 260);--feedlog-accent-color:#3b82f6;--feedlog-destructive:oklch(0.396 0.141 25.723);--feedlog-blue-400:oklch(0.707 0.165 254.624);--feedlog-blue-600:oklch(0.546 0.245 262.881);--feedlog-blue-900-30:color-mix(in oklab, oklch(0.379 0.146 265.522) 30%, transparent);--feedlog-red-900-30:color-mix(in oklab, oklch(0.396 0.141 25.723) 30%, transparent);--feedlog-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.3)}.issues-container{min-height:var(--feedlog-min-height);background-color:var(--feedlog-background, var(--feedlog-theme-bg, #ffffff));padding:var(--feedlog-padding);margin:0 auto;border-radius:var(--feedlog-radius)}.issues-header{margin-bottom:1.5rem;display:flex;align-items:flex-start;justify-content:space-between}.header-content{flex:1}.issues-title{color:var(--feedlog-foreground);margin:0 0 0.25rem 0;font-size:1.5rem;font-weight:500;line-height:1.5}.issues-subtitle{color:var(--feedlog-muted-foreground);font-size:0.875rem;margin:0}.loading-state{padding:0}.loading-skeletons{display:flex;flex-direction:column;gap:var(--feedlog-gap)}.skeleton-card{background-color:var(--feedlog-card);border:1px solid var(--feedlog-border);border-radius:var(--feedlog-radius);box-shadow:var(--feedlog-shadow);position:relative;overflow:hidden}.skeleton-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--feedlog-muted)}.skeleton-content{padding:1.25rem;padding-left:calc(1.25rem + 3px);display:flex;flex-direction:column;gap:0.875rem}.skeleton-header{display:flex;align-items:center;justify-content:space-between;gap:0.75rem}.skeleton-badge{width:4.5rem;height:1.25rem;border-radius:0.375rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite}.skeleton-timestamp{width:3rem;height:0.75rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.2s}.skeleton-main{display:flex;flex-direction:column;gap:0.5rem}.skeleton-title{height:0.9375rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.1s;width:85%}.skeleton-body{display:flex;flex-direction:column;gap:0.375rem}.skeleton-line{height:0.8125rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.15s;width:100%}.skeleton-line.short{width:70%}.skeleton-repo{width:6rem;height:0.75rem;border-radius:0.25rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.25s}.skeleton-footer{display:flex;justify-content:flex-end}.skeleton-upvote{width:2.5rem;height:2rem;border-radius:0.5rem;background-color:var(--feedlog-muted);animation:skeleton-pulse 1.5s ease-in-out infinite 0.3s}@keyframes skeleton-pulse{0%,100%{opacity:1}50%{opacity:0.5}}.error-state{display:flex;align-items:center;justify-content:center;padding:3rem 2rem;min-height:12rem}.error-state-content{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:20rem;padding:2rem}.error-icon{color:var(--feedlog-muted-foreground);opacity:0.8;margin-bottom:1rem}.error-state-title{margin:0 0 0.5rem 0;font-size:1.125rem;font-weight:600;color:var(--feedlog-foreground);line-height:1.4}.error-state-message{margin:0 0 1.25rem 0;font-size:0.875rem;color:var(--feedlog-muted-foreground);line-height:1.5}.load-more-container{display:flex;justify-content:center;padding:2rem 0;gap:1rem}`;
6
6
 
7
7
  const FeedlogIssues = class {
8
8
  constructor(hostRef) {
@@ -57,13 +57,13 @@ const FeedlogIssues = class {
57
57
  }
58
58
  renderIssuesList() {
59
59
  var _a, _b;
60
- return (index.h("feedlog-issues-list", { issues: this.issues, theme: this.currentTheme, getIssueUrl: this.getIssueUrl, emptyStateTitle: (_a = this.emptyStateTitle) !== null && _a !== void 0 ? _a : 'No updates yet', emptyStateMessage: (_b = this.emptyStateMessage) !== null && _b !== void 0 ? _b : 'Check back later for new updates.', onFeedlogUpvote: (e) => this.handleUpvote(e) }));
60
+ return (index.h("feedlog-issues-list", { issues: this.issues, limit: this.limit, theme: this.currentTheme, getIssueUrl: this.getIssueUrl, emptyStateTitle: (_a = this.emptyStateTitle) !== null && _a !== void 0 ? _a : 'No updates yet', emptyStateMessage: (_b = this.emptyStateMessage) !== null && _b !== void 0 ? _b : 'Check back later for new updates.', onFeedlogUpvote: (e) => this.handleUpvote(e) }));
61
61
  }
62
62
  render() {
63
63
  const containerStyle = {
64
64
  maxWidth: this.maxWidth,
65
65
  };
66
- return (index.h(index.Host, { key: '812719c5d6f25108834d1a422dee280c18033e36', class: this.currentTheme === 'dark' ? 'dark' : '' }, index.h("div", { key: '1e415969878bad8fb14ea9e648d2c2d2e0d492a1', class: "issues-container", style: containerStyle }, (this.heading || this.subtitle) && (index.h("header", { key: '5bf1308396ff3bc04a57763317fa71a34d48cc95', class: "issues-header" }, index.h("div", { key: '19494458a1bcd11c3d91c08e98887f9d6ed33314', class: "header-content" }, this.heading && index.h("h1", { key: 'f89bd679a9dd9262c93573ef0bfbbb23bd892a87', class: "issues-title" }, this.heading), this.subtitle && index.h("p", { key: '2bcc73dfb95d7ae8971004522fe44cca5128701b', class: "issues-subtitle" }, this.subtitle)))), this.loading && (index.h("div", { key: '85c06c80b624cd16d532bea5f0ad6fb7cc06f692', class: "loading-state", role: "status", "aria-label": "Loading issues" }, index.h("div", { key: '766cd9e7c18586f937a1b864e7bcfce60fe79707', class: "loading-skeletons" }, [1, 2, 3].map(i => (index.h("div", { key: i, class: "skeleton-card" }, index.h("div", { class: "skeleton-content" }, index.h("div", { class: "skeleton-header" }, index.h("div", { class: "skeleton-badge" }), index.h("div", { class: "skeleton-timestamp" })), index.h("div", { class: "skeleton-main" }, index.h("div", { class: "skeleton-title" }), index.h("div", { class: "skeleton-body" }, index.h("div", { class: "skeleton-line" }), index.h("div", { class: "skeleton-line short" })), index.h("div", { class: "skeleton-repo" })), index.h("div", { class: "skeleton-footer" }, index.h("div", { class: "skeleton-upvote" }))))))))), this.error && (index.h("div", { key: '5ca08a9ddc95b4ef59d6c776a24e08b5ac65c0b3', class: "error-state", role: "alert" }, index.h("div", { key: '93218f816564cff58f591b53d1aad6b6bc8a1c64', class: "error-state-content" }, this.renderErrorIcon(), index.h("h2", { key: 'f141f75b92164af3f4d139a17937b0533641bcc0', class: "error-state-title" }, "Something went wrong"), index.h("p", { key: '61225c7f4f46944787d4a6448386c8209cdaf74c', class: "error-state-message" }, this.error)))), !this.loading && !this.error && (index.h("div", { key: '5ac699f4c5d0e5b5d20f1546efe24f80cba70748' }, this.renderIssuesList(), this.hasMore && (index.h("div", { key: '9ad22c48dac0d8874dfae9735c850b2ca52836e7', class: "load-more-container" }, index.h("feedlog-button", { key: 'de55c05ca8b80ec5df98051653ca135874edc98b', onFeedlogClick: this.handleLoadMore, disabled: this.isLoadingMore, variant: "outline" }, this.isLoadingMore ? 'Loading...' : 'Load More Issues'))))))));
66
+ return (index.h(index.Host, { key: '96686863c5eb831e64993c681c7780e035c0e2b2', class: this.currentTheme === 'dark' ? 'dark' : '' }, index.h("div", { key: '54d01678053f4fe58eb547f9954f497402495a83', class: "issues-container", style: containerStyle }, (this.heading || this.subtitle) && (index.h("header", { key: '889aa47cb4ceea60ca4a5615f512793d726059d9', class: "issues-header" }, index.h("div", { key: '8b4ac6a9ed0c6120ec838a1329416f3471cd2751', class: "header-content" }, this.heading && index.h("h1", { key: 'cfc52f28bc5131715a5c7a0b9231e440b4c0b67c', class: "issues-title" }, this.heading), this.subtitle && index.h("p", { key: '8b4488546ceb6e807d689b8fca2b2fd85722f824', class: "issues-subtitle" }, this.subtitle)))), this.loading && (index.h("div", { key: '35c382f4417893c17951b73dedb12452e805668c', class: "loading-state", role: "status", "aria-label": "Loading issues" }, index.h("div", { key: '2d83dd9d40bf7b2a14744ee4a715108a9cdebd60', class: "loading-skeletons" }, [1, 2, 3].map(i => (index.h("div", { key: i, class: "skeleton-card" }, index.h("div", { class: "skeleton-content" }, index.h("div", { class: "skeleton-header" }, index.h("div", { class: "skeleton-badge" }), index.h("div", { class: "skeleton-timestamp" })), index.h("div", { class: "skeleton-main" }, index.h("div", { class: "skeleton-title" }), index.h("div", { class: "skeleton-body" }, index.h("div", { class: "skeleton-line" }), index.h("div", { class: "skeleton-line short" })), index.h("div", { class: "skeleton-repo" })), index.h("div", { class: "skeleton-footer" }, index.h("div", { class: "skeleton-upvote" }))))))))), this.error && (index.h("div", { key: '43efd42ce0d213131ba97d42d1f98c52515ea9fd', class: "error-state", role: "alert" }, index.h("div", { key: 'ad22b0378e290556c896c628dadabf6091bbf972', class: "error-state-content" }, this.renderErrorIcon(), index.h("h2", { key: '9a9779f52de12aa2241ba9ddda6cf8297a4af84d', class: "error-state-title" }, "Something went wrong"), index.h("p", { key: 'c697040d37909d882730e5d9ab3a3b147061fc51', class: "error-state-message" }, this.error)))), !this.loading && !this.error && (index.h("div", { key: 'afc12552ff7ccc808c7191c1dd1e26d3b95bf2fd' }, this.renderIssuesList(), this.hasMore && (index.h("div", { key: '0f6c84bdeda386e4eec439fb80f4ee1606b9b559', class: "load-more-container" }, index.h("feedlog-button", { key: 'e6983bd889a6cdfd4a4b8a06f3a6a97c2d276243', onFeedlogClick: this.handleLoadMore, disabled: this.isLoadingMore, variant: "outline" }, this.isLoadingMore ? 'Loading...' : 'Load More Issues'))))))));
67
67
  }
68
68
  };
69
69
  FeedlogIssues.style = feedlogIssuesCss();
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-SWDeFUqw.js');
3
+ var index = require('./index-Bk1-M_w_.js');
4
4
 
5
5
  var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
6
6
  /*
@@ -18,7 +18,7 @@ var patchBrowser = () => {
18
18
 
19
19
  patchBrowser().then(async (options) => {
20
20
  await index.globalScripts();
21
- return index.bootstrapLazy([["feedlog-card.cjs",[[257,"feedlog-card"]]],["feedlog-badge.cjs",[[257,"feedlog-badge",{"variant":[1]}]]],["feedlog-button_3.cjs",[[1,"feedlog-issues-list",{"issues":[16],"theme":[1],"getIssueUrl":[16],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"]}],[257,"feedlog-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1]}],[257,"feedlog-issue",{"issue":[16],"issueUrl":[1,"issue-url"],"theme":[1]}]]],["feedlog-issues.cjs",[[1,"feedlog-issues",{"issues":[16],"maxWidth":[1,"max-width"],"theme":[1025],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"error":[1],"hasMore":[4,"has-more"],"isLoadingMore":[4,"is-loading-more"],"getIssueUrl":[16],"currentTheme":[32]}]]],["feedlog-issues-client.cjs",[[1,"feedlog-issues-client",{"apiKey":[1,"api-key"],"type":[1],"limit":[2],"sortBy":[1,"sort-by"],"endpoint":[1],"maxWidth":[1,"max-width"],"theme":[1],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"getIssueUrl":[16],"issues":[32],"loading":[32],"error":[32],"cursor":[32],"hasMore":[32],"isLoadingMore":[32]}]]]], options);
21
+ return index.bootstrapLazy([["feedlog-card.cjs",[[257,"feedlog-card"]]],["feedlog-badge.cjs",[[257,"feedlog-badge",{"variant":[1]}]]],["feedlog-button_3.cjs",[[1,"feedlog-issues-list",{"issues":[16],"limit":[2],"theme":[1],"getIssueUrl":[16],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"currentPage":[32]},null,{"issues":[{"resetPage":0}],"limit":[{"resetPage":0}]}],[257,"feedlog-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1]}],[257,"feedlog-issue",{"issue":[16],"issueUrl":[1,"issue-url"],"theme":[1]}]]],["feedlog-issues.cjs",[[1,"feedlog-issues",{"issues":[16],"maxWidth":[1,"max-width"],"limit":[2],"theme":[1025],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"error":[1],"hasMore":[4,"has-more"],"isLoadingMore":[4,"is-loading-more"],"getIssueUrl":[16],"currentTheme":[32]}]]],["feedlog-issues-client.cjs",[[1,"feedlog-issues-client",{"apiKey":[1,"api-key"],"type":[1],"limit":[2],"sortBy":[1,"sort-by"],"endpoint":[1],"maxWidth":[1,"max-width"],"theme":[1],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"getIssueUrl":[16],"issues":[32],"loading":[32],"error":[32],"cursor":[32],"hasMore":[32],"isLoadingMore":[32]}]]]], options);
22
22
  });
23
23
 
24
24
  exports.setNonce = index.setNonce;
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const NAMESPACE = 'feedlog-toolkit';
4
- const BUILD = /* feedlog-toolkit */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, propChangeCallback: false, state: true, updatable: true};
4
+ const BUILD = /* feedlog-toolkit */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, propChangeCallback: true, state: true, updatable: true};
5
5
 
6
6
  const globalScripts = () => {};
7
7
  const globalStyles = ":root{--feedlog-font-size:16px;--feedlog-background:#ffffff;--feedlog-foreground:oklch(0.145 0 0);--feedlog-card:#ffffff;--feedlog-card-foreground:oklch(0.145 0 0);--feedlog-popover:oklch(1 0 0);--feedlog-popover-foreground:oklch(0.145 0 0);--feedlog-primary:#030213;--feedlog-primary-foreground:oklch(1 0 0);--feedlog-secondary:oklch(0.95 0.0058 264.53);--feedlog-secondary-foreground:#030213;--feedlog-muted:#ececf0;--feedlog-muted-foreground:#717182;--feedlog-accent:#e9ebef;--feedlog-accent-foreground:#030213;--feedlog-destructive:#d4183d;--feedlog-destructive-foreground:#ffffff;--feedlog-border:rgba(0, 0, 0, 0.1);--feedlog-input:transparent;--feedlog-input-background:#f3f3f5;--feedlog-switch-background:#cbced4;--feedlog-ring:oklch(0.708 0 0);--feedlog-radius:0.625rem;--feedlog-blue-100:oklch(0.932 0.032 255.585);--feedlog-blue-400:oklch(0.707 0.165 254.624);--feedlog-blue-500:oklch(0.623 0.214 259.815);--feedlog-blue-600:oklch(0.546 0.245 262.881);--feedlog-blue-700:oklch(0.488 0.243 264.376);--feedlog-blue-900:oklch(0.379 0.146 265.522);--feedlog-font-family:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace}.dark{--feedlog-background:oklch(0.145 0 0);--feedlog-foreground:oklch(0.985 0 0);--feedlog-card:oklch(0.145 0 0);--feedlog-card-foreground:oklch(0.985 0 0);--feedlog-popover:oklch(0.145 0 0);--feedlog-popover-foreground:oklch(0.985 0 0);--feedlog-primary:oklch(0.985 0 0);--feedlog-primary-foreground:oklch(0.205 0 0);--feedlog-secondary:oklch(0.269 0 0);--feedlog-secondary-foreground:oklch(0.985 0 0);--feedlog-muted:oklch(0.269 0 0);--feedlog-muted-foreground:oklch(0.708 0 0);--feedlog-accent:oklch(0.269 0 0);--feedlog-accent-foreground:oklch(0.985 0 0);--feedlog-destructive:oklch(0.396 0.141 25.723);--feedlog-destructive-foreground:oklch(0.637 0.237 25.331);--feedlog-border:oklch(0.269 0 0);--feedlog-input:oklch(0.269 0 0);--feedlog-ring:oklch(0.439 0 0)}";
@@ -2670,6 +2670,7 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
2670
2670
  `Couldn't find host element for "${cmpMeta.$tagName$}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`
2671
2671
  );
2672
2672
  }
2673
+ const elm = hostRef.$hostElement$ ;
2673
2674
  const oldVal = hostRef.$instanceValues$.get(propName);
2674
2675
  const flags = hostRef.$flags$;
2675
2676
  const instance = hostRef.$lazyInstance$ ;
@@ -2680,6 +2681,27 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
2680
2681
  const didValueChange = newVal !== oldVal && !areBothNaN;
2681
2682
  if ((!(flags & 8 /* isConstructingInstance */) || oldVal === void 0) && didValueChange) {
2682
2683
  hostRef.$instanceValues$.set(propName, newVal);
2684
+ if (cmpMeta.$watchers$) {
2685
+ const watchMethods = cmpMeta.$watchers$[propName];
2686
+ if (watchMethods) {
2687
+ watchMethods.map((watcher) => {
2688
+ try {
2689
+ const [[watchMethodName, watcherFlags]] = Object.entries(watcher);
2690
+ if (flags & 128 /* isWatchReady */ || watcherFlags & 1 /* Immediate */) {
2691
+ if (!instance) {
2692
+ hostRef.$fetchedCbList$.push(() => {
2693
+ hostRef.$lazyInstance$[watchMethodName](newVal, oldVal, propName);
2694
+ });
2695
+ } else {
2696
+ instance[watchMethodName](newVal, oldVal, propName);
2697
+ }
2698
+ }
2699
+ } catch (e) {
2700
+ consoleError(e, elm);
2701
+ }
2702
+ });
2703
+ }
2704
+ }
2683
2705
  if ((flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
2684
2706
  if (instance.componentShouldUpdate) {
2685
2707
  if (instance.componentShouldUpdate(newVal, oldVal, propName) === false) {
@@ -2696,6 +2718,17 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
2696
2718
  var _a, _b;
2697
2719
  const prototype = Cstr.prototype;
2698
2720
  if (cmpMeta.$members$ || BUILD.propChangeCallback) {
2721
+ {
2722
+ if (Cstr.watchers && !cmpMeta.$watchers$) {
2723
+ cmpMeta.$watchers$ = Cstr.watchers;
2724
+ }
2725
+ if (Cstr.deserializers && !cmpMeta.$deserializers$) {
2726
+ cmpMeta.$deserializers$ = Cstr.deserializers;
2727
+ }
2728
+ if (Cstr.serializers && !cmpMeta.$serializers$) {
2729
+ cmpMeta.$serializers$ = Cstr.serializers;
2730
+ }
2731
+ }
2699
2732
  const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
2700
2733
  members.map(([memberName, [memberFlags]]) => {
2701
2734
  if ((memberFlags & 31 /* Prop */ || (flags & 2 /* proxyState */) && memberFlags & 32 /* State */)) {
@@ -2845,6 +2878,11 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
2845
2878
  throw new Error(`Constructor for "${cmpMeta.$tagName$}#${hostRef.$modeName$}" was not found`);
2846
2879
  }
2847
2880
  if (!Cstr.isProxied) {
2881
+ {
2882
+ cmpMeta.$watchers$ = Cstr.watchers;
2883
+ cmpMeta.$serializers$ = Cstr.serializers;
2884
+ cmpMeta.$deserializers$ = Cstr.deserializers;
2885
+ }
2848
2886
  proxyComponent(Cstr, cmpMeta, 2 /* proxyState */);
2849
2887
  Cstr.isProxied = true;
2850
2888
  }
@@ -2860,6 +2898,9 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
2860
2898
  {
2861
2899
  hostRef.$flags$ &= -9 /* isConstructingInstance */;
2862
2900
  }
2901
+ {
2902
+ hostRef.$flags$ |= 128 /* isWatchReady */;
2903
+ }
2863
2904
  endNewInstance();
2864
2905
  fireConnectedCallback(hostRef.$lazyInstance$, elm);
2865
2906
  } else {
@@ -2980,6 +3021,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
2980
3021
  let hasSlotRelocation = false;
2981
3022
  lazyBundles.map((lazyBundle) => {
2982
3023
  lazyBundle[1].map((compactMeta) => {
3024
+ var _a2, _b, _c;
2983
3025
  const cmpMeta = {
2984
3026
  $flags$: compactMeta[0],
2985
3027
  $tagName$: compactMeta[1],
@@ -2992,6 +3034,11 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
2992
3034
  {
2993
3035
  cmpMeta.$members$ = compactMeta[2];
2994
3036
  }
3037
+ {
3038
+ cmpMeta.$watchers$ = (_a2 = compactMeta[4]) != null ? _a2 : {};
3039
+ cmpMeta.$serializers$ = (_b = compactMeta[5]) != null ? _b : {};
3040
+ cmpMeta.$deserializers$ = (_c = compactMeta[6]) != null ? _c : {};
3041
+ }
2995
3042
  const tagName = transformTag(cmpMeta.$tagName$);
2996
3043
  const HostElement = class extends HTMLElement {
2997
3044
  // StencilLazyHost
@@ -1,11 +1,11 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-SWDeFUqw.js');
3
+ var index = require('./index-Bk1-M_w_.js');
4
4
 
5
5
  const defineCustomElements = async (win, options) => {
6
6
  if (typeof window === 'undefined') return undefined;
7
7
  await index.globalScripts();
8
- return index.bootstrapLazy([["feedlog-card.cjs",[[257,"feedlog-card"]]],["feedlog-badge.cjs",[[257,"feedlog-badge",{"variant":[1]}]]],["feedlog-button_3.cjs",[[1,"feedlog-issues-list",{"issues":[16],"theme":[1],"getIssueUrl":[16],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"]}],[257,"feedlog-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1]}],[257,"feedlog-issue",{"issue":[16],"issueUrl":[1,"issue-url"],"theme":[1]}]]],["feedlog-issues.cjs",[[1,"feedlog-issues",{"issues":[16],"maxWidth":[1,"max-width"],"theme":[1025],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"error":[1],"hasMore":[4,"has-more"],"isLoadingMore":[4,"is-loading-more"],"getIssueUrl":[16],"currentTheme":[32]}]]],["feedlog-issues-client.cjs",[[1,"feedlog-issues-client",{"apiKey":[1,"api-key"],"type":[1],"limit":[2],"sortBy":[1,"sort-by"],"endpoint":[1],"maxWidth":[1,"max-width"],"theme":[1],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"getIssueUrl":[16],"issues":[32],"loading":[32],"error":[32],"cursor":[32],"hasMore":[32],"isLoadingMore":[32]}]]]], options);
8
+ return index.bootstrapLazy([["feedlog-card.cjs",[[257,"feedlog-card"]]],["feedlog-badge.cjs",[[257,"feedlog-badge",{"variant":[1]}]]],["feedlog-button_3.cjs",[[1,"feedlog-issues-list",{"issues":[16],"limit":[2],"theme":[1],"getIssueUrl":[16],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"currentPage":[32]},null,{"issues":[{"resetPage":0}],"limit":[{"resetPage":0}]}],[257,"feedlog-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1]}],[257,"feedlog-issue",{"issue":[16],"issueUrl":[1,"issue-url"],"theme":[1]}]]],["feedlog-issues.cjs",[[1,"feedlog-issues",{"issues":[16],"maxWidth":[1,"max-width"],"limit":[2],"theme":[1025],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"loading":[4],"error":[1],"hasMore":[4,"has-more"],"isLoadingMore":[4,"is-loading-more"],"getIssueUrl":[16],"currentTheme":[32]}]]],["feedlog-issues-client.cjs",[[1,"feedlog-issues-client",{"apiKey":[1,"api-key"],"type":[1],"limit":[2],"sortBy":[1,"sort-by"],"endpoint":[1],"maxWidth":[1,"max-width"],"theme":[1],"heading":[1],"subtitle":[1],"emptyStateTitle":[1,"empty-state-title"],"emptyStateMessage":[1,"empty-state-message"],"getIssueUrl":[16],"issues":[32],"loading":[32],"error":[32],"cursor":[32],"hasMore":[32],"isLoadingMore":[32]}]]]], options);
9
9
  };
10
10
 
11
11
  exports.setNonce = index.setNonce;
@@ -0,0 +1,10 @@
1
+ /**
2
+ * Mock for @feedlog-ai/core used in tests.
3
+ * Mapped via Stencil testing config moduleNameMapper to avoid CI resolution issues.
4
+ */
5
+ export const FeedlogSDK = jest.fn().mockImplementation(() => ({
6
+ fetchIssues: jest
7
+ .fn()
8
+ .mockResolvedValue({ issues: [], pagination: { cursor: null, hasMore: false } }),
9
+ toggleUpvote: jest.fn(),
10
+ }));
@@ -22,6 +22,7 @@
22
22
  --feedlog-radius: 0.625rem;
23
23
  --feedlog-gap: 0.5rem;
24
24
  --feedlog-padding: 2rem;
25
+ --feedlog-min-height: 100%;
25
26
  --feedlog-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08), 0 1px 2px -1px rgba(0, 0, 0, 0.08);
26
27
  }
27
28
 
@@ -45,11 +46,12 @@
45
46
 
46
47
 
47
48
  .issues-container {
48
- min-height: 100vh;
49
+ min-height: var(--feedlog-min-height);
49
50
  /* Parent can override via --feedlog-background (e.g. transparent); fallback to theme default */
50
51
  background-color: var(--feedlog-background, var(--feedlog-theme-bg, #ffffff));
51
52
  padding: var(--feedlog-padding);
52
53
  margin: 0 auto;
54
+ border-radius: var(--feedlog-radius);
53
55
  }
54
56
 
55
57
  .issues-header {
@@ -55,13 +55,13 @@ export class FeedlogIssues {
55
55
  }
56
56
  renderIssuesList() {
57
57
  var _a, _b;
58
- return (h("feedlog-issues-list", { issues: this.issues, theme: this.currentTheme, getIssueUrl: this.getIssueUrl, emptyStateTitle: (_a = this.emptyStateTitle) !== null && _a !== void 0 ? _a : 'No updates yet', emptyStateMessage: (_b = this.emptyStateMessage) !== null && _b !== void 0 ? _b : 'Check back later for new updates.', onFeedlogUpvote: (e) => this.handleUpvote(e) }));
58
+ return (h("feedlog-issues-list", { issues: this.issues, limit: this.limit, theme: this.currentTheme, getIssueUrl: this.getIssueUrl, emptyStateTitle: (_a = this.emptyStateTitle) !== null && _a !== void 0 ? _a : 'No updates yet', emptyStateMessage: (_b = this.emptyStateMessage) !== null && _b !== void 0 ? _b : 'Check back later for new updates.', onFeedlogUpvote: (e) => this.handleUpvote(e) }));
59
59
  }
60
60
  render() {
61
61
  const containerStyle = {
62
62
  maxWidth: this.maxWidth,
63
63
  };
64
- return (h(Host, { key: '812719c5d6f25108834d1a422dee280c18033e36', class: this.currentTheme === 'dark' ? 'dark' : '' }, h("div", { key: '1e415969878bad8fb14ea9e648d2c2d2e0d492a1', class: "issues-container", style: containerStyle }, (this.heading || this.subtitle) && (h("header", { key: '5bf1308396ff3bc04a57763317fa71a34d48cc95', class: "issues-header" }, h("div", { key: '19494458a1bcd11c3d91c08e98887f9d6ed33314', class: "header-content" }, this.heading && h("h1", { key: 'f89bd679a9dd9262c93573ef0bfbbb23bd892a87', class: "issues-title" }, this.heading), this.subtitle && h("p", { key: '2bcc73dfb95d7ae8971004522fe44cca5128701b', class: "issues-subtitle" }, this.subtitle)))), this.loading && (h("div", { key: '85c06c80b624cd16d532bea5f0ad6fb7cc06f692', class: "loading-state", role: "status", "aria-label": "Loading issues" }, h("div", { key: '766cd9e7c18586f937a1b864e7bcfce60fe79707', class: "loading-skeletons" }, [1, 2, 3].map(i => (h("div", { key: i, class: "skeleton-card" }, h("div", { class: "skeleton-content" }, h("div", { class: "skeleton-header" }, h("div", { class: "skeleton-badge" }), h("div", { class: "skeleton-timestamp" })), h("div", { class: "skeleton-main" }, h("div", { class: "skeleton-title" }), h("div", { class: "skeleton-body" }, h("div", { class: "skeleton-line" }), h("div", { class: "skeleton-line short" })), h("div", { class: "skeleton-repo" })), h("div", { class: "skeleton-footer" }, h("div", { class: "skeleton-upvote" }))))))))), this.error && (h("div", { key: '5ca08a9ddc95b4ef59d6c776a24e08b5ac65c0b3', class: "error-state", role: "alert" }, h("div", { key: '93218f816564cff58f591b53d1aad6b6bc8a1c64', class: "error-state-content" }, this.renderErrorIcon(), h("h2", { key: 'f141f75b92164af3f4d139a17937b0533641bcc0', class: "error-state-title" }, "Something went wrong"), h("p", { key: '61225c7f4f46944787d4a6448386c8209cdaf74c', class: "error-state-message" }, this.error)))), !this.loading && !this.error && (h("div", { key: '5ac699f4c5d0e5b5d20f1546efe24f80cba70748' }, this.renderIssuesList(), this.hasMore && (h("div", { key: '9ad22c48dac0d8874dfae9735c850b2ca52836e7', class: "load-more-container" }, h("feedlog-button", { key: 'de55c05ca8b80ec5df98051653ca135874edc98b', onFeedlogClick: this.handleLoadMore, disabled: this.isLoadingMore, variant: "outline" }, this.isLoadingMore ? 'Loading...' : 'Load More Issues'))))))));
64
+ return (h(Host, { key: '96686863c5eb831e64993c681c7780e035c0e2b2', class: this.currentTheme === 'dark' ? 'dark' : '' }, h("div", { key: '54d01678053f4fe58eb547f9954f497402495a83', class: "issues-container", style: containerStyle }, (this.heading || this.subtitle) && (h("header", { key: '889aa47cb4ceea60ca4a5615f512793d726059d9', class: "issues-header" }, h("div", { key: '8b4ac6a9ed0c6120ec838a1329416f3471cd2751', class: "header-content" }, this.heading && h("h1", { key: 'cfc52f28bc5131715a5c7a0b9231e440b4c0b67c', class: "issues-title" }, this.heading), this.subtitle && h("p", { key: '8b4488546ceb6e807d689b8fca2b2fd85722f824', class: "issues-subtitle" }, this.subtitle)))), this.loading && (h("div", { key: '35c382f4417893c17951b73dedb12452e805668c', class: "loading-state", role: "status", "aria-label": "Loading issues" }, h("div", { key: '2d83dd9d40bf7b2a14744ee4a715108a9cdebd60', class: "loading-skeletons" }, [1, 2, 3].map(i => (h("div", { key: i, class: "skeleton-card" }, h("div", { class: "skeleton-content" }, h("div", { class: "skeleton-header" }, h("div", { class: "skeleton-badge" }), h("div", { class: "skeleton-timestamp" })), h("div", { class: "skeleton-main" }, h("div", { class: "skeleton-title" }), h("div", { class: "skeleton-body" }, h("div", { class: "skeleton-line" }), h("div", { class: "skeleton-line short" })), h("div", { class: "skeleton-repo" })), h("div", { class: "skeleton-footer" }, h("div", { class: "skeleton-upvote" }))))))))), this.error && (h("div", { key: '43efd42ce0d213131ba97d42d1f98c52515ea9fd', class: "error-state", role: "alert" }, h("div", { key: 'ad22b0378e290556c896c628dadabf6091bbf972', class: "error-state-content" }, this.renderErrorIcon(), h("h2", { key: '9a9779f52de12aa2241ba9ddda6cf8297a4af84d', class: "error-state-title" }, "Something went wrong"), h("p", { key: 'c697040d37909d882730e5d9ab3a3b147061fc51', class: "error-state-message" }, this.error)))), !this.loading && !this.error && (h("div", { key: 'afc12552ff7ccc808c7191c1dd1e26d3b95bf2fd' }, this.renderIssuesList(), this.hasMore && (h("div", { key: '0f6c84bdeda386e4eec439fb80f4ee1606b9b559', class: "load-more-container" }, h("feedlog-button", { key: 'e6983bd889a6cdfd4a4b8a06f3a6a97c2d276243', onFeedlogClick: this.handleLoadMore, disabled: this.isLoadingMore, variant: "outline" }, this.isLoadingMore ? 'Loading...' : 'Load More Issues'))))))));
65
65
  }
66
66
  static get is() { return "feedlog-issues"; }
67
67
  static get encapsulation() { return "shadow"; }
@@ -121,6 +121,25 @@ export class FeedlogIssues {
121
121
  "attribute": "max-width",
122
122
  "defaultValue": "'42rem'"
123
123
  },
124
+ "limit": {
125
+ "type": "number",
126
+ "mutable": false,
127
+ "complexType": {
128
+ "original": "number",
129
+ "resolved": "number | undefined",
130
+ "references": {}
131
+ },
132
+ "required": false,
133
+ "optional": true,
134
+ "docs": {
135
+ "tags": [],
136
+ "text": "Page size for issues list pagination. When set, enables pagination when issues exceed this limit."
137
+ },
138
+ "getter": false,
139
+ "setter": false,
140
+ "reflect": false,
141
+ "attribute": "limit"
142
+ },
124
143
  "theme": {
125
144
  "type": "string",
126
145
  "mutable": true,
@@ -96,6 +96,7 @@ const sampleIssues = [
96
96
  hasUpvoted: false,
97
97
  },
98
98
  ];
99
+ const manyIssues = Array.from({ length: 200 }, (_, i) => (Object.assign(Object.assign({}, sampleIssues[0]), { id: `issue-${i + 1}`, title: `Issue ${i + 1}` })));
99
100
  const meta = {
100
101
  title: 'Components/Issues',
101
102
  component: 'feedlog-issues',
@@ -132,6 +133,10 @@ const meta = {
132
133
  control: 'text',
133
134
  description: 'Empty state message',
134
135
  },
136
+ limit: {
137
+ control: 'number',
138
+ description: 'Page size for pagination',
139
+ },
135
140
  },
136
141
  args: {
137
142
  issues: sampleIssues,
@@ -250,6 +255,29 @@ export const TransparentBackground = {
250
255
  }
251
256
  },
252
257
  };
258
+ export const Paginated = {
259
+ args: {
260
+ issues: manyIssues,
261
+ limit: 10,
262
+ heading: 'Community feedback',
263
+ subtitle: 'Upvote issues you care about',
264
+ },
265
+ parameters: {
266
+ docs: {
267
+ description: {
268
+ story: 'Pagination with 200 issues, 10 per page. Shows first/last pages, 3 pages around current, and prev/next arrows.',
269
+ },
270
+ },
271
+ },
272
+ render: props => h("feedlog-issues", Object.assign({}, props)),
273
+ play: async ({ canvasElement, args }) => {
274
+ const element = canvasElement.querySelector('feedlog-issues');
275
+ if (element && args.issues) {
276
+ element.issues = args.issues;
277
+ element.limit = args.limit;
278
+ }
279
+ },
280
+ };
253
281
  export const CustomCSSVars = {
254
282
  args: {
255
283
  issues: sampleIssues,
@@ -219,7 +219,7 @@ export class FeedlogIssuesClient {
219
219
  const style = hostBg
220
220
  ? { '--feedlog-background': hostBg }
221
221
  : undefined;
222
- return (h("feedlog-issues", { key: '85e92e5ad7b556d97f4d6b94e308c08070e1ff0f', style: style, issues: this.issues, maxWidth: this.maxWidth, theme: this.theme, heading: this.heading, subtitle: this.subtitle, emptyStateTitle: this.emptyStateTitle, emptyStateMessage: this.emptyStateMessage, getIssueUrl: this.getIssueUrl, loading: this.loading, error: this.error, hasMore: this.hasMore, isLoadingMore: this.isLoadingMore, onFeedlogUpvote: this.handleUpvote, onFeedlogLoadMore: async () => this.loadMore() }));
222
+ return (h("feedlog-issues", { key: '15ae96d7d7b51964026f873f8b97e10530ed02b4', style: style, issues: this.issues, limit: this.limit, maxWidth: this.maxWidth, theme: this.theme, heading: this.heading, subtitle: this.subtitle, emptyStateTitle: this.emptyStateTitle, emptyStateMessage: this.emptyStateMessage, getIssueUrl: this.getIssueUrl, loading: this.loading, error: this.error, hasMore: this.hasMore, isLoadingMore: this.isLoadingMore, onFeedlogUpvote: this.handleUpvote, onFeedlogLoadMore: async () => this.loadMore() }));
223
223
  }
224
224
  static get is() { return "feedlog-issues-client"; }
225
225
  static get encapsulation() { return "shadow"; }
@@ -55,3 +55,60 @@
55
55
  color: var(--feedlog-muted-foreground);
56
56
  line-height: 1.5;
57
57
  }
58
+
59
+ .pagination {
60
+ display: flex;
61
+ align-items: center;
62
+ justify-content: center;
63
+ gap: 0.25rem;
64
+ margin-top: 1.5rem;
65
+ flex-wrap: wrap;
66
+ }
67
+
68
+ .pagination-btn {
69
+ min-width: 2rem;
70
+ height: 2rem;
71
+ padding: 0 0.5rem;
72
+ color: var(--feedlog-foreground);
73
+ background: transparent;
74
+ border: 1px solid var(--feedlog-border, oklch(0.9 0 0));
75
+ border-radius: var(--feedlog-radius, 0.375rem);
76
+ font-size: 0.875rem;
77
+ font-weight: 500;
78
+ cursor: pointer;
79
+ transition: background-color 0.15s, border-color 0.15s;
80
+ }
81
+
82
+ .pagination-btn:hover:not(:disabled) {
83
+ background: var(--feedlog-muted, oklch(0.96 0 0));
84
+ }
85
+
86
+ .pagination-btn[aria-current='page'] {
87
+ background: var(--feedlog-accent-color, oklch(0.55 0.2 250));
88
+ color: white;
89
+ border-color: var(--feedlog-accent-color, oklch(0.55 0.2 250));
90
+ }
91
+
92
+ .pagination-btn:disabled {
93
+ opacity: 0.5;
94
+ cursor: not-allowed;
95
+ }
96
+
97
+ .pagination-arrow {
98
+ font-size: 1.25rem;
99
+ line-height: 1;
100
+ }
101
+
102
+ .pagination-ellipsis {
103
+ padding: 0 0.25rem;
104
+ color: var(--feedlog-muted-foreground);
105
+ font-size: 0.875rem;
106
+ }
107
+
108
+ :host(.dark) .pagination-btn {
109
+ border-color: oklch(0.4 0.02 260);
110
+ }
111
+
112
+ :host(.dark) .pagination-btn:hover:not(:disabled) {
113
+ background: oklch(0.35 0.02 260);
114
+ }