From 56dea18dfd0fe311e50aba582f241b08ce4d4b7b Mon Sep 17 00:00:00 2001 From: Harpush Date: Sat, 23 Nov 2024 13:43:38 +0200 Subject: [PATCH 1/3] fix: fork me on github ribbon --- src/index.html | 32 +++++++++++++++++--------------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/src/index.html b/src/index.html index 73829e58..e960f3d4 100644 --- a/src/index.html +++ b/src/index.html @@ -8,25 +8,27 @@ + + +

Loading...

-

Fork me on GitHub

+ Fork me on GitHub From b95c6cf21b9ac25cf45141da0a6ca1aa9bb69993 Mon Sep 17 00:00:00 2001 From: Harpush Date: Sat, 23 Nov 2024 13:46:50 +0200 Subject: [PATCH 2/3] fix: docs flex layout and split directive --- README.md | 6 +++--- projects/angular-split/package.json | 4 ++-- src/app/documentation/documentation.component.html | 2 +- src/app/documentation/documentation.component.ts | 5 ++--- src/app/home/home.component.ts | 2 +- 5 files changed, 9 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 1893d54b..1c2f0b4b 100644 --- a/README.md +++ b/README.md @@ -1,15 +1,15 @@ # angular-split [![npm latest version](https://img.shields.io/npm/v/angular-split/latest.svg?style=flat-square)](https://www.npmjs.com/package/angular-split) [![NPM next version](https://img.shields.io/npm/v/angular-split/next.svg?style=flat-square)](https://www.npmjs.com/package/angular-split) [![Discord](https://img.shields.io/discord/748677963142135818?color=7289DA&label=Angular%20Discord&logo=discord&logoColor=white&style=flat-square)](https://discord.gg/Qm9MPCg) -Angular UI library to split views and allow dragging to resize areas using CSS flexbox layout. +Angular UI library to split views and allow dragging to resize areas using CSS grid layout. Documentation and examples: [https://angular-split.github.io](https://angular-split.github.io) ### Credits -#### Built by [Bertrand Gaillard](https://github.com/bertrandg). +#### Built by [Bertrand Gaillard](https://github.com/bertrandg) -#### Maintained by: [Bram Borggreve](https://github.com/beeman) (As of 2020). +#### Maintained by: [Bram Borggreve](https://github.com/beeman) (As of 2020) #### Previously: [Bertrand Gaillard](https://github.com/bertrandg) (2016 to 2019) diff --git a/projects/angular-split/package.json b/projects/angular-split/package.json index 0d3ffee6..ffde3765 100644 --- a/projects/angular-split/package.json +++ b/projects/angular-split/package.json @@ -1,7 +1,7 @@ { "name": "angular-split", "version": "18.0.0", - "description": "Angular UI library to split views and allow dragging to resize areas using CSS flexbox layout.", + "description": "Angular UI library to split views and allow dragging to resize areas using CSS grid layout.", "author": "beeman", "repository": { "type": "git", @@ -23,7 +23,7 @@ "split", "split-pane", "split-area", - "flexbox" + "grid" ], "license": "Apache-2.0", "exports": { diff --git a/src/app/documentation/documentation.component.html b/src/app/documentation/documentation.component.html index 7bb2e4c3..bb1540b1 100644 --- a/src/app/documentation/documentation.component.html +++ b/src/app/documentation/documentation.component.html @@ -64,7 +64,7 @@

- SplitAreaDirective SplitAreaComponent (selector: 'as-split-area' / exportAs: 'asSplitArea')[visible] or `[size]` changes.
Warning: Transitions are not working for IE/Edge/Safari', + details: 'Add transition when toggling visibility using `[visible]` or `[size]` changes', }, ], outputs: [ @@ -124,7 +123,7 @@ export class DocumentationComponent { name: 'transitionEnd', value: 'SplitAreaSize[]', details: - 'Emit when transition ends (could be triggered from `[visible]` or `[size]` changes).
Only if `[useTransition]="true"`.
Warning: Transitions are not working for IE/Edge/Safari', + 'Emit when transition ends (could be triggered from `[visible]` or `[size]` changes).
Only if `[useTransition]="true"`', }, ], class: [ diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index a91c1fce..2655c2c8 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -32,7 +32,7 @@ import { Component, VERSION } from '@angular/core'

