From f109dadcab77c23dd3d315d21c1ad719bf6d7252 Mon Sep 17 00:00:00 2001
From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com>
Date: Wed, 18 Dec 2024 19:07:01 -0500
Subject: [PATCH 1/3] docs(segment): update angular to standalone
---
.../basic/angular/example_component_html.md | 19 +++++
.../basic/angular/example_component_ts.md | 11 +++
static/usage/v7/segment/basic/index.md | 20 ++++-
.../angular/example_component_ts.md | 2 +
.../colors/angular/example_component_html.md | 82 +++++++++++++++++++
.../colors/angular/example_component_ts.md | 11 +++
.../usage/v7/segment/theming/colors/index.md | 16 +++-
.../basic/angular/example_component_html.md | 19 +++++
.../basic/angular/example_component_ts.md | 11 +++
static/usage/v8/segment/basic/index.md | 20 ++++-
.../angular/example_component_ts.md | 2 +
.../colors/angular/example_component_html.md | 82 +++++++++++++++++++
.../colors/angular/example_component_ts.md | 11 +++
.../usage/v8/segment/theming/colors/index.md | 16 +++-
14 files changed, 314 insertions(+), 8 deletions(-)
create mode 100644 static/usage/v7/segment/basic/angular/example_component_html.md
create mode 100644 static/usage/v7/segment/basic/angular/example_component_ts.md
create mode 100644 static/usage/v7/segment/theming/colors/angular/example_component_html.md
create mode 100644 static/usage/v7/segment/theming/colors/angular/example_component_ts.md
create mode 100644 static/usage/v8/segment/basic/angular/example_component_html.md
create mode 100644 static/usage/v8/segment/basic/angular/example_component_ts.md
create mode 100644 static/usage/v8/segment/theming/colors/angular/example_component_html.md
create mode 100644 static/usage/v8/segment/theming/colors/angular/example_component_ts.md
diff --git a/static/usage/v7/segment/basic/angular/example_component_html.md b/static/usage/v7/segment/basic/angular/example_component_html.md
new file mode 100644
index 00000000000..c497151f125
--- /dev/null
+++ b/static/usage/v7/segment/basic/angular/example_component_html.md
@@ -0,0 +1,19 @@
+```html
+
+
+ Default
+
+
+ Segment
+
+
+
+
+
+ Disabled
+
+
+ Segment
+
+
+```
diff --git a/static/usage/v7/segment/basic/angular/example_component_ts.md b/static/usage/v7/segment/basic/angular/example_component_ts.md
new file mode 100644
index 00000000000..1b25b79b10d
--- /dev/null
+++ b/static/usage/v7/segment/basic/angular/example_component_ts.md
@@ -0,0 +1,11 @@
+```ts
+import { Component } from '@angular/core';
+import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
+
+@Component({
+ selector: 'app-example',
+ templateUrl: 'example.component.html',
+ imports: [IonLabel, IonSegment, IonSegmentButton],
+})
+export class ExampleComponent {}
+```
diff --git a/static/usage/v7/segment/basic/index.md b/static/usage/v7/segment/basic/index.md
index 3b98e622e39..dc16483ede8 100644
--- a/static/usage/v7/segment/basic/index.md
+++ b/static/usage/v7/segment/basic/index.md
@@ -3,6 +3,22 @@ import Playground from '@site/src/components/global/Playground';
import javascript from './javascript.md';
import react from './react.md';
import vue from './vue.md';
-import angular from './angular.md';
-
+import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_ts from './angular/example_component_ts.md';
+
+
diff --git a/static/usage/v7/segment/scrollable/angular/example_component_ts.md b/static/usage/v7/segment/scrollable/angular/example_component_ts.md
index 807b3ff6125..fb95a4ea914 100644
--- a/static/usage/v7/segment/scrollable/angular/example_component_ts.md
+++ b/static/usage/v7/segment/scrollable/angular/example_component_ts.md
@@ -1,5 +1,6 @@
```ts
import { Component } from '@angular/core';
+import { IonIcon, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { barbell, basket, call, globe, heart, home, person, pin, star, trash } from 'ionicons/icons';
@@ -8,6 +9,7 @@ import { barbell, basket, call, globe, heart, home, person, pin, star, trash } f
selector: 'app-example',
templateUrl: 'example.component.html',
styleUrls: ['example.component.css'],
+ imports: [IonIcon, IonSegment, IonSegmentButton],
})
export class ExampleComponent {
constructor() {
diff --git a/static/usage/v7/segment/theming/colors/angular/example_component_html.md b/static/usage/v7/segment/theming/colors/angular/example_component_html.md
new file mode 100644
index 00000000000..4787acc7ba3
--- /dev/null
+++ b/static/usage/v7/segment/theming/colors/angular/example_component_html.md
@@ -0,0 +1,82 @@
+```html
+
+
+ Default
+
+
+ Segment
+
+
+
+
+ Primary
+
+
+ Segment
+
+
+
+
+ Secondary
+
+
+ Segment
+
+
+
+
+ Tertiary
+
+
+ Segment
+
+
+
+
+ Success
+
+
+ Segment
+
+
+
+
+ Warning
+
+
+ Segment
+
+
+
+
+ Danger
+
+
+ Segment
+
+
+
+
+ Light
+
+
+ Segment
+
+
+
+
+ Medium
+
+
+ Segment
+
+
+
+
+ Dark
+
+
+ Segment
+
+
+```
diff --git a/static/usage/v7/segment/theming/colors/angular/example_component_ts.md b/static/usage/v7/segment/theming/colors/angular/example_component_ts.md
new file mode 100644
index 00000000000..1b25b79b10d
--- /dev/null
+++ b/static/usage/v7/segment/theming/colors/angular/example_component_ts.md
@@ -0,0 +1,11 @@
+```ts
+import { Component } from '@angular/core';
+import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
+
+@Component({
+ selector: 'app-example',
+ templateUrl: 'example.component.html',
+ imports: [IonLabel, IonSegment, IonSegmentButton],
+})
+export class ExampleComponent {}
+```
diff --git a/static/usage/v7/segment/theming/colors/index.md b/static/usage/v7/segment/theming/colors/index.md
index bdcf06a9deb..69423805864 100644
--- a/static/usage/v7/segment/theming/colors/index.md
+++ b/static/usage/v7/segment/theming/colors/index.md
@@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground';
import javascript from './javascript.md';
import react from './react.md';
import vue from './vue.md';
-import angular from './angular.md';
+
+import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_ts from './angular/example_component_ts.md';
diff --git a/static/usage/v8/segment/basic/angular/example_component_html.md b/static/usage/v8/segment/basic/angular/example_component_html.md
new file mode 100644
index 00000000000..c497151f125
--- /dev/null
+++ b/static/usage/v8/segment/basic/angular/example_component_html.md
@@ -0,0 +1,19 @@
+```html
+
+
+ Default
+
+
+ Segment
+
+
+
+
+
+ Disabled
+
+
+ Segment
+
+
+```
diff --git a/static/usage/v8/segment/basic/angular/example_component_ts.md b/static/usage/v8/segment/basic/angular/example_component_ts.md
new file mode 100644
index 00000000000..1b25b79b10d
--- /dev/null
+++ b/static/usage/v8/segment/basic/angular/example_component_ts.md
@@ -0,0 +1,11 @@
+```ts
+import { Component } from '@angular/core';
+import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
+
+@Component({
+ selector: 'app-example',
+ templateUrl: 'example.component.html',
+ imports: [IonLabel, IonSegment, IonSegmentButton],
+})
+export class ExampleComponent {}
+```
diff --git a/static/usage/v8/segment/basic/index.md b/static/usage/v8/segment/basic/index.md
index 31df28b8367..f240678f309 100644
--- a/static/usage/v8/segment/basic/index.md
+++ b/static/usage/v8/segment/basic/index.md
@@ -3,6 +3,22 @@ import Playground from '@site/src/components/global/Playground';
import javascript from './javascript.md';
import react from './react.md';
import vue from './vue.md';
-import angular from './angular.md';
-
+import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_ts from './angular/example_component_ts.md';
+
+
diff --git a/static/usage/v8/segment/scrollable/angular/example_component_ts.md b/static/usage/v8/segment/scrollable/angular/example_component_ts.md
index 807b3ff6125..fb95a4ea914 100644
--- a/static/usage/v8/segment/scrollable/angular/example_component_ts.md
+++ b/static/usage/v8/segment/scrollable/angular/example_component_ts.md
@@ -1,5 +1,6 @@
```ts
import { Component } from '@angular/core';
+import { IonIcon, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { barbell, basket, call, globe, heart, home, person, pin, star, trash } from 'ionicons/icons';
@@ -8,6 +9,7 @@ import { barbell, basket, call, globe, heart, home, person, pin, star, trash } f
selector: 'app-example',
templateUrl: 'example.component.html',
styleUrls: ['example.component.css'],
+ imports: [IonIcon, IonSegment, IonSegmentButton],
})
export class ExampleComponent {
constructor() {
diff --git a/static/usage/v8/segment/theming/colors/angular/example_component_html.md b/static/usage/v8/segment/theming/colors/angular/example_component_html.md
new file mode 100644
index 00000000000..4787acc7ba3
--- /dev/null
+++ b/static/usage/v8/segment/theming/colors/angular/example_component_html.md
@@ -0,0 +1,82 @@
+```html
+
+
+ Default
+
+
+ Segment
+
+
+
+
+ Primary
+
+
+ Segment
+
+
+
+
+ Secondary
+
+
+ Segment
+
+
+
+
+ Tertiary
+
+
+ Segment
+
+
+
+
+ Success
+
+
+ Segment
+
+
+
+
+ Warning
+
+
+ Segment
+
+
+
+
+ Danger
+
+
+ Segment
+
+
+
+
+ Light
+
+
+ Segment
+
+
+
+
+ Medium
+
+
+ Segment
+
+
+
+
+ Dark
+
+
+ Segment
+
+
+```
diff --git a/static/usage/v8/segment/theming/colors/angular/example_component_ts.md b/static/usage/v8/segment/theming/colors/angular/example_component_ts.md
new file mode 100644
index 00000000000..1b25b79b10d
--- /dev/null
+++ b/static/usage/v8/segment/theming/colors/angular/example_component_ts.md
@@ -0,0 +1,11 @@
+```ts
+import { Component } from '@angular/core';
+import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
+
+@Component({
+ selector: 'app-example',
+ templateUrl: 'example.component.html',
+ imports: [IonLabel, IonSegment, IonSegmentButton],
+})
+export class ExampleComponent {}
+```
diff --git a/static/usage/v8/segment/theming/colors/index.md b/static/usage/v8/segment/theming/colors/index.md
index fd3c2dbebc2..79842d48086 100644
--- a/static/usage/v8/segment/theming/colors/index.md
+++ b/static/usage/v8/segment/theming/colors/index.md
@@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground';
import javascript from './javascript.md';
import react from './react.md';
import vue from './vue.md';
-import angular from './angular.md';
+
+import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_ts from './angular/example_component_ts.md';
From f921b986ebe2756a0d83ce0fd3745fe176386a68 Mon Sep 17 00:00:00 2001
From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com>
Date: Fri, 20 Dec 2024 15:16:29 -0500
Subject: [PATCH 2/3] docs(segment): update angular to standalone
---
static/usage/v7/segment/basic/angular/example_component_ts.md | 1 +
.../v7/segment/theming/colors/angular/example_component_ts.md | 1 +
static/usage/v8/segment/basic/angular/example_component_ts.md | 1 +
.../v8/segment/theming/colors/angular/example_component_ts.md | 1 +
4 files changed, 4 insertions(+)
diff --git a/static/usage/v7/segment/basic/angular/example_component_ts.md b/static/usage/v7/segment/basic/angular/example_component_ts.md
index 1b25b79b10d..d51cbc123a9 100644
--- a/static/usage/v7/segment/basic/angular/example_component_ts.md
+++ b/static/usage/v7/segment/basic/angular/example_component_ts.md
@@ -5,6 +5,7 @@ import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalon
@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
+ styleUrls: ['example.component.css'],
imports: [IonLabel, IonSegment, IonSegmentButton],
})
export class ExampleComponent {}
diff --git a/static/usage/v7/segment/theming/colors/angular/example_component_ts.md b/static/usage/v7/segment/theming/colors/angular/example_component_ts.md
index 1b25b79b10d..d51cbc123a9 100644
--- a/static/usage/v7/segment/theming/colors/angular/example_component_ts.md
+++ b/static/usage/v7/segment/theming/colors/angular/example_component_ts.md
@@ -5,6 +5,7 @@ import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalon
@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
+ styleUrls: ['example.component.css'],
imports: [IonLabel, IonSegment, IonSegmentButton],
})
export class ExampleComponent {}
diff --git a/static/usage/v8/segment/basic/angular/example_component_ts.md b/static/usage/v8/segment/basic/angular/example_component_ts.md
index 1b25b79b10d..d51cbc123a9 100644
--- a/static/usage/v8/segment/basic/angular/example_component_ts.md
+++ b/static/usage/v8/segment/basic/angular/example_component_ts.md
@@ -5,6 +5,7 @@ import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalon
@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
+ styleUrls: ['example.component.css'],
imports: [IonLabel, IonSegment, IonSegmentButton],
})
export class ExampleComponent {}
diff --git a/static/usage/v8/segment/theming/colors/angular/example_component_ts.md b/static/usage/v8/segment/theming/colors/angular/example_component_ts.md
index 1b25b79b10d..d51cbc123a9 100644
--- a/static/usage/v8/segment/theming/colors/angular/example_component_ts.md
+++ b/static/usage/v8/segment/theming/colors/angular/example_component_ts.md
@@ -5,6 +5,7 @@ import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalon
@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
+ styleUrls: ['example.component.css'],
imports: [IonLabel, IonSegment, IonSegmentButton],
})
export class ExampleComponent {}
From c5baa15c925a842abe5e78701f43fd873b435320 Mon Sep 17 00:00:00 2001
From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com>
Date: Fri, 27 Dec 2024 10:51:46 -0500
Subject: [PATCH 3/3] docs(segment): update angular to standalone
---
static/usage/v7/segment/basic/angular.md | 19 -----
.../v7/segment/theming/colors/angular.md | 82 -------------------
.../angular/example_component_ts.md | 12 +++
.../segment/theming/css-properties/index.md | 6 +-
static/usage/v8/segment/basic/angular.md | 19 -----
...ngular_css.md => example_component_css.md} | 0
...ular_html.md => example_component_html.md} | 0
.../swipeable/angular/example_component_ts.md | 12 +++
static/usage/v8/segment/swipeable/index.md | 19 +++--
.../react/{react_css.md => main_css.md} | 0
.../react/{react_tsx.md => main_tsx.md} | 0
.../v8/segment/theming/colors/angular.md | 82 -------------------
.../angular/example_component_ts.md | 12 +++
.../segment/theming/css-properties/index.md | 6 +-
14 files changed, 56 insertions(+), 213 deletions(-)
delete mode 100644 static/usage/v7/segment/basic/angular.md
delete mode 100644 static/usage/v7/segment/theming/colors/angular.md
create mode 100644 static/usage/v7/segment/theming/css-properties/angular/example_component_ts.md
delete mode 100644 static/usage/v8/segment/basic/angular.md
rename static/usage/v8/segment/swipeable/angular/{angular_css.md => example_component_css.md} (100%)
rename static/usage/v8/segment/swipeable/angular/{angular_html.md => example_component_html.md} (100%)
create mode 100644 static/usage/v8/segment/swipeable/angular/example_component_ts.md
rename static/usage/v8/segment/swipeable/react/{react_css.md => main_css.md} (100%)
rename static/usage/v8/segment/swipeable/react/{react_tsx.md => main_tsx.md} (100%)
delete mode 100644 static/usage/v8/segment/theming/colors/angular.md
create mode 100644 static/usage/v8/segment/theming/css-properties/angular/example_component_ts.md
diff --git a/static/usage/v7/segment/basic/angular.md b/static/usage/v7/segment/basic/angular.md
deleted file mode 100644
index c497151f125..00000000000
--- a/static/usage/v7/segment/basic/angular.md
+++ /dev/null
@@ -1,19 +0,0 @@
-```html
-
-
- Default
-
-
- Segment
-
-
-
-
-
- Disabled
-
-
- Segment
-
-
-```
diff --git a/static/usage/v7/segment/theming/colors/angular.md b/static/usage/v7/segment/theming/colors/angular.md
deleted file mode 100644
index 4787acc7ba3..00000000000
--- a/static/usage/v7/segment/theming/colors/angular.md
+++ /dev/null
@@ -1,82 +0,0 @@
-```html
-
-
- Default
-
-
- Segment
-
-
-
-
- Primary
-
-
- Segment
-
-
-
-
- Secondary
-
-
- Segment
-
-
-
-
- Tertiary
-
-
- Segment
-
-
-
-
- Success
-
-
- Segment
-
-
-
-
- Warning
-
-
- Segment
-
-
-
-
- Danger
-
-
- Segment
-
-
-
-
- Light
-
-
- Segment
-
-
-
-
- Medium
-
-
- Segment
-
-
-
-
- Dark
-
-
- Segment
-
-
-```
diff --git a/static/usage/v7/segment/theming/css-properties/angular/example_component_ts.md b/static/usage/v7/segment/theming/css-properties/angular/example_component_ts.md
new file mode 100644
index 00000000000..d51cbc123a9
--- /dev/null
+++ b/static/usage/v7/segment/theming/css-properties/angular/example_component_ts.md
@@ -0,0 +1,12 @@
+```ts
+import { Component } from '@angular/core';
+import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
+
+@Component({
+ selector: 'app-example',
+ templateUrl: 'example.component.html',
+ styleUrls: ['example.component.css'],
+ imports: [IonLabel, IonSegment, IonSegmentButton],
+})
+export class ExampleComponent {}
+```
diff --git a/static/usage/v7/segment/theming/css-properties/index.md b/static/usage/v7/segment/theming/css-properties/index.md
index da21c55735d..ecc038e1c3d 100644
--- a/static/usage/v7/segment/theming/css-properties/index.md
+++ b/static/usage/v7/segment/theming/css-properties/index.md
@@ -7,8 +7,9 @@ import react_main_tsx from './react/main_tsx.md';
import vue from './vue.md';
-import angular_example_component_css from './angular/example_component_css.md';
import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_css from './angular/example_component_css.md';
+import angular_example_component_ts from './angular/example_component_ts.md';
-
- Default
-
-
- Segment
-
-
-
-
-
- Disabled
-
-
- Segment
-
-
-```
diff --git a/static/usage/v8/segment/swipeable/angular/angular_css.md b/static/usage/v8/segment/swipeable/angular/example_component_css.md
similarity index 100%
rename from static/usage/v8/segment/swipeable/angular/angular_css.md
rename to static/usage/v8/segment/swipeable/angular/example_component_css.md
diff --git a/static/usage/v8/segment/swipeable/angular/angular_html.md b/static/usage/v8/segment/swipeable/angular/example_component_html.md
similarity index 100%
rename from static/usage/v8/segment/swipeable/angular/angular_html.md
rename to static/usage/v8/segment/swipeable/angular/example_component_html.md
diff --git a/static/usage/v8/segment/swipeable/angular/example_component_ts.md b/static/usage/v8/segment/swipeable/angular/example_component_ts.md
new file mode 100644
index 00000000000..6ccef810d45
--- /dev/null
+++ b/static/usage/v8/segment/swipeable/angular/example_component_ts.md
@@ -0,0 +1,12 @@
+```ts
+import { Component } from '@angular/core';
+import { IonLabel, IonSegment, IonSegmentButton, IonSegmentContent, IonSegmentView } from '@ionic/angular/standalone';
+
+@Component({
+ selector: 'app-example',
+ templateUrl: 'example.component.html',
+ styleUrls: ['example.component.css'],
+ imports: [IonLabel, IonSegment, IonSegmentButton, IonSegmentContent, IonSegmentView],
+})
+export class ExampleComponent {}
+```
diff --git a/static/usage/v8/segment/swipeable/index.md b/static/usage/v8/segment/swipeable/index.md
index e19de64f789..4ac4971f6b7 100644
--- a/static/usage/v8/segment/swipeable/index.md
+++ b/static/usage/v8/segment/swipeable/index.md
@@ -1,11 +1,15 @@
import Playground from '@site/src/components/global/Playground';
import javascript from './javascript.md';
-import react_main_tsx from './react/react_tsx.md';
-import react_main_css from './react/react_css.md';
+
+import react_main_css from './react/main_css.md';
+import react_main_tsx from './react/main_tsx.md';
+
import vue from './vue.md';
-import angular_html from './angular/angular_html.md';
-import angular_css from './angular/angular_css.md';
+
+import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_css from './angular/example_component_css.md';
+import angular_example_component_ts from './angular/example_component_ts.md';
-
- Default
-
-
- Segment
-
-
-
-
- Primary
-
-
- Segment
-
-
-
-
- Secondary
-
-
- Segment
-
-
-
-
- Tertiary
-
-
- Segment
-
-
-
-
- Success
-
-
- Segment
-
-
-
-
- Warning
-
-
- Segment
-
-
-
-
- Danger
-
-
- Segment
-
-
-
-
- Light
-
-
- Segment
-
-
-
-
- Medium
-
-
- Segment
-
-
-
-
- Dark
-
-
- Segment
-
-
-```
diff --git a/static/usage/v8/segment/theming/css-properties/angular/example_component_ts.md b/static/usage/v8/segment/theming/css-properties/angular/example_component_ts.md
new file mode 100644
index 00000000000..d51cbc123a9
--- /dev/null
+++ b/static/usage/v8/segment/theming/css-properties/angular/example_component_ts.md
@@ -0,0 +1,12 @@
+```ts
+import { Component } from '@angular/core';
+import { IonLabel, IonSegment, IonSegmentButton } from '@ionic/angular/standalone';
+
+@Component({
+ selector: 'app-example',
+ templateUrl: 'example.component.html',
+ styleUrls: ['example.component.css'],
+ imports: [IonLabel, IonSegment, IonSegmentButton],
+})
+export class ExampleComponent {}
+```
diff --git a/static/usage/v8/segment/theming/css-properties/index.md b/static/usage/v8/segment/theming/css-properties/index.md
index 2ca6610b540..9c440653c4c 100644
--- a/static/usage/v8/segment/theming/css-properties/index.md
+++ b/static/usage/v8/segment/theming/css-properties/index.md
@@ -7,8 +7,9 @@ import react_main_tsx from './react/main_tsx.md';
import vue from './vue.md';
-import angular_example_component_css from './angular/example_component_css.md';
import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_css from './angular/example_component_css.md';
+import angular_example_component_ts from './angular/example_component_ts.md';