ngwr 6.1.1 → 7.1.0

package/fesm2022/ngwr-divider.mjs

@@ -1,62 +1,6 @@
+import { coerceNumberProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
-import { numberAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, HostBinding } from '@angular/core';
-
-class WrDividerComponent {
-    constructor() {
-        this.color = null;
-        this.type = 'solid';
-        this.width = 1;
-        this.role = 'separator';
-    }
-    get elClasses() {
-        return {
-            'wr-divider': true,
-            'wr-divider--primary': this.color === 'primary',
-            'wr-divider--secondary': this.color === 'secondary',
-            'wr-divider--success': this.color === 'success',
-            'wr-divider--warning': this.color === 'warning',
-            'wr-divider--danger': this.color === 'danger',
-            'wr-divider--light': this.color === 'light',
-            'wr-divider--medium': this.color === 'medium',
-            'wr-divider--dark': this.color === 'dark',
-            'wr-divider--solid': this.type === 'solid',
-            'wr-divider--dashed': this.type === 'dashed',
-            'wr-divider--dotted': this.type === 'dotted',
-        };
-    }
-    get elStyles() {
-        return {
-            '--wr-divider-width': `${this.width}px`,
-        };
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: WrDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.10", type: WrDividerComponent, isStandalone: true, selector: "wr-divider", inputs: { color: "color", type: "type", width: ["width", "width", numberAttribute] }, host: { properties: { "class": "this.elClasses", "style": "this.elStyles", "role": "this.role" } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: WrDividerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'wr-divider',
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                }]
-        }], propDecorators: { color: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], width: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], elClasses: [{
-                type: HostBinding,
-                args: ['class']
-            }], elStyles: [{
-                type: HostBinding,
-                args: ['style']
-            }], role: [{
-                type: HostBinding,
-                args: ['role']
-            }] } });
+import { input, computed, ViewEncapsulation, Component } from '@angular/core';
 
 /**
  * @license
@@ -64,10 +8,81 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImpo
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
  */
