@semantic-components/ui 0.63.0 → 0.65.0

package/esm2022/index.js

@@ -0,0 +1,3 @@
+export * from './lib/components';
+export * from './lib/utils';
+//# sourceMappingURL=index.js.map

package/esm2022/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../libs/ui/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC","sourcesContent":["export * from './lib/components';\nexport * from './lib/utils';\n"]}

package/esm2022/lib/components/button/button.js

@@ -0,0 +1,54 @@
+import { booleanAttribute, computed, Directive, input } from '@angular/core';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export const buttonVariants = cva("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none", {
+    variants: {
+        variant: {
+            default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
+            outline: 'border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground',
+            secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
+            ghost: 'hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground',
+            destructive: 'bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30',
+            link: 'text-primary underline-offset-4 hover:underline',
+        },
+        size: {
+            default: 'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',
+            xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+            sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+            lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3',
+            icon: 'size-8',
+            'icon-xs': "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+            'icon-sm': 'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',
+            'icon-lg': 'size-9',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+        size: 'default',
+    },
+});
+export class ScButton {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    type = input('button', ...(ngDevMode ? [{ debugName: "type" }] : []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
+    class = computed(() => cn(buttonVariants({ variant: this.variant(), size: this.size() }), this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.4", type: ScButton, isStandalone: true, selector: "button[sc-button]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "button" }, properties: { "attr.type": "type()", "disabled": "disabled()", "attr.aria-disabled": "disabled() || null", "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScButton, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[sc-button]',
+                    host: {
+                        'data-slot': 'button',
+                        '[attr.type]': 'type()',
+                        '[disabled]': 'disabled()',
+                        '[attr.aria-disabled]': 'disabled() || null',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+//# sourceMappingURL=button.js.map

package/esm2022/lib/components/button/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AAEjC,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,okBAAokB,EACpkB;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,4DAA4D;YACrE,OAAO,EACL,iLAAiL;YACnL,SAAS,EACP,iIAAiI;YACnI,KAAK,EACH,kHAAkH;YACpH,WAAW,EACT,6NAA6N;YAC/N,IAAI,EAAE,iDAAiD;SACxD;QACD,IAAI,EAAE;YACJ,OAAO,EACL,sFAAsF;YACxF,EAAE,EAAE,+MAA+M;YACnN,EAAE,EAAE,yNAAyN;YAC7N,EAAE,EAAE,sFAAsF;YAC1F,IAAI,EAAE,QAAQ;YACd,SAAS,EACP,yHAAyH;YAC3H,SAAS,EACP,oFAAoF;YACtF,SAAS,EAAE,QAAQ;SACpB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC;AAcF,MAAM,OAAO,QAAQ;IACV,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,OAAO,GAAG,KAAK,CAA8B,SAAS,mDAAC,CAAC;IACxD,IAAI,GAAG,KAAK,CAA2B,SAAS,gDAAC,CAAC;IAClD,IAAI,GAAG,KAAK,CAAgC,QAAQ,gDAAC,CAAC;IACtD,QAAQ,GAAG,KAAK,CAAmB,KAAK,qDAC/C,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IAEgB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,EAC9D,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGAdS,QAAQ;2FAAR,QAAQ;;2FAAR,QAAQ;kBAVpB,SAAS;mBAAC;oBACT,QAAQ,EAAE,mBAAmB;oBAC7B,IAAI,EAAE;wBACJ,WAAW,EAAE,QAAQ;wBACrB,aAAa,EAAE,QAAQ;wBACvB,YAAY,EAAE,YAAY;wBAC1B,sBAAsB,EAAE,oBAAoB;wBAC5C,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { booleanAttribute, computed, Directive, input } from '@angular/core';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils';\n\nexport const buttonVariants = cva(\n  \"focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none\",\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',\n        outline:\n          'border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground',\n        secondary:\n          'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',\n        ghost:\n          'hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground',\n        destructive:\n          'bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30',\n        link: 'text-primary underline-offset-4 hover:underline',\n      },\n      size: {\n        default:\n          'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',\n        xs: \"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3',\n        icon: 'size-8',\n        'icon-xs':\n          \"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3\",\n        'icon-sm':\n          'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',\n        'icon-lg': 'size-9',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\nexport type ScButtonVariants = VariantProps<typeof buttonVariants>;\n\n@Directive({\n  selector: 'button[sc-button]',\n  host: {\n    'data-slot': 'button',\n    '[attr.type]': 'type()',\n    '[disabled]': 'disabled()',\n    '[attr.aria-disabled]': 'disabled() || null',\n    '[class]': 'class()',\n  },\n})\nexport class ScButton {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly variant = input<ScButtonVariants['variant']>('default');\n  readonly size = input<ScButtonVariants['size']>('default');\n  readonly type = input<'button' | 'submit' | 'reset'>('button');\n  readonly disabled = input<boolean, unknown>(false, {\n    transform: booleanAttribute,\n  });\n\n  protected readonly class = computed(() =>\n    cn(\n      buttonVariants({ variant: this.variant(), size: this.size() }),\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/button/index.js

@@ -0,0 +1,2 @@
+export * from './button';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC","sourcesContent":["export * from './button';\n"]}

package/esm2022/lib/components/index.js

@@ -0,0 +1,3 @@
+export * from './button';
+export * from './link';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/ui/src/lib/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC","sourcesContent":["export * from './button';\nexport * from './link';\n"]}

package/esm2022/lib/components/link/index.js

@@ -0,0 +1,2 @@
+export * from './link';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/link/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/link/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC","sourcesContent":["export * from './link';\n"]}

package/esm2022/lib/components/link/link.js

@@ -0,0 +1,28 @@
+import { booleanAttribute, computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import { buttonVariants } from '../button';
+import * as i0 from "@angular/core";
+export class ScLink {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    href = input('#', ...(ngDevMode ? [{ debugName: "href" }] : []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
+    class = computed(() => cn(buttonVariants({ variant: this.variant(), size: this.size() }), this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScLink, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.4", type: ScLink, isStandalone: true, selector: "a[sc-link]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "link" }, properties: { "attr.href": "href()", "attr.aria-disabled": "disabled() || null", "attr.tabindex": "disabled() ? -1 : null", "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ScLink, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'a[sc-link]',
+                    host: {
+                        'data-slot': 'link',
+                        '[attr.href]': 'href()',
+                        '[attr.aria-disabled]': 'disabled() || null',
+                        '[attr.tabindex]': 'disabled() ? -1 : null',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+//# sourceMappingURL=link.js.map

package/esm2022/lib/components/link/link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/link/link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,cAAc,EAAyB,MAAM,WAAW,CAAC;;AAYlE,MAAM,OAAO,MAAM;IACR,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,OAAO,GAAG,KAAK,CAA8B,SAAS,mDAAC,CAAC;IACxD,IAAI,GAAG,KAAK,CAA2B,SAAS,gDAAC,CAAC;IAClD,IAAI,GAAG,KAAK,CAAS,GAAG,gDAAC,CAAC;IAC1B,QAAQ,GAAG,KAAK,CAAmB,KAAK,qDAC/C,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IAEgB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,EAC9D,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGAdS,MAAM;2FAAN,MAAM;;2FAAN,MAAM;kBAVlB,SAAS;mBAAC;oBACT,QAAQ,EAAE,YAAY;oBACtB,IAAI,EAAE;wBACJ,WAAW,EAAE,MAAM;wBACnB,aAAa,EAAE,QAAQ;wBACvB,sBAAsB,EAAE,oBAAoB;wBAC5C,iBAAiB,EAAE,wBAAwB;wBAC3C,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { booleanAttribute, computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\nimport { buttonVariants, type ScButtonVariants } from '../button';\n\n@Directive({\n  selector: 'a[sc-link]',\n  host: {\n    'data-slot': 'link',\n    '[attr.href]': 'href()',\n    '[attr.aria-disabled]': 'disabled() || null',\n    '[attr.tabindex]': 'disabled() ? -1 : null',\n    '[class]': 'class()',\n  },\n})\nexport class ScLink {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly variant = input<ScButtonVariants['variant']>('default');\n  readonly size = input<ScButtonVariants['size']>('default');\n  readonly href = input<string>('#');\n  readonly disabled = input<boolean, unknown>(false, {\n    transform: booleanAttribute,\n  });\n\n  protected readonly class = computed(() =>\n    cn(\n      buttonVariants({ variant: this.variant(), size: this.size() }),\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/utils/index.js

@@ -0,0 +1,6 @@
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+export function cn(...inputs) {
+    return twMerge(clsx(inputs));
+}
+//# sourceMappingURL=index.js.map

package/esm2022/lib/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/ui/src/lib/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAmB,MAAM,MAAM,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,MAAM,UAAU,EAAE,CAAC,GAAG,MAAoB;IACxC,OAAO,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;AAC/B,CAAC","sourcesContent":["import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"]}

package/esm2022/semantic-components-ui.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=semantic-components-ui.js.map

package/esm2022/semantic-components-ui.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"semantic-components-ui.js","sourceRoot":"","sources":["../../../../libs/ui/src/semantic-components-ui.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,cAAc,SAAS,CAAC","sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"]}

package/lib/components/button/button.d.ts

@@ -0,0 +1,17 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as i0 from "@angular/core";
+export declare const buttonVariants: (props?: ({
+    variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type ScButtonVariants = VariantProps<typeof buttonVariants>;
+export declare class ScButton {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    readonly variant: import("@angular/core").InputSignal<"default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined>;
+    readonly size: import("@angular/core").InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
+    readonly type: import("@angular/core").InputSignal<"button" | "submit" | "reset">;
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScButton, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ScButton, "button[sc-button]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/components/link/link.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+export declare class ScLink {
+    readonly classInput: import("@angular/core").InputSignal<string>;
+    readonly variant: import("@angular/core").InputSignal<"default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined>;
+    readonly size: import("@angular/core").InputSignal<"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined>;
+    readonly href: import("@angular/core").InputSignal<string>;
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    protected readonly class: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScLink, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ScLink, "a[sc-link]", never, { "classInput": { "alias": "class"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/utils/index.d.ts

@@ -0,0 +1,2 @@
+import { type ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@semantic-components/ui",
-  "version": "0.63.0",
+  "version": "0.65.0",
   "private": false,
   "publishConfig": {
     "access": "public"
@@ -21,7 +21,19 @@
   "exports": {
     "./styles": {
       "default": "./src/lib/styles/index.css"
+    },
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./semantic-components-ui.d.ts",
+      "default": "./esm2022/semantic-components-ui.js"
     }
   },
-  "sideEffects": false
+  "sideEffects": false,
+  "module": "esm2022/semantic-components-ui.js",
+  "typings": "semantic-components-ui.d.ts",
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
 }

package/semantic-components-ui.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@semantic-components/ui" />
+export * from './index';

package/eslint.config.mjs

@@ -1,48 +0,0 @@
-import nx from '@nx/eslint-plugin';
-import baseConfig from '../../eslint.config.mjs';
-
-export default [
-  ...baseConfig,
-  {
-    files: ['**/*.json'],
-    rules: {
-      '@nx/dependency-checks': [
-        'error',
-        {
-          ignoredFiles: ['{projectRoot}/eslint.config.{js,cjs,mjs,ts,cts,mts}'],
-        },
-      ],
-    },
-    languageOptions: {
-      parser: await import('jsonc-eslint-parser'),
-    },
-  },
-  ...nx.configs['flat/angular'],
-  ...nx.configs['flat/angular-template'],
-  {
-    files: ['**/*.ts'],
-    rules: {
-      '@angular-eslint/directive-selector': [
-        'error',
-        {
-          type: 'attribute',
-          prefix: 'sc',
-          style: 'camelCase',
-        },
-      ],
-      '@angular-eslint/component-selector': [
-        'error',
-        {
-          type: 'element',
-          prefix: 'sc',
-          style: 'kebab-case',
-        },
-      ],
-    },
-  },
-  {
-    files: ['**/*.html'],
-    // Override or add rules here
-    rules: {},
-  },
-];

package/ng-package.json

@@ -1,8 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/libs/ui",
-  "assets": ["./src/lib/styles"],
-  "lib": {
-    "entryFile": "src/index.ts"
-  }
-}

package/project.json

@@ -1,28 +0,0 @@
-{
-  "name": "ui",
-  "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "libs/ui/src",
-  "prefix": "sc",
-  "projectType": "library",
-  "tags": [],
-  "targets": {
-    "build": {
-      "executor": "@nx/angular:ng-packagr-lite",
-      "outputs": ["{workspaceRoot}/dist/{projectRoot}"],
-      "options": {
-        "project": "libs/ui/ng-package.json",
-        "tsConfig": "libs/ui/tsconfig.lib.json"
-      },
-      "configurations": {
-        "production": {
-          "tsConfig": "libs/ui/tsconfig.lib.prod.json"
-        },
-        "development": {}
-      },
-      "defaultConfiguration": "production"
-    },
-    "lint": {
-      "executor": "@nx/eslint:lint"
-    }
-  }
-}

package/src/lib/components/button/README.md

@@ -1,143 +0,0 @@
-# Button
-
-Displays a button or a component that looks like a button.
-
-## Usage
-
-```html
-<button sc-button>Click me</button>
-```
-
-## Directive
-
-### ScButton
-
-Button directive that can be applied to `button` or `a` elements.
-
-**Selector:** `button[sc-button], a[sc-button]`
-
-**Inputs:**
-
-| Input      | Type                              | Default     | Description                                                  |
-| ---------- | --------------------------------- | ----------- | ------------------------------------------------------------ |
-| `variant`  | `ButtonVariant`                   | `'default'` | Visual style variant                                         |
-| `size`     | `ButtonSize`                      | `'default'` | Size of the button                                           |
-| `type`     | `'button' \| 'submit' \| 'reset'` | `'button'`  | Button type attribute (only applied to `<button>` elements)  |
-| `href`     | `string`                          | `'#'`       | Href attribute (only applied to `<a>` elements, overridable) |
-| `disabled` | `boolean`                         | `false`     | Disables the button (sets `aria-disabled`)                   |
-| `class`    | `string`                          | `''`        | Additional CSS classes                                       |
-
-**ButtonVariant:**
-
-- `default` - Primary button style
-- `destructive` - Destructive/danger action
-- `outline` - Bordered button
-- `secondary` - Secondary action
-- `ghost` - Minimal styling
-- `link` - Looks like a link
-
-**ButtonSize:**
-
-- `default` - Standard size (h-8)
-- `xs` - Extra small size (h-6)
-- `sm` - Small size (h-7)
-- `lg` - Large size (h-9)
-- `icon` - Square icon button (size-8)
-- `icon-xs` - Extra small icon button (size-6)
-- `icon-sm` - Small icon button (size-7)
-- `icon-lg` - Large icon button (size-9)
-
-## Examples
-
-### Variants
-
-```html
-<button sc-button>Default</button>
-<button sc-button variant="secondary">Secondary</button>
-<button sc-button variant="destructive">Destructive</button>
-<button sc-button variant="outline">Outline</button>
-<button sc-button variant="ghost">Ghost</button>
-<button sc-button variant="link">Link</button>
-```
-
-### Sizes
-
-```html
-<button sc-button size="lg">Large</button>
-<button sc-button size="default">Default</button>
-<button sc-button size="sm">Small</button>
-<button sc-button size="icon">
-  <svg><!-- icon --></svg>
-</button>
-```
-
-### With Icons
-
-```html
-<button sc-button>
-  <svg><!-- icon --></svg>
-  Upload
-</button>
-
-<button sc-button variant="outline">
-  Settings
-  <svg><!-- icon --></svg>
-</button>
-```
-
-### Disabled
-
-```html
-<button sc-button disabled>Disabled</button>
-```
-
-### As Link
-
-`ScButton` automatically sets `href="#"` on `<a>` elements. Override with `[href]` for real navigation:
-
-```html
-<!-- Default href="#" -->
-<a sc-button>Link Button</a>
-<a sc-button variant="outline">Outline Link</a>
-
-<!-- Custom href -->
-<a sc-button href="/somewhere">Navigate</a>
-```
-
-### Form Submit
-
-By default, `sc-button` sets `type="button"` to prevent accidental form submissions. Use `type="submit"` explicitly for submit buttons:
-
-```html
-<form>
-  <button sc-button variant="outline">Cancel</button>
-  <!-- type="button" by default, won't submit -->
-
-  <button sc-button type="submit">Save</button>
-  <!-- explicit type="submit" -->
-</form>
-```
-
-### Loading State
-
-```html
-<button sc-button disabled>
-  <svg sc-spinner si-loader-2-icon></svg>
-  Please wait
-</button>
-```
-
-## Features
-
-- **Multiple Variants**: 6 visual variants for different use cases
-- **Size Options**: 4 sizes including icon-only
-- **Icon Support**: Automatic sizing for nested SVG icons
-- **Link Support**: Works on both `button` and `a` elements
-- **Disabled State**: Built-in disabled styling
-
-## Accessibility
-
-- Uses native `button` or `a` elements
-- Supports native `disabled` attribute
-- Focus ring for keyboard navigation
-- Proper contrast ratios for all variants

package/src/lib/components/button/button.ts

@@ -1,69 +0,0 @@
-import { booleanAttribute, computed, Directive, input } from '@angular/core';
-import { cva, type VariantProps } from 'class-variance-authority';
-import { cn } from '../../utils';
-
-export const buttonVariants = cva(
-  "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none",
-  {
-    variants: {
-      variant: {
-        default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
-        outline:
-          'border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground',
-        secondary:
-          'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
-        ghost:
-          'hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground',
-        destructive:
-          'bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30',
-        link: 'text-primary underline-offset-4 hover:underline',
-      },
-      size: {
-        default:
-          'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',
-        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
-        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
-        lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3',
-        icon: 'size-8',
-        'icon-xs':
-          "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
-        'icon-sm':
-          'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',
-        'icon-lg': 'size-9',
-      },
-    },
-    defaultVariants: {
-      variant: 'default',
-      size: 'default',
-    },
-  },
-);
-
-export type ScButtonVariants = VariantProps<typeof buttonVariants>;
-
-@Directive({
-  selector: 'button[sc-button]',
-  host: {
-    'data-slot': 'button',
-    '[attr.type]': 'type()',
-    '[disabled]': 'disabled()',
-    '[attr.aria-disabled]': 'disabled() || null',
-    '[class]': 'class()',
-  },
-})
-export class ScButton {
-  readonly classInput = input<string>('', { alias: 'class' });
-  readonly variant = input<ScButtonVariants['variant']>('default');
-  readonly size = input<ScButtonVariants['size']>('default');
-  readonly type = input<'button' | 'submit' | 'reset'>('button');
-  readonly disabled = input<boolean, unknown>(false, {
-    transform: booleanAttribute,
-  });
-
-  protected readonly class = computed(() =>
-    cn(
-      buttonVariants({ variant: this.variant(), size: this.size() }),
-      this.classInput(),
-    ),
-  );
-}

package/src/lib/components/link/link.ts

@@ -1,31 +0,0 @@
-import { booleanAttribute, computed, Directive, input } from '@angular/core';
-import { cn } from '../../utils';
-import { buttonVariants, type ScButtonVariants } from '../button';
-
-@Directive({
-  selector: 'a[sc-link]',
-  host: {
-    'data-slot': 'link',
-    '[attr.href]': '!disabled() ? href() : null',
-    '[attr.role]': 'disabled() ? "link" : null',
-    '[attr.aria-disabled]': 'disabled() || null',
-    '[attr.tabindex]': 'disabled() ? -1 : null',
-    '[class]': 'class()',
-  },
-})
-export class ScLink {
-  readonly classInput = input<string>('', { alias: 'class' });
-  readonly variant = input<ScButtonVariants['variant']>('default');
-  readonly size = input<ScButtonVariants['size']>('default');
-  readonly href = input<string>('#');
-  readonly disabled = input<boolean, unknown>(false, {
-    transform: booleanAttribute,
-  });
-
-  protected readonly class = computed(() =>
-    cn(
-      buttonVariants({ variant: this.variant(), size: this.size() }),
-      this.classInput(),
-    ),
-  );
-}

package/src/lib/utils/index.ts

@@ -1,6 +0,0 @@
-import { clsx, type ClassValue } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs));
-}

package/tsconfig.json

@@ -1,28 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "isolatedModules": true,
-    "target": "es2022",
-    "moduleResolution": "bundler",
-    "strict": true,
-    "noImplicitOverride": true,
-    "noPropertyAccessFromIndexSignature": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true,
-    "emitDecoratorMetadata": false,
-    "module": "preserve"
-  },
-  "angularCompilerOptions": {
-    "enableI18nLegacyMessageIdFormat": false,
-    "strictInjectionParameters": true,
-    "strictInputAccessModifiers": true,
-    "strictTemplates": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ]
-}

package/tsconfig.lib.json

@@ -1,12 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": []
-  },
-  "include": ["src/**/*.ts"],
-  "exclude": ["src/**/*.spec.ts", "src/**/*.test.ts"]
-}

package/tsconfig.lib.prod.json

@@ -1,7 +0,0 @@
-{
-  "extends": "./tsconfig.lib.json",
-  "compilerOptions": {
-    "declarationMap": false
-  },
-  "angularCompilerOptions": {}
-}