@feedlog-ai/webcomponents 0.0.1

package/dist/cjs/index.cjs.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var index = require('./index-5lluu_3h.js');
+
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await index.globalScripts();
+  return index.bootstrapLazy([["feedlog-card.cjs",[[257,"feedlog-card"]]],["feedlog-badge_3.cjs",[[1,"feedlog-issues-list",{"issues":[16],"theme":[1]}],[257,"feedlog-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1]}],[257,"feedlog-badge",{"variant":[1]}]]],["feedlog-github-issues.cjs",[[1,"feedlog-github-issues",{"issues":[16],"maxWidth":[1,"max-width"],"theme":[1025],"loading":[4],"error":[1],"showThemeToggle":[4,"show-theme-toggle"],"hasMore":[4,"has-more"],"isLoadingMore":[4,"is-loading-more"],"currentTheme":[32]}]]],["feedlog-github-issues-client.cjs",[[1,"feedlog-github-issues-client",{"repos":[1],"type":[1],"limit":[2],"endpoint":[1],"maxWidth":[1,"max-width"],"theme":[1],"showThemeToggle":[4,"show-theme-toggle"],"issues":[32],"loading":[32],"error":[32],"cursor":[32],"hasMore":[32],"isLoadingMore":[32]}]]]], options);
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;

package/dist/collection/collection-manifest.json

@@ -0,0 +1,17 @@
+{
+  "entries": [
+    "components/feedlog-card/feedlog-card.js",
+    "components/feedlog-badge/feedlog-badge.js",
+    "components/feedlog-button/feedlog-button.js",
+    "components/feedlog-github-issues/feedlog-github-issues.js",
+    "components/feedlog-github-issues-client/feedlog-github-issues-client.js",
+    "components/feedlog-issues-list/feedlog-issues-list.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.40.1",
+    "typescriptVersion": "5.8.3"
+  },
+  "collections": [],
+  "bundles": []
+}

package/dist/collection/components/feedlog-badge/feedlog-badge.css

@@ -0,0 +1,86 @@
+:host {
+  display: inline-block;
+  
+  /* Light theme defaults */
+  --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);
+  
+  /* Default/Enhancement variant colors */
+  --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);
+  
+  /* Destructive variant colors */
+  --feedlog-destructive: #d4183d;
+  --feedlog-destructive-hover: #b91c1c;
+}
+
+:host(.dark) {
+  /* Dark theme values */
+  --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;
+  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;
+}
+
+/* Default variant - uses blue like enhancement */
+.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);
+}
+
+/* Enhancement variant - blue styling */
+.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);
+}
+
+/* Destructive variant - red/danger styling */
+.badge-destructive {
+  background-color: var(--feedlog-destructive);
+  color: #ffffff;
+}
+
+.badge-destructive:hover {
+  background-color: var(--feedlog-destructive-hover);
+}

package/dist/collection/components/feedlog-badge/feedlog-badge.js

@@ -0,0 +1,53 @@
+import { h } from "@stencil/core";
+/**
+ * Feedlog Badge Component
+ *
+ * A label component with variant support for different styles.
+ */
+export class FeedlogBadge {
+    constructor() {
+        /**
+         * Badge variant style
+         */
+        this.variant = 'default';
+    }
+    render() {
+        return (h("span", { key: '482a74feb8d254a75383c30c7b39790edd04a05b', class: `badge badge-${this.variant}` }, h("slot", { key: '8d2db3fe0c2bc58e17829db4de7d0233189bb101' })));
+    }
+    static get is() { return "feedlog-badge"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["feedlog-badge.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["feedlog-badge.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'destructive' | 'enhancement'",
+                    "resolved": "\"default\" | \"destructive\" | \"enhancement\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Badge variant style"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'default'"
+            }
+        };
+    }
+}

package/dist/collection/components/feedlog-badge/feedlog-badge.stories.js