angular-split
-
Angular UI library to split views and allow dragging to resize areas using CSS flexbox layout.
+
Angular UI library to split views and allow dragging to resize areas using CSS grid layout.

Running on Angular v{{ version }}.
Date: Sat, 23 Nov 2024 13:47:47 +0200 Subject: [PATCH 3/3] fix: remove obsolete collapse expand example --- .../collapse-expand.component.ts | 82 ------------------- .../collapse-expand/collapse-expand.module.ts | 17 ---- src/app/examples/example-types.ts | 1 - src/app/examples/examples.routes.ts | 9 -- 4 files changed, 109 deletions(-) delete mode 100644 src/app/examples/collapse-expand/collapse-expand.component.ts delete mode 100644 src/app/examples/collapse-expand/collapse-expand.module.ts diff --git a/src/app/examples/collapse-expand/collapse-expand.component.ts b/src/app/examples/collapse-expand/collapse-expand.component.ts deleted file mode 100644 index 3e6f1912..00000000 --- a/src/app/examples/collapse-expand/collapse-expand.component.ts +++ /dev/null @@ -1,82 +0,0 @@ -import { Component, ViewChild, ViewChildren, QueryList, ChangeDetectionStrategy, HostBinding } from '@angular/core' -import { SplitComponent, SplitAreaComponent } from 'angular-split' - -import { AComponent } from '../../ui/components/AComponent' - -@Component({ - selector: 'sp-ex-class-collapse', - changeDetection: ChangeDetectionStrategy.OnPush, - styles: [ - ` - .btns { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: space-around; - } - .btns > div { - margin-bottom: 10px; - } - `, - ], - template: ` -
- -
- - -
- area #1 -
- - -
- area #2 -
- - -
- area #3 -
- - -
-
-
-
collapse(newSize:number = 0) will force the area the be the width given and its gutter disabled.
-
expand() will restore the area to its size before it was collapsed.
-
-

-
-
- - -
-
- - -
-
-
-
- -
-
- -
-
-
- `, -}) -export class CollapseExpandComponent extends AComponent { - @HostBinding('class') class = 'split-example-page' - - @ViewChild(SplitComponent) splitEl: SplitComponent - @ViewChildren(SplitAreaComponent) areasEl: QueryList -} diff --git a/src/app/examples/collapse-expand/collapse-expand.module.ts b/src/app/examples/collapse-expand/collapse-expand.module.ts deleted file mode 100644 index 8a1fcba7..00000000 --- a/src/app/examples/collapse-expand/collapse-expand.module.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { CommonModule } from '@angular/common' -import { NgModule } from '@angular/core' -import { RouterModule } from '@angular/router' -import { AngularSplitModule } from 'angular-split' -import { UiModule } from '../../ui/ui.module' -import { CollapseExpandComponent } from './collapse-expand.component' - -@NgModule({ - imports: [ - CommonModule, - UiModule, - RouterModule.forChild([{ path: '', component: CollapseExpandComponent }]), - AngularSplitModule, - ], - declarations: [CollapseExpandComponent], -}) -export class CollapseExpandModule {} diff --git a/src/app/examples/example-types.ts b/src/app/examples/example-types.ts index 1718ec89..f8a1c147 100644 --- a/src/app/examples/example-types.ts +++ b/src/app/examples/example-types.ts @@ -1,7 +1,6 @@ export enum ExampleEnum { CLICK = 'click', CODE = 'code', - COLLAPSE = 'collapse', DIR = 'dir', GEEK = 'geek', IFRAME = 'iframe', diff --git a/src/app/examples/examples.routes.ts b/src/app/examples/examples.routes.ts index d10695aa..470926a9 100644 --- a/src/app/examples/examples.routes.ts +++ b/src/app/examples/examples.routes.ts @@ -82,15 +82,6 @@ export const exampleRoutes: Routes = [ (m) => m.TogglingDomAndVisibilityModule, ), }, - { - data: { - type: ExampleEnum.COLLAPSE, - label: 'Collapse/Expand a specific area', - srcUrl: `${srcUrlBaseApp}/collapse-expand/collapse-expand.component.ts`, - }, - path: 'collapse-expand', - loadChildren: () => import('./collapse-expand/collapse-expand.module').then((m) => m.CollapseExpandModule), - }, { data: { type: ExampleEnum.CLICK,