+/**
+ * Horizontal separator line. Projected content renders as a label
+ * inline with the line (split into two halves on either side).
+ *
+ * @example
+ * ```html
+ * <wr-divider />
+ * <wr-divider type="dashed" color="primary" [width]="2" />
+ * <wr-divider>OR</wr-divider>
+ * <wr-divider align="start">Section</wr-divider>
+ * ```
+ *
+ * @see https://ngwr.dev/components/divider
+ */
+class WrDivider {
+    /**
+     * Color of the divider line. Omit for the neutral default.
+     *
+     * @default null
+     */
+    color = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /**
+     * Line style.
+     *
+     * @default 'solid'
+     */
+    type = input('solid', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /**
+     * Line width in pixels.
+     *
+     * @default 1
+     */
+    width = input(1, { ...(ngDevMode ? { debugName: "width" } : /* istanbul ignore next */ {}), transform: (v) => coerceNumberProperty(v, 1) });
+    /**
+     * Label position. Only meaningful when the divider has projected
+     * content — otherwise the line is symmetric and alignment has no
+     * visible effect.
+     *
+     * @default 'center'
+     */
+    align = input('center', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+    classes = computed(() => {
+        const parts = ['wr-divider', `wr-divider--${this.type()}`];
+        const color = this.color();
+        if (color)
+            parts.push(`wr-divider--${color}`);
+        const align = this.align();
+        if (align !== 'center')
+            parts.push(`wr-divider--${align}`);
+        return parts.join(' ');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.2", type: WrDivider, isStandalone: true, selector: "wr-divider", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "separator" }, properties: { "class": "classes()", "style.--wr-divider-width.px": "width()" } }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrDivider, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'wr-divider',
+                    template: '<ng-content />',
+                    encapsulation: ViewEncapsulation.None,
+                    host: {
+                        role: 'separator',
+                        '[class]': 'classes()',
+                        '[style.--wr-divider-width.px]': 'width()',
+                    },
+                }]
+        }], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { WrDividerComponent };
+export { WrDivider };
 //# sourceMappingURL=ngwr-divider.mjs.map

package/fesm2022/ngwr-divider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngwr-divider.mjs","sources":["../../../projects/lib/divider/divider.component.ts","../../../projects/lib/divider/public-api.ts","../../../projects/lib/divider/ngwr-divider.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  HostBinding,\n  Input,\n  numberAttribute,\n  ViewEncapsulation,\n} from '@angular/core';\n\nimport { SafeAny, WrThemeColor } from 'ngwr/cdk/types';\n\n@Component({\n  selector: 'wr-divider',\n  template: '',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class WrDividerComponent {\n  @Input() color: WrThemeColor | null = null;\n  @Input() type: 'solid' | 'dashed' | 'dotted' = 'solid';\n  @Input({ transform: numberAttribute }) width = 1;\n\n  @HostBinding('class')\n  get elClasses(): SafeAny {\n    return {\n      'wr-divider': true,\n      'wr-divider--primary': this.color === 'primary',\n      'wr-divider--secondary': this.color === 'secondary',\n      'wr-divider--success': this.color === 'success',\n      'wr-divider--warning': this.color === 'warning',\n      'wr-divider--danger': this.color === 'danger',\n      'wr-divider--light': this.color === 'light',\n      'wr-divider--medium': this.color === 'medium',\n      'wr-divider--dark': this.color === 'dark',\n      'wr-divider--solid': this.type === 'solid',\n      'wr-divider--dashed': this.type === 'dashed',\n      'wr-divider--dotted': this.type === 'dotted',\n    };\n  }\n\n  @HostBinding('style')\n  get elStyles(): SafeAny {\n    return {\n      '--wr-divider-width': `${this.width}px`,\n    };\n  }\n\n  @HostBinding('role') role = 'separator';\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nexport * from './divider.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAiBa,kBAAkB,CAAA;AAN/B,IAAA,WAAA,GAAA;QAOW,IAAK,CAAA,KAAA,GAAwB,IAAI;QACjC,IAAI,CAAA,IAAA,GAAkC,OAAO;QACf,IAAK,CAAA,KAAA,GAAG,CAAC;QA2B3B,IAAI,CAAA,IAAA,GAAG,WAAW;AACxC;AA1BC,IAAA,IACI,SAAS,GAAA;QACX,OAAO;AACL,YAAA,YAAY,EAAE,IAAI;AAClB,YAAA,qBAAqB,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS;AAC/C,YAAA,uBAAuB,EAAE,IAAI,CAAC,KAAK,KAAK,WAAW;AACnD,YAAA,qBAAqB,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS;AAC/C,YAAA,qBAAqB,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS;AAC/C,YAAA,oBAAoB,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ;AAC7C,YAAA,mBAAmB,EAAE,IAAI,CAAC,KAAK,KAAK,OAAO;AAC3C,YAAA,oBAAoB,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ;AAC7C,YAAA,kBAAkB,EAAE,IAAI,CAAC,KAAK,KAAK,MAAM;AACzC,YAAA,mBAAmB,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;AAC1C,YAAA,oBAAoB,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;AAC5C,YAAA,oBAAoB,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;SAC7C;;AAGH,IAAA,IACI,QAAQ,GAAA;QACV,OAAO;AACL,YAAA,oBAAoB,EAAE,CAAA,EAAG,IAAI,CAAC,KAAK,CAAI,EAAA,CAAA;SACxC;;+GA3BQ,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAGT,eAAe,CAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,gBAAA,EAAA,OAAA,EAAA,eAAA,EAAA,MAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAPzB,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAID,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAN9B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,QAAQ,EAAE,EAAE;oBACZ,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;;sBAEE;;sBACA;;sBACA,KAAK;uBAAC,EAAE,SAAS,EAAE,eAAe,EAAE;;sBAEpC,WAAW;uBAAC,OAAO;;sBAkBnB,WAAW;uBAAC,OAAO;;sBAOnB,WAAW;uBAAC,MAAM;;;AC/CrB;;;;;AAKG;;ACLH;;AAEG;;;;"}
+{"version":3,"file":"ngwr-divider.mjs","sources":["../../../projects/lib/divider/divider.ts","../../../projects/lib/divider/ngwr-divider.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceNumberProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport type { WrColor } from 'ngwr/theme';\n\nimport type { WrDividerAlign, WrDividerType } from './interfaces';\n\n/**\n * Horizontal separator line. Projected content renders as a label\n * inline with the line (split into two halves on either side).\n *\n * @example\n * ```html\n * <wr-divider />\n * <wr-divider type=\"dashed\" color=\"primary\" [width]=\"2\" />\n * <wr-divider>OR</wr-divider>\n * <wr-divider align=\"start\">Section</wr-divider>\n * ```\n *\n * @see https://ngwr.dev/components/divider\n */\n@Component({\n  selector: 'wr-divider',\n  template: '<ng-content />',\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    role: 'separator',\n    '[class]': 'classes()',\n    '[style.--wr-divider-width.px]': 'width()',\n  },\n})\nexport class WrDivider {\n  /**\n   * Color of the divider line. Omit for the neutral default.\n   *\n   * @default null\n   */\n  readonly color = input<WrColor | null>(null);\n\n  /**\n   * Line style.\n   *\n   * @default 'solid'\n   */\n  readonly type = input<WrDividerType>('solid');\n\n  /**\n   * Line width in pixels.\n   *\n   * @default 1\n   */\n  readonly width = input(1, { transform: (v: unknown): number => coerceNumberProperty(v, 1) });\n\n  /**\n   * Label position. Only meaningful when the divider has projected\n   * content — otherwise the line is symmetric and alignment has no\n   * visible effect.\n   *\n   * @default 'center'\n   */\n  readonly align = input<WrDividerAlign>('center');\n\n  protected readonly classes = computed(() => {\n    const parts = ['wr-divider', `wr-divider--${this.type()}`];\n    const color = this.color();\n    if (color) parts.push(`wr-divider--${color}`);\n    const align = this.align();\n    if (align !== 'center') parts.push(`wr-divider--${align}`);\n    return parts.join(' ');\n  });\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAAA;;;;;AAKG;AASH;;;;;;;;;;;;;AAaG;MAWU,SAAS,CAAA;AACpB;;;;AAIG;IACM,KAAK,GAAG,KAAK,CAAiB,IAAI;8EAAC;AAE5C;;;;AAIG;IACM,IAAI,GAAG,KAAK,CAAgB,OAAO;6EAAC;AAE7C;;;;AAIG;AACM,IAAA,KAAK,GAAG,KAAK,CAAC,CAAC,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,OAAA,EAAA,8BAAA,EAAA,CAAA,EAAI,SAAS,EAAE,CAAC,CAAU,KAAa,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;AAE5F;;;;;;AAMG;IACM,KAAK,GAAG,KAAK,CAAiB,QAAQ;8EAAC;AAE7B,IAAA,OAAO,GAAG,QAAQ,CAAC,MAAK;AACzC,QAAA,MAAM,KAAK,GAAG,CAAC,YAAY,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,IAAI,EAAE,CAAA,CAAE,CAAC;AAC1D,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;AAC1B,QAAA,IAAI,KAAK;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,eAAe,KAAK,CAAA,CAAE,CAAC;AAC7C,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;QAC1B,IAAI,KAAK,KAAK,QAAQ;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,eAAe,KAAK,CAAA,CAAE,CAAC;AAC1D,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;IACxB,CAAC;gFAAC;uGAtCS,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAT,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,SAAS,8qBARV,gBAAgB,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAQf,SAAS,EAAA,UAAA,EAAA,CAAA;kBAVrB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,QAAQ,EAAE,gBAAgB;oBAC1B,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACrC,oBAAA,IAAI,EAAE;AACJ,wBAAA,IAAI,EAAE,WAAW;AACjB,wBAAA,SAAS,EAAE,WAAW;AACtB,wBAAA,+BAA+B,EAAE,SAAS;AAC3C,qBAAA;AACF,iBAAA;;;ACrCD;;AAEG;;;;"}

package/fesm2022/ngwr-donut-chart.mjs

@@ -0,0 +1,131 @@
+import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i0 from '@angular/core';
+import { input, computed, ViewEncapsulation, Component } from '@angular/core';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+const FALLBACK_COLORS = [
+    'var(--wr-color-primary)',
+    'var(--wr-color-secondary)',
+    'var(--wr-color-success)',
+    'var(--wr-color-warning)',
+    'var(--wr-color-danger)',
+    'var(--wr-color-medium)',
+];
+/**
+ * Donut chart. Set `thickness` to 0 for a solid pie. Optional center
+ * text via inputs.
+ *
+ * @example
+ * ```html
+ * <wr-donut-chart [segments]="[
+ *   { label: 'Used', value: 60 },
+ *   { label: 'Free', value: 40 }
+ * ]" centerLabel="Disk" centerValue="60%" />
+ * ```
+ *
+ * @see https://ngwr.dev/components/donut-chart
+ */
+class WrDonutChart {
+    segments = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "segments" }] : /* istanbul ignore next */ []));
+    /** Diameter in CSS pixels. @default 200 */
+    size = input(200, { ...(ngDevMode ? { debugName: "size" } : /* istanbul ignore next */ {}), transform: (v) => Math.max(48, coerceNumberProperty(v, 200)) });
+    /** Inner-ring thickness as a percent of radius (0–100). `0` = solid pie. @default 30 */
+    thickness = input(30, { ...(ngDevMode ? { debugName: "thickness" } : /* istanbul ignore next */ {}), transform: (v) => Math.min(100, Math.max(0, coerceNumberProperty(v, 30))) });
+    /** Show the legend under the chart. @default true */
+    showLegend = input(true, { ...(ngDevMode ? { debugName: "showLegend" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Bold value text in the center. */
+    centerValue = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "centerValue" }] : /* istanbul ignore next */ []));
+    /** Smaller label under the value. */
+    centerLabel = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "centerLabel" }] : /* istanbul ignore next */ []));
+    // Drawn in a 100×100 viewBox.
+    outerR = 50;
+    innerR = computed(() => this.outerR * (1 - this.thickness() / 100), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "innerR" }] : /* istanbul ignore next */ []));
+    total = computed(() => {
+        const sum = this.segments().reduce((acc, s) => acc + Math.max(0, s.value), 0);
+        return sum > 0 ? sum : 1;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
+    /** Resolved slices ready for the template — each carries its arc path. */
+    slices = computed(() => {
+        const total = this.total();
+        let cumulative = 0;
+        return this.segments().map((s, i) => {
+            const value = Math.max(0, s.value);
+            const startAngle = (cumulative / total) * Math.PI * 2;
+            cumulative += value;
+            const endAngle = (cumulative / total) * Math.PI * 2;
+            return {
+                label: s.label,
+                value,
+                color: s.color ?? FALLBACK_COLORS[i % FALLBACK_COLORS.length],
+                path: this.arcPath(startAngle, endAngle),
+                percent: (value / total) * 100,
+            };
+        });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "slices" }] : /* istanbul ignore next */ []));
+    // Helpers
+    /** SVG path for one donut slice using outer and inner arcs. */
+    arcPath(start, end) {
+        const cx = 50;
+        const cy = 50;
+        const ro = this.outerR;
+        const ri = this.innerR();
+        const sweep = end - start;
+        if (sweep <= 0)
+            return '';
+        // Full-circle slice — two halves so the arc can render.
+        if (sweep >= Math.PI * 2 - 1e-6) {
+            const path = [
+                `M ${cx + ro} ${cy}`,
+                `A ${ro} ${ro} 0 1 1 ${cx - ro} ${cy}`,
+                `A ${ro} ${ro} 0 1 1 ${cx + ro} ${cy}`,
+            ];
+            if (ri > 0) {
+                path.push(`M ${cx + ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx - ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx + ri} ${cy}`);
+            }
+            return path.join(' ');
+        }
+        const largeArc = sweep > Math.PI ? 1 : 0;
+        const sox = cx + ro * Math.cos(start);
+        const soy = cy + ro * Math.sin(start);
+        const eox = cx + ro * Math.cos(end);
+        const eoy = cy + ro * Math.sin(end);
+        if (ri === 0) {
+            return `M ${cx} ${cy} L ${sox.toFixed(2)} ${soy.toFixed(2)} A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)} Z`;
+        }
+        const eix = cx + ri * Math.cos(end);
+        const eiy = cy + ri * Math.sin(end);
+        const six = cx + ri * Math.cos(start);
+        const siy = cy + ri * Math.sin(start);
+        return [
+            `M ${sox.toFixed(2)} ${soy.toFixed(2)}`,
+            `A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)}`,
+            `L ${eix.toFixed(2)} ${eiy.toFixed(2)}`,
+            `A ${ri} ${ri} 0 ${largeArc} 0 ${six.toFixed(2)} ${siy.toFixed(2)}`,
+            'Z',
+        ].join(' ');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrDonutChart, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrDonutChart, isStandalone: true, selector: "wr-donut-chart", inputs: { segments: { classPropertyName: "segments", publicName: "segments", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: true, isRequired: false, transformFunction: null }, centerValue: { classPropertyName: "centerValue", publicName: "centerValue", isSignal: true, isRequired: false, transformFunction: null }, centerLabel: { classPropertyName: "centerLabel", publicName: "centerLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-donut-chart" }, ngImport: i0, template: "<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n  <svg viewBox=\"0 0 100 100\" aria-hidden=\"true\">\n    @for (slice of slices(); track $index) {\n      <path [attr.d]=\"slice.path\" [attr.fill]=\"slice.color\" />\n    }\n  </svg>\n  @if (centerValue() || centerLabel()) {\n    <div class=\"wr-donut-chart__center\">\n      @if (centerValue()) {\n        <div class=\"wr-donut-chart__center-value\">{{ centerValue() }}</div>\n      }\n      @if (centerLabel()) {\n        <div class=\"wr-donut-chart__center-label\">{{ centerLabel() }}</div>\n      }\n    </div>\n  }\n</div>\n\n@if (showLegend()) {\n  <ul class=\"wr-donut-chart__legend\">\n    @for (slice of slices(); track $index) {\n      <li class=\"wr-donut-chart__legend-item\">\n        <span class=\"wr-donut-chart__swatch\" [style.background]=\"slice.color\"></span>\n        <span class=\"wr-donut-chart__legend-label\">{{ slice.label }}</span>\n        <span class=\"wr-donut-chart__legend-value\">{{ slice.value }}</span>\n      </li>\n    }\n  </ul>\n}\n", encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrDonutChart, decorators: [{
+            type: Component,
+            args: [{ selector: 'wr-donut-chart', encapsulation: ViewEncapsulation.None, host: { class: 'wr-donut-chart' }, template: "<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n  <svg viewBox=\"0 0 100 100\" aria-hidden=\"true\">\n    @for (slice of slices(); track $index) {\n      <path [attr.d]=\"slice.path\" [attr.fill]=\"slice.color\" />\n    }\n  </svg>\n  @if (centerValue() || centerLabel()) {\n    <div class=\"wr-donut-chart__center\">\n      @if (centerValue()) {\n        <div class=\"wr-donut-chart__center-value\">{{ centerValue() }}</div>\n      }\n      @if (centerLabel()) {\n        <div class=\"wr-donut-chart__center-label\">{{ centerLabel() }}</div>\n      }\n    </div>\n  }\n</div>\n\n@if (showLegend()) {\n  <ul class=\"wr-donut-chart__legend\">\n    @for (slice of slices(); track $index) {\n      <li class=\"wr-donut-chart__legend-item\">\n        <span class=\"wr-donut-chart__swatch\" [style.background]=\"slice.color\"></span>\n        <span class=\"wr-donut-chart__legend-label\">{{ slice.label }}</span>\n        <span class=\"wr-donut-chart__legend-value\">{{ slice.value }}</span>\n      </li>\n    }\n  </ul>\n}\n" }]
+        }], propDecorators: { segments: [{ type: i0.Input, args: [{ isSignal: true, alias: "segments", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], thickness: [{ type: i0.Input, args: [{ isSignal: true, alias: "thickness", required: false }] }], showLegend: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLegend", required: false }] }], centerValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "centerValue", required: false }] }], centerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "centerLabel", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WrDonutChart };
+//# sourceMappingURL=ngwr-donut-chart.mjs.map

package/fesm2022/ngwr-donut-chart.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-donut-chart.mjs","sources":["../../../projects/lib/donut-chart/donut-chart.ts","../../../projects/lib/donut-chart/donut-chart.html","../../../projects/lib/donut-chart/ngwr-donut-chart.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input } from '@angular/core';\n\nimport type { WrDonutSegment } from './interfaces';\n\nconst FALLBACK_COLORS = [\n  'var(--wr-color-primary)',\n  'var(--wr-color-secondary)',\n  'var(--wr-color-success)',\n  'var(--wr-color-warning)',\n  'var(--wr-color-danger)',\n  'var(--wr-color-medium)',\n];\n\n/**\n * Donut chart. Set `thickness` to 0 for a solid pie. Optional center\n * text via inputs.\n *\n * @example\n * ```html\n * <wr-donut-chart [segments]=\"[\n *   { label: 'Used', value: 60 },\n *   { label: 'Free', value: 40 }\n * ]\" centerLabel=\"Disk\" centerValue=\"60%\" />\n * ```\n *\n * @see https://ngwr.dev/components/donut-chart\n */\n@Component({\n  selector: 'wr-donut-chart',\n  templateUrl: './donut-chart.html',\n  encapsulation: ViewEncapsulation.None,\n  host: { class: 'wr-donut-chart' },\n})\nexport class WrDonutChart {\n  readonly segments = input<readonly WrDonutSegment[]>([]);\n\n  /** Diameter in CSS pixels. @default 200 */\n  readonly size = input(200, { transform: (v: unknown): number => Math.max(48, coerceNumberProperty(v, 200)) });\n\n  /** Inner-ring thickness as a percent of radius (0–100). `0` = solid pie. @default 30 */\n  readonly thickness = input(30, {\n    transform: (v: unknown): number => Math.min(100, Math.max(0, coerceNumberProperty(v, 30))),\n  });\n\n  /** Show the legend under the chart. @default true */\n  readonly showLegend = input(true, { transform: coerceBooleanProperty });\n\n  /** Bold value text in the center. */\n  readonly centerValue = input<string>('');\n\n  /** Smaller label under the value. */\n  readonly centerLabel = input<string>('');\n\n  // Drawn in a 100×100 viewBox.\n  private readonly outerR = 50;\n\n  protected readonly innerR = computed(() => this.outerR * (1 - this.thickness() / 100));\n\n  protected readonly total = computed(() => {\n    const sum = this.segments().reduce((acc, s) => acc + Math.max(0, s.value), 0);\n    return sum > 0 ? sum : 1;\n  });\n\n  /** Resolved slices ready for the template — each carries its arc path. */\n  protected readonly slices = computed(() => {\n    const total = this.total();\n    let cumulative = 0;\n    return this.segments().map((s, i) => {\n      const value = Math.max(0, s.value);\n      const startAngle = (cumulative / total) * Math.PI * 2;\n      cumulative += value;\n      const endAngle = (cumulative / total) * Math.PI * 2;\n      return {\n        label: s.label,\n        value,\n        color: s.color ?? FALLBACK_COLORS[i % FALLBACK_COLORS.length],\n        path: this.arcPath(startAngle, endAngle),\n        percent: (value / total) * 100,\n      };\n    });\n  });\n\n  // Helpers\n\n  /** SVG path for one donut slice using outer and inner arcs. */\n  private arcPath(start: number, end: number): string {\n    const cx = 50;\n    const cy = 50;\n    const ro = this.outerR;\n    const ri = this.innerR();\n    const sweep = end - start;\n    if (sweep <= 0) return '';\n    // Full-circle slice — two halves so the arc can render.\n    if (sweep >= Math.PI * 2 - 1e-6) {\n      const path = [\n        `M ${cx + ro} ${cy}`,\n        `A ${ro} ${ro} 0 1 1 ${cx - ro} ${cy}`,\n        `A ${ro} ${ro} 0 1 1 ${cx + ro} ${cy}`,\n      ];\n      if (ri > 0) {\n        path.push(`M ${cx + ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx - ri} ${cy}`, `A ${ri} ${ri} 0 1 0 ${cx + ri} ${cy}`);\n      }\n      return path.join(' ');\n    }\n    const largeArc = sweep > Math.PI ? 1 : 0;\n    const sox = cx + ro * Math.cos(start);\n    const soy = cy + ro * Math.sin(start);\n    const eox = cx + ro * Math.cos(end);\n    const eoy = cy + ro * Math.sin(end);\n    if (ri === 0) {\n      return `M ${cx} ${cy} L ${sox.toFixed(2)} ${soy.toFixed(2)} A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)} Z`;\n    }\n    const eix = cx + ri * Math.cos(end);\n    const eiy = cy + ri * Math.sin(end);\n    const six = cx + ri * Math.cos(start);\n    const siy = cy + ri * Math.sin(start);\n    return [\n      `M ${sox.toFixed(2)} ${soy.toFixed(2)}`,\n      `A ${ro} ${ro} 0 ${largeArc} 1 ${eox.toFixed(2)} ${eoy.toFixed(2)}`,\n      `L ${eix.toFixed(2)} ${eiy.toFixed(2)}`,\n      `A ${ri} ${ri} 0 ${largeArc} 0 ${six.toFixed(2)} ${siy.toFixed(2)}`,\n      'Z',\n    ].join(' ');\n  }\n}\n\nexport type { WrDonutSegment } from './interfaces';\n","<div class=\"wr-donut-chart__surface\" [style.width.px]=\"size()\">\n  <svg viewBox=\"0 0 100 100\" aria-hidden=\"true\">\n    @for (slice of slices(); track $index) {\n      <path [attr.d]=\"slice.path\" [attr.fill]=\"slice.color\" />\n    }\n  </svg>\n  @if (centerValue() || centerLabel()) {\n    <div class=\"wr-donut-chart__center\">\n      @if (centerValue()) {\n        <div class=\"wr-donut-chart__center-value\">{{ centerValue() }}</div>\n      }\n      @if (centerLabel()) {\n        <div class=\"wr-donut-chart__center-label\">{{ centerLabel() }}</div>\n      }\n    </div>\n  }\n</div>\n\n@if (showLegend()) {\n  <ul class=\"wr-donut-chart__legend\">\n    @for (slice of slices(); track $index) {\n      <li class=\"wr-donut-chart__legend-item\">\n        <span class=\"wr-donut-chart__swatch\" [style.background]=\"slice.color\"></span>\n        <span class=\"wr-donut-chart__legend-label\">{{ slice.label }}</span>\n        <span class=\"wr-donut-chart__legend-value\">{{ slice.value }}</span>\n      </li>\n    }\n  </ul>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngwr-drag-drop.mjs

@@ -0,0 +1,117 @@
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i1 from '@angular/cdk/drag-drop';
+import { moveItemInArray, CdkDropList, CdkDrag, CdkDragHandle } from '@angular/cdk/drag-drop';
+import { NgTemplateOutlet } from '@angular/common';
+import * as i0 from '@angular/core';
+import { model, input, output, contentChild, TemplateRef, ViewEncapsulation, Component, Directive } from '@angular/core';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Drag-to-reorder list. Wraps CDK's `cdkDropList` + `cdkDrag` with a
+ * signal-based items binding — the source array is updated in place and
+ * emitted via 2-way `[(items)]`.
+ *
+ * Drop a single template — it's rendered per item with `let-item
+ * let-index="index"`. Add `[handle]="true"` (or `[wrDragHandle]` inside
+ * your template) to restrict drag start to a handle element.
+ *
+ * @example
+ * ```html
+ * <wr-sortable-list [(items)]="rows" (reorder)="onReorder($event)">
+ *   <ng-template let-row let-i="index">
+ *     <div class="row">
+ *       <span wrDragHandle>≡</span>
+ *       {{ i + 1 }}. {{ row.label }}
+ *     </div>
+ *   </ng-template>
+ * </wr-sortable-list>
+ * ```
+ *
+ * @see https://ngwr.dev/components/drag-drop
+ */
+class WrSortableList {
+    /** Items to render. Two-way — emits the reordered array on drop. */
+    items = model.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    /** Layout direction. Drives CDK's `cdkDropListOrientation`. @default 'vertical' */
+    orientation = input('vertical', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    /** Disable all dragging. @default false */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Locked axis — restrict drag movement to one axis even diagonally. */
+    lockAxis = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "lockAxis" }] : /* istanbul ignore next */ []));
+    /** `trackBy` for the inner `@for`. Defaults to identity. */
+    trackBy = input((_, item) => item, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "trackBy" }] : /* istanbul ignore next */ []));
+    /** Fired after a successful reorder with the new array + indices. */
+    reorder = output();
+    rowTemplate = contentChild.required((TemplateRef));
+    onDrop(event) {
+        if (event.previousIndex === event.currentIndex)
+            return;
+        const next = this.items().slice();
+        moveItemInArray(next, event.previousIndex, event.currentIndex);
+        this.items.set(next);
+        this.reorder.emit({
+            items: next,
+            previousIndex: event.previousIndex,
+            currentIndex: event.currentIndex,
+            item: next[event.currentIndex],
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrSortableList, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrSortableList, isStandalone: true, selector: "wr-sortable-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, lockAxis: { classPropertyName: "lockAxis", publicName: "lockAxis", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", reorder: "reorder" }, host: { classAttribute: "wr-sortable-list" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: (TemplateRef), descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  cdkDropList\n  class=\"wr-sortable-list__list\"\n  [cdkDropListOrientation]=\"orientation()\"\n  [cdkDropListDisabled]=\"disabled()\"\n  (cdkDropListDropped)=\"onDrop($event)\"\n>\n  @for (item of items(); track trackBy()($index, item)) {\n    <div cdkDrag class=\"wr-sortable-list__item\" [cdkDragDisabled]=\"disabled()\" [cdkDragLockAxis]=\"lockAxis() ?? null\">\n      <ng-container *ngTemplateOutlet=\"rowTemplate(); context: { $implicit: item, index: $index }\" />\n    </div>\n  }\n</div>\n", styles: [".wr-sortable-list{display:block}.wr-sortable-list__list{display:flex;flex-direction:column;gap:var(--wr-sortable-list-gap, .5rem)}.wr-sortable-list__item{cursor:grab;-webkit-user-select:none;user-select:none;transition:box-shadow .18s ease}.wr-sortable-list__item.cdk-drag-disabled{cursor:default}.wr-sortable-list__item:active{cursor:grabbing}.wr-sortable-list[orientation=horizontal] .wr-sortable-list__list,.wr-sortable-list[data-orientation=horizontal] .wr-sortable-list__list{flex-direction:row}.wr-drag-handle{cursor:grab;display:inline-flex;align-items:center;justify-content:center;color:rgba(var(--wr-color-dark-rgb),.45);transition:color .15s ease}.wr-drag-handle:hover{color:var(--wr-color-dark)}.wr-drag-handle:active{cursor:grabbing}.cdk-drag-preview{box-sizing:border-box;color:var(--wr-color-dark);font-family:var(--wr-font-family-base);transition:none;filter:drop-shadow(0 8px 12px rgba(var(--wr-color-backdrop-rgb),.24)) drop-shadow(0 2px 3px rgba(var(--wr-color-backdrop-rgb),.16))}.cdk-drag-placeholder{opacity:.35;background:rgba(var(--wr-color-light-rgb),.6);border-radius:var(--wr-border-radius-base);outline:1px dashed rgba(var(--wr-color-dark-rgb),.25);outline-offset:-1px}.cdk-drag-animating{transition:transform .18s cubic-bezier(.2,.9,.3,1.1)}.wr-sortable-list__list.cdk-drop-list-dragging .wr-sortable-list__item:not(.cdk-drag-placeholder){transition:transform .18s cubic-bezier(.2,.9,.3,1.1)}\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrSortableList, decorators: [{
+            type: Component,
+            args: [{ selector: 'wr-sortable-list', encapsulation: ViewEncapsulation.None, imports: [CdkDropList, CdkDrag, NgTemplateOutlet], host: { class: 'wr-sortable-list' }, template: "<div\n  cdkDropList\n  class=\"wr-sortable-list__list\"\n  [cdkDropListOrientation]=\"orientation()\"\n  [cdkDropListDisabled]=\"disabled()\"\n  (cdkDropListDropped)=\"onDrop($event)\"\n>\n  @for (item of items(); track trackBy()($index, item)) {\n    <div cdkDrag class=\"wr-sortable-list__item\" [cdkDragDisabled]=\"disabled()\" [cdkDragLockAxis]=\"lockAxis() ?? null\">\n      <ng-container *ngTemplateOutlet=\"rowTemplate(); context: { $implicit: item, index: $index }\" />\n    </div>\n  }\n</div>\n", styles: [".wr-sortable-list{display:block}.wr-sortable-list__list{display:flex;flex-direction:column;gap:var(--wr-sortable-list-gap, .5rem)}.wr-sortable-list__item{cursor:grab;-webkit-user-select:none;user-select:none;transition:box-shadow .18s ease}.wr-sortable-list__item.cdk-drag-disabled{cursor:default}.wr-sortable-list__item:active{cursor:grabbing}.wr-sortable-list[orientation=horizontal] .wr-sortable-list__list,.wr-sortable-list[data-orientation=horizontal] .wr-sortable-list__list{flex-direction:row}.wr-drag-handle{cursor:grab;display:inline-flex;align-items:center;justify-content:center;color:rgba(var(--wr-color-dark-rgb),.45);transition:color .15s ease}.wr-drag-handle:hover{color:var(--wr-color-dark)}.wr-drag-handle:active{cursor:grabbing}.cdk-drag-preview{box-sizing:border-box;color:var(--wr-color-dark);font-family:var(--wr-font-family-base);transition:none;filter:drop-shadow(0 8px 12px rgba(var(--wr-color-backdrop-rgb),.24)) drop-shadow(0 2px 3px rgba(var(--wr-color-backdrop-rgb),.16))}.cdk-drag-placeholder{opacity:.35;background:rgba(var(--wr-color-light-rgb),.6);border-radius:var(--wr-border-radius-base);outline:1px dashed rgba(var(--wr-color-dark-rgb),.25);outline-offset:-1px}.cdk-drag-animating{transition:transform .18s cubic-bezier(.2,.9,.3,1.1)}.wr-sortable-list__list.cdk-drop-list-dragging .wr-sortable-list__item:not(.cdk-drag-placeholder){transition:transform .18s cubic-bezier(.2,.9,.3,1.1)}\n"] }]
+        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }, { type: i0.Output, args: ["itemsChange"] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], lockAxis: [{ type: i0.Input, args: [{ isSignal: true, alias: "lockAxis", required: false }] }], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], reorder: [{ type: i0.Output, args: ["reorder"] }], rowTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }] } });
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Drag handle for {@link WrSortableList} (and any nested `cdkDrag`).
+ * Composes CDK's `cdkDragHandle` via `hostDirectives` so consumers don't
+ * need to import the CDK selector directly.
+ *
+ * @example
+ * ```html
+ * <wr-sortable-list [(items)]="rows">
+ *   <ng-template let-row>
+ *     <div class="row">
+ *       <span wrDragHandle class="grip">≡</span>
+ *       <span>{{ row.label }}</span>
+ *     </div>
+ *   </ng-template>
+ * </wr-sortable-list>
+ * ```
+ */
+class WrDragHandle {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrDragHandle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: WrDragHandle, isStandalone: true, selector: "[wrDragHandle]", host: { classAttribute: "wr-drag-handle" }, hostDirectives: [{ directive: i1.CdkDragHandle }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrDragHandle, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[wrDragHandle]',
+                    hostDirectives: [CdkDragHandle],
+                    host: { class: 'wr-drag-handle' },
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WrDragHandle, WrSortableList };
+//# sourceMappingURL=ngwr-drag-drop.mjs.map

package/fesm2022/ngwr-drag-drop.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngwr-drag-drop.mjs","sources":["../../../projects/lib/drag-drop/sortable-list.ts","../../../projects/lib/drag-drop/sortable-list.html","../../../projects/lib/drag-drop/drag-handle.ts","../../../projects/lib/drag-drop/ngwr-drag-drop.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { CdkDrag, type CdkDragDrop, CdkDropList, moveItemInArray } from '@angular/cdk/drag-drop';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { Component, TemplateRef, ViewEncapsulation, contentChild, input, model, output } from '@angular/core';\n\nimport type { WrSortableReorderEvent } from './interfaces';\n\n/**\n * Drag-to-reorder list. Wraps CDK's `cdkDropList` + `cdkDrag` with a\n * signal-based items binding — the source array is updated in place and\n * emitted via 2-way `[(items)]`.\n *\n * Drop a single template — it's rendered per item with `let-item\n * let-index=\"index\"`. Add `[handle]=\"true\"` (or `[wrDragHandle]` inside\n * your template) to restrict drag start to a handle element.\n *\n * @example\n * ```html\n * <wr-sortable-list [(items)]=\"rows\" (reorder)=\"onReorder($event)\">\n *   <ng-template let-row let-i=\"index\">\n *     <div class=\"row\">\n *       <span wrDragHandle>≡</span>\n *       {{ i + 1 }}. {{ row.label }}\n *     </div>\n *   </ng-template>\n * </wr-sortable-list>\n * ```\n *\n * @see https://ngwr.dev/components/drag-drop\n */\n@Component({\n  selector: 'wr-sortable-list',\n  templateUrl: './sortable-list.html',\n  styleUrl: './sortable-list.scss',\n  encapsulation: ViewEncapsulation.None,\n  imports: [CdkDropList, CdkDrag, NgTemplateOutlet],\n  host: { class: 'wr-sortable-list' },\n})\nexport class WrSortableList<T = unknown> {\n  /** Items to render. Two-way — emits the reordered array on drop. */\n  readonly items = model.required<T[]>();\n\n  /** Layout direction. Drives CDK's `cdkDropListOrientation`. @default 'vertical' */\n  readonly orientation = input<'vertical' | 'horizontal'>('vertical');\n\n  /** Disable all dragging. @default false */\n  readonly disabled = input(false, { transform: coerceBooleanProperty });\n\n  /** Locked axis — restrict drag movement to one axis even diagonally. */\n  readonly lockAxis = input<'x' | 'y' | undefined>(undefined);\n\n  /** `trackBy` for the inner `@for`. Defaults to identity. */\n  readonly trackBy = input<(index: number, item: T) => unknown>((_, item) => item);\n\n  /** Fired after a successful reorder with the new array + indices. */\n  readonly reorder = output<WrSortableReorderEvent<T>>();\n\n  protected readonly rowTemplate = contentChild.required(TemplateRef<{ $implicit: T; index: number }>);\n\n  protected onDrop(event: CdkDragDrop<T[]>): void {\n    if (event.previousIndex === event.currentIndex) return;\n    const next = this.items().slice();\n    moveItemInArray(next, event.previousIndex, event.currentIndex);\n    this.items.set(next);\n    this.reorder.emit({\n      items: next,\n      previousIndex: event.previousIndex,\n      currentIndex: event.currentIndex,\n      item: next[event.currentIndex],\n    });\n  }\n}\n\nexport type { WrSortableReorderEvent } from './interfaces';\n","<div\n  cdkDropList\n  class=\"wr-sortable-list__list\"\n  [cdkDropListOrientation]=\"orientation()\"\n  [cdkDropListDisabled]=\"disabled()\"\n  (cdkDropListDropped)=\"onDrop($event)\"\n>\n  @for (item of items(); track trackBy()($index, item)) {\n    <div cdkDrag class=\"wr-sortable-list__item\" [cdkDragDisabled]=\"disabled()\" [cdkDragLockAxis]=\"lockAxis() ?? null\">\n      <ng-container *ngTemplateOutlet=\"rowTemplate(); context: { $implicit: item, index: $index }\" />\n    </div>\n  }\n</div>\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { CdkDragHandle } from '@angular/cdk/drag-drop';\nimport { Directive } from '@angular/core';\n\n/**\n * Drag handle for {@link WrSortableList} (and any nested `cdkDrag`).\n * Composes CDK's `cdkDragHandle` via `hostDirectives` so consumers don't\n * need to import the CDK selector directly.\n *\n * @example\n * ```html\n * <wr-sortable-list [(items)]=\"rows\">\n *   <ng-template let-row>\n *     <div class=\"row\">\n *       <span wrDragHandle class=\"grip\">≡</span>\n *       <span>{{ row.label }}</span>\n *     </div>\n *   </ng-template>\n * </wr-sortable-list>\n * ```\n */\n@Directive({\n  selector: '[wrDragHandle]',\n  hostDirectives: [CdkDragHandle],\n  host: { class: 'wr-drag-handle' },\n})\nexport class WrDragHandle {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;AAAA;;;;;AAKG;AASH;;;;;;;;;;;;;;;;;;;;;;AAsBG;MASU,cAAc,CAAA;;IAEhB,KAAK,GAAG,KAAK,CAAC,QAAQ;8EAAO;;IAG7B,WAAW,GAAG,KAAK,CAA4B,UAAU;oFAAC;;IAG1D,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAG7D,QAAQ,GAAG,KAAK,CAAwB,SAAS;iFAAC;;IAGlD,OAAO,GAAG,KAAK,CAAsC,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI;gFAAC;;IAGvE,OAAO,GAAG,MAAM,EAA6B;IAEnC,WAAW,GAAG,YAAY,CAAC,QAAQ,EAAC,WAA4C,EAAC;AAE1F,IAAA,MAAM,CAAC,KAAuB,EAAA;AACtC,QAAA,IAAI,KAAK,CAAC,aAAa,KAAK,KAAK,CAAC,YAAY;YAAE;QAChD,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE;QACjC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;AAC9D,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AACpB,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;AAChB,YAAA,KAAK,EAAE,IAAI;YACX,aAAa,EAAE,KAAK,CAAC,aAAa;YAClC,YAAY,EAAE,KAAK,CAAC,YAAY;AAChC,YAAA,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;AAC/B,SAAA,CAAC;IACJ;uGAhCW,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAd,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,KAAA,EAAA,aAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,kBAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,GAmB8B,WAA4C,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EChErG,0fAaA,EAAA,MAAA,EAAA,CAAA,i5CAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED6BY,WAAW,EAAA,QAAA,EAAA,8BAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,EAAA,iBAAA,EAAA,wBAAA,EAAA,IAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,4BAAA,EAAA,2BAAA,EAAA,0BAAA,EAAA,+BAAA,EAAA,2BAAA,EAAA,6BAAA,EAAA,sBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,oBAAA,EAAA,oBAAA,EAAA,mBAAA,EAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,yBAAA,EAAA,iBAAA,EAAA,0BAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,cAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,cAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAGrC,cAAc,EAAA,UAAA,EAAA,CAAA;kBAR1B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,iBAGb,iBAAiB,CAAC,IAAI,EAAA,OAAA,EAC5B,CAAC,WAAW,EAAE,OAAO,EAAE,gBAAgB,CAAC,EAAA,IAAA,EAC3C,EAAE,KAAK,EAAE,kBAAkB,EAAE,EAAA,QAAA,EAAA,0fAAA,EAAA,MAAA,EAAA,CAAA,i5CAAA,CAAA,EAAA;4pBAqBoB,WAA4C,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AEhErG;;;;;AAKG;AAKH;;;;;;;;;;;;;;;;AAgBG;MAMU,YAAY,CAAA;uGAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,cAAA,EAAA,CAAA,EAAA,SAAA,EAAA,EAAA,CAAA,aAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBALxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;oBAC1B,cAAc,EAAE,CAAC,aAAa,CAAC;AAC/B,oBAAA,IAAI,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE;AAClC,iBAAA;;;AC/BD;;AAEG;;;;"}