@rolatech/angular-components 17.5.0 → 17.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/esm2022/index.mjs +5 -1
- package/esm2022/lib/accordion/accordion.component.mjs +16 -0
- package/esm2022/lib/drawer/drawer-animations.mjs +16 -0
- package/esm2022/lib/drawer/drawer.component.mjs +4 -5
- package/esm2022/lib/editor/editor.component.mjs +63 -0
- package/esm2022/lib/mini-guide/mini-guide.component.mjs +3 -3
- package/esm2022/lib/paginator/paginator.component.mjs +10 -14
- package/esm2022/lib/panel/panel-animations.mjs +17 -0
- package/esm2022/lib/panel/panel.component.mjs +51 -0
- package/esm2022/lib/rich-view/rich-view.component.mjs +3 -3
- package/esm2022/lib/wechat-connect-dialog/wechat-connect-dialog.component.mjs +17 -10
- package/fesm2022/rolatech-angular-components.mjs +163 -46
- package/fesm2022/rolatech-angular-components.mjs.map +1 -1
- package/index.d.ts +4 -0
- package/lib/accordion/accordion.component.d.ts +6 -0
- package/lib/drawer/drawer-animations.d.ts +3 -0
- package/lib/drawer/drawer.component.d.ts +0 -1
- package/lib/editor/editor.component.d.ts +28 -0
- package/lib/paginator/paginator.component.d.ts +3 -8
- package/lib/panel/panel-animations.d.ts +6 -0
- package/lib/panel/panel.component.d.ts +17 -0
- package/lib/wechat-connect-dialog/wechat-connect-dialog.component.d.ts +5 -2
- package/package.json +1 -1
- package/themes/_default.scss +1 -1
- package/esm2022/lib/drawer/expansion-animations.mjs +0 -33
- package/lib/drawer/expansion-animations.d.ts +0 -8
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, booleanAttribute, inject, ElementRef, effect, Component, ViewEncapsulation, HostBinding, InjectionToken, makeEnvironmentProviders, Renderer2, PLATFORM_ID, viewChild, ChangeDetectionStrategy, contentChild, computed, Inject, NgModule, ChangeDetectorRef, output, HostListener, contentChildren
|
|
2
|
+
import { input, booleanAttribute, inject, ElementRef, effect, Component, ViewEncapsulation, HostBinding, InjectionToken, makeEnvironmentProviders, Renderer2, PLATFORM_ID, viewChild, ChangeDetectionStrategy, contentChild, computed, Inject, NgModule, ChangeDetectorRef, output, model, HostListener, contentChildren } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule, isPlatformBrowser, NgClass } from '@angular/common';
|
|
5
5
|
import * as i2$1 from '@angular/material/icon';
|
|
@@ -44,7 +44,6 @@ import { MatFormFieldModule } from '@angular/material/form-field';
|
|
|
44
44
|
import { MatGridListModule } from '@angular/material/grid-list';
|
|
45
45
|
import * as i2$2 from '@angular/material/input';
|
|
46
46
|
import { MatInputModule } from '@angular/material/input';
|
|
47
|
-
import * as i1$6 from '@angular/material/paginator';
|
|
48
47
|
import { MatPaginatorModule } from '@angular/material/paginator';
|
|
49
48
|
import * as i1$3 from '@angular/material/progress-bar';
|
|
50
49
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
@@ -236,24 +235,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
236
235
|
|
|
237
236
|
/** Time and timing curve for expansion panel animations. */
|
|
238
237
|
// Note: Keep this in sync with the Sass variable for the panel header animation.
|
|
239
|
-
const
|
|
240
|
-
const matExpansionAnimations = {
|
|
241
|
-
/** Animation that rotates the indicator arrow. */
|
|
242
|
-
indicatorRotate: trigger('indicatorRotate', [
|
|
243
|
-
state('collapsed, void', style({ transform: 'rotate(0deg)' })),
|
|
244
|
-
state('expanded', style({ transform: 'rotate(180deg)' })),
|
|
245
|
-
transition('expanded <=> collapsed, void => collapsed', animate(EXPANSION_PANEL_ANIMATION_TIMING$1)),
|
|
246
|
-
]),
|
|
247
|
-
/** Animation that expands and collapses the panel content. */
|
|
248
|
-
bodyExpansion: trigger('bodyExpansion', [
|
|
249
|
-
state('collapsed, void', style({ height: '0px', visibility: 'hidden' })),
|
|
250
|
-
// Clear the `visibility` while open, otherwise the content will be visible when placed in
|
|
251
|
-
// a parent that's `visibility: hidden`, because `visibility` doesn't apply to descendants
|
|
252
|
-
// that have a `visibility` of their own (see #27436).
|
|
253
|
-
state('expanded', style({ height: '*', visibility: '' })),
|
|
254
|
-
transition('expanded <=> collapsed, void => collapsed', animate(EXPANSION_PANEL_ANIMATION_TIMING$1)),
|
|
255
|
-
]),
|
|
256
|
-
};
|
|
238
|
+
const DRAWER_ANIMATION_TIMING = '225ms cubic-bezier(0.4,0.0,0.2,1)';
|
|
257
239
|
const heightAnimation = trigger('heightAnimation', [
|
|
258
240
|
state('open', style({
|
|
259
241
|
height: '*',
|
|
@@ -263,10 +245,9 @@ const heightAnimation = trigger('heightAnimation', [
|
|
|
263
245
|
height: '0px',
|
|
264
246
|
visibility: 'hidden',
|
|
265
247
|
})),
|
|
266
|
-
transition('open <=> closed', [animate(
|
|
248
|
+
transition('open <=> closed', [animate(DRAWER_ANIMATION_TIMING)]),
|
|
267
249
|
]);
|
|
268
250
|
|
|
269
|
-
const EXPANSION_PANEL_ANIMATION_TIMING = '225ms cubic-bezier(0.4,0.0,0.2,1)';
|
|
270
251
|
class DrawerComponent {
|
|
271
252
|
opened = false;
|
|
272
253
|
links = input();
|
|
@@ -340,7 +321,7 @@ class DrawerComponent {
|
|
|
340
321
|
}
|
|
341
322
|
}
|
|
342
323
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
343
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: DrawerComponent, isStandalone: true, selector: "rolatech-drawer", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hostId", "class.rolatech-drawer": "this.hasClass", "style.transition-duration": "this.duration" } }, viewQueries: [{ propertyName: "guideEl", first: true, predicate: ["guide"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "scrimEl", first: true, predicate: ["scrim"], descendants: true, isSignal: true }, { propertyName: "headerEl", first: true, predicate: ["header"], descendants: true, isSignal: true }], ngImport: i0, template: "<div id=\"scrim\" #scrim class=\"rolatech-drawer\" (click)=\"close()\"></div>\n<div id=\"contentContainer\" #content class=\"rolatech-drawer\">\n <div id=\"guide-wrapper\" class=\"rolatech-drawer\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\" class=\"rolatech-drawer\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-menu-icon #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\"></rolatech-menu-icon>\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"rolatech-drawer\">\n @if (completed) {\n <div>\n <div class=\"block p-3\">\n @for (item of links(); track $index) {\n @if (item.children) {\n <div class=\"cursor-pointer\">\n <div class=\"flex items-center h-11 mr-2\" (click)=\"panelOpenState = !panelOpenState\">\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n <span class=\"ml-3\">{{ item.title }}</span>\n <div class=\"flex-1\"></div>\n <rolatech-icon\n style=\"transition-duration:.5s;transform: {{ panelOpenState ? 'rotate(180deg)' : 'rotate(0deg)' }};\"\n >expand_more</rolatech-icon\n >\n </div>\n <div class=\"flex flex-col pl-8\" [@heightAnimation]=\"panelOpenState === true ? 'open' : 'closed'\">\n @for (child of item.children; track child) {\n <a\n id=\"endpoint\"\n [routerLink]=\"child.link\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n class=\"p-3 rt-guide-entry-renderer\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <span class=\"text-sm\">{{ child.title }}</span>\n </a>\n }\n </div>\n </div>\n } @else {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90 mr-3\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n @if (item.button) {\n <a\n class=\"flex app-drawer-button min-h-11 rounded-xl mr-4\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n } @else {\n <a\n id=\"endpoint\"\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11 rt-guide-entry-renderer\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n }\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility;transition-duration:.2s;touch-action:pan-y}rolatech-drawer[persistent]{width:var(--rt-drawer-width, 256px)}rolatech-drawer[persistent][position=top]{width:100%}rolatech-drawer[opened]{visibility:visible}rolatech-drawer[position=top] #contentContainer{left:0;right:0;width:100%;height:var(--rt-topbar-height, 56px);transform:translate3d(0,-100%,0)}rolatech-drawer[position=top] #contentContainer #guide-inner-content{height:56px}rolatech-drawer[position=top] #contentContainer #guide-inner-content div{display:flex!important;flex-direction:row!important;overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;height:56px;align-items:center}rolatech-drawer[position=bottom] #contentContainer{left:0;right:0;transform:translate3d(0,100%,0)}rolatech-drawer[position=left] #contentContainer{left:0;transform:translate3d(-100%,0,0)}rolatech-drawer[position=right] #contentContainer{right:0;transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=left]{right:auto}rolatech-drawer[persistent][position=right]{left:auto}rolatech-drawer[persistent][position=top] #contentContainer{transform:translate3d(0,-100%,0)}rolatech-drawer[persistent][position=left] #contentContainer{transform:translate3d(-100%,0,0)}rolatech-drawer[persistent][position=right] #contentContainer{transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=top] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=left] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=right] #contentContainer[opened]{transform:translateZ(0)}[hidden]{display:none!important}#guide-wrapper.rolatech-drawer{height:100%;display:flexbox;display:flex;flex-direction:column}#contentContainer.rolatech-drawer{position:absolute;top:0;bottom:0;width:var(--rt-drawer-width, 256px);padding:var(--rt-drawer-content-padding, 120px 0);transition-property:transform;transition-duration:0ms;color:var(--rt-drawer-content-container-color, #000);background-color:var(--rt-drawer-content-container-background-color, #fff);transition-duration:.2s}#contentContainer.rolatech-drawer[opened]{transform:translateZ(0)}#guide-content.rolatech-drawer{background:var(--rt-base-background);flex:1;flex-basis:.000000001px;display:flex;flex-direction:column}#guide-inner-content.rolatech-drawer{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.rolatech-drawer{position:absolute;inset:0;transition-property:opacity;transform:translateZ(0);transition-duration:.2s;opacity:0;background:var(--rt-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.rolatech-drawer{opacity:1}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-drawer:not([persistent]) #guide-spacer{display:none}rolatech-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:var(--rt-drawer-active-background-color, rgba(0, 0, 0, .05));font-weight:500;border-radius:10px}.content{display:flex;flex-direction:column;overflow:visible}.app-drawer-button{background-color:var(--rt-brand-color, #000);color:var(--rt-brand-color-inverse, #fff)}.app-drawer-button:hover{box-shadow:0 1px 3px #3c40434d,0 4px 8px 3px #3c404326;background-color:var(--rt-brand-color, #c2e7ff)}#endpoint.rt-guide-entry-renderer:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }, { kind: "component", type: MenuIconComponent, selector: "rolatech-menu-icon" }, { kind: "ngmodule", type: MatButtonModule }], animations: [heightAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
324
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: DrawerComponent, isStandalone: true, selector: "rolatech-drawer", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hostId", "class.rolatech-drawer": "this.hasClass", "style.transition-duration": "this.duration" } }, viewQueries: [{ propertyName: "guideEl", first: true, predicate: ["guide"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "scrimEl", first: true, predicate: ["scrim"], descendants: true, isSignal: true }, { propertyName: "headerEl", first: true, predicate: ["header"], descendants: true, isSignal: true }], ngImport: i0, template: "<div id=\"scrim\" #scrim class=\"rolatech-drawer\" (click)=\"close()\"></div>\n<div id=\"contentContainer\" #content class=\"rolatech-drawer\">\n <div id=\"guide-wrapper\" class=\"rolatech-drawer\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\" class=\"rolatech-drawer\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-menu-icon #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\"></rolatech-menu-icon>\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"rolatech-drawer\">\n @if (completed) {\n <div>\n <div class=\"block p-3\">\n @for (item of links(); track $index) {\n @if (item.children) {\n <div class=\"cursor-pointer\">\n <div class=\"flex items-center h-11 mr-2\" (click)=\"panelOpenState = !panelOpenState\">\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n <span class=\"ml-3\">{{ item.title }}</span>\n <div class=\"flex-1\"></div>\n <rolatech-icon\n style=\"transition-duration:.5s;transform: {{ panelOpenState ? 'rotate(180deg)' : 'rotate(0deg)' }};\"\n >expand_more</rolatech-icon\n >\n </div>\n <div class=\"flex flex-col pl-8\" [@heightAnimation]=\"panelOpenState === true ? 'open' : 'closed'\">\n @for (child of item.children; track child) {\n <a\n id=\"endpoint\"\n [routerLink]=\"child.link\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n class=\"p-3 rt-guide-entry\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <span class=\"text-sm\">{{ child.title }}</span>\n </a>\n }\n </div>\n </div>\n } @else {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90 mr-3\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n @if (item.button) {\n <a\n class=\"flex app-drawer-button min-h-11 rounded-xl mb-2\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n } @else {\n <a\n id=\"endpoint\"\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11 rt-guide-entry\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n }\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility;transition-duration:.2s;touch-action:pan-y}rolatech-drawer[persistent]{width:var(--rt-drawer-width, 256px)}rolatech-drawer[persistent][position=top]{width:100%}rolatech-drawer[opened]{visibility:visible}rolatech-drawer[position=top] #contentContainer{left:0;right:0;width:100%;height:var(--rt-topbar-height, 56px);transform:translate3d(0,-100%,0)}rolatech-drawer[position=top] #contentContainer #guide-inner-content{height:56px}rolatech-drawer[position=top] #contentContainer #guide-inner-content div{display:flex!important;flex-direction:row!important;overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;height:56px;align-items:center}rolatech-drawer[position=bottom] #contentContainer{left:0;right:0;transform:translate3d(0,100%,0)}rolatech-drawer[position=left] #contentContainer{left:0;transform:translate3d(-100%,0,0)}rolatech-drawer[position=right] #contentContainer{right:0;transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=left]{right:auto}rolatech-drawer[persistent][position=right]{left:auto}rolatech-drawer[persistent][position=top] #contentContainer{transform:translate3d(0,-100%,0)}rolatech-drawer[persistent][position=left] #contentContainer{transform:translate3d(-100%,0,0)}rolatech-drawer[persistent][position=right] #contentContainer{transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=top] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=left] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=right] #contentContainer[opened]{transform:translateZ(0)}[hidden]{display:none!important}#guide-wrapper.rolatech-drawer{height:100%;display:flexbox;display:flex;flex-direction:column}#contentContainer.rolatech-drawer{position:absolute;top:0;bottom:0;width:var(--rt-drawer-width, 256px);padding:var(--rt-drawer-content-padding, 120px 0);transition-property:transform;transition-duration:0ms;color:var(--rt-drawer-content-container-color, #000);background-color:var(--rt-drawer-content-container-background-color, #fff);transition-duration:.2s}#contentContainer.rolatech-drawer[opened]{transform:translateZ(0)}#guide-content.rolatech-drawer{background:var(--rt-base-background);flex:1;flex-basis:.000000001px;display:flex;flex-direction:column}#guide-inner-content.rolatech-drawer{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.rolatech-drawer{position:absolute;inset:0;transition-property:opacity;transform:translateZ(0);transition-duration:.2s;opacity:0;background:var(--rt-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.rolatech-drawer{opacity:1}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-drawer:not([persistent]) #guide-spacer{display:none}rolatech-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:var(--rt-drawer-active-background-color, rgba(0, 0, 0, .05));font-weight:500;border-radius:10px}.content{display:flex;flex-direction:column;overflow:visible}.app-drawer-button{background-color:var(--rt-brand-color, #000);color:var(--rt-brand-color-inverse, #fff)}.app-drawer-button:hover{box-shadow:0 1px 3px #3c40434d,0 4px 8px 3px #3c404326;background-color:var(--rt-brand-color, #c2e7ff)}#endpoint.rt-guide-entry:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }, { kind: "component", type: MenuIconComponent, selector: "rolatech-menu-icon" }, { kind: "ngmodule", type: MatButtonModule }], animations: [heightAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
344
325
|
}
|
|
345
326
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: DrawerComponent, decorators: [{
|
|
346
327
|
type: Component,
|
|
@@ -356,7 +337,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
356
337
|
IconComponent,
|
|
357
338
|
MenuIconComponent,
|
|
358
339
|
MatButtonModule,
|
|
359
|
-
], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [heightAnimation], template: "<div id=\"scrim\" #scrim class=\"rolatech-drawer\" (click)=\"close()\"></div>\n<div id=\"contentContainer\" #content class=\"rolatech-drawer\">\n <div id=\"guide-wrapper\" class=\"rolatech-drawer\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\" class=\"rolatech-drawer\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-menu-icon #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\"></rolatech-menu-icon>\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"rolatech-drawer\">\n @if (completed) {\n <div>\n <div class=\"block p-3\">\n @for (item of links(); track $index) {\n @if (item.children) {\n <div class=\"cursor-pointer\">\n <div class=\"flex items-center h-11 mr-2\" (click)=\"panelOpenState = !panelOpenState\">\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n <span class=\"ml-3\">{{ item.title }}</span>\n <div class=\"flex-1\"></div>\n <rolatech-icon\n style=\"transition-duration:.5s;transform: {{ panelOpenState ? 'rotate(180deg)' : 'rotate(0deg)' }};\"\n >expand_more</rolatech-icon\n >\n </div>\n <div class=\"flex flex-col pl-8\" [@heightAnimation]=\"panelOpenState === true ? 'open' : 'closed'\">\n @for (child of item.children; track child) {\n <a\n id=\"endpoint\"\n [routerLink]=\"child.link\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n class=\"p-3 rt-guide-entry
|
|
340
|
+
], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [heightAnimation], template: "<div id=\"scrim\" #scrim class=\"rolatech-drawer\" (click)=\"close()\"></div>\n<div id=\"contentContainer\" #content class=\"rolatech-drawer\">\n <div id=\"guide-wrapper\" class=\"rolatech-drawer\">\n <div id=\"guide-spacer\"></div>\n <div id=\"guide-content\" class=\"rolatech-drawer\">\n <div id=\"header\" #header class=\"flex pl-4 h-14 items-center\">\n <rolatech-menu-icon #menuButton (click)=\"this.toggle()\" onclick=\"this.blur()\"></rolatech-menu-icon>\n <div class=\"text-[--rt-text-primary] text-lg md:text-xl font-bold\" routerLink=\"/\">\n <span class=\"text-orange-600\">{{ appLayout.title }}</span>\n <span>{{ appLayout.subtitle }}</span>\n </div>\n </div>\n <div id=\"guide-inner-content\" class=\"rolatech-drawer\">\n @if (completed) {\n <div>\n <div class=\"block p-3\">\n @for (item of links(); track $index) {\n @if (item.children) {\n <div class=\"cursor-pointer\">\n <div class=\"flex items-center h-11 mr-2\" (click)=\"panelOpenState = !panelOpenState\">\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n <span class=\"ml-3\">{{ item.title }}</span>\n <div class=\"flex-1\"></div>\n <rolatech-icon\n style=\"transition-duration:.5s;transform: {{ panelOpenState ? 'rotate(180deg)' : 'rotate(0deg)' }};\"\n >expand_more</rolatech-icon\n >\n </div>\n <div class=\"flex flex-col pl-8\" [@heightAnimation]=\"panelOpenState === true ? 'open' : 'closed'\">\n @for (child of item.children; track child) {\n <a\n id=\"endpoint\"\n [routerLink]=\"child.link\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n class=\"p-3 rt-guide-entry\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <span class=\"text-sm\">{{ child.title }}</span>\n </a>\n }\n </div>\n </div>\n } @else {\n @if (item.openinView) {\n <a\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11\"\n [href]=\"item.link\"\n target=\"_blank\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm opacity-75\">{{ item.subtitle }}</span>\n </div>\n </div>\n <rolatech-icon class=\"scale-90 mr-3\">open_in_new</rolatech-icon>\n </div>\n </a>\n } @else {\n @if (item.button) {\n <a\n class=\"flex app-drawer-button min-h-11 rounded-xl mb-2\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n } @else {\n <a\n id=\"endpoint\"\n class=\"flex hover:bg-[--rt-10-percent-layer] min-h-11 rt-guide-entry\"\n [routerLink]=\"item.link\"\n (click)=\"this.isPersistent ? '' : this.close()\"\n routerLinkActive=\"drawer-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n >\n <div class=\"flex justify-between items-center w-full\">\n <div class=\"flex justify-start\">\n @if (item.icon) {\n <rolatech-icon class=\"ml-3\" [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n }\n <div class=\"flex flex-col ml-3\">\n <span>{{ item.title }}</span>\n <span class=\"text-sm\">{{ item.subtitle }}</span>\n </div>\n </div>\n </div>\n </a>\n }\n }\n }\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n", styles: ["rolatech-drawer{position:fixed;z-index:1;inset:-120px 0;visibility:hidden;transition-property:visibility;transition-duration:.2s;touch-action:pan-y}rolatech-drawer[persistent]{width:var(--rt-drawer-width, 256px)}rolatech-drawer[persistent][position=top]{width:100%}rolatech-drawer[opened]{visibility:visible}rolatech-drawer[position=top] #contentContainer{left:0;right:0;width:100%;height:var(--rt-topbar-height, 56px);transform:translate3d(0,-100%,0)}rolatech-drawer[position=top] #contentContainer #guide-inner-content{height:56px}rolatech-drawer[position=top] #contentContainer #guide-inner-content div{display:flex!important;flex-direction:row!important;overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;height:56px;align-items:center}rolatech-drawer[position=bottom] #contentContainer{left:0;right:0;transform:translate3d(0,100%,0)}rolatech-drawer[position=left] #contentContainer{left:0;transform:translate3d(-100%,0,0)}rolatech-drawer[position=right] #contentContainer{right:0;transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=left]{right:auto}rolatech-drawer[persistent][position=right]{left:auto}rolatech-drawer[persistent][position=top] #contentContainer{transform:translate3d(0,-100%,0)}rolatech-drawer[persistent][position=left] #contentContainer{transform:translate3d(-100%,0,0)}rolatech-drawer[persistent][position=right] #contentContainer{transform:translate3d(100%,0,0)}rolatech-drawer[persistent][position=top] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=left] #contentContainer[opened]{transform:translateZ(0)}rolatech-drawer[persistent][position=right] #contentContainer[opened]{transform:translateZ(0)}[hidden]{display:none!important}#guide-wrapper.rolatech-drawer{height:100%;display:flexbox;display:flex;flex-direction:column}#contentContainer.rolatech-drawer{position:absolute;top:0;bottom:0;width:var(--rt-drawer-width, 256px);padding:var(--rt-drawer-content-padding, 120px 0);transition-property:transform;transition-duration:0ms;color:var(--rt-drawer-content-container-color, #000);background-color:var(--rt-drawer-content-container-background-color, #fff);transition-duration:.2s}#contentContainer.rolatech-drawer[opened]{transform:translateZ(0)}#guide-content.rolatech-drawer{background:var(--rt-base-background);flex:1;flex-basis:.000000001px;display:flex;flex-direction:column}#guide-inner-content.rolatech-drawer{overflow:hidden;flex:1;flex-basis:.000000001px;overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin}#scrim.rolatech-drawer{position:absolute;inset:0;transition-property:opacity;transform:translateZ(0);transition-duration:.2s;opacity:0;background:var(--rt-drawer-scrim-background, rgba(0, 0, 0, .5))}#scrim.visible.rolatech-drawer{opacity:1}#guide-spacer{margin-top:var(--ytd-masthead-height, 56px)}rolatech-drawer:not([persistent]) #guide-spacer{display:none}rolatech-drawer:not([persistent]){z-index:2030}.drawer-active{background-color:var(--rt-drawer-active-background-color, rgba(0, 0, 0, .05));font-weight:500;border-radius:10px}.content{display:flex;flex-direction:column;overflow:visible}.app-drawer-button{background-color:var(--rt-brand-color, #000);color:var(--rt-brand-color-inverse, #fff)}.app-drawer-button:hover{box-shadow:0 1px 3px #3c40434d,0 4px 8px 3px #3c404326;background-color:var(--rt-brand-color, #c2e7ff)}#endpoint.rt-guide-entry:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\n"] }]
|
|
360
341
|
}], propDecorators: { hostId: [{
|
|
361
342
|
type: HostBinding,
|
|
362
343
|
args: ['id']
|
|
@@ -425,11 +406,11 @@ class MiniGuideComponent {
|
|
|
425
406
|
this.opened ? this.close() : this.open();
|
|
426
407
|
}
|
|
427
408
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: MiniGuideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
428
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: MiniGuideComponent, isStandalone: true, selector: "rolatech-mini-guide", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.rolatech-mini-guide": "this.hasClass" } }, ngImport: i0, template: "<div id=\"items\" class=\"w-16 mt-[6px]\" style=\"transition-duration: 200ms\">\n @for (item of items(); track $index) {\n <div>\n <a\n [routerLink]=\"item.link\"\n routerLinkActive=\"min-guide-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n class=\"flex flex-col justify-center items-center py-
|
|
409
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: MiniGuideComponent, isStandalone: true, selector: "rolatech-mini-guide", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "id": "this.hasId", "class.rolatech-mini-guide": "this.hasClass" } }, ngImport: i0, template: "<div id=\"items\" class=\"w-16 mt-[6px]\" style=\"transition-duration: 200ms\">\n @for (item of items(); track $index) {\n <div>\n <a\n id=\"min-guide-endpoint\"\n [routerLink]=\"item.link\"\n routerLinkActive=\"min-guide-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n class=\"flex flex-col justify-center items-center py-3 rt-guide-entry\"\n >\n <rolatech-icon [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n @if (title()) {\n <span class=\"text-xs mt-1 max-w-full truncate\">{{ item.title }}</span>\n }\n </a>\n </div>\n }\n</div>\n", styles: [".rolatech-mini-guide{position:fixed;left:0;top:var(--rt-toolbar-height, 56px);bottom:0;width:var(--rt-mini-guide-width, 72px);box-sizing:border-box;display:inline-block;background-color:var(--rt-base-background, #fff);color:var(--rt-text-primary, #000);z-index:2028;padding:0 4px}.min-guide-active{background-color:#0000000d;border-radius:8px;font-weight:500}#min-guide-endpoint.rt-guide-entry:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
429
410
|
}
|
|
430
411
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: MiniGuideComponent, decorators: [{
|
|
431
412
|
type: Component,
|
|
432
|
-
args: [{ selector: 'rolatech-mini-guide', standalone: true, imports: [CommonModule, IconButtonComponent, IconComponent, RouterLink, RouterLinkActive], encapsulation: ViewEncapsulation.None, template: "<div id=\"items\" class=\"w-16 mt-[6px]\" style=\"transition-duration: 200ms\">\n @for (item of items(); track $index) {\n <div>\n <a\n [routerLink]=\"item.link\"\n routerLinkActive=\"min-guide-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n class=\"flex flex-col justify-center items-center py-
|
|
413
|
+
args: [{ selector: 'rolatech-mini-guide', standalone: true, imports: [CommonModule, IconButtonComponent, IconComponent, RouterLink, RouterLinkActive], encapsulation: ViewEncapsulation.None, template: "<div id=\"items\" class=\"w-16 mt-[6px]\" style=\"transition-duration: 200ms\">\n @for (item of items(); track $index) {\n <div>\n <a\n id=\"min-guide-endpoint\"\n [routerLink]=\"item.link\"\n routerLinkActive=\"min-guide-active\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n #routerLink=\"routerLinkActive\"\n class=\"flex flex-col justify-center items-center py-3 rt-guide-entry\"\n >\n <rolatech-icon [filled]=\"routerLink.isActive\">{{ item.icon }}</rolatech-icon>\n @if (title()) {\n <span class=\"text-xs mt-1 max-w-full truncate\">{{ item.title }}</span>\n }\n </a>\n </div>\n }\n</div>\n", styles: [".rolatech-mini-guide{position:fixed;left:0;top:var(--rt-toolbar-height, 56px);bottom:0;width:var(--rt-mini-guide-width, 72px);box-sizing:border-box;display:inline-block;background-color:var(--rt-base-background, #fff);color:var(--rt-text-primary, #000);z-index:2028;padding:0 4px}.min-guide-active{background-color:#0000000d;border-radius:8px;font-weight:500}#min-guide-endpoint.rt-guide-entry:hover{background-color:var(--rt-drawer-active-background-color);border-radius:10px}\n"] }]
|
|
433
414
|
}], propDecorators: { hasId: [{
|
|
434
415
|
type: HostBinding,
|
|
435
416
|
args: ['id']
|
|
@@ -1013,15 +994,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
1013
994
|
class WechatConnectDialogComponent {
|
|
1014
995
|
dialogRef = inject(MatDialogRef);
|
|
1015
996
|
environment = inject(APP_CONFIG);
|
|
1016
|
-
|
|
997
|
+
appId = model();
|
|
998
|
+
redirectUri = model('');
|
|
999
|
+
state = model();
|
|
1017
1000
|
urlSafe;
|
|
1018
1001
|
sanitizer = inject(DomSanitizer);
|
|
1019
1002
|
baseUrl = 'https://open.weixin.qq.com/connect/qrconnect';
|
|
1003
|
+
loaded = false;
|
|
1020
1004
|
constructor() {
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1005
|
+
effect(() => {
|
|
1006
|
+
const href = 'https://cloudcache.tencent-cloud.com/open_proj/proj_qcloud_v2/gateway/login-regist/css/link-wx-login.css';
|
|
1007
|
+
// const encodedURI = encodeURI(this.redirectUri());
|
|
1008
|
+
const encodedURI = encodeURI('https://accounts.pinxiaoke.cn');
|
|
1009
|
+
const src = `${this.baseUrl}?appid=${this.appId()}&response_type=code&self_redirect=true&scope=snsapi_login&href=${href}&redirect_uri=${encodedURI}&state=${this.state()}#wechat_redirect`;
|
|
1010
|
+
this.urlSafe = this.sanitizer.bypassSecurityTrustResourceUrl(src);
|
|
1011
|
+
this.loaded = true;
|
|
1012
|
+
});
|
|
1025
1013
|
}
|
|
1026
1014
|
onNoClick() {
|
|
1027
1015
|
this.dialogRef.close();
|
|
@@ -1032,11 +1020,11 @@ class WechatConnectDialogComponent {
|
|
|
1032
1020
|
}
|
|
1033
1021
|
}
|
|
1034
1022
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: WechatConnectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1035
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
1023
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: WechatConnectDialogComponent, isStandalone: true, selector: "rolatech-wechat-connect-dialog", inputs: { appId: { classPropertyName: "appId", publicName: "appId", isSignal: true, isRequired: false, transformFunction: null }, redirectUri: { classPropertyName: "redirectUri", publicName: "redirectUri", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { appId: "appIdChange", redirectUri: "redirectUriChange", state: "stateChange" }, host: { listeners: { "window:message": "onLogin($event)" } }, ngImport: i0, template: "<div class=\"flex flex-col p-3\">\n <div class=\"w-[190px] h-[190px]\">\n @if (loaded) {\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n }\n </div>\n</div>\n", styles: ["*{margin:0;padding:0}.normalPanel .panelContent{width:188px;height:188px}.normalPanel .wrp_code{position:relative;width:188px;height:188px;margin:0}.impowerBox .title,.normalPanel .info{display:none}.impowerBox .qrcode{margin-top:0;border:0;width:188px;height:188px}#MAXIM{content:\"veg20170418191511\"}mat-mdc-dialog-content mdc-dialog__content{padding:0}\n"] });
|
|
1036
1024
|
}
|
|
1037
1025
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: WechatConnectDialogComponent, decorators: [{
|
|
1038
1026
|
type: Component,
|
|
1039
|
-
args: [{ selector: 'rolatech-wechat-connect-dialog', standalone: true, template: "<div class=\"flex flex-col p-3\">\n <div class=\"
|
|
1027
|
+
args: [{ selector: 'rolatech-wechat-connect-dialog', standalone: true, template: "<div class=\"flex flex-col p-3\">\n <div class=\"w-[190px] h-[190px]\">\n @if (loaded) {\n <iframe [src]=\"urlSafe\" class=\"w-full h-full inline\" scrolling=\"no\" frameBorder=\"no\"></iframe>\n }\n </div>\n</div>\n", styles: ["*{margin:0;padding:0}.normalPanel .panelContent{width:188px;height:188px}.normalPanel .wrp_code{position:relative;width:188px;height:188px;margin:0}.impowerBox .title,.normalPanel .info{display:none}.impowerBox .qrcode{margin-top:0;border:0;width:188px;height:188px}#MAXIM{content:\"veg20170418191511\"}mat-mdc-dialog-content mdc-dialog__content{padding:0}\n"] }]
|
|
1040
1028
|
}], ctorParameters: () => [], propDecorators: { onLogin: [{
|
|
1041
1029
|
type: HostListener,
|
|
1042
1030
|
args: ['window:message', ['$event']]
|
|
@@ -1237,20 +1225,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
1237
1225
|
}] });
|
|
1238
1226
|
|
|
1239
1227
|
class PaginatorComponent {
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
pageSizeOptions = [5, 10, 25, 100];
|
|
1243
|
-
pageEvent;
|
|
1244
|
-
page = output();
|
|
1245
|
-
onPage(event) {
|
|
1246
|
-
this.page.emit(event);
|
|
1247
|
-
}
|
|
1228
|
+
prevClick() { }
|
|
1229
|
+
nextClick() { }
|
|
1248
1230
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1249
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.3", type: PaginatorComponent, isStandalone: true, selector: "rolatech-paginator",
|
|
1231
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.3", type: PaginatorComponent, isStandalone: true, selector: "rolatech-paginator", ngImport: i0, template: "<div class=\"flex h-14 items-center\">\n <button mat-icon-button></button>\n <button mat-icon-button (click)=\"prevClick()\">\n <mat-icon>chevron_left</mat-icon>\n </button>\n <div></div>\n <button mat-icon-button (click)=\"nextClick()\">\n <mat-icon>chevron_right</mat-icon>\n </button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1250
1232
|
}
|
|
1251
1233
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
1252
1234
|
type: Component,
|
|
1253
|
-
args: [{ selector: 'rolatech-paginator', standalone: true, imports: [CommonModule,
|
|
1235
|
+
args: [{ selector: 'rolatech-paginator', standalone: true, imports: [CommonModule, MatButtonModule, MatIconModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"flex h-14 items-center\">\n <button mat-icon-button></button>\n <button mat-icon-button (click)=\"prevClick()\">\n <mat-icon>chevron_left</mat-icon>\n </button>\n <div></div>\n <button mat-icon-button (click)=\"nextClick()\">\n <mat-icon>chevron_right</mat-icon>\n </button>\n</div>\n" }]
|
|
1254
1236
|
}] });
|
|
1255
1237
|
|
|
1256
1238
|
class MediaPreviewComponent {
|
|
@@ -1698,11 +1680,11 @@ class RichViewComponent {
|
|
|
1698
1680
|
}
|
|
1699
1681
|
}
|
|
1700
1682
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: RichViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1701
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.3", type: RichViewComponent, isStandalone: true, selector: "rolatech-rich-view", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-view": "this.hasClass", "class.scrollbar-hide": "this.disableScrollbar" } }, queries: [{ propertyName: "items", predicate: RichItemComponent, read: ElementRef, isSignal: true }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["rolatech-rich-view{display:flex;--rt-rich-view-items-per-row: 1;--rt-rich-view-item-max-width: 500px}rolatech-rich-view[list]{flex-direction:column;flex-wrap:nowrap}rolatech-rich-view[wrap]{flex-wrap:wrap}rolatech-rich-view:not([wrap]){overflow-x:scroll}rolatech-rich-view:not([wrap]) rolatech-rich-item{min-width:40%}rolatech-rich-view[list] rolatech-rich-item{flex-direction:row;padding:12px}rolatech-rich-view[list] rolatech-rich-item #thumbnail.rolatech-rich-item{width:33%;min-width:33%}rolatech-rich-view[list] rolatech-rich-item #details.rolatech-rich-item{margin-left:12px}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:32px}@media (min-width: 600px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 1}}@media (min-width: 700px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 2}}@media (min-width: 1280px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 5}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1683
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.0.3", type: RichViewComponent, isStandalone: true, selector: "rolatech-rich-view", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rolatech-rich-view": "this.hasClass", "class.scrollbar-hide": "this.disableScrollbar" } }, queries: [{ propertyName: "items", predicate: RichItemComponent, read: ElementRef, isSignal: true }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["rolatech-rich-view{display:flex;--rt-rich-view-items-per-row: 1;--rt-rich-view-item-max-width: 500px}rolatech-rich-view[list]{flex-direction:column;flex-wrap:nowrap}rolatech-rich-view[wrap]{flex-wrap:wrap}rolatech-rich-view:not([wrap]){overflow-x:scroll}rolatech-rich-view:not([wrap]) rolatech-rich-item{min-width:40%}rolatech-rich-view[list] rolatech-rich-item{flex-direction:row;padding:12px 0;cursor:pointer}rolatech-rich-view[list] rolatech-rich-item #thumbnail.rolatech-rich-item{width:33%;min-width:33%}rolatech-rich-view[list] rolatech-rich-item #details.rolatech-rich-item{margin-left:12px}rolatech-rich-view[list] rolatech-rich-item:hover{background-color:var(--rt-10-percent-layer)}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:32px}@media (min-width: 600px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 1}}@media (min-width: 700px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 2}}@media (min-width: 1280px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 5}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1702
1684
|
}
|
|
1703
1685
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: RichViewComponent, decorators: [{
|
|
1704
1686
|
type: Component,
|
|
1705
|
-
args: [{ selector: 'rolatech-rich-view', standalone: true, imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: ["rolatech-rich-view{display:flex;--rt-rich-view-items-per-row: 1;--rt-rich-view-item-max-width: 500px}rolatech-rich-view[list]{flex-direction:column;flex-wrap:nowrap}rolatech-rich-view[wrap]{flex-wrap:wrap}rolatech-rich-view:not([wrap]){overflow-x:scroll}rolatech-rich-view:not([wrap]) rolatech-rich-item{min-width:40%}rolatech-rich-view[list] rolatech-rich-item{flex-direction:row;padding:12px}rolatech-rich-view[list] rolatech-rich-item #thumbnail.rolatech-rich-item{width:33%;min-width:33%}rolatech-rich-view[list] rolatech-rich-item #details.rolatech-rich-item{margin-left:12px}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:32px}@media (min-width: 600px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 1}}@media (min-width: 700px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 2}}@media (min-width: 1280px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 5}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
|
|
1687
|
+
args: [{ selector: 'rolatech-rich-view', standalone: true, imports: [CommonModule, ThumbnailComponent], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: ["rolatech-rich-view{display:flex;--rt-rich-view-items-per-row: 1;--rt-rich-view-item-max-width: 500px}rolatech-rich-view[list]{flex-direction:column;flex-wrap:nowrap}rolatech-rich-view[wrap]{flex-wrap:wrap}rolatech-rich-view:not([wrap]){overflow-x:scroll}rolatech-rich-view:not([wrap]) rolatech-rich-item{min-width:40%}rolatech-rich-view[list] rolatech-rich-item{flex-direction:row;padding:12px 0;cursor:pointer}rolatech-rich-view[list] rolatech-rich-item #thumbnail.rolatech-rich-item{width:33%;min-width:33%}rolatech-rich-view[list] rolatech-rich-item #details.rolatech-rich-item{margin-left:12px}rolatech-rich-view[list] rolatech-rich-item:hover{background-color:var(--rt-10-percent-layer)}rolatech-rich-view:not([list]) rolatech-rich-item{margin-bottom:32px}@media (min-width: 600px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 1}}@media (min-width: 700px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 2}}@media (min-width: 1280px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 3}}@media (min-width: 1536px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 4}}@media (min-width: 1920px){rolatech-rich-view:not([list]){--rt-rich-view-items-per-row: 5}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
|
|
1706
1688
|
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
1707
1689
|
type: HostBinding,
|
|
1708
1690
|
args: ['class.rolatech-rich-view']
|
|
@@ -1711,9 +1693,144 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
1711
1693
|
args: ['class.scrollbar-hide']
|
|
1712
1694
|
}] } });
|
|
1713
1695
|
|
|
1696
|
+
class EditorComponent {
|
|
1697
|
+
platformId = inject(PLATFORM_ID);
|
|
1698
|
+
isBrowser;
|
|
1699
|
+
editor;
|
|
1700
|
+
constructor() {
|
|
1701
|
+
this.isBrowser = isPlatformBrowser(this.platformId);
|
|
1702
|
+
// const options = {
|
|
1703
|
+
// debug: 'info',
|
|
1704
|
+
// modules: {
|
|
1705
|
+
// toolbar: true,
|
|
1706
|
+
// },
|
|
1707
|
+
// placeholder: 'Compose an epic...',
|
|
1708
|
+
// theme: 'snow',
|
|
1709
|
+
// };
|
|
1710
|
+
// const quill = new Quill('#editor', options);
|
|
1711
|
+
}
|
|
1712
|
+
ngAfterViewInit() {
|
|
1713
|
+
// this.quill();
|
|
1714
|
+
}
|
|
1715
|
+
ngOnInit() {
|
|
1716
|
+
this.quill();
|
|
1717
|
+
}
|
|
1718
|
+
get toolbar() {
|
|
1719
|
+
return [
|
|
1720
|
+
['bold', 'italic', 'underline', 'strike'], // toggled buttons
|
|
1721
|
+
['blockquote', 'code-block'],
|
|
1722
|
+
// [{ header: 1 }, { header: 2 }], // custom button values
|
|
1723
|
+
[{ list: 'ordered' }, { list: 'bullet' }],
|
|
1724
|
+
[{ script: 'sub' }, { script: 'super' }], // superscript/subscript
|
|
1725
|
+
[{ indent: '-1' }, { indent: '+1' }], // outdent/indent
|
|
1726
|
+
[{ direction: 'rtl' }], // text direction
|
|
1727
|
+
// [{ size: ['small', false, 'large', 'huge'] }], // custom dropdown
|
|
1728
|
+
[{ header: [1, 2, 3, 4, 5, 6, false] }],
|
|
1729
|
+
// [{ color: [] }, { background: [] }], // dropdown with defaults from theme
|
|
1730
|
+
[{ font: [] }],
|
|
1731
|
+
[{ align: [] }],
|
|
1732
|
+
['clean'], // remove formatting button
|
|
1733
|
+
];
|
|
1734
|
+
}
|
|
1735
|
+
async quill() {
|
|
1736
|
+
if (this.isBrowser) {
|
|
1737
|
+
const m = await import('quill');
|
|
1738
|
+
console.log(`🚀 => AppComponent => quill => m:`, m);
|
|
1739
|
+
this.editor = new m.default('#editor', {
|
|
1740
|
+
// modules: { toolbar: '#toolbar' },
|
|
1741
|
+
modules: { toolbar: this.toolbar },
|
|
1742
|
+
theme: 'snow',
|
|
1743
|
+
placeholder: 'placeholder',
|
|
1744
|
+
});
|
|
1745
|
+
console.log(`🚀 => AppComponent => quill => this.editor:`, this.editor);
|
|
1746
|
+
}
|
|
1747
|
+
}
|
|
1748
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: EditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1749
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.3", type: EditorComponent, isStandalone: true, selector: "rolatech-editor", ngImport: i0, template: "<div id=\"editor\"></div>\n", styles: ["@import\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\";.ql-snow{position:relative}.ql-snow .ql-toolbar{position:sticky;top:5em}.ql-snow button{width:inherit!important;height:24px!important}.ql-snow .ql-editor{border:4px solid #efefef}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1750
|
+
}
|
|
1751
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: EditorComponent, decorators: [{
|
|
1752
|
+
type: Component,
|
|
1753
|
+
args: [{ selector: 'rolatech-editor', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div id=\"editor\"></div>\n", styles: ["@import\"https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css\";.ql-snow{position:relative}.ql-snow .ql-toolbar{position:sticky;top:5em}.ql-snow button{width:inherit!important;height:24px!important}.ql-snow .ql-editor{border:4px solid #efefef}\n"] }]
|
|
1754
|
+
}], ctorParameters: () => [] });
|
|
1755
|
+
|
|
1756
|
+
class AccordionComponent {
|
|
1757
|
+
hasClass = true;
|
|
1758
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1759
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.3", type: AccordionComponent, isStandalone: true, selector: "rolatech-accordion", host: { properties: { "class.rolatech-accordion": "this.hasClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
1760
|
+
}
|
|
1761
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: AccordionComponent, decorators: [{
|
|
1762
|
+
type: Component,
|
|
1763
|
+
args: [{ selector: 'rolatech-accordion', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
|
|
1764
|
+
}], propDecorators: { hasClass: [{
|
|
1765
|
+
type: HostBinding,
|
|
1766
|
+
args: ['class.rolatech-accordion']
|
|
1767
|
+
}] } });
|
|
1768
|
+
|
|
1769
|
+
const PANEL_ANIMATION_TIMING = '225ms cubic-bezier(0.4,0.0,0.2,1)';
|
|
1770
|
+
const panelAnimations = {
|
|
1771
|
+
/** Animation that rotates the indicator arrow. */
|
|
1772
|
+
indicator: trigger('indicator', [
|
|
1773
|
+
state('collapsed, void', style({ transform: 'rotate(0deg)' })),
|
|
1774
|
+
state('expanded', style({ transform: 'rotate(180deg)' })),
|
|
1775
|
+
transition('expanded <=> collapsed, void => collapsed', animate(PANEL_ANIMATION_TIMING)),
|
|
1776
|
+
]),
|
|
1777
|
+
/** Animation that expands and collapses the panel content. */
|
|
1778
|
+
content: trigger('content', [
|
|
1779
|
+
state('collapsed, void', style({ height: '0px', visibility: 'hidden' })),
|
|
1780
|
+
state('expanded', style({ height: '*', visibility: 'visible' })),
|
|
1781
|
+
transition('expanded <=> collapsed, void => collapsed', animate(PANEL_ANIMATION_TIMING)),
|
|
1782
|
+
]),
|
|
1783
|
+
};
|
|
1784
|
+
|
|
1785
|
+
class PanelComponent {
|
|
1786
|
+
hasClass = true;
|
|
1787
|
+
border = input(false, { transform: booleanAttribute });
|
|
1788
|
+
divider = input(false, { transform: booleanAttribute });
|
|
1789
|
+
expanded = model(false);
|
|
1790
|
+
title = input();
|
|
1791
|
+
subtitle = input();
|
|
1792
|
+
el = inject(ElementRef);
|
|
1793
|
+
constructor() {
|
|
1794
|
+
effect(() => {
|
|
1795
|
+
if (this.expanded()) {
|
|
1796
|
+
this.el.nativeElement.setAttribute('expanded', '');
|
|
1797
|
+
}
|
|
1798
|
+
else {
|
|
1799
|
+
this.el.nativeElement.removeAttribute('expanded');
|
|
1800
|
+
}
|
|
1801
|
+
if (this.border()) {
|
|
1802
|
+
this.el.nativeElement.setAttribute('border', '');
|
|
1803
|
+
}
|
|
1804
|
+
else {
|
|
1805
|
+
this.el.nativeElement.removeAttribute('border');
|
|
1806
|
+
}
|
|
1807
|
+
if (this.divider()) {
|
|
1808
|
+
this.el.nativeElement.setAttribute('divider', '');
|
|
1809
|
+
}
|
|
1810
|
+
else {
|
|
1811
|
+
this.el.nativeElement.removeAttribute('divider');
|
|
1812
|
+
}
|
|
1813
|
+
});
|
|
1814
|
+
}
|
|
1815
|
+
ngOnInit() { }
|
|
1816
|
+
ngAfterViewInit() { }
|
|
1817
|
+
toggle() {
|
|
1818
|
+
this.expanded.set(!this.expanded());
|
|
1819
|
+
}
|
|
1820
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1821
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.3", type: PanelComponent, isStandalone: true, selector: "rolatech-panel", inputs: { border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { properties: { "class.rolatech-panel": "this.hasClass" } }, ngImport: i0, template: "<div id=\"header\" class=\"header rolatech-panel w-full h-11\" (click)=\"toggle(); $event.stopPropagation()\">\n <div>{{ title() }}</div>\n <rolatech-icon [@indicator]=\"expanded() === true ? 'expanded' : 'collapsed'\">expand_more</rolatech-icon>\n</div>\n<div class=\"content-container rolatech-panel\" [@content]=\"expanded() === true ? 'expanded' : 'collapsed'\">\n <div class=\"content-inner rolatech-panel\">\n <ng-content>No content</ng-content>\n </div>\n</div>\n", styles: ["rolatech-panel{box-sizing:content-box;display:block;overflow:hidden;background:var(--rt-base-background);color:var(--rt-text-primary);--rt-panel-padding: 12px;margin-bottom:var(--rt-panel-padding)}rolatech-panel .header{padding:var(--rt-panel-padding);cursor:pointer;display:flex;justify-content:space-between;align-items:center;height:44px;background-color:var(--rt-10-percent-layer)}rolatech-panel .header:hover{background-color:var(--rt-20-percent-layer)}rolatech-panel .content-container{overflow:visible}rolatech-panel .content-container .content-inner{padding:var(--rt-panel-padding)}rolatech-panel[border]{border-top:1px solid #d1d7dc;border-left:1px solid #d1d7dc;border-right:1px solid #d1d7dc}rolatech-panel[border]:last-child{border-bottom:1px solid #d1d7dc}rolatech-panel[divider]{border-bottom:1px solid #d1d7dc}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IconComponent, selector: "rolatech-icon", inputs: ["filled"] }], animations: [panelAnimations.indicator, panelAnimations.content], encapsulation: i0.ViewEncapsulation.None });
|
|
1822
|
+
}
|
|
1823
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: PanelComponent, decorators: [{
|
|
1824
|
+
type: Component,
|
|
1825
|
+
args: [{ selector: 'rolatech-panel', standalone: true, imports: [CommonModule, IconComponent], encapsulation: ViewEncapsulation.None, animations: [panelAnimations.indicator, panelAnimations.content], template: "<div id=\"header\" class=\"header rolatech-panel w-full h-11\" (click)=\"toggle(); $event.stopPropagation()\">\n <div>{{ title() }}</div>\n <rolatech-icon [@indicator]=\"expanded() === true ? 'expanded' : 'collapsed'\">expand_more</rolatech-icon>\n</div>\n<div class=\"content-container rolatech-panel\" [@content]=\"expanded() === true ? 'expanded' : 'collapsed'\">\n <div class=\"content-inner rolatech-panel\">\n <ng-content>No content</ng-content>\n </div>\n</div>\n", styles: ["rolatech-panel{box-sizing:content-box;display:block;overflow:hidden;background:var(--rt-base-background);color:var(--rt-text-primary);--rt-panel-padding: 12px;margin-bottom:var(--rt-panel-padding)}rolatech-panel .header{padding:var(--rt-panel-padding);cursor:pointer;display:flex;justify-content:space-between;align-items:center;height:44px;background-color:var(--rt-10-percent-layer)}rolatech-panel .header:hover{background-color:var(--rt-20-percent-layer)}rolatech-panel .content-container{overflow:visible}rolatech-panel .content-container .content-inner{padding:var(--rt-panel-padding)}rolatech-panel[border]{border-top:1px solid #d1d7dc;border-left:1px solid #d1d7dc;border-right:1px solid #d1d7dc}rolatech-panel[border]:last-child{border-bottom:1px solid #d1d7dc}rolatech-panel[divider]{border-bottom:1px solid #d1d7dc}\n"] }]
|
|
1826
|
+
}], ctorParameters: () => [], propDecorators: { hasClass: [{
|
|
1827
|
+
type: HostBinding,
|
|
1828
|
+
args: ['class.rolatech-panel']
|
|
1829
|
+
}] } });
|
|
1830
|
+
|
|
1714
1831
|
/**
|
|
1715
1832
|
* Generated bundle index. Do not edit.
|
|
1716
1833
|
*/
|
|
1717
1834
|
|
|
1718
|
-
export { APP_LAYOUT, AngularComponentsModule, AppPageComponent, AvatarComponent, BaseComponent, ChipBarComponent, ConfirmationDialogComponent, ConsoleLayoutComponent, ContainerComponent, ContentComponent, DrawerComponent, EmptyComponent, FolderComponent, FooterComponent, IconButtonComponent, IconComponent, ImageComponent, ImagePlaceholderComponent, ImagePreviewDialogComponent, InputComponent, LayoutComponent, ListComponent, MaterialModule, MediaListComponent, MediaListItemComponent, MediaPreviewComponent, MediaPreviewDialogComponent, MediaUploadComponent, MediaUploadDialogComponent, MenuIconComponent, MenuUserComponent, MiniGuideComponent, NotFoundComponent, PaginatorComponent, RichItemComponent, RichViewComponent, SpacerComponent, SpinnerComponent, StorageBucketCreateComponent, StorageFileUploadComponent, StorageFolderCreateComponent, TabComponent, TableComponent, TabsComponent, ThumbnailComponent, TitleComponent, ToolbarComponent, TopbarAvatarMenuComponent, TopbarComponent, WechatConnectDialogComponent, provideAngularLayout };
|
|
1835
|
+
export { APP_LAYOUT, AccordionComponent, AngularComponentsModule, AppPageComponent, AvatarComponent, BaseComponent, ChipBarComponent, ConfirmationDialogComponent, ConsoleLayoutComponent, ContainerComponent, ContentComponent, DrawerComponent, EditorComponent, EmptyComponent, FolderComponent, FooterComponent, IconButtonComponent, IconComponent, ImageComponent, ImagePlaceholderComponent, ImagePreviewDialogComponent, InputComponent, LayoutComponent, ListComponent, MaterialModule, MediaListComponent, MediaListItemComponent, MediaPreviewComponent, MediaPreviewDialogComponent, MediaUploadComponent, MediaUploadDialogComponent, MenuIconComponent, MenuUserComponent, MiniGuideComponent, NotFoundComponent, PaginatorComponent, PanelComponent, RichItemComponent, RichViewComponent, SpacerComponent, SpinnerComponent, StorageBucketCreateComponent, StorageFileUploadComponent, StorageFolderCreateComponent, TabComponent, TableComponent, TabsComponent, ThumbnailComponent, TitleComponent, ToolbarComponent, TopbarAvatarMenuComponent, TopbarComponent, WechatConnectDialogComponent, provideAngularLayout };
|
|
1719
1836
|
//# sourceMappingURL=rolatech-angular-components.mjs.map
|