@neural-ui/core 1.5.13 → 1.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/neural-ui-core-button.mjs +2 -2
- package/fesm2022/neural-ui-core-button.mjs.map +1 -1
- package/fesm2022/neural-ui-core-rich-text-editor.mjs +740 -0
- package/fesm2022/neural-ui-core-rich-text-editor.mjs.map +1 -0
- package/fesm2022/neural-ui-core-split-button.mjs +2 -2
- package/fesm2022/neural-ui-core-split-button.mjs.map +1 -1
- package/package.json +5 -1
- package/types/neural-ui-core-rich-text-editor.d.ts +97 -0
|
@@ -79,7 +79,7 @@ class NeuButtonComponent {
|
|
|
79
79
|
@if (hasIcon() && iconPosition() === 'right') {
|
|
80
80
|
<neu-icon [name]="icon()" [size]="iconSize()" strokeWidth="2" aria-hidden="true" />
|
|
81
81
|
}
|
|
82
|
-
`, isInline: true, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon
|
|
82
|
+
`, isInline: true, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin:0;line-height:1}.neu-button--icon-only .neu-icon ng-icon,.neu-button--icon-only neu-icon ng-icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ng-icon__size, 1em);height:var(--ng-icon__size, 1em);line-height:1}.neu-button--icon-only .neu-icon svg,.neu-button--icon-only neu-icon svg{display:block;width:100%;height:100%}.neu-button__spinner{display:inline-flex;flex-shrink:0;width:1em;height:1em}.neu-button__spinner svg{width:100%;height:100%;animation:neu-spin .8s linear infinite}@keyframes neu-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "component", type: NeuIconComponent, selector: "neu-icon", inputs: ["name", "strokeWidth", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
83
83
|
}
|
|
84
84
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuButtonComponent, decorators: [{
|
|
85
85
|
type: Component,
|
|
@@ -114,7 +114,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
114
114
|
@if (hasIcon() && iconPosition() === 'right') {
|
|
115
115
|
<neu-icon [name]="icon()" [size]="iconSize()" strokeWidth="2" aria-hidden="true" />
|
|
116
116
|
}
|
|
117
|
-
`, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon
|
|
117
|
+
`, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin:0;line-height:1}.neu-button--icon-only .neu-icon ng-icon,.neu-button--icon-only neu-icon ng-icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ng-icon__size, 1em);height:var(--ng-icon__size, 1em);line-height:1}.neu-button--icon-only .neu-icon svg,.neu-button--icon-only neu-icon svg{display:block;width:100%;height:100%}.neu-button__spinner{display:inline-flex;flex-shrink:0;width:1em;height:1em}.neu-button__spinner svg{width:100%;height:100%;animation:neu-spin .8s linear infinite}@keyframes neu-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
118
118
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPosition", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], neuClick: [{ type: i0.Output, args: ["neuClick"] }] } });
|
|
119
119
|
|
|
120
120
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"neural-ui-core-button.mjs","sources":["../../../../projects/ui-core/button/neu-button.component.ts","../../../../projects/ui-core/button/neural-ui-core-button.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ViewEncapsulation,\n computed,\n input,\n output,\n} from '@angular/core';\nimport { NeuIconComponent } from '@neural-ui/core/icon';\n\nexport type NeuButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger' | 'outline';\nexport type NeuButtonSize = 'sm' | 'md' | 'lg';\nexport type NeuButtonIconPosition = 'left' | 'right';\n\n/**\n * NeuralUI Button Component\n *\n * Uso: <button neu-button variant=\"primary\" size=\"md\">Texto</button>\n * Con icono: <button neu-button icon=\"lucideSave\">Guardar</button>\n * Solo icono: <button neu-button icon=\"lucideTrash2\" [iconOnly]=\"true\" />\n *\n * Signals: variant, size, disabled, loading, fullWidth, icon, iconPosition, iconOnly\n * son inputs reactivos. El estado se computa automáticamente con computed().\n */\n@Component({\n selector: 'button[neu-button]',\n imports: [NeuIconComponent],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[class]': 'hostClasses()',\n '[attr.disabled]': 'isDisabled() ? \"\" : null',\n '[attr.aria-disabled]': 'isDisabled()',\n '[attr.aria-busy]': 'loading()',\n '[attr.aria-label]': 'ariaLabel() || null',\n '(click)': '_onHostClick($event)',\n },\n template: `\n @if (loading()) {\n <span class=\"neu-button__spinner\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"31.416\"\n stroke-dashoffset=\"10\"\n />\n </svg>\n </span>\n }\n @if (hasIcon() && iconPosition() === 'left') {\n <neu-icon [name]=\"icon()\" [size]=\"iconSize()\" strokeWidth=\"2\" aria-hidden=\"true\" />\n }\n <ng-content />\n @if (hasIcon() && iconPosition() === 'right') {\n <neu-icon [name]=\"icon()\" [size]=\"iconSize()\" strokeWidth=\"2\" aria-hidden=\"true\" />\n }\n `,\n styleUrl: './neu-button.component.scss',\n})\nexport class NeuButtonComponent {\n /** Variante visual del botón / Visual button variant */\n variant = input<NeuButtonVariant>('primary');\n\n /** Tamaño del botón / Button size */\n size = input<NeuButtonSize>('md');\n\n /** Deshabilita el botón y bloquea la interacción / Disables the button and blocks interaction */\n disabled = input<boolean>(false);\n\n /** Muestra un spinner y deshabilita mientras se procesa / Shows a spinner and disables while processing */\n loading = input<boolean>(false);\n\n /** Ocupa el 100% del ancho de su contenedor / Takes up 100% of its container width */\n fullWidth = input<boolean>(false);\n\n /** Nombre del icono Lucide (ej: 'lucideSave', 'lucidePlus') / Lucide icon name (e.g. 'lucideSave', 'lucidePlus') */\n icon = input<string>('');\n\n /** Posición del icono respecto al texto */\n iconPosition = input<NeuButtonIconPosition>('left');\n\n /** Modo solo-icono: aplica padding cuadrado y oculta el ng-content / Icon-only mode: applies square padding and hides ng-content */\n iconOnly = input<boolean>(false);\n\n /** Etiqueta accesible obligatoria cuando se usa iconOnly (WCAG 4.1.2) / Required accessible label when using iconOnly (WCAG 4.1.2) */\n ariaLabel = input<string>('');\n\n /** Emite el evento de click cuando el botón está activo / Emits the click event when the button is active */\n neuClick = output<MouseEvent>();\n\n /** @internal — reenvía el click nativo al output Angular / forwards the native click to the Angular output */\n _onHostClick(event: MouseEvent): void {\n if (!this.isDisabled()) {\n this.neuClick.emit(event);\n }\n }\n\n readonly isDisabled = computed(() => this.disabled() || this.loading());\n readonly hasIcon = computed(() => !!this.icon());\n\n readonly iconSize = computed(() => {\n const map: Record<NeuButtonSize, string> = { sm: '14px', md: '16px', lg: '18px' };\n return map[this.size()];\n });\n\n readonly hostClasses = computed(() => ({\n 'neu-button': true,\n [`neu-button--${this.variant()}`]: true,\n [`neu-button--${this.size()}`]: true,\n 'neu-button--loading': this.loading(),\n 'neu-button--disabled': this.isDisabled(),\n 'neu-button--full-width': this.fullWidth(),\n 'neu-button--icon-only': this.iconOnly(),\n }));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"neural-ui-core-button.mjs","sources":["../../../../projects/ui-core/button/neu-button.component.ts","../../../../projects/ui-core/button/neural-ui-core-button.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ViewEncapsulation,\n computed,\n input,\n output,\n} from '@angular/core';\nimport { NeuIconComponent } from '@neural-ui/core/icon';\n\nexport type NeuButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger' | 'outline';\nexport type NeuButtonSize = 'sm' | 'md' | 'lg';\nexport type NeuButtonIconPosition = 'left' | 'right';\n\n/**\n * NeuralUI Button Component\n *\n * Uso: <button neu-button variant=\"primary\" size=\"md\">Texto</button>\n * Con icono: <button neu-button icon=\"lucideSave\">Guardar</button>\n * Solo icono: <button neu-button icon=\"lucideTrash2\" [iconOnly]=\"true\" />\n *\n * Signals: variant, size, disabled, loading, fullWidth, icon, iconPosition, iconOnly\n * son inputs reactivos. El estado se computa automáticamente con computed().\n */\n@Component({\n selector: 'button[neu-button]',\n imports: [NeuIconComponent],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[class]': 'hostClasses()',\n '[attr.disabled]': 'isDisabled() ? \"\" : null',\n '[attr.aria-disabled]': 'isDisabled()',\n '[attr.aria-busy]': 'loading()',\n '[attr.aria-label]': 'ariaLabel() || null',\n '(click)': '_onHostClick($event)',\n },\n template: `\n @if (loading()) {\n <span class=\"neu-button__spinner\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"31.416\"\n stroke-dashoffset=\"10\"\n />\n </svg>\n </span>\n }\n @if (hasIcon() && iconPosition() === 'left') {\n <neu-icon [name]=\"icon()\" [size]=\"iconSize()\" strokeWidth=\"2\" aria-hidden=\"true\" />\n }\n <ng-content />\n @if (hasIcon() && iconPosition() === 'right') {\n <neu-icon [name]=\"icon()\" [size]=\"iconSize()\" strokeWidth=\"2\" aria-hidden=\"true\" />\n }\n `,\n styleUrl: './neu-button.component.scss',\n})\nexport class NeuButtonComponent {\n /** Variante visual del botón / Visual button variant */\n variant = input<NeuButtonVariant>('primary');\n\n /** Tamaño del botón / Button size */\n size = input<NeuButtonSize>('md');\n\n /** Deshabilita el botón y bloquea la interacción / Disables the button and blocks interaction */\n disabled = input<boolean>(false);\n\n /** Muestra un spinner y deshabilita mientras se procesa / Shows a spinner and disables while processing */\n loading = input<boolean>(false);\n\n /** Ocupa el 100% del ancho de su contenedor / Takes up 100% of its container width */\n fullWidth = input<boolean>(false);\n\n /** Nombre del icono Lucide (ej: 'lucideSave', 'lucidePlus') / Lucide icon name (e.g. 'lucideSave', 'lucidePlus') */\n icon = input<string>('');\n\n /** Posición del icono respecto al texto */\n iconPosition = input<NeuButtonIconPosition>('left');\n\n /** Modo solo-icono: aplica padding cuadrado y oculta el ng-content / Icon-only mode: applies square padding and hides ng-content */\n iconOnly = input<boolean>(false);\n\n /** Etiqueta accesible obligatoria cuando se usa iconOnly (WCAG 4.1.2) / Required accessible label when using iconOnly (WCAG 4.1.2) */\n ariaLabel = input<string>('');\n\n /** Emite el evento de click cuando el botón está activo / Emits the click event when the button is active */\n neuClick = output<MouseEvent>();\n\n /** @internal — reenvía el click nativo al output Angular / forwards the native click to the Angular output */\n _onHostClick(event: MouseEvent): void {\n if (!this.isDisabled()) {\n this.neuClick.emit(event);\n }\n }\n\n readonly isDisabled = computed(() => this.disabled() || this.loading());\n readonly hasIcon = computed(() => !!this.icon());\n\n readonly iconSize = computed(() => {\n const map: Record<NeuButtonSize, string> = { sm: '14px', md: '16px', lg: '18px' };\n return map[this.size()];\n });\n\n readonly hostClasses = computed(() => ({\n 'neu-button': true,\n [`neu-button--${this.variant()}`]: true,\n [`neu-button--${this.size()}`]: true,\n 'neu-button--loading': this.loading(),\n 'neu-button--disabled': this.isDisabled(),\n 'neu-button--full-width': this.fullWidth(),\n 'neu-button--icon-only': this.iconOnly(),\n }));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,740 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, output, signal, viewChild, computed, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
|
|
3
|
+
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
4
|
+
import { NeuButtonComponent } from '@neural-ui/core/button';
|
|
5
|
+
|
|
6
|
+
const NEU_RICH_TEXT_ALLOWED_TAGS = new Set([
|
|
7
|
+
'a',
|
|
8
|
+
'b',
|
|
9
|
+
'blockquote',
|
|
10
|
+
'br',
|
|
11
|
+
'div',
|
|
12
|
+
'em',
|
|
13
|
+
'h1',
|
|
14
|
+
'h2',
|
|
15
|
+
'h3',
|
|
16
|
+
'h4',
|
|
17
|
+
'h5',
|
|
18
|
+
'h6',
|
|
19
|
+
'i',
|
|
20
|
+
'img',
|
|
21
|
+
'li',
|
|
22
|
+
'ol',
|
|
23
|
+
'p',
|
|
24
|
+
'span',
|
|
25
|
+
'strong',
|
|
26
|
+
'table',
|
|
27
|
+
'tbody',
|
|
28
|
+
'td',
|
|
29
|
+
'th',
|
|
30
|
+
'thead',
|
|
31
|
+
'tr',
|
|
32
|
+
'u',
|
|
33
|
+
'ul',
|
|
34
|
+
]);
|
|
35
|
+
const VOID_TAGS = new Set(['br', 'img']);
|
|
36
|
+
const BLOCKED_TAGS = 'script|style|iframe|object|embed|form|input|button|textarea|select|option|meta|link|svg|math';
|
|
37
|
+
function normalizeRichTextHtml(value) {
|
|
38
|
+
const clean = value.trim();
|
|
39
|
+
if (!clean) {
|
|
40
|
+
return '';
|
|
41
|
+
}
|
|
42
|
+
return hasHtmlTags(clean) ? sanitizeRichTextHtml(clean) : plainTextToRichTextHtml(clean);
|
|
43
|
+
}
|
|
44
|
+
function plainTextToRichTextHtml(value) {
|
|
45
|
+
return value
|
|
46
|
+
.trim()
|
|
47
|
+
.split(/\n{2,}/)
|
|
48
|
+
.map((paragraph) => `<p>${escapeRichTextHtml(paragraph).replace(/\n/g, '<br>')}</p>`)
|
|
49
|
+
.join('');
|
|
50
|
+
}
|
|
51
|
+
function sanitizeRichTextHtml(value) {
|
|
52
|
+
const blockedTagPattern = new RegExp(`<\\s*(?:${BLOCKED_TAGS})[\\s\\S]*?>[\\s\\S]*?<\\s*\\/\\s*(?:${BLOCKED_TAGS})\\s*>`, 'gi');
|
|
53
|
+
const blockedSingleTagPattern = new RegExp(`<\\s*\\/?\\s*(?:${BLOCKED_TAGS})[^>]*>`, 'gi');
|
|
54
|
+
const withoutDangerousContent = value
|
|
55
|
+
.replace(/<!--[\s\S]*?-->/g, '')
|
|
56
|
+
.replace(blockedTagPattern, '')
|
|
57
|
+
.replace(blockedSingleTagPattern, '')
|
|
58
|
+
.replace(/\s+on[a-z]+\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+)/gi, '')
|
|
59
|
+
.replace(/\s+style\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+)/gi, '');
|
|
60
|
+
return withoutDangerousContent
|
|
61
|
+
.replace(/<\/?([a-z][a-z0-9]*)([^>]*)>/gi, (match, tagName, rawAttributes) => {
|
|
62
|
+
const tag = tagName.toLowerCase();
|
|
63
|
+
const isClosing = /^<\s*\//.test(match);
|
|
64
|
+
if (!NEU_RICH_TEXT_ALLOWED_TAGS.has(tag)) {
|
|
65
|
+
return '';
|
|
66
|
+
}
|
|
67
|
+
if (isClosing) {
|
|
68
|
+
return VOID_TAGS.has(tag) ? '' : `</${tag}>`;
|
|
69
|
+
}
|
|
70
|
+
return `<${tag}${sanitizeAttributes(tag, rawAttributes || '')}>`;
|
|
71
|
+
})
|
|
72
|
+
.trim();
|
|
73
|
+
}
|
|
74
|
+
function escapeRichTextHtml(value) {
|
|
75
|
+
return value
|
|
76
|
+
.replaceAll('&', '&')
|
|
77
|
+
.replaceAll('<', '<')
|
|
78
|
+
.replaceAll('>', '>')
|
|
79
|
+
.replaceAll('"', '"')
|
|
80
|
+
.replaceAll("'", ''');
|
|
81
|
+
}
|
|
82
|
+
function escapeRichTextAttribute(value) {
|
|
83
|
+
return escapeRichTextHtml(value).replaceAll('`', '`');
|
|
84
|
+
}
|
|
85
|
+
function sanitizeAttributes(tag, rawAttributes) {
|
|
86
|
+
const attributes = new Map();
|
|
87
|
+
rawAttributes.replace(/([a-zA-Z:-]+)(?:\s*=\s*("([^"]*)"|'([^']*)'|([^\s"'>`]+)))?/g, (_match, rawName, _rawValue, doubleQuoted, singleQuoted, bareValue) => {
|
|
88
|
+
const name = rawName.toLowerCase();
|
|
89
|
+
const value = doubleQuoted ?? singleQuoted ?? bareValue ?? '';
|
|
90
|
+
if (name.startsWith('on') || name === 'style' || !isAllowedAttribute(tag, name)) {
|
|
91
|
+
return '';
|
|
92
|
+
}
|
|
93
|
+
if (tag === 'a' && name === 'href') {
|
|
94
|
+
if (isSafeHref(value)) {
|
|
95
|
+
attributes.set('href', value.trim());
|
|
96
|
+
attributes.set('target', '_blank');
|
|
97
|
+
attributes.set('rel', 'noopener noreferrer');
|
|
98
|
+
}
|
|
99
|
+
return '';
|
|
100
|
+
}
|
|
101
|
+
if (tag === 'img' && name === 'src') {
|
|
102
|
+
if (isSafeImageSource(value)) {
|
|
103
|
+
attributes.set('src', value.trim());
|
|
104
|
+
}
|
|
105
|
+
return '';
|
|
106
|
+
}
|
|
107
|
+
if ((name === 'width' || name === 'height') && !/^\d{1,4}$/.test(value.trim())) {
|
|
108
|
+
return '';
|
|
109
|
+
}
|
|
110
|
+
if (name === 'target' || name === 'rel') {
|
|
111
|
+
return '';
|
|
112
|
+
}
|
|
113
|
+
attributes.set(name, value.trim());
|
|
114
|
+
return '';
|
|
115
|
+
});
|
|
116
|
+
return Array.from(attributes.entries())
|
|
117
|
+
.filter(([, value]) => value.length > 0)
|
|
118
|
+
.map(([name, value]) => ` ${name}="${escapeRichTextAttribute(value)}"`)
|
|
119
|
+
.join('');
|
|
120
|
+
}
|
|
121
|
+
function isAllowedAttribute(tag, name) {
|
|
122
|
+
if (name === 'title') {
|
|
123
|
+
return true;
|
|
124
|
+
}
|
|
125
|
+
if (tag === 'a') {
|
|
126
|
+
return ['href', 'target', 'rel'].includes(name);
|
|
127
|
+
}
|
|
128
|
+
if (tag === 'img') {
|
|
129
|
+
return ['src', 'alt', 'width', 'height'].includes(name);
|
|
130
|
+
}
|
|
131
|
+
if (['td', 'th'].includes(tag)) {
|
|
132
|
+
return ['colspan', 'rowspan'].includes(name);
|
|
133
|
+
}
|
|
134
|
+
return false;
|
|
135
|
+
}
|
|
136
|
+
function hasHtmlTags(value) {
|
|
137
|
+
return /<\/?[a-z][\s\S]*>/i.test(value);
|
|
138
|
+
}
|
|
139
|
+
function isSafeHref(value) {
|
|
140
|
+
const clean = value.trim();
|
|
141
|
+
return /^{{[a-zA-Z0-9_. -]+}}$/.test(clean) || /^(https?:|mailto:|tel:)/i.test(clean);
|
|
142
|
+
}
|
|
143
|
+
function isSafeImageSource(value) {
|
|
144
|
+
const clean = value.trim();
|
|
145
|
+
if (/^https?:\/\//i.test(clean)) {
|
|
146
|
+
return true;
|
|
147
|
+
}
|
|
148
|
+
return (/^data:image\/(?:png|jpe?g|gif|webp);base64,[a-z0-9+/=\s]+$/i.test(clean) &&
|
|
149
|
+
clean.length <= 1_500_000);
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
const DEFAULT_RICH_TEXT_EDITOR_LABELS = {
|
|
153
|
+
toolbar: 'Rich text editor',
|
|
154
|
+
formatGroup: 'Text formatting',
|
|
155
|
+
listsGroup: 'Lists',
|
|
156
|
+
insertGroup: 'Insert',
|
|
157
|
+
clearGroup: 'Clear',
|
|
158
|
+
bold: 'Bold',
|
|
159
|
+
italic: 'Italic',
|
|
160
|
+
underline: 'Underline',
|
|
161
|
+
unorderedList: 'Bullet list',
|
|
162
|
+
orderedList: 'Numbered list',
|
|
163
|
+
addLink: 'Add link',
|
|
164
|
+
addImageUrl: 'Add image by URL',
|
|
165
|
+
clearFormat: 'Clear formatting',
|
|
166
|
+
linkUrlPrompt: 'Link URL',
|
|
167
|
+
linkTextPrompt: 'Link text',
|
|
168
|
+
imageUrlPrompt: 'Image URL',
|
|
169
|
+
imageAltPrompt: 'Alternative text',
|
|
170
|
+
imageAltFallback: 'Image',
|
|
171
|
+
pastedImageAlt: 'Pasted image',
|
|
172
|
+
};
|
|
173
|
+
let _neuRichTextEditorIdSeq = 0;
|
|
174
|
+
class NeuRichTextEditorComponent {
|
|
175
|
+
label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
176
|
+
placeholder = input('Write here...', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
177
|
+
hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
|
|
178
|
+
errorMessage = input('', ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
|
|
179
|
+
size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
180
|
+
minHeight = input('180px', ...(ngDevMode ? [{ debugName: "minHeight" }] : /* istanbul ignore next */ []));
|
|
181
|
+
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
182
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
183
|
+
/**
|
|
184
|
+
* @deprecated Use `labels.toolbar` instead.
|
|
185
|
+
*/
|
|
186
|
+
toolbarAriaLabel = input('', ...(ngDevMode ? [{ debugName: "toolbarAriaLabel" }] : /* istanbul ignore next */ []));
|
|
187
|
+
labels = input({}, ...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
|
|
188
|
+
variables = input([], ...(ngDevMode ? [{ debugName: "variables" }] : /* istanbul ignore next */ []));
|
|
189
|
+
variablesLabel = input('Variables', ...(ngDevMode ? [{ debugName: "variablesLabel" }] : /* istanbul ignore next */ []));
|
|
190
|
+
variablesAriaLabel = input('Available variables', ...(ngDevMode ? [{ debugName: "variablesAriaLabel" }] : /* istanbul ignore next */ []));
|
|
191
|
+
maxPastedImageBytes = input(1_500_000, ...(ngDevMode ? [{ debugName: "maxPastedImageBytes" }] : /* istanbul ignore next */ []));
|
|
192
|
+
showPreview = input(false, ...(ngDevMode ? [{ debugName: "showPreview" }] : /* istanbul ignore next */ []));
|
|
193
|
+
previewLabel = input('Preview', ...(ngDevMode ? [{ debugName: "previewLabel" }] : /* istanbul ignore next */ []));
|
|
194
|
+
editorId = input(`neu-rich-text-editor-${++_neuRichTextEditorIdSeq}`, ...(ngDevMode ? [{ debugName: "editorId" }] : /* istanbul ignore next */ []));
|
|
195
|
+
valueChange = output();
|
|
196
|
+
imageRejected = output();
|
|
197
|
+
value = signal('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
198
|
+
focused = signal(false, ...(ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []));
|
|
199
|
+
cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "cvaDisabled" }] : /* istanbul ignore next */ []));
|
|
200
|
+
editorRef = viewChild('editorRef', ...(ngDevMode ? [{ debugName: "editorRef" }] : /* istanbul ignore next */ []));
|
|
201
|
+
viewReady = false;
|
|
202
|
+
onChange = () => undefined;
|
|
203
|
+
onTouched = () => undefined;
|
|
204
|
+
isDisabledFinal = computed(() => this.disabled() || this.readonly() || this.cvaDisabled(), ...(ngDevMode ? [{ debugName: "isDisabledFinal" }] : /* istanbul ignore next */ []));
|
|
205
|
+
mergedLabels = computed(() => ({
|
|
206
|
+
...DEFAULT_RICH_TEXT_EDITOR_LABELS,
|
|
207
|
+
...(this.toolbarAriaLabel() ? { toolbar: this.toolbarAriaLabel() } : {}),
|
|
208
|
+
...this.labels(),
|
|
209
|
+
}), ...(ngDevMode ? [{ debugName: "mergedLabels" }] : /* istanbul ignore next */ []));
|
|
210
|
+
hasError = computed(() => !!this.errorMessage(), ...(ngDevMode ? [{ debugName: "hasError" }] : /* istanbul ignore next */ []));
|
|
211
|
+
ariaDescribedBy = computed(() => {
|
|
212
|
+
if (this.hasError()) {
|
|
213
|
+
return `${this.editorId()}-error`;
|
|
214
|
+
}
|
|
215
|
+
return this.hint() ? `${this.editorId()}-hint` : null;
|
|
216
|
+
}, ...(ngDevMode ? [{ debugName: "ariaDescribedBy" }] : /* istanbul ignore next */ []));
|
|
217
|
+
ngAfterViewInit() {
|
|
218
|
+
this.viewReady = true;
|
|
219
|
+
this.renderValue(this.value());
|
|
220
|
+
}
|
|
221
|
+
writeValue(value) {
|
|
222
|
+
const html = normalizeRichTextHtml(value ?? '');
|
|
223
|
+
this.value.set(html);
|
|
224
|
+
this.renderValue(html);
|
|
225
|
+
}
|
|
226
|
+
registerOnChange(fn) {
|
|
227
|
+
this.onChange = fn;
|
|
228
|
+
}
|
|
229
|
+
registerOnTouched(fn) {
|
|
230
|
+
this.onTouched = fn;
|
|
231
|
+
}
|
|
232
|
+
setDisabledState(isDisabled) {
|
|
233
|
+
this.cvaDisabled.set(isDisabled);
|
|
234
|
+
}
|
|
235
|
+
format(command) {
|
|
236
|
+
if (this.isDisabledFinal())
|
|
237
|
+
return;
|
|
238
|
+
this.focus();
|
|
239
|
+
document.execCommand(command);
|
|
240
|
+
this.syncValueFromEditor();
|
|
241
|
+
}
|
|
242
|
+
addLink() {
|
|
243
|
+
if (this.isDisabledFinal())
|
|
244
|
+
return;
|
|
245
|
+
const url = window.prompt(this.mergedLabels().linkUrlPrompt);
|
|
246
|
+
if (!url)
|
|
247
|
+
return;
|
|
248
|
+
const text = window.prompt(this.mergedLabels().linkTextPrompt) || url;
|
|
249
|
+
this.insertHtml(`<a href="${escapeRichTextAttribute(url)}">${escapeRichTextHtml(text)}</a>`);
|
|
250
|
+
}
|
|
251
|
+
addImageUrl() {
|
|
252
|
+
if (this.isDisabledFinal())
|
|
253
|
+
return;
|
|
254
|
+
const url = window.prompt(this.mergedLabels().imageUrlPrompt);
|
|
255
|
+
if (!url)
|
|
256
|
+
return;
|
|
257
|
+
const alt = window.prompt(this.mergedLabels().imageAltPrompt) || this.mergedLabels().imageAltFallback;
|
|
258
|
+
this.insertHtml(`<img src="${escapeRichTextAttribute(url)}" alt="${escapeRichTextAttribute(alt)}">`);
|
|
259
|
+
}
|
|
260
|
+
insertVariable(variable) {
|
|
261
|
+
if (this.isDisabledFinal())
|
|
262
|
+
return;
|
|
263
|
+
this.insertHtml(escapeRichTextHtml(variable));
|
|
264
|
+
}
|
|
265
|
+
handleInput() {
|
|
266
|
+
this.syncValueFromEditor();
|
|
267
|
+
}
|
|
268
|
+
onFocus() {
|
|
269
|
+
this.focused.set(true);
|
|
270
|
+
}
|
|
271
|
+
onBlur() {
|
|
272
|
+
this.focused.set(false);
|
|
273
|
+
this.onTouched();
|
|
274
|
+
}
|
|
275
|
+
handlePaste(event) {
|
|
276
|
+
if (this.isDisabledFinal())
|
|
277
|
+
return;
|
|
278
|
+
const imageFile = Array.from(event.clipboardData?.files ?? []).find((file) => file.type.startsWith('image/'));
|
|
279
|
+
if (imageFile) {
|
|
280
|
+
event.preventDefault();
|
|
281
|
+
this.insertPastedImage(imageFile);
|
|
282
|
+
return;
|
|
283
|
+
}
|
|
284
|
+
const html = event.clipboardData?.getData('text/html');
|
|
285
|
+
if (html) {
|
|
286
|
+
event.preventDefault();
|
|
287
|
+
this.insertHtml(sanitizeRichTextHtml(html));
|
|
288
|
+
return;
|
|
289
|
+
}
|
|
290
|
+
const text = event.clipboardData?.getData('text/plain');
|
|
291
|
+
if (text) {
|
|
292
|
+
event.preventDefault();
|
|
293
|
+
this.insertHtml(plainTextToRichTextHtml(text));
|
|
294
|
+
}
|
|
295
|
+
}
|
|
296
|
+
insertPastedImage(file) {
|
|
297
|
+
const maxBytes = this.maxPastedImageBytes();
|
|
298
|
+
if (file.size > maxBytes) {
|
|
299
|
+
this.imageRejected.emit({ file, maxBytes, reason: 'size' });
|
|
300
|
+
return;
|
|
301
|
+
}
|
|
302
|
+
const reader = new FileReader();
|
|
303
|
+
reader.onload = () => {
|
|
304
|
+
const src = typeof reader.result === 'string' ? reader.result : '';
|
|
305
|
+
this.insertHtml(sanitizeRichTextHtml(`<img src="${escapeRichTextAttribute(src)}" alt="${escapeRichTextAttribute(this.mergedLabels().pastedImageAlt)}">`));
|
|
306
|
+
};
|
|
307
|
+
reader.readAsDataURL(file);
|
|
308
|
+
}
|
|
309
|
+
insertHtml(html) {
|
|
310
|
+
this.focus();
|
|
311
|
+
document.execCommand('insertHTML', false, sanitizeRichTextHtml(html));
|
|
312
|
+
this.syncValueFromEditor();
|
|
313
|
+
}
|
|
314
|
+
syncValueFromEditor() {
|
|
315
|
+
const html = sanitizeRichTextHtml(this.editorRef()?.nativeElement.innerHTML ?? '');
|
|
316
|
+
this.value.set(html);
|
|
317
|
+
this.onChange(html);
|
|
318
|
+
this.valueChange.emit(html);
|
|
319
|
+
}
|
|
320
|
+
focus() {
|
|
321
|
+
this.editorRef()?.nativeElement.focus();
|
|
322
|
+
}
|
|
323
|
+
renderValue(html) {
|
|
324
|
+
const editor = this.editorRef()?.nativeElement;
|
|
325
|
+
if (!this.viewReady || !editor)
|
|
326
|
+
return;
|
|
327
|
+
if (editor.innerHTML !== html) {
|
|
328
|
+
editor.innerHTML = html;
|
|
329
|
+
}
|
|
330
|
+
}
|
|
331
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuRichTextEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
332
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NeuRichTextEditorComponent, isStandalone: true, selector: "neu-rich-text-editor", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, toolbarAriaLabel: { classPropertyName: "toolbarAriaLabel", publicName: "toolbarAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, variables: { classPropertyName: "variables", publicName: "variables", isSignal: true, isRequired: false, transformFunction: null }, variablesLabel: { classPropertyName: "variablesLabel", publicName: "variablesLabel", isSignal: true, isRequired: false, transformFunction: null }, variablesAriaLabel: { classPropertyName: "variablesAriaLabel", publicName: "variablesAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, maxPastedImageBytes: { classPropertyName: "maxPastedImageBytes", publicName: "maxPastedImageBytes", isSignal: true, isRequired: false, transformFunction: null }, showPreview: { classPropertyName: "showPreview", publicName: "showPreview", isSignal: true, isRequired: false, transformFunction: null }, previewLabel: { classPropertyName: "previewLabel", publicName: "previewLabel", isSignal: true, isRequired: false, transformFunction: null }, editorId: { classPropertyName: "editorId", publicName: "editorId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", imageRejected: "imageRejected" }, host: { properties: { "class.neu-rich-text-editor-host--sm": "size() === \"sm\"", "class.neu-rich-text-editor-host--lg": "size() === \"lg\"" }, classAttribute: "neu-rich-text-editor-host" }, providers: [
|
|
333
|
+
{
|
|
334
|
+
provide: NG_VALUE_ACCESSOR,
|
|
335
|
+
useExisting: forwardRef(() => NeuRichTextEditorComponent),
|
|
336
|
+
multi: true,
|
|
337
|
+
},
|
|
338
|
+
], viewQueries: [{ propertyName: "editorRef", first: true, predicate: ["editorRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
339
|
+
<div class="neu-rich-text-editor" [class.neu-rich-text-editor--disabled]="isDisabledFinal()">
|
|
340
|
+
@if (label()) {
|
|
341
|
+
<label class="neu-rich-text-editor__label" [for]="editorId()">{{ label() }}</label>
|
|
342
|
+
}
|
|
343
|
+
|
|
344
|
+
<div
|
|
345
|
+
class="neu-rich-text-editor__frame"
|
|
346
|
+
[class.neu-rich-text-editor__frame--focused]="focused()"
|
|
347
|
+
[class.neu-rich-text-editor__frame--error]="hasError()"
|
|
348
|
+
>
|
|
349
|
+
<div
|
|
350
|
+
class="neu-rich-text-editor__toolbar"
|
|
351
|
+
role="toolbar"
|
|
352
|
+
[attr.aria-label]="mergedLabels().toolbar"
|
|
353
|
+
>
|
|
354
|
+
<div
|
|
355
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
356
|
+
role="group"
|
|
357
|
+
[attr.aria-label]="mergedLabels().formatGroup"
|
|
358
|
+
>
|
|
359
|
+
<button
|
|
360
|
+
neu-button
|
|
361
|
+
type="button"
|
|
362
|
+
variant="ghost"
|
|
363
|
+
size="sm"
|
|
364
|
+
icon="lucideBold"
|
|
365
|
+
[iconOnly]="true"
|
|
366
|
+
[ariaLabel]="mergedLabels().bold"
|
|
367
|
+
[title]="mergedLabels().bold"
|
|
368
|
+
[disabled]="isDisabledFinal()"
|
|
369
|
+
(click)="format('bold')"
|
|
370
|
+
></button>
|
|
371
|
+
<button
|
|
372
|
+
neu-button
|
|
373
|
+
type="button"
|
|
374
|
+
variant="ghost"
|
|
375
|
+
size="sm"
|
|
376
|
+
icon="lucideItalic"
|
|
377
|
+
[iconOnly]="true"
|
|
378
|
+
[ariaLabel]="mergedLabels().italic"
|
|
379
|
+
[title]="mergedLabels().italic"
|
|
380
|
+
[disabled]="isDisabledFinal()"
|
|
381
|
+
(click)="format('italic')"
|
|
382
|
+
></button>
|
|
383
|
+
<button
|
|
384
|
+
neu-button
|
|
385
|
+
type="button"
|
|
386
|
+
variant="ghost"
|
|
387
|
+
size="sm"
|
|
388
|
+
icon="lucideUnderline"
|
|
389
|
+
[iconOnly]="true"
|
|
390
|
+
[ariaLabel]="mergedLabels().underline"
|
|
391
|
+
[title]="mergedLabels().underline"
|
|
392
|
+
[disabled]="isDisabledFinal()"
|
|
393
|
+
(click)="format('underline')"
|
|
394
|
+
></button>
|
|
395
|
+
</div>
|
|
396
|
+
|
|
397
|
+
<div
|
|
398
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
399
|
+
role="group"
|
|
400
|
+
[attr.aria-label]="mergedLabels().listsGroup"
|
|
401
|
+
>
|
|
402
|
+
<button
|
|
403
|
+
neu-button
|
|
404
|
+
type="button"
|
|
405
|
+
variant="ghost"
|
|
406
|
+
size="sm"
|
|
407
|
+
icon="lucideList"
|
|
408
|
+
[iconOnly]="true"
|
|
409
|
+
[ariaLabel]="mergedLabels().unorderedList"
|
|
410
|
+
[title]="mergedLabels().unorderedList"
|
|
411
|
+
[disabled]="isDisabledFinal()"
|
|
412
|
+
(click)="format('insertUnorderedList')"
|
|
413
|
+
></button>
|
|
414
|
+
<button
|
|
415
|
+
neu-button
|
|
416
|
+
type="button"
|
|
417
|
+
variant="ghost"
|
|
418
|
+
size="sm"
|
|
419
|
+
icon="lucideListOrdered"
|
|
420
|
+
[iconOnly]="true"
|
|
421
|
+
[ariaLabel]="mergedLabels().orderedList"
|
|
422
|
+
[title]="mergedLabels().orderedList"
|
|
423
|
+
[disabled]="isDisabledFinal()"
|
|
424
|
+
(click)="format('insertOrderedList')"
|
|
425
|
+
></button>
|
|
426
|
+
</div>
|
|
427
|
+
|
|
428
|
+
<div
|
|
429
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
430
|
+
role="group"
|
|
431
|
+
[attr.aria-label]="mergedLabels().insertGroup"
|
|
432
|
+
>
|
|
433
|
+
<button
|
|
434
|
+
neu-button
|
|
435
|
+
type="button"
|
|
436
|
+
variant="ghost"
|
|
437
|
+
size="sm"
|
|
438
|
+
icon="lucideLink"
|
|
439
|
+
[iconOnly]="true"
|
|
440
|
+
[ariaLabel]="mergedLabels().addLink"
|
|
441
|
+
[title]="mergedLabels().addLink"
|
|
442
|
+
[disabled]="isDisabledFinal()"
|
|
443
|
+
(click)="addLink()"
|
|
444
|
+
></button>
|
|
445
|
+
<button
|
|
446
|
+
neu-button
|
|
447
|
+
type="button"
|
|
448
|
+
variant="ghost"
|
|
449
|
+
size="sm"
|
|
450
|
+
icon="lucideImage"
|
|
451
|
+
[iconOnly]="true"
|
|
452
|
+
[ariaLabel]="mergedLabels().addImageUrl"
|
|
453
|
+
[title]="mergedLabels().addImageUrl"
|
|
454
|
+
[disabled]="isDisabledFinal()"
|
|
455
|
+
(click)="addImageUrl()"
|
|
456
|
+
></button>
|
|
457
|
+
</div>
|
|
458
|
+
|
|
459
|
+
<div
|
|
460
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
461
|
+
role="group"
|
|
462
|
+
[attr.aria-label]="mergedLabels().clearGroup"
|
|
463
|
+
>
|
|
464
|
+
<button
|
|
465
|
+
neu-button
|
|
466
|
+
type="button"
|
|
467
|
+
variant="ghost"
|
|
468
|
+
size="sm"
|
|
469
|
+
icon="lucideEraser"
|
|
470
|
+
[iconOnly]="true"
|
|
471
|
+
[ariaLabel]="mergedLabels().clearFormat"
|
|
472
|
+
[title]="mergedLabels().clearFormat"
|
|
473
|
+
[disabled]="isDisabledFinal()"
|
|
474
|
+
(click)="format('removeFormat')"
|
|
475
|
+
></button>
|
|
476
|
+
</div>
|
|
477
|
+
</div>
|
|
478
|
+
|
|
479
|
+
@if (variables().length) {
|
|
480
|
+
<div class="neu-rich-text-editor__variables" [attr.aria-label]="variablesAriaLabel()">
|
|
481
|
+
<span class="neu-rich-text-editor__variables-label">{{ variablesLabel() }}</span>
|
|
482
|
+
@for (variable of variables(); track variable) {
|
|
483
|
+
<button
|
|
484
|
+
class="neu-rich-text-editor__variable"
|
|
485
|
+
type="button"
|
|
486
|
+
[disabled]="isDisabledFinal()"
|
|
487
|
+
(click)="insertVariable(variable)"
|
|
488
|
+
>
|
|
489
|
+
{{ variable }}
|
|
490
|
+
</button>
|
|
491
|
+
}
|
|
492
|
+
</div>
|
|
493
|
+
}
|
|
494
|
+
|
|
495
|
+
<div
|
|
496
|
+
#editorRef
|
|
497
|
+
class="neu-rich-text-editor__surface"
|
|
498
|
+
role="textbox"
|
|
499
|
+
aria-multiline="true"
|
|
500
|
+
[id]="editorId()"
|
|
501
|
+
[attr.contenteditable]="isDisabledFinal() ? 'false' : 'true'"
|
|
502
|
+
[attr.data-placeholder]="placeholder()"
|
|
503
|
+
[attr.aria-describedby]="ariaDescribedBy()"
|
|
504
|
+
[attr.aria-invalid]="hasError() ? 'true' : null"
|
|
505
|
+
[style.min-height]="minHeight()"
|
|
506
|
+
(input)="handleInput()"
|
|
507
|
+
(focus)="onFocus()"
|
|
508
|
+
(blur)="onBlur()"
|
|
509
|
+
(paste)="handlePaste($event)"
|
|
510
|
+
></div>
|
|
511
|
+
</div>
|
|
512
|
+
|
|
513
|
+
@if (hasError()) {
|
|
514
|
+
<p class="neu-rich-text-editor__error" [id]="editorId() + '-error'" role="alert">
|
|
515
|
+
{{ errorMessage() }}
|
|
516
|
+
</p>
|
|
517
|
+
} @else if (hint()) {
|
|
518
|
+
<p class="neu-rich-text-editor__hint" [id]="editorId() + '-hint'">{{ hint() }}</p>
|
|
519
|
+
}
|
|
520
|
+
|
|
521
|
+
@if (showPreview() && value()) {
|
|
522
|
+
<details class="neu-rich-text-editor__preview">
|
|
523
|
+
<summary>{{ previewLabel() }}</summary>
|
|
524
|
+
<div class="neu-rich-text-editor__preview-content" [innerHTML]="value()"></div>
|
|
525
|
+
</details>
|
|
526
|
+
}
|
|
527
|
+
</div>
|
|
528
|
+
`, isInline: true, styles: [".neu-rich-text-editor-host{display:block;font-family:var(--neu-font-sans)}.neu-rich-text-editor{display:grid;gap:var(--neu-space-2, .5rem);color:var(--neu-text)}.neu-rich-text-editor__label{color:var(--neu-text);font-size:var(--neu-text-sm);font-weight:700;line-height:1.2}.neu-rich-text-editor__frame{overflow:hidden;background:var(--neu-surface);border:1px solid var(--neu-border);border-radius:var(--neu-radius-lg, .75rem);box-shadow:var(--neu-shadow-sm, 0 1px 2px rgba(15, 23, 42, .08));transition:border-color var(--neu-transition),box-shadow var(--neu-transition),background-color var(--neu-transition)}.neu-rich-text-editor__frame--focused{border-color:var(--neu-border-focus, var(--neu-primary));box-shadow:var(--neu-focus-ring, 0 0 0 3px rgba(0, 176, 160, .18))}.neu-rich-text-editor__frame--error{border-color:var(--neu-error)}.neu-rich-text-editor__toolbar{display:flex;flex-wrap:wrap;gap:var(--neu-space-2, .5rem);align-items:center;min-height:46px;padding:var(--neu-space-2, .5rem);background:var(--neu-surface-2, #f8fafc);border-bottom:1px solid var(--neu-border)}.neu-rich-text-editor__toolbar-group{display:inline-flex;align-items:center;gap:2px;padding:2px;background:var(--neu-surface);border:1px solid var(--neu-border);border-radius:var(--neu-radius, .5rem)}.neu-rich-text-editor__toolbar .neu-button--ghost{color:var(--neu-text-muted)}.neu-rich-text-editor__toolbar .neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){color:var(--neu-text);background:var(--neu-primary-50, rgba(0, 176, 160, .1))}.neu-rich-text-editor__variables{display:flex;flex-wrap:wrap;gap:var(--neu-space-2, .5rem);align-items:center;padding:var(--neu-space-2, .5rem) var(--neu-space-3, .75rem);background:var(--neu-surface);border-bottom:1px solid var(--neu-border)}.neu-rich-text-editor__variables-label{color:var(--neu-text-muted);font-size:var(--neu-text-xs, .75rem);font-weight:700}.neu-rich-text-editor__variable{min-height:28px;padding:0 var(--neu-space-2, .5rem);color:var(--neu-primary-dark, var(--neu-primary));font:inherit;font-size:var(--neu-text-xs, .75rem);font-weight:700;cursor:pointer;background:var(--neu-primary-50, rgba(0, 176, 160, .1));border:1px solid var(--neu-primary-100, rgba(0, 176, 160, .22));border-radius:var(--neu-radius-full, 999px)}.neu-rich-text-editor__variable:hover:not(:disabled){background:var(--neu-primary-100, rgba(0, 176, 160, .18))}.neu-rich-text-editor__surface{min-height:180px;max-height:min(60vh,560px);padding:var(--neu-space-4, 1rem);overflow:auto;color:var(--neu-text);font-size:var(--neu-text-base, 1rem);line-height:1.55;background:var(--neu-surface);outline:none;-webkit-overflow-scrolling:touch}.neu-rich-text-editor-host--sm .neu-rich-text-editor__surface{min-height:140px;padding:var(--neu-space-3, .75rem);font-size:var(--neu-text-sm, .875rem)}.neu-rich-text-editor-host--lg .neu-rich-text-editor__surface{min-height:240px;padding:var(--neu-space-5, 1.25rem);font-size:var(--neu-text-lg, 1.125rem)}.neu-rich-text-editor__surface:empty:before{color:var(--neu-text-muted);pointer-events:none;content:attr(data-placeholder)}.neu-rich-text-editor__surface :where(p,ul,ol,blockquote,table){margin:0 0 .85em}.neu-rich-text-editor__surface :where(p:last-child,ul:last-child,ol:last-child,blockquote:last-child){margin-bottom:0}.neu-rich-text-editor__surface :where(ul,ol){padding-left:1.4rem}.neu-rich-text-editor__surface :where(a){color:var(--neu-primary-dark, var(--neu-primary));text-decoration:underline;text-underline-offset:2px}.neu-rich-text-editor__surface :where(img){max-width:100%;height:auto;border-radius:var(--neu-radius-sm, .375rem)}.neu-rich-text-editor__surface :where(blockquote){padding-left:var(--neu-space-4, 1rem);color:var(--neu-text-muted);border-left:3px solid var(--neu-primary-100, rgba(0, 176, 160, .22))}.neu-rich-text-editor__surface :where(table){width:100%;border-collapse:collapse}.neu-rich-text-editor__surface :where(td,th){padding:.45rem;border:1px solid var(--neu-border)}.neu-rich-text-editor__hint,.neu-rich-text-editor__error{margin:0;font-size:var(--neu-text-xs, .75rem);line-height:1.45}.neu-rich-text-editor__hint{color:var(--neu-text-muted)}.neu-rich-text-editor__error{color:var(--neu-error);font-weight:600}.neu-rich-text-editor__preview{padding:var(--neu-space-3, .75rem);background:var(--neu-surface-2, #f8fafc);border:1px solid var(--neu-border);border-radius:var(--neu-radius, .5rem)}.neu-rich-text-editor__preview summary{cursor:pointer;color:var(--neu-text);font-weight:700}.neu-rich-text-editor__preview-content{margin-top:var(--neu-space-3, .75rem)}.neu-rich-text-editor--disabled{opacity:.72}.neu-rich-text-editor--disabled .neu-rich-text-editor__surface{cursor:not-allowed;background:var(--neu-surface-2, #f8fafc)}\n"], dependencies: [{ kind: "component", type: NeuButtonComponent, selector: "button[neu-button]", inputs: ["variant", "size", "disabled", "loading", "fullWidth", "icon", "iconPosition", "iconOnly", "ariaLabel"], outputs: ["neuClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
529
|
+
}
|
|
530
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuRichTextEditorComponent, decorators: [{
|
|
531
|
+
type: Component,
|
|
532
|
+
args: [{ selector: 'neu-rich-text-editor', imports: [NeuButtonComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
533
|
+
class: 'neu-rich-text-editor-host',
|
|
534
|
+
'[class.neu-rich-text-editor-host--sm]': 'size() === "sm"',
|
|
535
|
+
'[class.neu-rich-text-editor-host--lg]': 'size() === "lg"',
|
|
536
|
+
}, providers: [
|
|
537
|
+
{
|
|
538
|
+
provide: NG_VALUE_ACCESSOR,
|
|
539
|
+
useExisting: forwardRef(() => NeuRichTextEditorComponent),
|
|
540
|
+
multi: true,
|
|
541
|
+
},
|
|
542
|
+
], template: `
|
|
543
|
+
<div class="neu-rich-text-editor" [class.neu-rich-text-editor--disabled]="isDisabledFinal()">
|
|
544
|
+
@if (label()) {
|
|
545
|
+
<label class="neu-rich-text-editor__label" [for]="editorId()">{{ label() }}</label>
|
|
546
|
+
}
|
|
547
|
+
|
|
548
|
+
<div
|
|
549
|
+
class="neu-rich-text-editor__frame"
|
|
550
|
+
[class.neu-rich-text-editor__frame--focused]="focused()"
|
|
551
|
+
[class.neu-rich-text-editor__frame--error]="hasError()"
|
|
552
|
+
>
|
|
553
|
+
<div
|
|
554
|
+
class="neu-rich-text-editor__toolbar"
|
|
555
|
+
role="toolbar"
|
|
556
|
+
[attr.aria-label]="mergedLabels().toolbar"
|
|
557
|
+
>
|
|
558
|
+
<div
|
|
559
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
560
|
+
role="group"
|
|
561
|
+
[attr.aria-label]="mergedLabels().formatGroup"
|
|
562
|
+
>
|
|
563
|
+
<button
|
|
564
|
+
neu-button
|
|
565
|
+
type="button"
|
|
566
|
+
variant="ghost"
|
|
567
|
+
size="sm"
|
|
568
|
+
icon="lucideBold"
|
|
569
|
+
[iconOnly]="true"
|
|
570
|
+
[ariaLabel]="mergedLabels().bold"
|
|
571
|
+
[title]="mergedLabels().bold"
|
|
572
|
+
[disabled]="isDisabledFinal()"
|
|
573
|
+
(click)="format('bold')"
|
|
574
|
+
></button>
|
|
575
|
+
<button
|
|
576
|
+
neu-button
|
|
577
|
+
type="button"
|
|
578
|
+
variant="ghost"
|
|
579
|
+
size="sm"
|
|
580
|
+
icon="lucideItalic"
|
|
581
|
+
[iconOnly]="true"
|
|
582
|
+
[ariaLabel]="mergedLabels().italic"
|
|
583
|
+
[title]="mergedLabels().italic"
|
|
584
|
+
[disabled]="isDisabledFinal()"
|
|
585
|
+
(click)="format('italic')"
|
|
586
|
+
></button>
|
|
587
|
+
<button
|
|
588
|
+
neu-button
|
|
589
|
+
type="button"
|
|
590
|
+
variant="ghost"
|
|
591
|
+
size="sm"
|
|
592
|
+
icon="lucideUnderline"
|
|
593
|
+
[iconOnly]="true"
|
|
594
|
+
[ariaLabel]="mergedLabels().underline"
|
|
595
|
+
[title]="mergedLabels().underline"
|
|
596
|
+
[disabled]="isDisabledFinal()"
|
|
597
|
+
(click)="format('underline')"
|
|
598
|
+
></button>
|
|
599
|
+
</div>
|
|
600
|
+
|
|
601
|
+
<div
|
|
602
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
603
|
+
role="group"
|
|
604
|
+
[attr.aria-label]="mergedLabels().listsGroup"
|
|
605
|
+
>
|
|
606
|
+
<button
|
|
607
|
+
neu-button
|
|
608
|
+
type="button"
|
|
609
|
+
variant="ghost"
|
|
610
|
+
size="sm"
|
|
611
|
+
icon="lucideList"
|
|
612
|
+
[iconOnly]="true"
|
|
613
|
+
[ariaLabel]="mergedLabels().unorderedList"
|
|
614
|
+
[title]="mergedLabels().unorderedList"
|
|
615
|
+
[disabled]="isDisabledFinal()"
|
|
616
|
+
(click)="format('insertUnorderedList')"
|
|
617
|
+
></button>
|
|
618
|
+
<button
|
|
619
|
+
neu-button
|
|
620
|
+
type="button"
|
|
621
|
+
variant="ghost"
|
|
622
|
+
size="sm"
|
|
623
|
+
icon="lucideListOrdered"
|
|
624
|
+
[iconOnly]="true"
|
|
625
|
+
[ariaLabel]="mergedLabels().orderedList"
|
|
626
|
+
[title]="mergedLabels().orderedList"
|
|
627
|
+
[disabled]="isDisabledFinal()"
|
|
628
|
+
(click)="format('insertOrderedList')"
|
|
629
|
+
></button>
|
|
630
|
+
</div>
|
|
631
|
+
|
|
632
|
+
<div
|
|
633
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
634
|
+
role="group"
|
|
635
|
+
[attr.aria-label]="mergedLabels().insertGroup"
|
|
636
|
+
>
|
|
637
|
+
<button
|
|
638
|
+
neu-button
|
|
639
|
+
type="button"
|
|
640
|
+
variant="ghost"
|
|
641
|
+
size="sm"
|
|
642
|
+
icon="lucideLink"
|
|
643
|
+
[iconOnly]="true"
|
|
644
|
+
[ariaLabel]="mergedLabels().addLink"
|
|
645
|
+
[title]="mergedLabels().addLink"
|
|
646
|
+
[disabled]="isDisabledFinal()"
|
|
647
|
+
(click)="addLink()"
|
|
648
|
+
></button>
|
|
649
|
+
<button
|
|
650
|
+
neu-button
|
|
651
|
+
type="button"
|
|
652
|
+
variant="ghost"
|
|
653
|
+
size="sm"
|
|
654
|
+
icon="lucideImage"
|
|
655
|
+
[iconOnly]="true"
|
|
656
|
+
[ariaLabel]="mergedLabels().addImageUrl"
|
|
657
|
+
[title]="mergedLabels().addImageUrl"
|
|
658
|
+
[disabled]="isDisabledFinal()"
|
|
659
|
+
(click)="addImageUrl()"
|
|
660
|
+
></button>
|
|
661
|
+
</div>
|
|
662
|
+
|
|
663
|
+
<div
|
|
664
|
+
class="neu-rich-text-editor__toolbar-group"
|
|
665
|
+
role="group"
|
|
666
|
+
[attr.aria-label]="mergedLabels().clearGroup"
|
|
667
|
+
>
|
|
668
|
+
<button
|
|
669
|
+
neu-button
|
|
670
|
+
type="button"
|
|
671
|
+
variant="ghost"
|
|
672
|
+
size="sm"
|
|
673
|
+
icon="lucideEraser"
|
|
674
|
+
[iconOnly]="true"
|
|
675
|
+
[ariaLabel]="mergedLabels().clearFormat"
|
|
676
|
+
[title]="mergedLabels().clearFormat"
|
|
677
|
+
[disabled]="isDisabledFinal()"
|
|
678
|
+
(click)="format('removeFormat')"
|
|
679
|
+
></button>
|
|
680
|
+
</div>
|
|
681
|
+
</div>
|
|
682
|
+
|
|
683
|
+
@if (variables().length) {
|
|
684
|
+
<div class="neu-rich-text-editor__variables" [attr.aria-label]="variablesAriaLabel()">
|
|
685
|
+
<span class="neu-rich-text-editor__variables-label">{{ variablesLabel() }}</span>
|
|
686
|
+
@for (variable of variables(); track variable) {
|
|
687
|
+
<button
|
|
688
|
+
class="neu-rich-text-editor__variable"
|
|
689
|
+
type="button"
|
|
690
|
+
[disabled]="isDisabledFinal()"
|
|
691
|
+
(click)="insertVariable(variable)"
|
|
692
|
+
>
|
|
693
|
+
{{ variable }}
|
|
694
|
+
</button>
|
|
695
|
+
}
|
|
696
|
+
</div>
|
|
697
|
+
}
|
|
698
|
+
|
|
699
|
+
<div
|
|
700
|
+
#editorRef
|
|
701
|
+
class="neu-rich-text-editor__surface"
|
|
702
|
+
role="textbox"
|
|
703
|
+
aria-multiline="true"
|
|
704
|
+
[id]="editorId()"
|
|
705
|
+
[attr.contenteditable]="isDisabledFinal() ? 'false' : 'true'"
|
|
706
|
+
[attr.data-placeholder]="placeholder()"
|
|
707
|
+
[attr.aria-describedby]="ariaDescribedBy()"
|
|
708
|
+
[attr.aria-invalid]="hasError() ? 'true' : null"
|
|
709
|
+
[style.min-height]="minHeight()"
|
|
710
|
+
(input)="handleInput()"
|
|
711
|
+
(focus)="onFocus()"
|
|
712
|
+
(blur)="onBlur()"
|
|
713
|
+
(paste)="handlePaste($event)"
|
|
714
|
+
></div>
|
|
715
|
+
</div>
|
|
716
|
+
|
|
717
|
+
@if (hasError()) {
|
|
718
|
+
<p class="neu-rich-text-editor__error" [id]="editorId() + '-error'" role="alert">
|
|
719
|
+
{{ errorMessage() }}
|
|
720
|
+
</p>
|
|
721
|
+
} @else if (hint()) {
|
|
722
|
+
<p class="neu-rich-text-editor__hint" [id]="editorId() + '-hint'">{{ hint() }}</p>
|
|
723
|
+
}
|
|
724
|
+
|
|
725
|
+
@if (showPreview() && value()) {
|
|
726
|
+
<details class="neu-rich-text-editor__preview">
|
|
727
|
+
<summary>{{ previewLabel() }}</summary>
|
|
728
|
+
<div class="neu-rich-text-editor__preview-content" [innerHTML]="value()"></div>
|
|
729
|
+
</details>
|
|
730
|
+
}
|
|
731
|
+
</div>
|
|
732
|
+
`, styles: [".neu-rich-text-editor-host{display:block;font-family:var(--neu-font-sans)}.neu-rich-text-editor{display:grid;gap:var(--neu-space-2, .5rem);color:var(--neu-text)}.neu-rich-text-editor__label{color:var(--neu-text);font-size:var(--neu-text-sm);font-weight:700;line-height:1.2}.neu-rich-text-editor__frame{overflow:hidden;background:var(--neu-surface);border:1px solid var(--neu-border);border-radius:var(--neu-radius-lg, .75rem);box-shadow:var(--neu-shadow-sm, 0 1px 2px rgba(15, 23, 42, .08));transition:border-color var(--neu-transition),box-shadow var(--neu-transition),background-color var(--neu-transition)}.neu-rich-text-editor__frame--focused{border-color:var(--neu-border-focus, var(--neu-primary));box-shadow:var(--neu-focus-ring, 0 0 0 3px rgba(0, 176, 160, .18))}.neu-rich-text-editor__frame--error{border-color:var(--neu-error)}.neu-rich-text-editor__toolbar{display:flex;flex-wrap:wrap;gap:var(--neu-space-2, .5rem);align-items:center;min-height:46px;padding:var(--neu-space-2, .5rem);background:var(--neu-surface-2, #f8fafc);border-bottom:1px solid var(--neu-border)}.neu-rich-text-editor__toolbar-group{display:inline-flex;align-items:center;gap:2px;padding:2px;background:var(--neu-surface);border:1px solid var(--neu-border);border-radius:var(--neu-radius, .5rem)}.neu-rich-text-editor__toolbar .neu-button--ghost{color:var(--neu-text-muted)}.neu-rich-text-editor__toolbar .neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){color:var(--neu-text);background:var(--neu-primary-50, rgba(0, 176, 160, .1))}.neu-rich-text-editor__variables{display:flex;flex-wrap:wrap;gap:var(--neu-space-2, .5rem);align-items:center;padding:var(--neu-space-2, .5rem) var(--neu-space-3, .75rem);background:var(--neu-surface);border-bottom:1px solid var(--neu-border)}.neu-rich-text-editor__variables-label{color:var(--neu-text-muted);font-size:var(--neu-text-xs, .75rem);font-weight:700}.neu-rich-text-editor__variable{min-height:28px;padding:0 var(--neu-space-2, .5rem);color:var(--neu-primary-dark, var(--neu-primary));font:inherit;font-size:var(--neu-text-xs, .75rem);font-weight:700;cursor:pointer;background:var(--neu-primary-50, rgba(0, 176, 160, .1));border:1px solid var(--neu-primary-100, rgba(0, 176, 160, .22));border-radius:var(--neu-radius-full, 999px)}.neu-rich-text-editor__variable:hover:not(:disabled){background:var(--neu-primary-100, rgba(0, 176, 160, .18))}.neu-rich-text-editor__surface{min-height:180px;max-height:min(60vh,560px);padding:var(--neu-space-4, 1rem);overflow:auto;color:var(--neu-text);font-size:var(--neu-text-base, 1rem);line-height:1.55;background:var(--neu-surface);outline:none;-webkit-overflow-scrolling:touch}.neu-rich-text-editor-host--sm .neu-rich-text-editor__surface{min-height:140px;padding:var(--neu-space-3, .75rem);font-size:var(--neu-text-sm, .875rem)}.neu-rich-text-editor-host--lg .neu-rich-text-editor__surface{min-height:240px;padding:var(--neu-space-5, 1.25rem);font-size:var(--neu-text-lg, 1.125rem)}.neu-rich-text-editor__surface:empty:before{color:var(--neu-text-muted);pointer-events:none;content:attr(data-placeholder)}.neu-rich-text-editor__surface :where(p,ul,ol,blockquote,table){margin:0 0 .85em}.neu-rich-text-editor__surface :where(p:last-child,ul:last-child,ol:last-child,blockquote:last-child){margin-bottom:0}.neu-rich-text-editor__surface :where(ul,ol){padding-left:1.4rem}.neu-rich-text-editor__surface :where(a){color:var(--neu-primary-dark, var(--neu-primary));text-decoration:underline;text-underline-offset:2px}.neu-rich-text-editor__surface :where(img){max-width:100%;height:auto;border-radius:var(--neu-radius-sm, .375rem)}.neu-rich-text-editor__surface :where(blockquote){padding-left:var(--neu-space-4, 1rem);color:var(--neu-text-muted);border-left:3px solid var(--neu-primary-100, rgba(0, 176, 160, .22))}.neu-rich-text-editor__surface :where(table){width:100%;border-collapse:collapse}.neu-rich-text-editor__surface :where(td,th){padding:.45rem;border:1px solid var(--neu-border)}.neu-rich-text-editor__hint,.neu-rich-text-editor__error{margin:0;font-size:var(--neu-text-xs, .75rem);line-height:1.45}.neu-rich-text-editor__hint{color:var(--neu-text-muted)}.neu-rich-text-editor__error{color:var(--neu-error);font-weight:600}.neu-rich-text-editor__preview{padding:var(--neu-space-3, .75rem);background:var(--neu-surface-2, #f8fafc);border:1px solid var(--neu-border);border-radius:var(--neu-radius, .5rem)}.neu-rich-text-editor__preview summary{cursor:pointer;color:var(--neu-text);font-weight:700}.neu-rich-text-editor__preview-content{margin-top:var(--neu-space-3, .75rem)}.neu-rich-text-editor--disabled{opacity:.72}.neu-rich-text-editor--disabled .neu-rich-text-editor__surface{cursor:not-allowed;background:var(--neu-surface-2, #f8fafc)}\n"] }]
|
|
733
|
+
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], toolbarAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolbarAriaLabel", required: false }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }], variables: [{ type: i0.Input, args: [{ isSignal: true, alias: "variables", required: false }] }], variablesLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "variablesLabel", required: false }] }], variablesAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "variablesAriaLabel", required: false }] }], maxPastedImageBytes: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxPastedImageBytes", required: false }] }], showPreview: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPreview", required: false }] }], previewLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "previewLabel", required: false }] }], editorId: [{ type: i0.Input, args: [{ isSignal: true, alias: "editorId", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], imageRejected: [{ type: i0.Output, args: ["imageRejected"] }], editorRef: [{ type: i0.ViewChild, args: ['editorRef', { isSignal: true }] }] } });
|
|
734
|
+
|
|
735
|
+
/**
|
|
736
|
+
* Generated bundle index. Do not edit.
|
|
737
|
+
*/
|
|
738
|
+
|
|
739
|
+
export { NEU_RICH_TEXT_ALLOWED_TAGS, NeuRichTextEditorComponent, escapeRichTextAttribute, escapeRichTextHtml, normalizeRichTextHtml, plainTextToRichTextHtml, sanitizeRichTextHtml };
|
|
740
|
+
//# sourceMappingURL=neural-ui-core-rich-text-editor.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"neural-ui-core-rich-text-editor.mjs","sources":["../../../../projects/ui-core/rich-text-editor/neu-rich-text-editor.utils.ts","../../../../projects/ui-core/rich-text-editor/neu-rich-text-editor.component.ts","../../../../projects/ui-core/rich-text-editor/neural-ui-core-rich-text-editor.ts"],"sourcesContent":["export const NEU_RICH_TEXT_ALLOWED_TAGS = new Set([\n 'a',\n 'b',\n 'blockquote',\n 'br',\n 'div',\n 'em',\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h6',\n 'i',\n 'img',\n 'li',\n 'ol',\n 'p',\n 'span',\n 'strong',\n 'table',\n 'tbody',\n 'td',\n 'th',\n 'thead',\n 'tr',\n 'u',\n 'ul',\n]);\n\nconst VOID_TAGS = new Set(['br', 'img']);\nconst BLOCKED_TAGS =\n 'script|style|iframe|object|embed|form|input|button|textarea|select|option|meta|link|svg|math';\n\nexport function normalizeRichTextHtml(value: string): string {\n const clean = value.trim();\n if (!clean) {\n return '';\n }\n\n return hasHtmlTags(clean) ? sanitizeRichTextHtml(clean) : plainTextToRichTextHtml(clean);\n}\n\nexport function plainTextToRichTextHtml(value: string): string {\n return value\n .trim()\n .split(/\\n{2,}/)\n .map((paragraph) => `<p>${escapeRichTextHtml(paragraph).replace(/\\n/g, '<br>')}</p>`)\n .join('');\n}\n\nexport function sanitizeRichTextHtml(value: string): string {\n const blockedTagPattern = new RegExp(\n `<\\\\s*(?:${BLOCKED_TAGS})[\\\\s\\\\S]*?>[\\\\s\\\\S]*?<\\\\s*\\\\/\\\\s*(?:${BLOCKED_TAGS})\\\\s*>`,\n 'gi',\n );\n const blockedSingleTagPattern = new RegExp(`<\\\\s*\\\\/?\\\\s*(?:${BLOCKED_TAGS})[^>]*>`, 'gi');\n\n const withoutDangerousContent = value\n .replace(/<!--[\\s\\S]*?-->/g, '')\n .replace(blockedTagPattern, '')\n .replace(blockedSingleTagPattern, '')\n .replace(/\\s+on[a-z]+\\s*=\\s*(?:\"[^\"]*\"|'[^']*'|[^\\s>]+)/gi, '')\n .replace(/\\s+style\\s*=\\s*(?:\"[^\"]*\"|'[^']*'|[^\\s>]+)/gi, '');\n\n return withoutDangerousContent\n .replace(/<\\/?([a-z][a-z0-9]*)([^>]*)>/gi, (match, tagName: string, rawAttributes: string) => {\n const tag = tagName.toLowerCase();\n const isClosing = /^<\\s*\\//.test(match);\n\n if (!NEU_RICH_TEXT_ALLOWED_TAGS.has(tag)) {\n return '';\n }\n\n if (isClosing) {\n return VOID_TAGS.has(tag) ? '' : `</${tag}>`;\n }\n\n return `<${tag}${sanitizeAttributes(tag, rawAttributes || '')}>`;\n })\n .trim();\n}\n\nexport function escapeRichTextHtml(value: string): string {\n return value\n .replaceAll('&', '&')\n .replaceAll('<', '<')\n .replaceAll('>', '>')\n .replaceAll('\"', '"')\n .replaceAll(\"'\", ''');\n}\n\nexport function escapeRichTextAttribute(value: string): string {\n return escapeRichTextHtml(value).replaceAll('`', '`');\n}\n\nfunction sanitizeAttributes(tag: string, rawAttributes: string): string {\n const attributes = new Map<string, string>();\n rawAttributes.replace(\n /([a-zA-Z:-]+)(?:\\s*=\\s*(\"([^\"]*)\"|'([^']*)'|([^\\s\"'>`]+)))?/g,\n (\n _match,\n rawName: string,\n _rawValue: string,\n doubleQuoted: string,\n singleQuoted: string,\n bareValue: string,\n ) => {\n const name = rawName.toLowerCase();\n const value = doubleQuoted ?? singleQuoted ?? bareValue ?? '';\n\n if (name.startsWith('on') || name === 'style' || !isAllowedAttribute(tag, name)) {\n return '';\n }\n\n if (tag === 'a' && name === 'href') {\n if (isSafeHref(value)) {\n attributes.set('href', value.trim());\n attributes.set('target', '_blank');\n attributes.set('rel', 'noopener noreferrer');\n }\n return '';\n }\n\n if (tag === 'img' && name === 'src') {\n if (isSafeImageSource(value)) {\n attributes.set('src', value.trim());\n }\n return '';\n }\n\n if ((name === 'width' || name === 'height') && !/^\\d{1,4}$/.test(value.trim())) {\n return '';\n }\n\n if (name === 'target' || name === 'rel') {\n return '';\n }\n\n attributes.set(name, value.trim());\n return '';\n },\n );\n\n return Array.from(attributes.entries())\n .filter(([, value]) => value.length > 0)\n .map(([name, value]) => ` ${name}=\"${escapeRichTextAttribute(value)}\"`)\n .join('');\n}\n\nfunction isAllowedAttribute(tag: string, name: string): boolean {\n if (name === 'title') {\n return true;\n }\n\n if (tag === 'a') {\n return ['href', 'target', 'rel'].includes(name);\n }\n\n if (tag === 'img') {\n return ['src', 'alt', 'width', 'height'].includes(name);\n }\n\n if (['td', 'th'].includes(tag)) {\n return ['colspan', 'rowspan'].includes(name);\n }\n\n return false;\n}\n\nfunction hasHtmlTags(value: string): boolean {\n return /<\\/?[a-z][\\s\\S]*>/i.test(value);\n}\n\nfunction isSafeHref(value: string): boolean {\n const clean = value.trim();\n return /^{{[a-zA-Z0-9_. -]+}}$/.test(clean) || /^(https?:|mailto:|tel:)/i.test(clean);\n}\n\nfunction isSafeImageSource(value: string): boolean {\n const clean = value.trim();\n if (/^https?:\\/\\//i.test(clean)) {\n return true;\n }\n\n return (\n /^data:image\\/(?:png|jpe?g|gif|webp);base64,[a-z0-9+/=\\s]+$/i.test(clean) &&\n clean.length <= 1_500_000\n );\n}\n","import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n ViewEncapsulation,\n computed,\n forwardRef,\n input,\n output,\n signal,\n viewChild,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { NeuButtonComponent } from '@neural-ui/core/button';\nimport {\n escapeRichTextAttribute,\n escapeRichTextHtml,\n normalizeRichTextHtml,\n plainTextToRichTextHtml,\n sanitizeRichTextHtml,\n} from './neu-rich-text-editor.utils';\n\nexport type NeuRichTextEditorSize = 'sm' | 'md' | 'lg';\nexport type NeuRichTextEditorCommand =\n | 'bold'\n | 'italic'\n | 'underline'\n | 'insertUnorderedList'\n | 'insertOrderedList'\n | 'removeFormat';\n\nexport interface NeuRichTextImageRejectedEvent {\n file: File;\n maxBytes: number;\n reason: 'size';\n}\n\nexport interface NeuRichTextEditorLabels {\n toolbar: string;\n formatGroup: string;\n listsGroup: string;\n insertGroup: string;\n clearGroup: string;\n bold: string;\n italic: string;\n underline: string;\n unorderedList: string;\n orderedList: string;\n addLink: string;\n addImageUrl: string;\n clearFormat: string;\n linkUrlPrompt: string;\n linkTextPrompt: string;\n imageUrlPrompt: string;\n imageAltPrompt: string;\n imageAltFallback: string;\n pastedImageAlt: string;\n}\n\nconst DEFAULT_RICH_TEXT_EDITOR_LABELS: NeuRichTextEditorLabels = {\n toolbar: 'Rich text editor',\n formatGroup: 'Text formatting',\n listsGroup: 'Lists',\n insertGroup: 'Insert',\n clearGroup: 'Clear',\n bold: 'Bold',\n italic: 'Italic',\n underline: 'Underline',\n unorderedList: 'Bullet list',\n orderedList: 'Numbered list',\n addLink: 'Add link',\n addImageUrl: 'Add image by URL',\n clearFormat: 'Clear formatting',\n linkUrlPrompt: 'Link URL',\n linkTextPrompt: 'Link text',\n imageUrlPrompt: 'Image URL',\n imageAltPrompt: 'Alternative text',\n imageAltFallback: 'Image',\n pastedImageAlt: 'Pasted image',\n};\n\nlet _neuRichTextEditorIdSeq = 0;\n\n@Component({\n selector: 'neu-rich-text-editor',\n imports: [NeuButtonComponent],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'neu-rich-text-editor-host',\n '[class.neu-rich-text-editor-host--sm]': 'size() === \"sm\"',\n '[class.neu-rich-text-editor-host--lg]': 'size() === \"lg\"',\n },\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => NeuRichTextEditorComponent),\n multi: true,\n },\n ],\n template: `\n <div class=\"neu-rich-text-editor\" [class.neu-rich-text-editor--disabled]=\"isDisabledFinal()\">\n @if (label()) {\n <label class=\"neu-rich-text-editor__label\" [for]=\"editorId()\">{{ label() }}</label>\n }\n\n <div\n class=\"neu-rich-text-editor__frame\"\n [class.neu-rich-text-editor__frame--focused]=\"focused()\"\n [class.neu-rich-text-editor__frame--error]=\"hasError()\"\n >\n <div\n class=\"neu-rich-text-editor__toolbar\"\n role=\"toolbar\"\n [attr.aria-label]=\"mergedLabels().toolbar\"\n >\n <div\n class=\"neu-rich-text-editor__toolbar-group\"\n role=\"group\"\n [attr.aria-label]=\"mergedLabels().formatGroup\"\n >\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideBold\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().bold\"\n [title]=\"mergedLabels().bold\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"format('bold')\"\n ></button>\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideItalic\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().italic\"\n [title]=\"mergedLabels().italic\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"format('italic')\"\n ></button>\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideUnderline\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().underline\"\n [title]=\"mergedLabels().underline\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"format('underline')\"\n ></button>\n </div>\n\n <div\n class=\"neu-rich-text-editor__toolbar-group\"\n role=\"group\"\n [attr.aria-label]=\"mergedLabels().listsGroup\"\n >\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideList\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().unorderedList\"\n [title]=\"mergedLabels().unorderedList\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"format('insertUnorderedList')\"\n ></button>\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideListOrdered\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().orderedList\"\n [title]=\"mergedLabels().orderedList\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"format('insertOrderedList')\"\n ></button>\n </div>\n\n <div\n class=\"neu-rich-text-editor__toolbar-group\"\n role=\"group\"\n [attr.aria-label]=\"mergedLabels().insertGroup\"\n >\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideLink\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().addLink\"\n [title]=\"mergedLabels().addLink\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"addLink()\"\n ></button>\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideImage\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().addImageUrl\"\n [title]=\"mergedLabels().addImageUrl\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"addImageUrl()\"\n ></button>\n </div>\n\n <div\n class=\"neu-rich-text-editor__toolbar-group\"\n role=\"group\"\n [attr.aria-label]=\"mergedLabels().clearGroup\"\n >\n <button\n neu-button\n type=\"button\"\n variant=\"ghost\"\n size=\"sm\"\n icon=\"lucideEraser\"\n [iconOnly]=\"true\"\n [ariaLabel]=\"mergedLabels().clearFormat\"\n [title]=\"mergedLabels().clearFormat\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"format('removeFormat')\"\n ></button>\n </div>\n </div>\n\n @if (variables().length) {\n <div class=\"neu-rich-text-editor__variables\" [attr.aria-label]=\"variablesAriaLabel()\">\n <span class=\"neu-rich-text-editor__variables-label\">{{ variablesLabel() }}</span>\n @for (variable of variables(); track variable) {\n <button\n class=\"neu-rich-text-editor__variable\"\n type=\"button\"\n [disabled]=\"isDisabledFinal()\"\n (click)=\"insertVariable(variable)\"\n >\n {{ variable }}\n </button>\n }\n </div>\n }\n\n <div\n #editorRef\n class=\"neu-rich-text-editor__surface\"\n role=\"textbox\"\n aria-multiline=\"true\"\n [id]=\"editorId()\"\n [attr.contenteditable]=\"isDisabledFinal() ? 'false' : 'true'\"\n [attr.data-placeholder]=\"placeholder()\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.aria-invalid]=\"hasError() ? 'true' : null\"\n [style.min-height]=\"minHeight()\"\n (input)=\"handleInput()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (paste)=\"handlePaste($event)\"\n ></div>\n </div>\n\n @if (hasError()) {\n <p class=\"neu-rich-text-editor__error\" [id]=\"editorId() + '-error'\" role=\"alert\">\n {{ errorMessage() }}\n </p>\n } @else if (hint()) {\n <p class=\"neu-rich-text-editor__hint\" [id]=\"editorId() + '-hint'\">{{ hint() }}</p>\n }\n\n @if (showPreview() && value()) {\n <details class=\"neu-rich-text-editor__preview\">\n <summary>{{ previewLabel() }}</summary>\n <div class=\"neu-rich-text-editor__preview-content\" [innerHTML]=\"value()\"></div>\n </details>\n }\n </div>\n `,\n styleUrl: './neu-rich-text-editor.component.scss',\n})\nexport class NeuRichTextEditorComponent implements ControlValueAccessor, AfterViewInit {\n readonly label = input<string>('');\n readonly placeholder = input<string>('Write here...');\n readonly hint = input<string>('');\n readonly errorMessage = input<string>('');\n readonly size = input<NeuRichTextEditorSize>('md');\n readonly minHeight = input<string>('180px');\n readonly disabled = input<boolean>(false);\n readonly readonly = input<boolean>(false);\n /**\n * @deprecated Use `labels.toolbar` instead.\n */\n readonly toolbarAriaLabel = input<string>('');\n readonly labels = input<Partial<NeuRichTextEditorLabels>>({});\n readonly variables = input<readonly string[]>([]);\n readonly variablesLabel = input<string>('Variables');\n readonly variablesAriaLabel = input<string>('Available variables');\n readonly maxPastedImageBytes = input<number>(1_500_000);\n readonly showPreview = input<boolean>(false);\n readonly previewLabel = input<string>('Preview');\n readonly editorId = input<string>(`neu-rich-text-editor-${++_neuRichTextEditorIdSeq}`);\n\n readonly valueChange = output<string>();\n readonly imageRejected = output<NeuRichTextImageRejectedEvent>();\n\n protected readonly value = signal('');\n protected readonly focused = signal(false);\n private readonly cvaDisabled = signal(false);\n private readonly editorRef = viewChild<ElementRef<HTMLDivElement>>('editorRef');\n\n private viewReady = false;\n private onChange: (value: string) => void = () => undefined;\n private onTouched: () => void = () => undefined;\n\n readonly isDisabledFinal = computed(\n () => this.disabled() || this.readonly() || this.cvaDisabled(),\n );\n readonly mergedLabels = computed<NeuRichTextEditorLabels>(() => ({\n ...DEFAULT_RICH_TEXT_EDITOR_LABELS,\n ...(this.toolbarAriaLabel() ? { toolbar: this.toolbarAriaLabel() } : {}),\n ...this.labels(),\n }));\n readonly hasError = computed(() => !!this.errorMessage());\n readonly ariaDescribedBy = computed(() => {\n if (this.hasError()) {\n return `${this.editorId()}-error`;\n }\n return this.hint() ? `${this.editorId()}-hint` : null;\n });\n\n ngAfterViewInit(): void {\n this.viewReady = true;\n this.renderValue(this.value());\n }\n\n writeValue(value: string | null): void {\n const html = normalizeRichTextHtml(value ?? '');\n this.value.set(html);\n this.renderValue(html);\n }\n\n registerOnChange(fn: (value: string) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n setDisabledState(isDisabled: boolean): void {\n this.cvaDisabled.set(isDisabled);\n }\n\n format(command: NeuRichTextEditorCommand): void {\n if (this.isDisabledFinal()) return;\n this.focus();\n document.execCommand(command);\n this.syncValueFromEditor();\n }\n\n addLink(): void {\n if (this.isDisabledFinal()) return;\n const url = window.prompt(this.mergedLabels().linkUrlPrompt);\n if (!url) return;\n const text = window.prompt(this.mergedLabels().linkTextPrompt) || url;\n this.insertHtml(`<a href=\"${escapeRichTextAttribute(url)}\">${escapeRichTextHtml(text)}</a>`);\n }\n\n addImageUrl(): void {\n if (this.isDisabledFinal()) return;\n const url = window.prompt(this.mergedLabels().imageUrlPrompt);\n if (!url) return;\n const alt =\n window.prompt(this.mergedLabels().imageAltPrompt) || this.mergedLabels().imageAltFallback;\n this.insertHtml(\n `<img src=\"${escapeRichTextAttribute(url)}\" alt=\"${escapeRichTextAttribute(alt)}\">`,\n );\n }\n\n insertVariable(variable: string): void {\n if (this.isDisabledFinal()) return;\n this.insertHtml(escapeRichTextHtml(variable));\n }\n\n handleInput(): void {\n this.syncValueFromEditor();\n }\n\n onFocus(): void {\n this.focused.set(true);\n }\n\n onBlur(): void {\n this.focused.set(false);\n this.onTouched();\n }\n\n handlePaste(event: ClipboardEvent): void {\n if (this.isDisabledFinal()) return;\n\n const imageFile = Array.from(event.clipboardData?.files ?? []).find((file) =>\n file.type.startsWith('image/'),\n );\n if (imageFile) {\n event.preventDefault();\n this.insertPastedImage(imageFile);\n return;\n }\n\n const html = event.clipboardData?.getData('text/html');\n if (html) {\n event.preventDefault();\n this.insertHtml(sanitizeRichTextHtml(html));\n return;\n }\n\n const text = event.clipboardData?.getData('text/plain');\n if (text) {\n event.preventDefault();\n this.insertHtml(plainTextToRichTextHtml(text));\n }\n }\n\n private insertPastedImage(file: File): void {\n const maxBytes = this.maxPastedImageBytes();\n if (file.size > maxBytes) {\n this.imageRejected.emit({ file, maxBytes, reason: 'size' });\n return;\n }\n\n const reader = new FileReader();\n reader.onload = () => {\n const src = typeof reader.result === 'string' ? reader.result : '';\n this.insertHtml(\n sanitizeRichTextHtml(\n `<img src=\"${escapeRichTextAttribute(src)}\" alt=\"${escapeRichTextAttribute(\n this.mergedLabels().pastedImageAlt,\n )}\">`,\n ),\n );\n };\n reader.readAsDataURL(file);\n }\n\n private insertHtml(html: string): void {\n this.focus();\n document.execCommand('insertHTML', false, sanitizeRichTextHtml(html));\n this.syncValueFromEditor();\n }\n\n private syncValueFromEditor(): void {\n const html = sanitizeRichTextHtml(this.editorRef()?.nativeElement.innerHTML ?? '');\n this.value.set(html);\n this.onChange(html);\n this.valueChange.emit(html);\n }\n\n private focus(): void {\n this.editorRef()?.nativeElement.focus();\n }\n\n private renderValue(html: string): void {\n const editor = this.editorRef()?.nativeElement;\n if (!this.viewReady || !editor) return;\n if (editor.innerHTML !== html) {\n editor.innerHTML = html;\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
@@ -193,7 +193,7 @@ class NeuSplitButtonComponent {
|
|
|
193
193
|
</div>
|
|
194
194
|
</ng-template>
|
|
195
195
|
</div>
|
|
196
|
-
`, isInline: true, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon
|
|
196
|
+
`, isInline: true, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin:0;line-height:1}.neu-button--icon-only .neu-icon ng-icon,.neu-button--icon-only neu-icon ng-icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ng-icon__size, 1em);height:var(--ng-icon__size, 1em);line-height:1}.neu-button--icon-only .neu-icon svg,.neu-button--icon-only neu-icon svg{display:block;width:100%;height:100%}.neu-button__spinner{display:inline-flex;flex-shrink:0;width:1em;height:1em}.neu-button__spinner svg{width:100%;height:100%;animation:neu-spin .8s linear infinite}@keyframes neu-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.neu-split-button-host{display:inline-block}.neu-split-button{display:inline-flex;align-items:stretch}.neu-split-button--disabled{opacity:.6;pointer-events:none}.neu-split-button .neu-split-button__main{border-top-right-radius:0!important;border-bottom-right-radius:0!important;border-right:none!important;flex:1}.neu-split-button .neu-split-button__chevron{border-top-left-radius:0!important;border-bottom-left-radius:0!important;padding-inline:10px!important;min-width:auto}.neu-split-button .neu-split-button__chevron svg{width:14px;height:14px;display:block}.neu-split-button__divider{width:1px;background:var(--neu-split-button-primary-divider);align-self:stretch;flex-shrink:0}.neu-button--secondary .neu-split-button__divider,.neu-button--ghost .neu-split-button__divider,.neu-button--outline .neu-split-button__divider{background:var(--neu-border)}.neu-split-button__dropdown{position:relative;z-index:200;min-width:180px;background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);box-shadow:var(--neu-shadow-lg);padding:var(--neu-space-1) 0;animation:neu-split-btn-in .1s ease}@keyframes neu-split-btn-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.neu-split-button{position:relative}.neu-split-button__dropdown-item{display:flex;align-items:center;width:100%;padding:9px var(--neu-space-4);border:none;background:none;font-family:var(--neu-font-sans);font-size:var(--neu-text-sm);color:var(--neu-text);cursor:pointer;text-align:left;transition:background var(--neu-transition)}.neu-split-button__dropdown-item:hover:not(:disabled):not(.neu-split-button__dropdown-item--disabled){background:var(--neu-surface-2)}.neu-split-button__dropdown-item--disabled,.neu-split-button__dropdown-item:disabled{color:var(--neu-text-disabled);cursor:not-allowed}.neu-split-button__dropdown-sep{height:1px;background:var(--neu-border);margin:var(--neu-space-1) 0}\n"], dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
197
197
|
}
|
|
198
198
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuSplitButtonComponent, decorators: [{
|
|
199
199
|
type: Component,
|
|
@@ -300,7 +300,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
300
300
|
</div>
|
|
301
301
|
</ng-template>
|
|
302
302
|
</div>
|
|
303
|
-
`, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon
|
|
303
|
+
`, styles: [".neu-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--neu-space-2);border:1px solid transparent;border-radius:var(--neu-radius);font-family:var(--neu-font-sans);font-weight:500;line-height:1;cursor:pointer;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition),box-shadow var(--neu-transition),opacity var(--neu-transition);outline:none}.neu-button:focus-visible{box-shadow:var(--neu-focus-ring-strong)}.neu-button--sm{padding:var(--neu-space-2) var(--neu-space-3);font-size:var(--neu-text-sm);border-radius:var(--neu-radius-sm)}.neu-button--md{padding:var(--neu-space-2) var(--neu-space-5);font-size:var(--neu-text-base)}@media(min-width:400px){.neu-button--md{padding:.625rem var(--neu-space-6)}}.neu-button--lg{padding:var(--neu-space-3) var(--neu-space-8);font-size:var(--neu-text-lg)}.neu-button--full-width{width:100%}.neu-button--primary{background:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)));color:var(--neu-primary-solid-fg, var(--neu-primary-fg));border-color:var(--neu-primary-solid, var(--neu-primary-dark, var(--neu-primary)))}.neu-button--primary:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));border-color:var(--neu-primary-solid-hover, var(--neu-primary-dark));box-shadow:var(--neu-shadow-glow)}.neu-button--primary:active:not(:disabled){background:var(--neu-primary-solid-hover, var(--neu-primary-dark));transform:translateY(1px)}.neu-button--secondary{background:#475569;color:#fff;border-color:#475569}.neu-button--secondary:hover:not(:disabled):not(.neu-button--disabled){background:#334155;border-color:#334155}.neu-button--outline{background:transparent;color:var(--neu-primary-dark, var(--neu-primary));border-color:var(--neu-primary)}.neu-button--outline:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-primary-50);border-color:var(--neu-primary-dark, var(--neu-primary))}.neu-button--ghost{background:transparent;color:var(--neu-text-muted);border-color:transparent}.neu-button--ghost:hover:not(:disabled):not(.neu-button--disabled){background:var(--neu-surface-2);color:var(--neu-text)}.neu-button--danger{background:var(--neu-error);color:var(--neu-primary-fg);border-color:var(--neu-error)}.neu-button--danger:hover:not(:disabled):not(.neu-button--disabled){background:#dc2626;border-color:#dc2626}.neu-button--disabled,.neu-button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.neu-button--loading{cursor:wait;pointer-events:none}.neu-button--icon-only{gap:0;align-items:center;justify-content:center;aspect-ratio:1/1;line-height:1}.neu-button--icon-only.neu-button--sm{width:30px;height:30px;padding:0}.neu-button--icon-only.neu-button--md{width:38px;height:38px;padding:0}.neu-button--icon-only.neu-button--lg{width:46px;height:46px;padding:0}.neu-button--icon-only .neu-icon,.neu-button--icon-only neu-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin:0;line-height:1}.neu-button--icon-only .neu-icon ng-icon,.neu-button--icon-only neu-icon ng-icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ng-icon__size, 1em);height:var(--ng-icon__size, 1em);line-height:1}.neu-button--icon-only .neu-icon svg,.neu-button--icon-only neu-icon svg{display:block;width:100%;height:100%}.neu-button__spinner{display:inline-flex;flex-shrink:0;width:1em;height:1em}.neu-button__spinner svg{width:100%;height:100%;animation:neu-spin .8s linear infinite}@keyframes neu-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.neu-split-button-host{display:inline-block}.neu-split-button{display:inline-flex;align-items:stretch}.neu-split-button--disabled{opacity:.6;pointer-events:none}.neu-split-button .neu-split-button__main{border-top-right-radius:0!important;border-bottom-right-radius:0!important;border-right:none!important;flex:1}.neu-split-button .neu-split-button__chevron{border-top-left-radius:0!important;border-bottom-left-radius:0!important;padding-inline:10px!important;min-width:auto}.neu-split-button .neu-split-button__chevron svg{width:14px;height:14px;display:block}.neu-split-button__divider{width:1px;background:var(--neu-split-button-primary-divider);align-self:stretch;flex-shrink:0}.neu-button--secondary .neu-split-button__divider,.neu-button--ghost .neu-split-button__divider,.neu-button--outline .neu-split-button__divider{background:var(--neu-border)}.neu-split-button__dropdown{position:relative;z-index:200;min-width:180px;background:var(--neu-surface);border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);box-shadow:var(--neu-shadow-lg);padding:var(--neu-space-1) 0;animation:neu-split-btn-in .1s ease}@keyframes neu-split-btn-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.neu-split-button{position:relative}.neu-split-button__dropdown-item{display:flex;align-items:center;width:100%;padding:9px var(--neu-space-4);border:none;background:none;font-family:var(--neu-font-sans);font-size:var(--neu-text-sm);color:var(--neu-text);cursor:pointer;text-align:left;transition:background var(--neu-transition)}.neu-split-button__dropdown-item:hover:not(:disabled):not(.neu-split-button__dropdown-item--disabled){background:var(--neu-surface-2)}.neu-split-button__dropdown-item--disabled,.neu-split-button__dropdown-item:disabled{color:var(--neu-text-disabled);cursor:not-allowed}.neu-split-button__dropdown-sep{height:1px;background:var(--neu-border);margin:var(--neu-space-1) 0}\n"] }]
|
|
304
304
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], moreActionsAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "moreActionsAriaLabel", required: false }] }], actionsAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionsAriaLabel", required: false }] }], primaryClick: [{ type: i0.Output, args: ["primaryClick"] }], actionClick: [{ type: i0.Output, args: ["actionClick"] }] } });
|
|
305
305
|
|
|
306
306
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"neural-ui-core-split-button.mjs","sources":["../../../../projects/ui-core/split-button/neu-split-button.component.ts","../../../../projects/ui-core/split-button/neural-ui-core-split-button.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n ViewEncapsulation,\n computed,\n inject,\n input,\n output,\n signal,\n} from '@angular/core';\nimport { ConnectedPosition, Overlay, OverlayModule } from '@angular/cdk/overlay';\nimport { NeuButtonVariant, NeuButtonSize } from '@neural-ui/core/button';\n\nexport interface NeuSplitButtonAction {\n /** Identificador único de la acción / Unique action identifier */\n id: string;\n /** Texto visible / Visible text */\n label: string;\n /** Icono opcional (SVG string o nombre) / Optional icon (SVG string or name) */\n icon?: string;\n /** Deshabilita esta acción individualmente / Disables this action individually */\n disabled?: boolean;\n /** Separador visual encima de este item / Visual separator above this item */\n divider?: boolean;\n}\n\n/**\n * NeuralUI SplitButton Component\n *\n * Botón principal con un dropdown de acciones adicionales. / Primary button with a dropdown of additional actions.\n *\n * Uso:\n * <neu-split-button\n * label=\"Guardar\"\n * [actions]=\"actions\"\n * (primaryClick)=\"save()\"\n * (actionClick)=\"onAction($event)\"\n * />\n */\n@Component({\n selector: 'neu-split-button',\n imports: [OverlayModule],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'neu-split-button-host',\n '(document:click)': 'onDocumentClick($event)',\n '(keydown.escape)': 'closeDropdown()',\n },\n template: `\n <div class=\"neu-split-button\" [class.neu-split-button--disabled]=\"isDisabled()\">\n <!-- Botón principal -->\n <button\n class=\"neu-split-button__main\"\n [class]=\"mainClasses()\"\n type=\"button\"\n [disabled]=\"isDisabled() || null\"\n [attr.aria-disabled]=\"isDisabled()\"\n [attr.aria-busy]=\"loading()\"\n (click)=\"onPrimaryClick($event)\"\n >\n @if (loading()) {\n <span class=\"neu-button__spinner\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\">\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"31.416\"\n stroke-dashoffset=\"10\"\n />\n </svg>\n </span>\n }\n {{ label() }}\n </button>\n\n <!-- Separador -->\n <span class=\"neu-split-button__divider\" aria-hidden=\"true\"></span>\n\n <!-- Chevron trigger -->\n <button\n cdkOverlayOrigin\n #splitButtonOrigin=\"cdkOverlayOrigin\"\n class=\"neu-split-button__chevron\"\n [class]=\"chevronClasses()\"\n type=\"button\"\n [disabled]=\"isDisabled() || null\"\n [attr.aria-haspopup]=\"'menu'\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-label]=\"moreActionsAriaLabel()\"\n (click)=\"toggleDropdown($event)\"\n >\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <polyline points=\"6 9 12 15 18 9\" />\n </svg>\n </button>\n\n <!-- Dropdown de acciones -->\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"splitButtonOrigin\"\n [cdkConnectedOverlayOpen]=\"isOpen()\"\n [cdkConnectedOverlayPositions]=\"overlayPositions\"\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop'\"\n [cdkConnectedOverlayPush]=\"true\"\n [cdkConnectedOverlayViewportMargin]=\"_viewportMargin\"\n (backdropClick)=\"closeDropdown()\"\n (detach)=\"closeDropdown()\"\n >\n <div\n class=\"neu-split-button__dropdown\"\n role=\"menu\"\n [attr.aria-label]=\"actionsAriaLabel()\"\n (click)=\"$event.stopPropagation()\"\n >\n @for (action of actions(); track action.id) {\n @if (action.divider) {\n <div class=\"neu-split-button__dropdown-sep\" role=\"separator\" aria-hidden=\"true\"></div>\n }\n <button\n class=\"neu-split-button__dropdown-item\"\n [class.neu-split-button__dropdown-item--disabled]=\"action.disabled\"\n type=\"button\"\n role=\"menuitem\"\n [disabled]=\"action.disabled || null\"\n [attr.aria-disabled]=\"action.disabled ? 'true' : null\"\n (click)=\"onActionClick(action)\"\n >\n {{ action.label }}\n </button>\n }\n </div>\n </ng-template>\n </div>\n `,\n styleUrl: './neu-split-button.component.scss',\n})\nexport class NeuSplitButtonComponent {\n private readonly el = inject<ElementRef<HTMLElement>>(ElementRef);\n private readonly overlay = inject(Overlay);\n readonly _viewportMargin = 16;\n readonly overlayPositions: ConnectedPosition[] = [\n {\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetY: 6,\n },\n {\n originX: 'end',\n originY: 'top',\n overlayX: 'end',\n overlayY: 'bottom',\n offsetY: -6,\n },\n {\n originX: 'start',\n originY: 'bottom',\n overlayX: 'start',\n overlayY: 'top',\n offsetY: 6,\n },\n ];\n readonly overlayScrollStrategy = this.overlay.scrollStrategies.reposition();\n\n /** Texto del botón principal / Primary button text */\n label = input<string>('');\n\n /** Variante visual / Visual variant */\n variant = input<NeuButtonVariant>('primary');\n\n /** Tamaño / Size */\n size = input<NeuButtonSize>('md');\n\n /** Deshabilita todo el componente / Disables the entire component */\n disabled = input<boolean>(false);\n\n /** Muestra spinner en el botón principal / Shows spinner on the primary button */\n loading = input<boolean>(false);\n\n /** Acciones del dropdown / Dropdown actions */\n actions = input<NeuSplitButtonAction[]>([]);\n\n /** Aria-label del botón de desplegable / Aria-label for the dropdown button */\n moreActionsAriaLabel = input<string>('Más opciones');\n\n /** Aria-label del menú desplegable / Aria-label for the dropdown menu */\n actionsAriaLabel = input<string>('Acciones');\n\n /** Emite al hacer click en el botón principal / Emits on primary button click */\n primaryClick = output<MouseEvent>();\n\n /** Emite al seleccionar una acción del dropdown / Emits when a dropdown action is selected */\n actionClick = output<NeuSplitButtonAction>();\n\n readonly isOpen = signal(false);\n\n readonly isDisabled = computed(() => this.disabled() || this.loading());\n\n readonly mainClasses = computed(\n () =>\n `neu-button neu-button--${this.variant()} neu-button--${this.size()}${this.loading() ? ' neu-button--loading' : ''}`,\n );\n\n readonly chevronClasses = computed(\n () => `neu-button neu-button--${this.variant()} neu-button--${this.size()}`,\n );\n\n toggleDropdown(event: MouseEvent): void {\n event.stopPropagation();\n this.isOpen.update((v) => !v);\n }\n\n closeDropdown(): void {\n this.isOpen.set(false);\n }\n\n onDocumentClick(event: MouseEvent): void {\n const target = event.target as Element | null;\n const isInsidePanel = !!target?.closest('.neu-split-button__dropdown');\n if (!this.el.nativeElement.contains(event.target as Node) && !isInsidePanel) {\n this.closeDropdown();\n }\n }\n\n onPrimaryClick(event: MouseEvent): void {\n if (this.isDisabled()) return;\n this.primaryClick.emit(event);\n }\n\n onActionClick(action: NeuSplitButtonAction): void {\n if (action.disabled) return;\n this.closeDropdown();\n this.actionClick.emit(action);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"neural-ui-core-split-button.mjs","sources":["../../../../projects/ui-core/split-button/neu-split-button.component.ts","../../../../projects/ui-core/split-button/neural-ui-core-split-button.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n ViewEncapsulation,\n computed,\n inject,\n input,\n output,\n signal,\n} from '@angular/core';\nimport { ConnectedPosition, Overlay, OverlayModule } from '@angular/cdk/overlay';\nimport { NeuButtonVariant, NeuButtonSize } from '@neural-ui/core/button';\n\nexport interface NeuSplitButtonAction {\n /** Identificador único de la acción / Unique action identifier */\n id: string;\n /** Texto visible / Visible text */\n label: string;\n /** Icono opcional (SVG string o nombre) / Optional icon (SVG string or name) */\n icon?: string;\n /** Deshabilita esta acción individualmente / Disables this action individually */\n disabled?: boolean;\n /** Separador visual encima de este item / Visual separator above this item */\n divider?: boolean;\n}\n\n/**\n * NeuralUI SplitButton Component\n *\n * Botón principal con un dropdown de acciones adicionales. / Primary button with a dropdown of additional actions.\n *\n * Uso:\n * <neu-split-button\n * label=\"Guardar\"\n * [actions]=\"actions\"\n * (primaryClick)=\"save()\"\n * (actionClick)=\"onAction($event)\"\n * />\n */\n@Component({\n selector: 'neu-split-button',\n imports: [OverlayModule],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'neu-split-button-host',\n '(document:click)': 'onDocumentClick($event)',\n '(keydown.escape)': 'closeDropdown()',\n },\n template: `\n <div class=\"neu-split-button\" [class.neu-split-button--disabled]=\"isDisabled()\">\n <!-- Botón principal -->\n <button\n class=\"neu-split-button__main\"\n [class]=\"mainClasses()\"\n type=\"button\"\n [disabled]=\"isDisabled() || null\"\n [attr.aria-disabled]=\"isDisabled()\"\n [attr.aria-busy]=\"loading()\"\n (click)=\"onPrimaryClick($event)\"\n >\n @if (loading()) {\n <span class=\"neu-button__spinner\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\">\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"31.416\"\n stroke-dashoffset=\"10\"\n />\n </svg>\n </span>\n }\n {{ label() }}\n </button>\n\n <!-- Separador -->\n <span class=\"neu-split-button__divider\" aria-hidden=\"true\"></span>\n\n <!-- Chevron trigger -->\n <button\n cdkOverlayOrigin\n #splitButtonOrigin=\"cdkOverlayOrigin\"\n class=\"neu-split-button__chevron\"\n [class]=\"chevronClasses()\"\n type=\"button\"\n [disabled]=\"isDisabled() || null\"\n [attr.aria-haspopup]=\"'menu'\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-label]=\"moreActionsAriaLabel()\"\n (click)=\"toggleDropdown($event)\"\n >\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <polyline points=\"6 9 12 15 18 9\" />\n </svg>\n </button>\n\n <!-- Dropdown de acciones -->\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"splitButtonOrigin\"\n [cdkConnectedOverlayOpen]=\"isOpen()\"\n [cdkConnectedOverlayPositions]=\"overlayPositions\"\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop'\"\n [cdkConnectedOverlayPush]=\"true\"\n [cdkConnectedOverlayViewportMargin]=\"_viewportMargin\"\n (backdropClick)=\"closeDropdown()\"\n (detach)=\"closeDropdown()\"\n >\n <div\n class=\"neu-split-button__dropdown\"\n role=\"menu\"\n [attr.aria-label]=\"actionsAriaLabel()\"\n (click)=\"$event.stopPropagation()\"\n >\n @for (action of actions(); track action.id) {\n @if (action.divider) {\n <div class=\"neu-split-button__dropdown-sep\" role=\"separator\" aria-hidden=\"true\"></div>\n }\n <button\n class=\"neu-split-button__dropdown-item\"\n [class.neu-split-button__dropdown-item--disabled]=\"action.disabled\"\n type=\"button\"\n role=\"menuitem\"\n [disabled]=\"action.disabled || null\"\n [attr.aria-disabled]=\"action.disabled ? 'true' : null\"\n (click)=\"onActionClick(action)\"\n >\n {{ action.label }}\n </button>\n }\n </div>\n </ng-template>\n </div>\n `,\n styleUrl: './neu-split-button.component.scss',\n})\nexport class NeuSplitButtonComponent {\n private readonly el = inject<ElementRef<HTMLElement>>(ElementRef);\n private readonly overlay = inject(Overlay);\n readonly _viewportMargin = 16;\n readonly overlayPositions: ConnectedPosition[] = [\n {\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetY: 6,\n },\n {\n originX: 'end',\n originY: 'top',\n overlayX: 'end',\n overlayY: 'bottom',\n offsetY: -6,\n },\n {\n originX: 'start',\n originY: 'bottom',\n overlayX: 'start',\n overlayY: 'top',\n offsetY: 6,\n },\n ];\n readonly overlayScrollStrategy = this.overlay.scrollStrategies.reposition();\n\n /** Texto del botón principal / Primary button text */\n label = input<string>('');\n\n /** Variante visual / Visual variant */\n variant = input<NeuButtonVariant>('primary');\n\n /** Tamaño / Size */\n size = input<NeuButtonSize>('md');\n\n /** Deshabilita todo el componente / Disables the entire component */\n disabled = input<boolean>(false);\n\n /** Muestra spinner en el botón principal / Shows spinner on the primary button */\n loading = input<boolean>(false);\n\n /** Acciones del dropdown / Dropdown actions */\n actions = input<NeuSplitButtonAction[]>([]);\n\n /** Aria-label del botón de desplegable / Aria-label for the dropdown button */\n moreActionsAriaLabel = input<string>('Más opciones');\n\n /** Aria-label del menú desplegable / Aria-label for the dropdown menu */\n actionsAriaLabel = input<string>('Acciones');\n\n /** Emite al hacer click en el botón principal / Emits on primary button click */\n primaryClick = output<MouseEvent>();\n\n /** Emite al seleccionar una acción del dropdown / Emits when a dropdown action is selected */\n actionClick = output<NeuSplitButtonAction>();\n\n readonly isOpen = signal(false);\n\n readonly isDisabled = computed(() => this.disabled() || this.loading());\n\n readonly mainClasses = computed(\n () =>\n `neu-button neu-button--${this.variant()} neu-button--${this.size()}${this.loading() ? ' neu-button--loading' : ''}`,\n );\n\n readonly chevronClasses = computed(\n () => `neu-button neu-button--${this.variant()} neu-button--${this.size()}`,\n );\n\n toggleDropdown(event: MouseEvent): void {\n event.stopPropagation();\n this.isOpen.update((v) => !v);\n }\n\n closeDropdown(): void {\n this.isOpen.set(false);\n }\n\n onDocumentClick(event: MouseEvent): void {\n const target = event.target as Element | null;\n const isInsidePanel = !!target?.closest('.neu-split-button__dropdown');\n if (!this.el.nativeElement.contains(event.target as Node) && !isInsidePanel) {\n this.closeDropdown();\n }\n }\n\n onPrimaryClick(event: MouseEvent): void {\n if (this.isDisabled()) return;\n this.primaryClick.emit(event);\n }\n\n onActionClick(action: NeuSplitButtonAction): void {\n if (action.disabled) return;\n this.closeDropdown();\n this.actionClick.emit(action);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neural-ui/core",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.6.0",
|
|
4
4
|
"description": "Modern Angular UI component library built with signals, standalone components, and OnPush change detection.",
|
|
5
5
|
"author": "PedroMorenoTrujillo",
|
|
6
6
|
"keywords": [
|
|
@@ -222,6 +222,10 @@
|
|
|
222
222
|
"types": "./types/neural-ui-core-rating.d.ts",
|
|
223
223
|
"default": "./fesm2022/neural-ui-core-rating.mjs"
|
|
224
224
|
},
|
|
225
|
+
"./rich-text-editor": {
|
|
226
|
+
"types": "./types/neural-ui-core-rich-text-editor.d.ts",
|
|
227
|
+
"default": "./fesm2022/neural-ui-core-rich-text-editor.mjs"
|
|
228
|
+
},
|
|
225
229
|
"./scheduler-gantt": {
|
|
226
230
|
"types": "./types/neural-ui-core-scheduler-gantt.d.ts",
|
|
227
231
|
"default": "./fesm2022/neural-ui-core-scheduler-gantt.mjs"
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { AfterViewInit } from '@angular/core';
|
|
3
|
+
import { ControlValueAccessor } from '@angular/forms';
|
|
4
|
+
|
|
5
|
+
type NeuRichTextEditorSize = 'sm' | 'md' | 'lg';
|
|
6
|
+
type NeuRichTextEditorCommand = 'bold' | 'italic' | 'underline' | 'insertUnorderedList' | 'insertOrderedList' | 'removeFormat';
|
|
7
|
+
interface NeuRichTextImageRejectedEvent {
|
|
8
|
+
file: File;
|
|
9
|
+
maxBytes: number;
|
|
10
|
+
reason: 'size';
|
|
11
|
+
}
|
|
12
|
+
interface NeuRichTextEditorLabels {
|
|
13
|
+
toolbar: string;
|
|
14
|
+
formatGroup: string;
|
|
15
|
+
listsGroup: string;
|
|
16
|
+
insertGroup: string;
|
|
17
|
+
clearGroup: string;
|
|
18
|
+
bold: string;
|
|
19
|
+
italic: string;
|
|
20
|
+
underline: string;
|
|
21
|
+
unorderedList: string;
|
|
22
|
+
orderedList: string;
|
|
23
|
+
addLink: string;
|
|
24
|
+
addImageUrl: string;
|
|
25
|
+
clearFormat: string;
|
|
26
|
+
linkUrlPrompt: string;
|
|
27
|
+
linkTextPrompt: string;
|
|
28
|
+
imageUrlPrompt: string;
|
|
29
|
+
imageAltPrompt: string;
|
|
30
|
+
imageAltFallback: string;
|
|
31
|
+
pastedImageAlt: string;
|
|
32
|
+
}
|
|
33
|
+
declare class NeuRichTextEditorComponent implements ControlValueAccessor, AfterViewInit {
|
|
34
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
35
|
+
readonly placeholder: _angular_core.InputSignal<string>;
|
|
36
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
37
|
+
readonly errorMessage: _angular_core.InputSignal<string>;
|
|
38
|
+
readonly size: _angular_core.InputSignal<NeuRichTextEditorSize>;
|
|
39
|
+
readonly minHeight: _angular_core.InputSignal<string>;
|
|
40
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
41
|
+
readonly readonly: _angular_core.InputSignal<boolean>;
|
|
42
|
+
/**
|
|
43
|
+
* @deprecated Use `labels.toolbar` instead.
|
|
44
|
+
*/
|
|
45
|
+
readonly toolbarAriaLabel: _angular_core.InputSignal<string>;
|
|
46
|
+
readonly labels: _angular_core.InputSignal<Partial<NeuRichTextEditorLabels>>;
|
|
47
|
+
readonly variables: _angular_core.InputSignal<readonly string[]>;
|
|
48
|
+
readonly variablesLabel: _angular_core.InputSignal<string>;
|
|
49
|
+
readonly variablesAriaLabel: _angular_core.InputSignal<string>;
|
|
50
|
+
readonly maxPastedImageBytes: _angular_core.InputSignal<number>;
|
|
51
|
+
readonly showPreview: _angular_core.InputSignal<boolean>;
|
|
52
|
+
readonly previewLabel: _angular_core.InputSignal<string>;
|
|
53
|
+
readonly editorId: _angular_core.InputSignal<string>;
|
|
54
|
+
readonly valueChange: _angular_core.OutputEmitterRef<string>;
|
|
55
|
+
readonly imageRejected: _angular_core.OutputEmitterRef<NeuRichTextImageRejectedEvent>;
|
|
56
|
+
protected readonly value: _angular_core.WritableSignal<string>;
|
|
57
|
+
protected readonly focused: _angular_core.WritableSignal<boolean>;
|
|
58
|
+
private readonly cvaDisabled;
|
|
59
|
+
private readonly editorRef;
|
|
60
|
+
private viewReady;
|
|
61
|
+
private onChange;
|
|
62
|
+
private onTouched;
|
|
63
|
+
readonly isDisabledFinal: _angular_core.Signal<boolean>;
|
|
64
|
+
readonly mergedLabels: _angular_core.Signal<NeuRichTextEditorLabels>;
|
|
65
|
+
readonly hasError: _angular_core.Signal<boolean>;
|
|
66
|
+
readonly ariaDescribedBy: _angular_core.Signal<string | null>;
|
|
67
|
+
ngAfterViewInit(): void;
|
|
68
|
+
writeValue(value: string | null): void;
|
|
69
|
+
registerOnChange(fn: (value: string) => void): void;
|
|
70
|
+
registerOnTouched(fn: () => void): void;
|
|
71
|
+
setDisabledState(isDisabled: boolean): void;
|
|
72
|
+
format(command: NeuRichTextEditorCommand): void;
|
|
73
|
+
addLink(): void;
|
|
74
|
+
addImageUrl(): void;
|
|
75
|
+
insertVariable(variable: string): void;
|
|
76
|
+
handleInput(): void;
|
|
77
|
+
onFocus(): void;
|
|
78
|
+
onBlur(): void;
|
|
79
|
+
handlePaste(event: ClipboardEvent): void;
|
|
80
|
+
private insertPastedImage;
|
|
81
|
+
private insertHtml;
|
|
82
|
+
private syncValueFromEditor;
|
|
83
|
+
private focus;
|
|
84
|
+
private renderValue;
|
|
85
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuRichTextEditorComponent, never>;
|
|
86
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuRichTextEditorComponent, "neu-rich-text-editor", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "toolbarAriaLabel": { "alias": "toolbarAriaLabel"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "variables": { "alias": "variables"; "required": false; "isSignal": true; }; "variablesLabel": { "alias": "variablesLabel"; "required": false; "isSignal": true; }; "variablesAriaLabel": { "alias": "variablesAriaLabel"; "required": false; "isSignal": true; }; "maxPastedImageBytes": { "alias": "maxPastedImageBytes"; "required": false; "isSignal": true; }; "showPreview": { "alias": "showPreview"; "required": false; "isSignal": true; }; "previewLabel": { "alias": "previewLabel"; "required": false; "isSignal": true; }; "editorId": { "alias": "editorId"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "imageRejected": "imageRejected"; }, never, never, true, never>;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
declare const NEU_RICH_TEXT_ALLOWED_TAGS: Set<string>;
|
|
90
|
+
declare function normalizeRichTextHtml(value: string): string;
|
|
91
|
+
declare function plainTextToRichTextHtml(value: string): string;
|
|
92
|
+
declare function sanitizeRichTextHtml(value: string): string;
|
|
93
|
+
declare function escapeRichTextHtml(value: string): string;
|
|
94
|
+
declare function escapeRichTextAttribute(value: string): string;
|
|
95
|
+
|
|
96
|
+
export { NEU_RICH_TEXT_ALLOWED_TAGS, NeuRichTextEditorComponent, escapeRichTextAttribute, escapeRichTextHtml, normalizeRichTextHtml, plainTextToRichTextHtml, sanitizeRichTextHtml };
|
|
97
|
+
export type { NeuRichTextEditorCommand, NeuRichTextEditorLabels, NeuRichTextEditorSize, NeuRichTextImageRejectedEvent };
|