@@ -0,0 +1,38 @@
+import { h } from "@stencil/core";
+import { FeedlogBadge } from "./feedlog-badge";
+const meta = {
+    title: 'Components/Badge',
+    component: FeedlogBadge,
+    parameters: {
+        layout: 'centered',
+    },
+    argTypes: {
+        variant: {
+            control: 'select',
+            options: ['default', 'destructive'],
+            description: 'Badge variant style',
+        },
+    },
+    args: {
+        variant: 'default',
+    },
+};
+export default meta;
+export const Default = {
+    args: {
+        variant: 'default',
+    },
+    render: props => h("feedlog-badge", Object.assign({}, props), "Enhancement"),
+};
+export const Destructive = {
+    args: {
+        variant: 'destructive',
+    },
+    render: props => h("feedlog-badge", Object.assign({}, props), "Bug"),
+};
+export const AllVariants = {
+    render: () => (h("div", { style: { display: 'flex', gap: '1rem' } }, h("feedlog-badge", { variant: "default" }, "Default"), h("feedlog-badge", { variant: "destructive" }, "Destructive"))),
+};
+export const Labels = {
+    render: () => (h("div", { style: { display: 'flex', gap: '0.5rem', flexWrap: 'wrap' } }, h("feedlog-badge", null, "New"), h("feedlog-badge", null, "Feature"), h("feedlog-badge", null, "Enhancement"), h("feedlog-badge", { variant: "destructive" }, "Bug"), h("feedlog-badge", { variant: "destructive" }, "Critical"))),
+};

package/dist/collection/components/feedlog-button/feedlog-button.css

@@ -0,0 +1,155 @@
+:host {
+  display: inline-block;
+  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
+  
+  /* Light theme defaults */
+  --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) {
+  /* Dark theme values */
+  --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);
+}
+
+/* Default variant */
+.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);
+}
+
+/* Outline variant */
+.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);
+}
+
+/* Ghost variant */
+.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);
+}
+
+/* Destructive variant */
+.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);
+}
+
+/* Size variants */
+.button-size-sm {
+  height: 2rem;
+  padding: 0 0.75rem;
+  font-size: 0.75rem;
+}
+
+/* Icon-only small buttons */
+.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;
+}
+
+/* SVG icons styling */
+button svg {
+  pointer-events: none;
+  flex-shrink: 0;
+  width: 1rem;
+  height: 1rem;
+}

package/dist/collection/components/feedlog-button/feedlog-button.js

@@ -0,0 +1,154 @@
+import { h } from "@stencil/core";
+/**
+ * Feedlog Button Component
+ *
+ * A button component with variant and size support.
+ */
+export class FeedlogButton {
+    constructor() {
+        /**
+         * Button variant style
+         */
+        this.variant = 'default';
+        /**
+         * Button size
+         */
+        this.size = 'default';
+        /**
+         * Disabled state
+         */
+        this.disabled = false;
+        /**
+         * Button type
+         */
+        this.type = 'button';
+        this.handleClick = (event) => {
+            if (!this.disabled) {
+                this.feedlogClick.emit(event);
+            }
+        };
+    }
+    render() {
+        const sizeClass = this.size === 'default' ? 'button-size-default' : `button-size-${this.size}`;
+        return (h("button", { key: '6cdd8347def51592707b1fb9aab0dc565ca0f76f', type: this.type, class: `button button-${this.variant} ${sizeClass}`, disabled: this.disabled, onClick: this.handleClick }, h("slot", { key: '3f3845195fa4b8a551473ecf1d5702321a31763e' })));
+    }
+    static get is() { return "feedlog-button"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["feedlog-button.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["feedlog-button.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'outline' | 'ghost' | 'destructive'",
+                    "resolved": "\"default\" | \"destructive\" | \"ghost\" | \"outline\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Button variant style"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'default'"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'sm' | 'lg'",
+                    "resolved": "\"default\" | \"lg\" | \"sm\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Button size"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'default'"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disabled state"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'button' | 'submit' | 'reset'",
+                    "resolved": "\"button\" | \"reset\" | \"submit\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Button type"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "type",
+                "defaultValue": "'button'"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "feedlogClick",
+                "name": "feedlogClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event emitted when button is clicked"
+                },
+                "complexType": {
+                    "original": "MouseEvent",
+                    "resolved": "MouseEvent",
+                    "references": {
+                        "MouseEvent": {
+                            "location": "global",
+                            "id": "global::MouseEvent"
+                        }
+                    }
+                }
+            }];
+    }
+}

package/dist/collection/components/feedlog-button/feedlog-button.stories.js

@@ -0,0 +1,82 @@
+import { h } from "@stencil/core";
+import { FeedlogButton } from "./feedlog-button";
+const meta = {
+    title: 'Components/Button',
+    component: FeedlogButton,
+    parameters: {
+        layout: 'centered',
+    },
+    argTypes: {
+        variant: {
+            control: 'select',
+            options: ['default', 'outline', 'ghost', 'destructive'],
+            description: 'Button variant style',
+        },
+        size: {
+            control: 'select',
+            options: ['default', 'sm', 'lg'],
+            description: 'Button size',
+        },
+        disabled: {
+            control: 'boolean',
+            description: 'Disabled state',
+        },
+        type: {
+            control: 'select',
+            options: ['button', 'submit', 'reset'],
+            description: 'Button type',
+        },
+    },
+    args: {
+        variant: 'default',
+        size: 'default',
+        disabled: false,
+        type: 'button',
+    },
+};
+export default meta;
+export const Default = {
+    args: {
+        variant: 'default',
+    },
+    render: props => h("feedlog-button", Object.assign({}, props), "Click me"),
+};
+export const Outline = {
+    args: {
+        variant: 'outline',
+    },
+    render: props => h("feedlog-button", Object.assign({}, props), "Outline Button"),
+};
+export const Ghost = {
+    args: {
+        variant: 'ghost',
+    },
+    render: props => h("feedlog-button", Object.assign({}, props), "Ghost Button"),
+};
+export const Destructive = {
+    args: {
+        variant: 'destructive',
+    },
+    render: props => h("feedlog-button", Object.assign({}, props), "Delete"),
+};
+export const Small = {
+    args: {
+        size: 'sm',
+    },
+    render: props => h("feedlog-button", Object.assign({}, props), "Small Button"),
+};
+export const Large = {
+    args: {
+        size: 'lg',
+    },
+    render: props => h("feedlog-button", Object.assign({}, props), "Large Button"),
+};
+export const Disabled = {
+    args: {
+        disabled: true,
+    },
+    render: props => h("feedlog-button", Object.assign({}, props), "Disabled"),
+};
+export const AllVariants = {
+    render: () => (h("div", { style: { display: 'flex', gap: '1rem', flexWrap: 'wrap' } }, h("feedlog-button", { variant: "default" }, "Default"), h("feedlog-button", { variant: "outline" }, "Outline"), h("feedlog-button", { variant: "ghost" }, "Ghost"), h("feedlog-button", { variant: "destructive" }, "Destructive"))),
+};

package/dist/collection/components/feedlog-card/feedlog-card.css

@@ -0,0 +1,47 @@
+:host {
+  display: block;
+  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
+  
+  /* Light theme defaults */
+  --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) {
+  /* Dark theme values */
+  --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;
+}

package/dist/collection/components/feedlog-card/feedlog-card.js

@@ -0,0 +1,23 @@
+import { h } from "@stencil/core";
+/**
+ * Feedlog Card Component
+ *
+ * A reusable card container component with header and content areas.
+ */
+export class FeedlogCard {
+    render() {
+        return (h("div", { key: '293a80e66adedfc1af29daf72390a4f464321b96', class: "feedlog-card" }, h("slot", { key: 'b7e5a827f89035e791d9c756db0f66198e6c5a38', name: "header" }), h("slot", { key: 'da89fee0a01068c8438564848f218faa9c5d849e', name: "content" }), h("slot", { key: '30b05e80e4189c0f73810a48f64e072dfac83267', name: "footer" })));
+    }
+    static get is() { return "feedlog-card"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["feedlog-card.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["feedlog-card.css"]
+        };
+    }
+}