mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
Compare commits
2 Commits
v8.8.1
...
chip-tests
| Author | SHA1 | Date | |
|---|---|---|---|
|
80e9ee2314 | ||
|
|
25a7adf7cc |
@@ -27,10 +27,6 @@ runs:
|
||||
run: npm run build
|
||||
shell: bash
|
||||
working-directory: ./packages/angular
|
||||
- name: Clean core package.json
|
||||
run: git checkout ./package.json
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: 🔍 Check Diff
|
||||
run: git diff --exit-code
|
||||
shell: bash
|
||||
|
||||
@@ -8,7 +8,7 @@ inputs:
|
||||
runs:
|
||||
using: 'composite'
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
|
||||
with:
|
||||
node-version: 24.x
|
||||
@@ -29,4 +29,4 @@ runs:
|
||||
with:
|
||||
name: ionic-core
|
||||
output: core/CoreBuild.zip
|
||||
paths: core/dist core/components core/css core/hydrate core/loader core/src/components.d.ts core/package.json
|
||||
paths: core/dist core/components core/css core/hydrate core/loader core/src/components.d.ts
|
||||
|
||||
@@ -8,7 +8,7 @@ inputs:
|
||||
runs:
|
||||
using: 'composite'
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
|
||||
with:
|
||||
node-version: 24.x
|
||||
|
||||
@@ -31,10 +31,6 @@ runs:
|
||||
run: npm run test.spec
|
||||
shell: bash
|
||||
working-directory: ./packages/react
|
||||
- name: Clean core package.json
|
||||
run: git checkout ./package.json
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: 🔍 Check Diff
|
||||
run: git diff --exit-code
|
||||
shell: bash
|
||||
|
||||
@@ -27,10 +27,6 @@ runs:
|
||||
run: npm run build
|
||||
shell: bash
|
||||
working-directory: ./packages/vue
|
||||
- name: Clean core package.json
|
||||
run: git checkout ./package.json
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: 🔍 Check Diff
|
||||
run: git diff --exit-code
|
||||
shell: bash
|
||||
|
||||
@@ -17,7 +17,7 @@ runs:
|
||||
- uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
name: ionic-angular
|
||||
path: ./packages/angular
|
||||
path: ./angular
|
||||
filename: AngularBuild.zip
|
||||
- uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
|
||||
@@ -12,10 +12,6 @@ runs:
|
||||
name: ionic-core
|
||||
path: ./core
|
||||
filename: CoreBuild.zip
|
||||
- name: Clean core package.json
|
||||
run: git checkout ./package.json
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: 🔍 Check Diff
|
||||
run: |
|
||||
git diff --exit-code || {
|
||||
|
||||
@@ -10,10 +10,6 @@ runs:
|
||||
run: npm ci
|
||||
working-directory: ./core
|
||||
shell: bash
|
||||
- name: Clean core package.json
|
||||
run: git checkout ./package.json
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: 🖌️ Lint
|
||||
run: npm run lint
|
||||
shell: bash
|
||||
|
||||
@@ -30,10 +30,6 @@ runs:
|
||||
run: npm run test.e2e.docker.ci ${{ inputs.component }} -- --shard=${{ inputs.shard }}/${{ inputs.totalShards }}
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: Clean core package.json
|
||||
run: git checkout ./package.json
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: Test and Update
|
||||
id: test-and-update
|
||||
if: inputs.update == 'true'
|
||||
|
||||
@@ -21,10 +21,6 @@ runs:
|
||||
find . -type f -name 'UpdatedScreenshots-*.zip' -exec unzip -q -o -d ../ {} \;
|
||||
shell: bash
|
||||
working-directory: ./artifacts
|
||||
- name: Clean core package.json
|
||||
run: git checkout ./package.json
|
||||
shell: bash
|
||||
working-directory: ./core
|
||||
- name: 📸 Push Screenshots
|
||||
# Configure user as Ionitron
|
||||
# and push only the changed .png snapshots
|
||||
|
||||
30
.github/workflows/build.yml
vendored
30
.github/workflows/build.yml
vendored
@@ -22,7 +22,7 @@ jobs:
|
||||
build-core:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-core
|
||||
with:
|
||||
ionicons-version: ${{ inputs.ionicons_npm_release_tag }}
|
||||
@@ -31,21 +31,21 @@ jobs:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-clean-build
|
||||
|
||||
test-core-lint:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-lint
|
||||
|
||||
test-core-spec:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-spec
|
||||
|
||||
test-core-screenshot:
|
||||
@@ -62,7 +62,7 @@ jobs:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-screenshot
|
||||
with:
|
||||
shard: ${{ matrix.shard }}
|
||||
@@ -90,14 +90,14 @@ jobs:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-vue
|
||||
|
||||
build-vue-router:
|
||||
needs: [build-vue]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-vue-router
|
||||
|
||||
test-vue-e2e:
|
||||
@@ -108,7 +108,7 @@ jobs:
|
||||
needs: [build-vue, build-vue-router]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-vue-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
@@ -126,14 +126,14 @@ jobs:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-angular
|
||||
|
||||
build-angular-server:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-angular-server
|
||||
|
||||
test-angular-e2e:
|
||||
@@ -144,7 +144,7 @@ jobs:
|
||||
needs: [build-angular, build-angular-server]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-angular-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
@@ -162,14 +162,14 @@ jobs:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-react
|
||||
|
||||
build-react-router:
|
||||
needs: [build-react]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-react-router
|
||||
|
||||
test-react-router-e2e:
|
||||
@@ -180,7 +180,7 @@ jobs:
|
||||
needs: [build-react, build-react-router]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-react-router-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
@@ -202,7 +202,7 @@ jobs:
|
||||
needs: [build-react, build-react-router]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-react-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
|
||||
2
.github/workflows/codeql-analysis.yml
vendored
2
.github/workflows/codeql-analysis.yml
vendored
@@ -14,7 +14,7 @@ jobs:
|
||||
permissions:
|
||||
security-events: write
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: github/codeql-action/init@v4
|
||||
with:
|
||||
languages: javascript
|
||||
|
||||
2
.github/workflows/dev-build.yml
vendored
2
.github/workflows/dev-build.yml
vendored
@@ -13,7 +13,7 @@ jobs:
|
||||
outputs:
|
||||
dev-hash: ${{ steps.create-dev-hash.outputs.DEV_HASH }}
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
# A 1 is required before the timestamp
|
||||
# as lerna will fail when there is a leading 0
|
||||
# See https://github.com/lerna/lerna/issues/2840
|
||||
|
||||
2
.github/workflows/nightly.yml
vendored
2
.github/workflows/nightly.yml
vendored
@@ -13,7 +13,7 @@ jobs:
|
||||
outputs:
|
||||
nightly-hash: ${{ steps.create-nightly-hash.outputs.NIGHTLY_HASH }}
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
# A 1 is required before the timestamp
|
||||
# as lerna will fail when there is a leading 0
|
||||
# See https://github.com/lerna/lerna/issues/2840
|
||||
|
||||
16
.github/workflows/release-ionic.yml
vendored
16
.github/workflows/release-ionic.yml
vendored
@@ -23,7 +23,7 @@ jobs:
|
||||
release-core:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/actions/publish-npm
|
||||
with:
|
||||
scope: '@ionic/core'
|
||||
@@ -48,7 +48,7 @@ jobs:
|
||||
needs: [release-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- name: Restore @ionic/docs built cache
|
||||
uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
@@ -67,7 +67,7 @@ jobs:
|
||||
needs: [release-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- name: Restore @ionic/core built cache
|
||||
uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
@@ -93,7 +93,7 @@ jobs:
|
||||
needs: [release-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- name: Restore @ionic/core built cache
|
||||
uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
@@ -118,7 +118,7 @@ jobs:
|
||||
needs: [release-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- name: Restore @ionic/core built cache
|
||||
uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
@@ -143,7 +143,7 @@ jobs:
|
||||
needs: [release-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- name: Restore @ionic/core built cache
|
||||
uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
@@ -163,7 +163,7 @@ jobs:
|
||||
needs: [release-react]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- name: Restore @ionic/core built cache
|
||||
uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
@@ -188,7 +188,7 @@ jobs:
|
||||
needs: [release-vue]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- name: Restore @ionic/core built cache
|
||||
uses: ./.github/workflows/actions/download-archive
|
||||
with:
|
||||
|
||||
4
.github/workflows/release.yml
vendored
4
.github/workflows/release.yml
vendored
@@ -58,7 +58,7 @@ jobs:
|
||||
contents: write
|
||||
id-token: write
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
with:
|
||||
token: ${{ secrets.IONITRON_TOKEN }}
|
||||
fetch-depth: 0
|
||||
@@ -89,7 +89,7 @@ jobs:
|
||||
contents: write
|
||||
id-token: write
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
# Pull the latest version of the reference
|
||||
# branch instead of the revision that triggered
|
||||
# the workflow otherwise we won't get the commit
|
||||
|
||||
30
.github/workflows/stencil-nightly.yml
vendored
30
.github/workflows/stencil-nightly.yml
vendored
@@ -26,7 +26,7 @@ jobs:
|
||||
build-core-with-stencil-nightly:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-core-stencil-prerelease
|
||||
with:
|
||||
stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}
|
||||
@@ -35,21 +35,21 @@ jobs:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-clean-build
|
||||
|
||||
test-core-lint:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-lint
|
||||
|
||||
test-core-spec:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-spec
|
||||
with:
|
||||
stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}
|
||||
@@ -72,7 +72,7 @@ jobs:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-screenshot
|
||||
with:
|
||||
shard: ${{ matrix.shard }}
|
||||
@@ -100,14 +100,14 @@ jobs:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-vue
|
||||
|
||||
build-vue-router:
|
||||
needs: [build-vue]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-vue-router
|
||||
|
||||
test-vue-e2e:
|
||||
@@ -118,7 +118,7 @@ jobs:
|
||||
needs: [build-vue, build-vue-router]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-vue-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
@@ -136,14 +136,14 @@ jobs:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-angular
|
||||
|
||||
build-angular-server:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-angular-server
|
||||
|
||||
test-angular-e2e:
|
||||
@@ -154,7 +154,7 @@ jobs:
|
||||
needs: [build-angular, build-angular-server]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-angular-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
@@ -172,14 +172,14 @@ jobs:
|
||||
needs: [build-core-with-stencil-nightly]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-react
|
||||
|
||||
build-react-router:
|
||||
needs: [build-react]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-react-router
|
||||
|
||||
test-react-router-e2e:
|
||||
@@ -190,7 +190,7 @@ jobs:
|
||||
needs: [build-react, build-react-router]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-react-router-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
@@ -212,7 +212,7 @@ jobs:
|
||||
needs: [build-react, build-react-router]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-react-e2e
|
||||
with:
|
||||
app: ${{ matrix.apps }}
|
||||
|
||||
6
.github/workflows/update-screenshots.yml
vendored
6
.github/workflows/update-screenshots.yml
vendored
@@ -26,7 +26,7 @@ jobs:
|
||||
build-core:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/build-core
|
||||
|
||||
test-core-screenshot:
|
||||
@@ -47,7 +47,7 @@ jobs:
|
||||
needs: [build-core]
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
- uses: ./.github/workflows/actions/test-core-screenshot
|
||||
with:
|
||||
shard: ${{ matrix.shard }}
|
||||
@@ -59,7 +59,7 @@ jobs:
|
||||
runs-on: ubuntu-latest
|
||||
needs: [test-core-screenshot]
|
||||
steps:
|
||||
- uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
|
||||
- uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
|
||||
# Normally, we could just push with the
|
||||
# default GITHUB_TOKEN, but that will
|
||||
# not cause the build workflow
|
||||
|
||||
59
CHANGELOG.md
59
CHANGELOG.md
@@ -3,65 +3,6 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [8.8.1](https://github.com/ionic-team/ionic-framework/compare/v8.8.0...v8.8.1) (2026-03-06)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **accordion:** update tabindex based on disabled state ([#30986](https://github.com/ionic-team/ionic-framework/issues/30986)) ([0e76a69](https://github.com/ionic-team/ionic-framework/commit/0e76a69370083702568825c29d63cf257d6b88f1))
|
||||
* **angular:** export RefresherPullEnd types ([#30991](https://github.com/ionic-team/ionic-framework/issues/30991)) ([72abcca](https://github.com/ionic-team/ionic-framework/commit/72abccaad8df3c1db004da28610fddd95ac93c02))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **toast:** add wrapper and content parts ([#30992](https://github.com/ionic-team/ionic-framework/issues/30992)) ([366f00e](https://github.com/ionic-team/ionic-framework/commit/366f00e25f06e28aa7166275445716c2d301e44a)), closes [#30735](https://github.com/ionic-team/ionic-framework/issues/30735)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [8.8.0](https://github.com/ionic-team/ionic-framework/compare/v8.7.18...v8.8.0) (2026-03-04)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **angular:** add custom injector support for modal and popover controllers ([#30899](https://github.com/ionic-team/ionic-framework/issues/30899)) ([822da42](https://github.com/ionic-team/ionic-framework/commit/822da428af86cd9b036b81515272321eb8fa586c)), closes [#30638](https://github.com/ionic-team/ionic-framework/issues/30638)
|
||||
* **content:** add content-fullscreen class when fullscreen is true ([#30926](https://github.com/ionic-team/ionic-framework/issues/30926)) ([d74b11b](https://github.com/ionic-team/ionic-framework/commit/d74b11bc19d6268b256daf23ba6f107483c00320))
|
||||
* **datetime:** add header parts ([#30945](https://github.com/ionic-team/ionic-framework/issues/30945)) ([6ea186d](https://github.com/ionic-team/ionic-framework/commit/6ea186d96d80a94b774d4d0a51d536e0e5599935))
|
||||
* **datetime:** add wheel part to ion-picker-column ([#30934](https://github.com/ionic-team/ionic-framework/issues/30934)) ([0cf4c03](https://github.com/ionic-team/ionic-framework/commit/0cf4c03e298bb4f7eea71c966a1473765ebd6d7a))
|
||||
* **item-divider:** add inner and container parts ([#30928](https://github.com/ionic-team/ionic-framework/issues/30928)) ([5cdeb7f](https://github.com/ionic-team/ionic-framework/commit/5cdeb7fd357298f15e7ae29b14412d97bdc7c656))
|
||||
* **item-option:** add inner and container parts ([#30929](https://github.com/ionic-team/ionic-framework/issues/30929)) ([f8f7ffd](https://github.com/ionic-team/ionic-framework/commit/f8f7ffda318c0143d9bb5c79fe55b4ecb88e6ce3))
|
||||
* **item:** add inner and container parts ([#30927](https://github.com/ionic-team/ionic-framework/issues/30927)) ([a2c6559](https://github.com/ionic-team/ionic-framework/commit/a2c655923bb1cff51864949575e19028623c695d))
|
||||
* **list-header:** add inner part ([#30930](https://github.com/ionic-team/ionic-framework/issues/30930)) ([ef73476](https://github.com/ionic-team/ionic-framework/commit/ef73476e08670630907e775a38f9ed30a84e3f1f))
|
||||
* **modal:** add drag events for sheet and card modals ([#30962](https://github.com/ionic-team/ionic-framework/issues/30962)) ([d29ac71](https://github.com/ionic-team/ionic-framework/commit/d29ac713fad604c256fb385eb0c26eb9717e1ff4))
|
||||
* **range:** add classes and expose parts to allow individual styling of dual knobs ([#30941](https://github.com/ionic-team/ionic-framework/issues/30941)) ([5bcf921](https://github.com/ionic-team/ionic-framework/commit/5bcf92184118055483bf306ab9e319b8e3e61870)), closes [#29862](https://github.com/ionic-team/ionic-framework/issues/29862)
|
||||
* **range:** add classes to the range when the value is at the min or max ([#30932](https://github.com/ionic-team/ionic-framework/issues/30932)) ([fac1a66](https://github.com/ionic-team/ionic-framework/commit/fac1a6673c88a531f1d79656be4eb544f235f819))
|
||||
* **refresher:** add ionPullStart and ionPullEnd events ([#30946](https://github.com/ionic-team/ionic-framework/issues/30946)) ([814c2e5](https://github.com/ionic-team/ionic-framework/commit/814c2e5ccd6d5bfda12bdf13a566cd66ff830d5b)), closes [#24524](https://github.com/ionic-team/ionic-framework/issues/24524)
|
||||
* **segment-view:** add swipeGesture property to disable swiping ([#30948](https://github.com/ionic-team/ionic-framework/issues/30948)) ([46806bd](https://github.com/ionic-team/ionic-framework/commit/46806bd6e2af90a0b31fca68f508c06d3d281ec0)), closes [#30290](https://github.com/ionic-team/ionic-framework/issues/30290)
|
||||
* **select:** add wrapper and bottom shadow parts ([#30951](https://github.com/ionic-team/ionic-framework/issues/30951)) ([5cea5ae](https://github.com/ionic-team/ionic-framework/commit/5cea5aeb44393edab7064e5980a1eb7e607d1b8d))
|
||||
* **select:** pass cancelText property to modal interface ([#30282](https://github.com/ionic-team/ionic-framework/issues/30282)) ([6e4f60a](https://github.com/ionic-team/ionic-framework/commit/6e4f60af4c188ae04028b444aa21118ae27c2ca7))
|
||||
* **textarea:** reflect disabled and readonly props ([#30910](https://github.com/ionic-team/ionic-framework/issues/30910)) ([55735df](https://github.com/ionic-team/ionic-framework/commit/55735df3fa62c8e259c56db3169f3d5459e71c0c))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.7.18](https://github.com/ionic-team/ionic-framework/compare/v8.7.17...v8.7.18) (2026-02-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **datetime:** stretch ion-buttons to fill space for ios ([#30963](https://github.com/ionic-team/ionic-framework/issues/30963)) ([d46b0b1](https://github.com/ionic-team/ionic-framework/commit/d46b0b15f6a652da6f863cf303e7ce06cfc820a8))
|
||||
* **many:** clear timeouts ([#30851](https://github.com/ionic-team/ionic-framework/issues/30851)) ([70b1237](https://github.com/ionic-team/ionic-framework/commit/70b1237823dd0cdab852486a6b2cbbfe0d0aaae9)), closes [#30860](https://github.com/ionic-team/ionic-framework/issues/30860)
|
||||
* **modal, popover:** respect safe area insets on popovers and modals ([#30949](https://github.com/ionic-team/ionic-framework/issues/30949)) ([6490797](https://github.com/ionic-team/ionic-framework/commit/6490797851cede3bfda893a19b10f165259ec988)), closes [#28411](https://github.com/ionic-team/ionic-framework/issues/28411)
|
||||
* **nav-controller:** reset direction state when navigation is canceled ([#30955](https://github.com/ionic-team/ionic-framework/issues/30955)) ([53172d1](https://github.com/ionic-team/ionic-framework/commit/53172d1a4035d5b510c230553aabd53dc1389e4b))
|
||||
* **radio-group:** prevent DOMException and NotFoundError when filtering radios ([#30958](https://github.com/ionic-team/ionic-framework/issues/30958)) ([682a17e](https://github.com/ionic-team/ionic-framework/commit/682a17ebb754da7714989623cf84b75e715e20e1)), closes [#30279](https://github.com/ionic-team/ionic-framework/issues/30279) [#30359](https://github.com/ionic-team/ionic-framework/issues/30359)
|
||||
* **toast:** keep icon on the same line as long message in stacked layout ([#30923](https://github.com/ionic-team/ionic-framework/issues/30923)) ([442e3e9](https://github.com/ionic-team/ionic-framework/commit/442e3e983107a69cea4fb5587fb33da718eee8a3)), closes [#30908](https://github.com/ionic-team/ionic-framework/issues/30908)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.7.17](https://github.com/ionic-team/ionic-framework/compare/v8.7.15...v8.7.17) (2026-01-14)
|
||||
|
||||
|
||||
|
||||
@@ -3,63 +3,6 @@
|
||||
All notable changes to this project will be documented in this file.
|
||||
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
||||
|
||||
## [8.8.1](https://github.com/ionic-team/ionic-framework/compare/v8.8.0...v8.8.1) (2026-03-06)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **accordion:** update tabindex based on disabled state ([#30986](https://github.com/ionic-team/ionic-framework/issues/30986)) ([0e76a69](https://github.com/ionic-team/ionic-framework/commit/0e76a69370083702568825c29d63cf257d6b88f1))
|
||||
* **angular:** export RefresherPullEnd types ([#30991](https://github.com/ionic-team/ionic-framework/issues/30991)) ([72abcca](https://github.com/ionic-team/ionic-framework/commit/72abccaad8df3c1db004da28610fddd95ac93c02))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **toast:** add wrapper and content parts ([#30992](https://github.com/ionic-team/ionic-framework/issues/30992)) ([366f00e](https://github.com/ionic-team/ionic-framework/commit/366f00e25f06e28aa7166275445716c2d301e44a)), closes [#30735](https://github.com/ionic-team/ionic-framework/issues/30735)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
# [8.8.0](https://github.com/ionic-team/ionic-framework/compare/v8.7.18...v8.8.0) (2026-03-04)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **content:** add content-fullscreen class when fullscreen is true ([#30926](https://github.com/ionic-team/ionic-framework/issues/30926)) ([d74b11b](https://github.com/ionic-team/ionic-framework/commit/d74b11bc19d6268b256daf23ba6f107483c00320))
|
||||
* **datetime:** add header parts ([#30945](https://github.com/ionic-team/ionic-framework/issues/30945)) ([6ea186d](https://github.com/ionic-team/ionic-framework/commit/6ea186d96d80a94b774d4d0a51d536e0e5599935))
|
||||
* **datetime:** add wheel part to ion-picker-column ([#30934](https://github.com/ionic-team/ionic-framework/issues/30934)) ([0cf4c03](https://github.com/ionic-team/ionic-framework/commit/0cf4c03e298bb4f7eea71c966a1473765ebd6d7a))
|
||||
* **item-divider:** add inner and container parts ([#30928](https://github.com/ionic-team/ionic-framework/issues/30928)) ([5cdeb7f](https://github.com/ionic-team/ionic-framework/commit/5cdeb7fd357298f15e7ae29b14412d97bdc7c656))
|
||||
* **item-option:** add inner and container parts ([#30929](https://github.com/ionic-team/ionic-framework/issues/30929)) ([f8f7ffd](https://github.com/ionic-team/ionic-framework/commit/f8f7ffda318c0143d9bb5c79fe55b4ecb88e6ce3))
|
||||
* **item:** add inner and container parts ([#30927](https://github.com/ionic-team/ionic-framework/issues/30927)) ([a2c6559](https://github.com/ionic-team/ionic-framework/commit/a2c655923bb1cff51864949575e19028623c695d))
|
||||
* **list-header:** add inner part ([#30930](https://github.com/ionic-team/ionic-framework/issues/30930)) ([ef73476](https://github.com/ionic-team/ionic-framework/commit/ef73476e08670630907e775a38f9ed30a84e3f1f))
|
||||
* **modal:** add drag events for sheet and card modals ([#30962](https://github.com/ionic-team/ionic-framework/issues/30962)) ([d29ac71](https://github.com/ionic-team/ionic-framework/commit/d29ac713fad604c256fb385eb0c26eb9717e1ff4))
|
||||
* **range:** add classes and expose parts to allow individual styling of dual knobs ([#30941](https://github.com/ionic-team/ionic-framework/issues/30941)) ([5bcf921](https://github.com/ionic-team/ionic-framework/commit/5bcf92184118055483bf306ab9e319b8e3e61870)), closes [#29862](https://github.com/ionic-team/ionic-framework/issues/29862)
|
||||
* **range:** add classes to the range when the value is at the min or max ([#30932](https://github.com/ionic-team/ionic-framework/issues/30932)) ([fac1a66](https://github.com/ionic-team/ionic-framework/commit/fac1a6673c88a531f1d79656be4eb544f235f819))
|
||||
* **refresher:** add ionPullStart and ionPullEnd events ([#30946](https://github.com/ionic-team/ionic-framework/issues/30946)) ([814c2e5](https://github.com/ionic-team/ionic-framework/commit/814c2e5ccd6d5bfda12bdf13a566cd66ff830d5b)), closes [#24524](https://github.com/ionic-team/ionic-framework/issues/24524)
|
||||
* **segment-view:** add swipeGesture property to disable swiping ([#30948](https://github.com/ionic-team/ionic-framework/issues/30948)) ([46806bd](https://github.com/ionic-team/ionic-framework/commit/46806bd6e2af90a0b31fca68f508c06d3d281ec0)), closes [#30290](https://github.com/ionic-team/ionic-framework/issues/30290)
|
||||
* **select:** add wrapper and bottom shadow parts ([#30951](https://github.com/ionic-team/ionic-framework/issues/30951)) ([5cea5ae](https://github.com/ionic-team/ionic-framework/commit/5cea5aeb44393edab7064e5980a1eb7e607d1b8d))
|
||||
* **select:** pass cancelText property to modal interface ([#30282](https://github.com/ionic-team/ionic-framework/issues/30282)) ([6e4f60a](https://github.com/ionic-team/ionic-framework/commit/6e4f60af4c188ae04028b444aa21118ae27c2ca7))
|
||||
* **textarea:** reflect disabled and readonly props ([#30910](https://github.com/ionic-team/ionic-framework/issues/30910)) ([55735df](https://github.com/ionic-team/ionic-framework/commit/55735df3fa62c8e259c56db3169f3d5459e71c0c))
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.7.18](https://github.com/ionic-team/ionic-framework/compare/v8.7.17...v8.7.18) (2026-02-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **datetime:** stretch ion-buttons to fill space for ios ([#30963](https://github.com/ionic-team/ionic-framework/issues/30963)) ([d46b0b1](https://github.com/ionic-team/ionic-framework/commit/d46b0b15f6a652da6f863cf303e7ce06cfc820a8))
|
||||
* **many:** clear timeouts ([#30851](https://github.com/ionic-team/ionic-framework/issues/30851)) ([70b1237](https://github.com/ionic-team/ionic-framework/commit/70b1237823dd0cdab852486a6b2cbbfe0d0aaae9)), closes [#30860](https://github.com/ionic-team/ionic-framework/issues/30860)
|
||||
* **modal, popover:** respect safe area insets on popovers and modals ([#30949](https://github.com/ionic-team/ionic-framework/issues/30949)) ([6490797](https://github.com/ionic-team/ionic-framework/commit/6490797851cede3bfda893a19b10f165259ec988)), closes [#28411](https://github.com/ionic-team/ionic-framework/issues/28411)
|
||||
* **radio-group:** prevent DOMException and NotFoundError when filtering radios ([#30958](https://github.com/ionic-team/ionic-framework/issues/30958)) ([682a17e](https://github.com/ionic-team/ionic-framework/commit/682a17ebb754da7714989623cf84b75e715e20e1)), closes [#30279](https://github.com/ionic-team/ionic-framework/issues/30279) [#30359](https://github.com/ionic-team/ionic-framework/issues/30359)
|
||||
* **toast:** keep icon on the same line as long message in stacked layout ([#30923](https://github.com/ionic-team/ionic-framework/issues/30923)) ([442e3e9](https://github.com/ionic-team/ionic-framework/commit/442e3e983107a69cea4fb5587fb33da718eee8a3)), closes [#30908](https://github.com/ionic-team/ionic-framework/issues/30908)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## [8.7.17](https://github.com/ionic-team/ionic-framework/compare/v8.7.15...v8.7.17) (2026-01-14)
|
||||
|
||||
|
||||
|
||||
59
core/api.txt
59
core/api.txt
@@ -566,18 +566,9 @@ ion-datetime,part,calendar-day
|
||||
ion-datetime,part,calendar-day active
|
||||
ion-datetime,part,calendar-day disabled
|
||||
ion-datetime,part,calendar-day today
|
||||
ion-datetime,part,calendar-days-of-week
|
||||
ion-datetime,part,calendar-header
|
||||
ion-datetime,part,datetime-header
|
||||
ion-datetime,part,datetime-selected-date
|
||||
ion-datetime,part,datetime-title
|
||||
ion-datetime,part,month-year-button
|
||||
ion-datetime,part,navigation-button
|
||||
ion-datetime,part,next-button
|
||||
ion-datetime,part,previous-button
|
||||
ion-datetime,part,time-button
|
||||
ion-datetime,part,time-button active
|
||||
ion-datetime,part,wheel
|
||||
ion-datetime,part,wheel-item
|
||||
ion-datetime,part,wheel-item active
|
||||
|
||||
@@ -712,7 +703,7 @@ ion-infinite-scroll-content,prop,loadingText,IonicSafeString | string | undefine
|
||||
|
||||
ion-input,scoped
|
||||
ion-input,prop,autocapitalize,string,'off',false,false
|
||||
ion-input,prop,autocomplete,"additional-name" | "address-level1" | "address-level2" | "address-level3" | "address-level4" | "address-line1" | "address-line2" | "address-line3" | "bday" | "bday-day" | "bday-month" | "bday-year" | "cc-additional-name" | "cc-csc" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-family-name" | "cc-given-name" | "cc-name" | "cc-number" | "cc-type" | "country" | "country-name" | "current-password" | "email" | "family-name" | "given-name" | "honorific-prefix" | "honorific-suffix" | "impp" | "language" | "name" | "new-password" | "nickname" | "off" | "on" | "one-time-code" | "organization" | "organization-title" | "photo" | "postal-code" | "sex" | "street-address" | "tel" | "tel-area-code" | "tel-country-code" | "tel-extension" | "tel-local" | "tel-national" | "transaction-amount" | "transaction-currency" | "url" | "username",'off',false,false
|
||||
ion-input,prop,autocomplete,"name" | "email" | "tel" | "url" | "on" | "off" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "photo",'off',false,false
|
||||
ion-input,prop,autocorrect,"off" | "on",'off',false,false
|
||||
ion-input,prop,autofocus,boolean,false,false,false
|
||||
ion-input,prop,clearInput,boolean,false,false,false
|
||||
@@ -939,9 +930,7 @@ ion-item,css-prop,--ripple-color,ios
|
||||
ion-item,css-prop,--ripple-color,md
|
||||
ion-item,css-prop,--transition,ios
|
||||
ion-item,css-prop,--transition,md
|
||||
ion-item,part,container
|
||||
ion-item,part,detail-icon
|
||||
ion-item,part,inner
|
||||
ion-item,part,native
|
||||
|
||||
ion-item-divider,shadow
|
||||
@@ -968,8 +957,6 @@ ion-item-divider,css-prop,--padding-start,ios
|
||||
ion-item-divider,css-prop,--padding-start,md
|
||||
ion-item-divider,css-prop,--padding-top,ios
|
||||
ion-item-divider,css-prop,--padding-top,md
|
||||
ion-item-divider,part,container
|
||||
ion-item-divider,part,inner
|
||||
|
||||
ion-item-group,none
|
||||
|
||||
@@ -987,8 +974,6 @@ ion-item-option,css-prop,--background,ios
|
||||
ion-item-option,css-prop,--background,md
|
||||
ion-item-option,css-prop,--color,ios
|
||||
ion-item-option,css-prop,--color,md
|
||||
ion-item-option,part,container
|
||||
ion-item-option,part,inner
|
||||
ion-item-option,part,native
|
||||
|
||||
ion-item-options,none
|
||||
@@ -1033,7 +1018,6 @@ ion-list-header,css-prop,--color,ios
|
||||
ion-list-header,css-prop,--color,md
|
||||
ion-list-header,css-prop,--inner-border-width,ios
|
||||
ion-list-header,css-prop,--inner-border-width,md
|
||||
ion-list-header,part,inner
|
||||
|
||||
ion-loading,scoped
|
||||
ion-loading,prop,animated,boolean,true,false,false
|
||||
@@ -1187,9 +1171,6 @@ ion-modal,method,setCurrentBreakpoint,setCurrentBreakpoint(breakpoint: number) =
|
||||
ion-modal,event,didDismiss,OverlayEventDetail<any>,true
|
||||
ion-modal,event,didPresent,void,true
|
||||
ion-modal,event,ionBreakpointDidChange,ModalBreakpointChangeEventDetail,true
|
||||
ion-modal,event,ionDragEnd,ModalDragEventDetail,true
|
||||
ion-modal,event,ionDragMove,ModalDragEventDetail,true
|
||||
ion-modal,event,ionDragStart,void,true
|
||||
ion-modal,event,ionModalDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-modal,event,ionModalDidPresent,void,true
|
||||
ion-modal,event,ionModalWillDismiss,OverlayEventDetail<any>,true
|
||||
@@ -1228,7 +1209,7 @@ ion-nav,shadow
|
||||
ion-nav,prop,animated,boolean,true,false,false
|
||||
ion-nav,prop,animation,((baseEl: any, opts?: any) => Animation) | undefined,undefined,false,false
|
||||
ion-nav,prop,root,Function | HTMLElement | ViewController | null | string | undefined,undefined,false,false
|
||||
ion-nav,prop,rootParams,T | undefined,undefined,false,false
|
||||
ion-nav,prop,rootParams,undefined | { [key: string]: any; },undefined,false,false
|
||||
ion-nav,prop,swipeGesture,boolean | undefined,undefined,false,false
|
||||
ion-nav,method,canGoBack,canGoBack(view?: ViewController) => Promise<boolean>
|
||||
ion-nav,method,getActive,getActive() => Promise<ViewController | undefined>
|
||||
@@ -1249,7 +1230,7 @@ ion-nav,event,ionNavWillChange,void,false
|
||||
|
||||
ion-nav-link,none
|
||||
ion-nav-link,prop,component,Function | HTMLElement | ViewController | null | string | undefined,undefined,false,false
|
||||
ion-nav-link,prop,componentProps,T | undefined,undefined,false,false
|
||||
ion-nav-link,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
|
||||
ion-nav-link,prop,routerAnimation,((baseEl: any, opts?: any) => Animation) | undefined,undefined,false,false
|
||||
ion-nav-link,prop,routerDirection,"back" | "forward" | "root",'forward',false,false
|
||||
|
||||
@@ -1342,7 +1323,7 @@ ion-popover,prop,animated,boolean,true,false,false
|
||||
ion-popover,prop,arrow,boolean,true,false,false
|
||||
ion-popover,prop,backdropDismiss,boolean,true,false,false
|
||||
ion-popover,prop,component,Function | HTMLElement | null | string | undefined,undefined,false,false
|
||||
ion-popover,prop,componentProps,T | undefined,undefined,false,false
|
||||
ion-popover,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
|
||||
ion-popover,prop,dismissOnSelect,boolean,false,false,false
|
||||
ion-popover,prop,enterAnimation,((baseEl: any, opts?: any) => Animation) | undefined,undefined,false,false
|
||||
ion-popover,prop,event,any,undefined,false,false
|
||||
@@ -1491,28 +1472,11 @@ ion-range,css-prop,--pin-background,ios
|
||||
ion-range,css-prop,--pin-background,md
|
||||
ion-range,css-prop,--pin-color,ios
|
||||
ion-range,css-prop,--pin-color,md
|
||||
ion-range,part,activated
|
||||
ion-range,part,bar
|
||||
ion-range,part,bar-active
|
||||
ion-range,part,focused
|
||||
ion-range,part,hover
|
||||
ion-range,part,knob
|
||||
ion-range,part,knob-a
|
||||
ion-range,part,knob-b
|
||||
ion-range,part,knob-handle
|
||||
ion-range,part,knob-handle-a
|
||||
ion-range,part,knob-handle-b
|
||||
ion-range,part,knob-handle-lower
|
||||
ion-range,part,knob-handle-upper
|
||||
ion-range,part,knob-lower
|
||||
ion-range,part,knob-upper
|
||||
ion-range,part,label
|
||||
ion-range,part,pin
|
||||
ion-range,part,pin-a
|
||||
ion-range,part,pin-b
|
||||
ion-range,part,pin-lower
|
||||
ion-range,part,pin-upper
|
||||
ion-range,part,pressed
|
||||
ion-range,part,tick
|
||||
ion-range,part,tick-active
|
||||
|
||||
@@ -1528,8 +1492,6 @@ ion-refresher,method,cancel,cancel() => Promise<void>
|
||||
ion-refresher,method,complete,complete() => Promise<void>
|
||||
ion-refresher,method,getProgress,getProgress() => Promise<number>
|
||||
ion-refresher,event,ionPull,void,true
|
||||
ion-refresher,event,ionPullEnd,RefresherPullEndEventDetail,true
|
||||
ion-refresher,event,ionPullStart,void,true
|
||||
ion-refresher,event,ionRefresh,RefresherEventDetail,true
|
||||
ion-refresher,event,ionStart,void,true
|
||||
|
||||
@@ -1595,7 +1557,7 @@ ion-row,shadow
|
||||
ion-searchbar,scoped
|
||||
ion-searchbar,prop,animated,boolean,false,false,false
|
||||
ion-searchbar,prop,autocapitalize,string,'off',false,false
|
||||
ion-searchbar,prop,autocomplete,"additional-name" | "address-level1" | "address-level2" | "address-level3" | "address-level4" | "address-line1" | "address-line2" | "address-line3" | "bday" | "bday-day" | "bday-month" | "bday-year" | "cc-additional-name" | "cc-csc" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-family-name" | "cc-given-name" | "cc-name" | "cc-number" | "cc-type" | "country" | "country-name" | "current-password" | "email" | "family-name" | "given-name" | "honorific-prefix" | "honorific-suffix" | "impp" | "language" | "name" | "new-password" | "nickname" | "off" | "on" | "one-time-code" | "organization" | "organization-title" | "photo" | "postal-code" | "sex" | "street-address" | "tel" | "tel-area-code" | "tel-country-code" | "tel-extension" | "tel-local" | "tel-national" | "transaction-amount" | "transaction-currency" | "url" | "username",'off',false,false
|
||||
ion-searchbar,prop,autocomplete,"name" | "email" | "tel" | "url" | "on" | "off" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "photo",'off',false,false
|
||||
ion-searchbar,prop,autocorrect,"off" | "on",'off',false,false
|
||||
ion-searchbar,prop,cancelButtonIcon,string,config.get('backButtonIcon', arrowBackSharp) as string,false,false
|
||||
ion-searchbar,prop,cancelButtonText,string,'Cancel',false,false
|
||||
@@ -1730,7 +1692,6 @@ ion-segment-content,shadow
|
||||
|
||||
ion-segment-view,shadow
|
||||
ion-segment-view,prop,disabled,boolean,false,false,false
|
||||
ion-segment-view,prop,swipeGesture,boolean,true,false,false
|
||||
ion-segment-view,event,ionSegmentViewScroll,SegmentViewScrollEvent,true
|
||||
|
||||
ion-select,shadow
|
||||
@@ -1795,20 +1756,16 @@ ion-select,css-prop,--placeholder-opacity,ios
|
||||
ion-select,css-prop,--placeholder-opacity,md
|
||||
ion-select,css-prop,--ripple-color,ios
|
||||
ion-select,css-prop,--ripple-color,md
|
||||
ion-select,part,bottom
|
||||
ion-select,part,container
|
||||
ion-select,part,error-text
|
||||
ion-select,part,helper-text
|
||||
ion-select,part,icon
|
||||
ion-select,part,inner
|
||||
ion-select,part,label
|
||||
ion-select,part,placeholder
|
||||
ion-select,part,supporting-text
|
||||
ion-select,part,text
|
||||
ion-select,part,wrapper
|
||||
|
||||
ion-select-modal,scoped
|
||||
ion-select-modal,prop,cancelText,string,'Close',false,false
|
||||
ion-select-modal,prop,header,string | undefined,undefined,false,false
|
||||
ion-select-modal,prop,multiple,boolean | undefined,undefined,false,false
|
||||
ion-select-modal,prop,options,SelectModalOption[],[],false,false
|
||||
@@ -1916,7 +1873,7 @@ ion-textarea,prop,cols,number | undefined,undefined,false,true
|
||||
ion-textarea,prop,counter,boolean,false,false,false
|
||||
ion-textarea,prop,counterFormatter,((inputLength: number, maxLength: number) => string) | undefined,undefined,false,false
|
||||
ion-textarea,prop,debounce,number | undefined,undefined,false,false
|
||||
ion-textarea,prop,disabled,boolean,false,false,true
|
||||
ion-textarea,prop,disabled,boolean,false,false,false
|
||||
ion-textarea,prop,enterkeyhint,"done" | "enter" | "go" | "next" | "previous" | "search" | "send" | undefined,undefined,false,false
|
||||
ion-textarea,prop,errorText,string | undefined,undefined,false,false
|
||||
ion-textarea,prop,fill,"outline" | "solid" | undefined,undefined,false,false
|
||||
@@ -1929,7 +1886,7 @@ ion-textarea,prop,minlength,number | undefined,undefined,false,false
|
||||
ion-textarea,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-textarea,prop,name,string,this.inputId,false,false
|
||||
ion-textarea,prop,placeholder,string | undefined,undefined,false,false
|
||||
ion-textarea,prop,readonly,boolean,false,false,true
|
||||
ion-textarea,prop,readonly,boolean,false,false,false
|
||||
ion-textarea,prop,required,boolean,false,false,false
|
||||
ion-textarea,prop,rows,number | undefined,undefined,false,false
|
||||
ion-textarea,prop,shape,"round" | undefined,undefined,false,false
|
||||
@@ -2059,11 +2016,9 @@ ion-toast,css-prop,--width,md
|
||||
ion-toast,part,button
|
||||
ion-toast,part,button cancel
|
||||
ion-toast,part,container
|
||||
ion-toast,part,content
|
||||
ion-toast,part,header
|
||||
ion-toast,part,icon
|
||||
ion-toast,part,message
|
||||
ion-toast,part,wrapper
|
||||
|
||||
ion-toggle,shadow
|
||||
ion-toggle,prop,alignment,"center" | "start" | undefined,undefined,false,false
|
||||
|
||||
93
core/package-lock.json
generated
93
core/package-lock.json
generated
@@ -1,15 +1,15 @@
|
||||
{
|
||||
"name": "@ionic/core",
|
||||
"version": "8.8.1",
|
||||
"version": "8.7.17",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "@ionic/core",
|
||||
"version": "8.8.1",
|
||||
"version": "8.7.17",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@stencil/core": "4.43.0",
|
||||
"@stencil/core": "4.38.0",
|
||||
"ionicons": "^8.0.13",
|
||||
"tslib": "^2.1.0"
|
||||
},
|
||||
@@ -19,6 +19,7 @@
|
||||
"@capacitor/haptics": "^8.0.0",
|
||||
"@capacitor/keyboard": "^8.0.0",
|
||||
"@capacitor/status-bar": "^8.0.0",
|
||||
"@clack/prompts": "^0.11.0",
|
||||
"@ionic/eslint-config": "^0.3.0",
|
||||
"@ionic/prettier-config": "^2.0.0",
|
||||
"@playwright/test": "^1.56.1",
|
||||
@@ -93,6 +94,7 @@
|
||||
"version": "7.16.12",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.16.7",
|
||||
"@babel/generator": "^7.16.8",
|
||||
@@ -627,19 +629,20 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@capacitor/core": {
|
||||
"version": "8.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/core/-/core-8.1.0.tgz",
|
||||
"integrity": "sha512-UfMBMWc1v7J+14AhH03QmeNwV3HZx3qnOWhpwnHfzALEwAwlV/itQOQqcasMQYhOHWL0tiymc5ByaLTn7KKQxw==",
|
||||
"version": "8.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/core/-/core-8.0.1.tgz",
|
||||
"integrity": "sha512-5UqSWxGMp/B8KhYu7rAijqNtYslhcLh+TrbfU48PfdMDsPfaU/VY48sMNzC22xL8BmoFoql/3SKyP+pavTOvOA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"tslib": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@capacitor/haptics": {
|
||||
"version": "8.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/haptics/-/haptics-8.0.1.tgz",
|
||||
"integrity": "sha512-8v8rowLBMeb3CryqoQvXndwyUsoi4pPXf0qFw7IGA4D32Uk7+K6juN2SjRowqunoovkvvbFmU9TD7JIAz2zmFw==",
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/haptics/-/haptics-8.0.0.tgz",
|
||||
"integrity": "sha512-DY1IUOjke1T4ITl7mFHQIKCaJJyHYAYRYHG9bVApU7PDOZiMVGMp48Yjzdqjya+wv/AHS5mDabSTUmhJ5uDvBA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
@@ -647,9 +650,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@capacitor/keyboard": {
|
||||
"version": "8.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/keyboard/-/keyboard-8.0.1.tgz",
|
||||
"integrity": "sha512-HDf4qrvvhLRMsgBoqeqIld6hP8JMK/WPbCYMvz8ajhY6TaibYt6B+NQyky4oIPCOfHTz5OcVsuHkbb8fQvGDAg==",
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/keyboard/-/keyboard-8.0.0.tgz",
|
||||
"integrity": "sha512-ycPW6iQyFwzDK95jihesj5EGiyyGSfbBqNek11iNp9tBOB7zDeYkUA2S/vPpOETt3dhP6pWr7a9gNVGuEfj11g==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
@@ -657,15 +660,34 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@capacitor/status-bar": {
|
||||
"version": "8.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/status-bar/-/status-bar-8.0.1.tgz",
|
||||
"integrity": "sha512-OR59dlbwvmrV5dKsC9lvwv48QaGbqcbSTBpk+9/WXWxXYSdXXdzJZU9p8oyNPAkuJhCdnSa3XmU43fZRPBJJ5w==",
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@capacitor/status-bar/-/status-bar-8.0.0.tgz",
|
||||
"integrity": "sha512-aIj3bc7z8lfPgOen8HlrBrkfnxpFnh21OCx6jCUx4Mvv+B6eEkUQ49b32DOddgVfr+igRHLX2SYi7duqIsNDXg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"@capacitor/core": ">=8.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@clack/core": {
|
||||
"version": "0.5.0",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"picocolors": "^1.0.0",
|
||||
"sisteransi": "^1.0.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@clack/prompts": {
|
||||
"version": "0.11.0",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@clack/core": "0.5.0",
|
||||
"picocolors": "^1.0.0",
|
||||
"sisteransi": "^1.0.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@eslint-community/eslint-utils": {
|
||||
"version": "4.4.0",
|
||||
"dev": true,
|
||||
@@ -850,6 +872,7 @@
|
||||
"version": "4.33.0",
|
||||
"dev": true,
|
||||
"license": "BSD-2-Clause",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@typescript-eslint/scope-manager": "4.33.0",
|
||||
"@typescript-eslint/types": "4.33.0",
|
||||
@@ -1785,10 +1808,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@stencil/core": {
|
||||
"version": "4.43.0",
|
||||
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.43.0.tgz",
|
||||
"integrity": "sha512-6Uj2Z3lzLuufYAE7asZ6NLKgSwsB9uxl84Eh34PASnUjfj32GkrP4DtKK7fNeh1WFGGyffsTDka3gwtl+4reUg==",
|
||||
"version": "4.38.0",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"stencil": "bin/stencil"
|
||||
},
|
||||
@@ -2213,6 +2235,7 @@
|
||||
"version": "6.7.2",
|
||||
"dev": true,
|
||||
"license": "BSD-2-Clause",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@typescript-eslint/scope-manager": "6.7.2",
|
||||
"@typescript-eslint/types": "6.7.2",
|
||||
@@ -2438,7 +2461,6 @@
|
||||
"integrity": "sha512-vay5/oQJdsNHmliWoZfHPoVZZRmnSWhug0BYT34njkYTPqClh3DNWLkZNJBVSjsNMrg0CCrBfoKkjZQPM/QVUw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.28.5",
|
||||
"@vue/shared": "3.5.25",
|
||||
@@ -2453,7 +2475,6 @@
|
||||
"integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
|
||||
"dev": true,
|
||||
"license": "BSD-2-Clause",
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">=0.12"
|
||||
},
|
||||
@@ -2466,8 +2487,7 @@
|
||||
"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
|
||||
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@vue/compiler-dom": {
|
||||
"version": "3.5.25",
|
||||
@@ -2475,7 +2495,6 @@
|
||||
"integrity": "sha512-4We0OAcMZsKgYoGlMjzYvaoErltdFI2/25wqanuTu+S4gismOTRTBPi4IASOjxWdzIwrYSjnqONfKvuqkXzE2Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vue/compiler-core": "3.5.25",
|
||||
"@vue/shared": "3.5.25"
|
||||
@@ -2487,7 +2506,6 @@
|
||||
"integrity": "sha512-PUgKp2rn8fFsI++lF2sO7gwO2d9Yj57Utr5yEsDf3GNaQcowCLKL7sf+LvVFvtJDXUp/03+dC6f2+LCv5aK1ag==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.28.5",
|
||||
"@vue/compiler-core": "3.5.25",
|
||||
@@ -2505,8 +2523,7 @@
|
||||
"resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
|
||||
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@vue/compiler-sfc/node_modules/postcss": {
|
||||
"version": "8.5.6",
|
||||
@@ -2528,7 +2545,6 @@
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"nanoid": "^3.3.11",
|
||||
"picocolors": "^1.1.1",
|
||||
@@ -2544,7 +2560,6 @@
|
||||
"integrity": "sha512-ritPSKLBcParnsKYi+GNtbdbrIE1mtuFEJ4U1sWeuOMlIziK5GtOL85t5RhsNy4uWIXPgk+OUdpnXiTdzn8o3A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vue/compiler-dom": "3.5.25",
|
||||
"@vue/shared": "3.5.25"
|
||||
@@ -2556,7 +2571,6 @@
|
||||
"integrity": "sha512-5xfAypCQepv4Jog1U4zn8cZIcbKKFka3AgWHEFQeK65OW+Ys4XybP6z2kKgws4YB43KGpqp5D/K3go2UPPunLA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vue/shared": "3.5.25"
|
||||
}
|
||||
@@ -2567,7 +2581,6 @@
|
||||
"integrity": "sha512-Z751v203YWwYzy460bzsYQISDfPjHTl+6Zzwo/a3CsAf+0ccEjQ8c+0CdX1WsumRTHeywvyUFtW6KvNukT/smA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vue/reactivity": "3.5.25",
|
||||
"@vue/shared": "3.5.25"
|
||||
@@ -2579,7 +2592,6 @@
|
||||
"integrity": "sha512-a4WrkYFbb19i9pjkz38zJBg8wa/rboNERq3+hRRb0dHiJh13c+6kAbgqCPfMaJ2gg4weWD3APZswASOfmKwamA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vue/reactivity": "3.5.25",
|
||||
"@vue/runtime-core": "3.5.25",
|
||||
@@ -2593,7 +2605,6 @@
|
||||
"integrity": "sha512-UJaXR54vMG61i8XNIzTSf2Q7MOqZHpp8+x3XLGtE3+fL+nQd+k7O5+X3D/uWrnQXOdMw5VPih+Uremcw+u1woQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vue/compiler-ssr": "3.5.25",
|
||||
"@vue/shared": "3.5.25"
|
||||
@@ -2607,8 +2618,7 @@
|
||||
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.25.tgz",
|
||||
"integrity": "sha512-AbOPdQQnAnzs58H2FrrDxYj/TJfmeS2jdfEEhgiKINy+bnOANmVizIEgq1r+C5zsbs6l1CCQxtcj71rwNQ4jWg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@zeit/schemas": {
|
||||
"version": "2.21.0",
|
||||
@@ -2631,6 +2641,7 @@
|
||||
"version": "7.4.0",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"acorn": "bin/acorn"
|
||||
},
|
||||
@@ -3791,8 +3802,7 @@
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
|
||||
"integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/debug": {
|
||||
"version": "2.6.9",
|
||||
@@ -4086,6 +4096,7 @@
|
||||
"version": "7.32.0",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "7.12.11",
|
||||
"@eslint/eslintrc": "^0.4.3",
|
||||
@@ -7281,7 +7292,6 @@
|
||||
"integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@jridgewell/sourcemap-codec": "^1.5.5"
|
||||
}
|
||||
@@ -7603,7 +7613,6 @@
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"nanoid": "bin/nanoid.cjs"
|
||||
},
|
||||
@@ -7958,6 +7967,7 @@
|
||||
"integrity": "sha512-hutraynyn31F+Bifme+Ps9Vq59hKuUCz7H1kDOcBs+2oGguKkWTU50bBWrtz34OUWmIwpBTWDxaRPXrIXkgvmQ==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"playwright-core": "cli.js"
|
||||
},
|
||||
@@ -7969,6 +7979,7 @@
|
||||
"version": "7.0.35",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"chalk": "^2.4.2",
|
||||
"source-map": "^0.6.1",
|
||||
@@ -8074,6 +8085,7 @@
|
||||
"version": "0.36.2",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"peerDependencies": {
|
||||
"postcss": ">=5.0.0"
|
||||
}
|
||||
@@ -8122,6 +8134,7 @@
|
||||
"version": "2.6.1",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"prettier": "bin-prettier.js"
|
||||
},
|
||||
@@ -8479,6 +8492,7 @@
|
||||
"version": "2.35.1",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"rollup": "dist/bin/rollup"
|
||||
},
|
||||
@@ -8700,7 +8714,6 @@
|
||||
"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
@@ -9821,4 +9834,4 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@ionic/core",
|
||||
"version": "8.8.1",
|
||||
"version": "8.7.17",
|
||||
"description": "Base components for Ionic",
|
||||
"engines": {
|
||||
"node": ">= 16"
|
||||
@@ -34,7 +34,7 @@
|
||||
"loader/"
|
||||
],
|
||||
"dependencies": {
|
||||
"@stencil/core": "4.43.0",
|
||||
"@stencil/core": "4.38.0",
|
||||
"ionicons": "^8.0.13",
|
||||
"tslib": "^2.1.0"
|
||||
},
|
||||
@@ -44,6 +44,7 @@
|
||||
"@capacitor/haptics": "^8.0.0",
|
||||
"@capacitor/keyboard": "^8.0.0",
|
||||
"@capacitor/status-bar": "^8.0.0",
|
||||
"@clack/prompts": "^0.11.0",
|
||||
"@ionic/eslint-config": "^0.3.0",
|
||||
"@ionic/prettier-config": "^2.0.0",
|
||||
"@playwright/test": "^1.56.1",
|
||||
@@ -103,7 +104,8 @@
|
||||
"docker.build": "docker build -t ionic-playwright .",
|
||||
"test.e2e.docker": "npm run docker.build && node ./scripts/docker.mjs",
|
||||
"test.e2e.docker.update-snapshots": "npm run test.e2e.docker -- --update-snapshots='changed'",
|
||||
"test.e2e.docker.ci": "npm run docker.build && CI=true node ./scripts/docker.mjs"
|
||||
"test.e2e.docker.ci": "npm run docker.build && CI=true node ./scripts/docker.mjs",
|
||||
"test.e2e.script": "node scripts/testing/e2e-script.mjs"
|
||||
},
|
||||
"author": "Ionic Team",
|
||||
"license": "MIT",
|
||||
|
||||
260
core/scripts/testing/e2e-script.mjs
Normal file
260
core/scripts/testing/e2e-script.mjs
Normal file
@@ -0,0 +1,260 @@
|
||||
// The purpose of this script is to provide a way run the E2E tests
|
||||
// without having the developer to manually run multiple commands based
|
||||
// on the desired end result.
|
||||
// E.g. update the local ground truths for a specific component or
|
||||
// open the Playwright report after running the E2E tests.
|
||||
|
||||
import {
|
||||
intro,
|
||||
outro,
|
||||
confirm,
|
||||
spinner,
|
||||
isCancel,
|
||||
cancel,
|
||||
text,
|
||||
log,
|
||||
} from '@clack/prompts';
|
||||
import { exec, spawn } from 'child_process';
|
||||
import fs from 'node:fs';
|
||||
import { setTimeout as sleep } from 'node:timers/promises';
|
||||
import util from 'node:util';
|
||||
import color from 'picocolors';
|
||||
|
||||
async function main() {
|
||||
const execAsync = util.promisify(exec);
|
||||
const cleanUpFiles = async () => {
|
||||
// Clean up the local ground truths.
|
||||
const cleanUp = spinner();
|
||||
|
||||
// Inform the user that the local ground truths are being cleaned up.
|
||||
cleanUp.start('Restoring local ground truths');
|
||||
|
||||
// Reset the local ground truths.
|
||||
await execAsync('git reset -- src/**/*-linux.png').catch((error) => {
|
||||
cleanUp.stop('Failed to reset local ground truths');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
|
||||
// Restore the local ground truths.
|
||||
await execAsync('git restore -- src/**/*-linux.png').catch((error) => {
|
||||
cleanUp.stop('Failed to restore local ground truths');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
|
||||
// Inform the user that the local ground truths have been cleaned up.
|
||||
cleanUp.stop('Local ground truths have been restored to their original state in order to avoid committing them.');
|
||||
};
|
||||
|
||||
intro(color.inverse(' Update Local Ground Truths'));
|
||||
|
||||
// Ask user for the component name they want to test.
|
||||
const componentValue = await text({
|
||||
message: 'Enter the component or path you want to test (e.g. chip, src/components/chip)',
|
||||
placeholder: 'Empty for all components',
|
||||
});
|
||||
|
||||
// User cancelled the operation with `Ctrl+C` or `CMD+C`.
|
||||
if (isCancel(componentValue)) {
|
||||
cancel('Operation cancelled');
|
||||
return process.exit(0);
|
||||
}
|
||||
|
||||
// Ask user if they want to update their local ground truths.
|
||||
const shouldUpdateTruths = await confirm({
|
||||
message: 'Do you want to update your local ground truths?',
|
||||
});
|
||||
|
||||
// User cancelled the operation with `Ctrl+C` or `CMD+C`.
|
||||
if (isCancel(shouldUpdateTruths)) {
|
||||
cancel('Operation cancelled');
|
||||
return process.exit(0);
|
||||
}
|
||||
|
||||
if (shouldUpdateTruths) {
|
||||
const defaultBaseBranch = 'main';
|
||||
|
||||
// Ask user for the base branch.
|
||||
let baseBranch = await text({
|
||||
message: 'Enter the base branch name:',
|
||||
placeholder: `default: ${defaultBaseBranch}`,
|
||||
})
|
||||
|
||||
// User cancelled the operation with `Ctrl+C` or `CMD+C`.
|
||||
if (isCancel(baseBranch)) {
|
||||
cancel('Operation cancelled');
|
||||
return process.exit(0);
|
||||
}
|
||||
|
||||
// User didn't provide a base branch.
|
||||
if (!baseBranch) {
|
||||
baseBranch = defaultBaseBranch;
|
||||
}
|
||||
|
||||
/**
|
||||
* The provided base branch needs to be fetched.
|
||||
* This ensures that the local base branch is up-to-date with the
|
||||
* remote base branch. Otherwise, there might be errors stating that
|
||||
* certain files don't exist in the local base branch.
|
||||
*/
|
||||
const fetchBaseBranch = spinner();
|
||||
|
||||
// Inform the user that the base branch is being fetched.
|
||||
fetchBaseBranch.start(`Fetching "${baseBranch}" to have the latest changes`);
|
||||
|
||||
// Fetch the base branch.
|
||||
await execAsync(`git fetch origin ${baseBranch}`).catch((error) => {
|
||||
fetchBaseBranch.stop(`Failed to fetch "${baseBranch}"`);
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
|
||||
// Inform the user that the base branch has been fetched.
|
||||
fetchBaseBranch.stop(`Fetched "${baseBranch}"`);
|
||||
|
||||
|
||||
const updateGroundTruth = spinner();
|
||||
|
||||
// Inform the user that the local ground truths are being updated.
|
||||
updateGroundTruth.start('Updating local ground truths');
|
||||
|
||||
// Check if user provided an existing file or directory.
|
||||
const isValidLocation = fs.existsSync(componentValue);
|
||||
|
||||
// User provided an existing file or directory.
|
||||
if (isValidLocation) {
|
||||
const stats = fs.statSync(componentValue);
|
||||
|
||||
// User provided a file as the component.
|
||||
// ex: `componentValue` = `src/components/chip/test/basic/chip.e2e.ts`
|
||||
if (stats.isFile()) {
|
||||
// Update the local ground truths for the provided path.
|
||||
await execAsync(`git checkout origin/${baseBranch} -- ${componentValue}-snapshots/*-linux.png`).catch((error) => {
|
||||
updateGroundTruth.stop('Failed to update local ground truths');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
}
|
||||
|
||||
// User provided a directory as the component.
|
||||
// ex: `componentValue` = `src/components/chip`
|
||||
if (stats.isDirectory()) {
|
||||
// Update the local ground truths for the provided directory.
|
||||
await execAsync(`git checkout origin/${baseBranch} -- ${componentValue}/test/*/*.e2e.ts-snapshots/*-linux.png`).catch((error) => {
|
||||
updateGroundTruth.stop('Failed to update local ground truths');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
}
|
||||
}
|
||||
// User provided a component name as the component.
|
||||
// ex: `componentValue` = `chip`
|
||||
else if (componentValue) {
|
||||
// Update the local ground truths for the provided component.
|
||||
await execAsync(`git checkout origin/${baseBranch} -- src/components/${componentValue}/test/*/${componentValue}.e2e.ts-snapshots/*-linux.png`).catch((error) => {
|
||||
updateGroundTruth.stop('Failed to update local ground truths');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
}
|
||||
// User provided an empty string.
|
||||
else {
|
||||
// Update the local ground truths for all components.
|
||||
await execAsync(`git checkout origin/${baseBranch} -- src/components/*/test/*/*.e2e.ts-snapshots/*-linux.png`).catch((error) => {
|
||||
updateGroundTruth.stop('Failed to update local ground truths');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
}
|
||||
|
||||
// Inform the user that the local ground truths have been updated.
|
||||
updateGroundTruth.stop('Updated local ground truths');
|
||||
}
|
||||
|
||||
const buildCore = spinner();
|
||||
|
||||
// Inform the user that the core is being built.
|
||||
buildCore.start('Building core');
|
||||
|
||||
/**
|
||||
* Build core
|
||||
* Otherwise, the uncommitted changes will not be reflected in the tests because:
|
||||
* - popping the stash doesn't trigger a re-render even if `npm start` is running
|
||||
* - app is not running the `npm start` command
|
||||
*/
|
||||
await execAsync('npm run build').catch((error) => {
|
||||
// Clean up the local ground truths.
|
||||
cleanUpFiles();
|
||||
|
||||
buildCore.stop('Failed to build core');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
|
||||
buildCore.stop('Built core');
|
||||
|
||||
const runE2ETests = spinner();
|
||||
|
||||
// Inform the user that the E2E tests are being run.
|
||||
runE2ETests.start('Running E2E tests');
|
||||
|
||||
// User provided a component value.
|
||||
if (componentValue) {
|
||||
await execAsync(`npm run test.e2e.docker.ci ${componentValue}`).catch((error) => {
|
||||
// Clean up the local ground truths.
|
||||
cleanUpFiles();
|
||||
|
||||
runE2ETests.stop('Failed to run E2E tests');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
} else {
|
||||
await execAsync('npm run test.e2e.docker.ci').catch((error) => {
|
||||
// Clean up the local ground truths.
|
||||
cleanUpFiles();
|
||||
|
||||
runE2ETests.stop('Failed to run E2E tests');
|
||||
console.error(error);
|
||||
return process.exit(0);
|
||||
});
|
||||
}
|
||||
|
||||
runE2ETests.stop('Ran E2E tests');
|
||||
|
||||
// Clean up the local ground truths.
|
||||
await cleanUpFiles();
|
||||
|
||||
// Ask user if they want to open the Playwright report.
|
||||
const shouldOpenReport = await confirm({
|
||||
message: 'Do you want to open the Playwright report?',
|
||||
});
|
||||
|
||||
// User cancelled the operation with `Ctrl+C` or `CMD+C`.
|
||||
if (isCancel(shouldOpenReport)) {
|
||||
cancel('Operation cancelled');
|
||||
return process.exit(0);
|
||||
}
|
||||
|
||||
// User chose to open the Playwright report.
|
||||
if (shouldOpenReport) {
|
||||
// Use spawn to display the server information and the key to quit the server.
|
||||
spawn('npx', ['playwright', 'show-report'], {
|
||||
stdio: 'inherit',
|
||||
});
|
||||
} else {
|
||||
// Inform the user that the Playwright report can be opened by running the following command.
|
||||
log.info('If you change your mind, you can open the Playwright report by running the following command:');
|
||||
log.info(color.bold('npx playwright show-report'));
|
||||
}
|
||||
|
||||
if (shouldOpenReport) {
|
||||
outro("You're all set! Don't forget to quit serving the Playwright report when you're done.");
|
||||
} else {
|
||||
outro("You're all set!");
|
||||
}
|
||||
|
||||
await sleep(1000);
|
||||
}
|
||||
|
||||
main().catch(console.error);
|
||||
@@ -8,9 +8,7 @@ expect.extend({
|
||||
throw new Error('expected toHaveShadowPart to be called on an element with a shadow root');
|
||||
}
|
||||
|
||||
// Use attribute selector with ~= to match space-separated part values
|
||||
// e.g., [part~="knob"] matches elements with part="knob" or part="knob knob-a"
|
||||
const shadowPart = received.shadowRoot.querySelector(`[part~="${part}"]`);
|
||||
const shadowPart = received.shadowRoot.querySelector(`[part="${part}"]`);
|
||||
const pass = shadowPart !== null;
|
||||
|
||||
const message = `expected ${received.tagName.toLowerCase()} to have shadow part "${part}"`;
|
||||
|
||||
1177
core/src/components.d.ts
vendored
1177
core/src/components.d.ts
vendored
File diff suppressed because it is too large
Load Diff
@@ -514,7 +514,6 @@ export class Accordion implements ComponentInterface {
|
||||
|
||||
'accordion-animated': this.shouldAnimate(),
|
||||
}}
|
||||
tabindex={disabled ? '-1' : undefined}
|
||||
>
|
||||
<div
|
||||
onClick={() => this.toggleExpanded()}
|
||||
|
||||
@@ -14,13 +14,12 @@ import { getIonMode } from '../../global/ionic-global';
|
||||
})
|
||||
export class App implements ComponentInterface {
|
||||
private focusVisible?: FocusVisibleUtility;
|
||||
private loadTimeout?: ReturnType<typeof setTimeout> | undefined;
|
||||
|
||||
@Element() el!: HTMLElement;
|
||||
|
||||
componentDidLoad() {
|
||||
if (Build.isBrowser) {
|
||||
this.rIC(async () => {
|
||||
rIC(async () => {
|
||||
const isHybrid = isPlatform(window, 'hybrid');
|
||||
if (!config.getBoolean('_testing')) {
|
||||
import('../../utils/tap-click').then((module) => module.startTapClick(config));
|
||||
@@ -61,12 +60,6 @@ export class App implements ComponentInterface {
|
||||
}
|
||||
}
|
||||
|
||||
disconnectedCallback() {
|
||||
if (this.loadTimeout) {
|
||||
clearTimeout(this.loadTimeout);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Used to set focus on an element that uses `ion-focusable`.
|
||||
* Do not use this if focusing the element as a result of a keyboard
|
||||
@@ -85,14 +78,6 @@ export class App implements ComponentInterface {
|
||||
}
|
||||
}
|
||||
|
||||
private rIC(callback: () => void) {
|
||||
if ('requestIdleCallback' in window) {
|
||||
(window as any).requestIdleCallback(callback);
|
||||
} else {
|
||||
this.loadTimeout = setTimeout(callback, 32);
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const mode = getIonMode(this);
|
||||
return (
|
||||
@@ -128,3 +113,11 @@ const needInputShims = () => {
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
const rIC = (callback: () => void) => {
|
||||
if ('requestIdleCallback' in window) {
|
||||
(window as any).requestIdleCallback(callback);
|
||||
} else {
|
||||
setTimeout(callback, 32);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1,23 +1,27 @@
|
||||
import { expect } from '@playwright/test';
|
||||
import { configs, test } from '@utils/test/playwright';
|
||||
|
||||
/**
|
||||
* This behavior does not vary across modes/directions
|
||||
*/
|
||||
configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
|
||||
/**
|
||||
* This behavior does not vary across modes/directions.
|
||||
*/
|
||||
test.describe(title('chip: states'), () => {
|
||||
test('should render disabled state', async ({ page }) => {
|
||||
await page.setContent(
|
||||
`<ion-chip disabled="true">
|
||||
<ion-label>Disabled</ion-label>
|
||||
</ion-chip>`,
|
||||
config
|
||||
);
|
||||
await page.goto(`/src/components/chip/test/states`, config);
|
||||
|
||||
const chip = page.locator('ion-chip');
|
||||
const container = page.locator('#disabled');
|
||||
|
||||
await expect(chip).toHaveScreenshot(screenshot(`chip-disabled`));
|
||||
await expect(container).toHaveScreenshot(screenshot(`chip-disabled`));
|
||||
});
|
||||
|
||||
test('should render activated state', async ({ page }) => {
|
||||
await page.goto(`/src/components/chip/test/states`, config);
|
||||
|
||||
const container = page.locator('#activated');
|
||||
|
||||
await expect(container).toHaveScreenshot(screenshot(`chip-activated`));
|
||||
});
|
||||
|
||||
test('should custom chip', async ({ page }) => {
|
||||
await page.setContent(
|
||||
`
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 27 KiB |
@@ -19,211 +19,285 @@
|
||||
<ion-content>
|
||||
<h3>Default</h3>
|
||||
|
||||
<p>
|
||||
<ion-chip>
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip style="border-radius: 4px">
|
||||
<ion-label>Border Radius</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip>
|
||||
<ion-icon name="checkmark-circle"></ion-icon>
|
||||
<ion-label>With Icon</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip>
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
<ion-label>With Avatar</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip>
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
<ion-label>With Icon and Avatar</ion-label>
|
||||
<ion-icon name="close-circle"></ion-icon>
|
||||
</ion-chip>
|
||||
</p>
|
||||
<p>
|
||||
<ion-chip class="ion-focused">
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip style="border-radius: 4px" class="ion-focused">
|
||||
<ion-label>Border Radius</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip class="ion-focused">
|
||||
<ion-icon name="checkmark-circle"></ion-icon>
|
||||
<ion-label>With Icon</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip class="ion-focused">
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
<ion-label>With Avatar</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip class="ion-focused">
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
<ion-label>With Icon and Avatar</ion-label>
|
||||
<ion-icon name="close-circle"></ion-icon>
|
||||
</ion-chip>
|
||||
</p>
|
||||
<div id="default">
|
||||
<p>
|
||||
<ion-chip>
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="primary">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="tertiary">
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="success">
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="warning">
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="danger">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="light">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="medium">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="dark">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
|
||||
<h3>Colors</h3>
|
||||
<p>
|
||||
<ion-chip color="primary">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="tertiary">
|
||||
<ion-icon name="checkmark-circle"></ion-icon>
|
||||
<ion-label>Tertiary with Icon</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="success">
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
<ion-label>Success with Avatar</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="warning">
|
||||
<ion-label>Warning with Icon</ion-label>
|
||||
<ion-icon name="calendar"></ion-icon>
|
||||
</ion-chip>
|
||||
<ion-chip color="danger">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="light">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="medium">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="dark">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
<p>
|
||||
<ion-chip color="primary" class="ion-focused">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary" class="ion-focused">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="tertiary" class="ion-focused">
|
||||
<ion-icon name="checkmark-circle"></ion-icon>
|
||||
<ion-label>Tertiary with Icon</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="success" class="ion-focused">
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
<ion-label>Success with Avatar</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="warning" class="ion-focused">
|
||||
<ion-label>Warning with Icon</ion-label>
|
||||
<ion-icon name="calendar"></ion-icon>
|
||||
</ion-chip>
|
||||
<ion-chip color="danger" class="ion-focused">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="light" class="ion-focused">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="medium" class="ion-focused">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="dark" class="ion-focused">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
|
||||
<h3>Outline</h3>
|
||||
|
||||
<p>
|
||||
<ion-chip outline>
|
||||
<ion-label>Outline</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="danger">
|
||||
<ion-label>Danger Outline</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="secondary">
|
||||
<ion-icon name="checkmark-circle"></ion-icon>
|
||||
<ion-label>Secondary Outline with Icon</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="primary">
|
||||
<ion-label>Primary Outline with Avatar</ion-label>
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
</ion-chip>
|
||||
<ion-chip outline>
|
||||
<ion-icon name="git-pull-request"></ion-icon>
|
||||
<ion-label>Outline with Icon and Avatar</ion-label>
|
||||
<ion-icon name="close-circle"></ion-icon>
|
||||
</ion-chip>
|
||||
</p>
|
||||
<p>
|
||||
<ion-chip outline class="ion-focused">
|
||||
<ion-label>Outline</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="danger" class="ion-focused">
|
||||
<ion-label>Danger Outline</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="secondary" class="ion-focused">
|
||||
<ion-icon name="checkmark-circle"></ion-icon>
|
||||
<ion-label>Secondary Outline with Icon</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="primary" class="ion-focused">
|
||||
<ion-label>Primary Outline with Avatar</ion-label>
|
||||
<ion-avatar>
|
||||
<img
|
||||
src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYzVkYmZmIiBkPSJNMCAwaDUxMnY1MTJIMHoiLz48cGF0aCBkPSJNMjU2IDMwNGM2MS42IDAgMTEyLTUwLjQgMTEyLTExMlMzMTcuNiA4MCAyNTYgODBzLTExMiA1MC40LTExMiAxMTIgNTAuNCAxMTIgMTEyIDExMnptMCA0MGMtNzQuMiAwLTIyNCAzNy44LTIyNCAxMTJ2NTZoNDQ4di01NmMwLTc0LjItMTQ5LjgtMTEyLTIyNC0xMTJ6IiBmaWxsPSIjODJhZWZmIi8+PC9zdmc+"
|
||||
/>
|
||||
</ion-avatar>
|
||||
</ion-chip>
|
||||
<ion-chip outline class="ion-focused">
|
||||
<ion-icon name="git-pull-request"></ion-icon>
|
||||
<ion-label>Outline with Icon and Avatar</ion-label>
|
||||
<ion-icon name="close-circle"></ion-icon>
|
||||
</ion-chip>
|
||||
</p>
|
||||
<p>
|
||||
<ion-chip outline>
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="primary">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="secondary">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="tertiary">
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="success">
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="warning">
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="danger">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="light">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="medium">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="dark">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<h3>Disabled</h3>
|
||||
<div id="disabled">
|
||||
<p>
|
||||
<ion-chip disabled>
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="primary" disabled>
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary" disabled>
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="tertiary" disabled>
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="success" disabled>
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="warning" disabled>
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="danger" disabled>
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="light" disabled>
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="medium" disabled>
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="dark" disabled>
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<ion-chip outline disabled>
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="primary" disabled>
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="secondary" disabled>
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="tertiary" disabled>
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="success" disabled>
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="warning" disabled>
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="danger" disabled>
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="light" disabled>
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="medium" disabled>
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="dark" disabled>
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<h3>Activated</h3>
|
||||
<div id="activated">
|
||||
<p>
|
||||
<ion-chip class="ion-activated">
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="primary" class="ion-activated">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary" class="ion-activated">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="tertiary" class="ion-activated">
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="success" class="ion-activated">
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="warning" class="ion-activated">
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="danger" class="ion-activated">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="light" class="ion-activated">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="medium" class="ion-activated">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="dark" class="ion-activated">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<ion-chip outline class="ion-activated">
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="primary" class="ion-activated">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="secondary" class="ion-activated">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="tertiary" class="ion-activated">
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="success" class="ion-activated">
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="warning" class="ion-activated">
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="danger" class="ion-activated">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="light" class="ion-activated">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="medium" class="ion-activated">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="dark" class="ion-activated">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<h3>Focused</h3>
|
||||
<p>
|
||||
<ion-chip disabled>
|
||||
<ion-label>Disabled</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="danger" class="ion-focused" disabled>
|
||||
<ion-label>Disabled Outline</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary" class="ion-focused" disabled>
|
||||
<ion-icon name="checkmark-circle"></ion-icon>
|
||||
<ion-label>Disabled Secondary with Icon</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline class="ion-focused" disabled>
|
||||
<ion-icon name="git-pull-request"></ion-icon>
|
||||
<ion-label>Disabled Outline with Icon and Avatar</ion-label>
|
||||
<ion-icon name="close-circle"></ion-icon>
|
||||
</ion-chip>
|
||||
`ion-chip` is not focusable by default, meaning it doesn't use `ion-focusable`. But it does have focus styles
|
||||
that target the `:focus` pseudo-class. In order to see the focus styles, you need to add tabindex="0" and tab
|
||||
into the chip.
|
||||
</p>
|
||||
<div id="focused">
|
||||
<p>
|
||||
<ion-chip tabindex="0">
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="primary" tabindex="0">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary" tabindex="0">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="tertiary" tabindex="0">
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="success" tabindex="0">
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="warning" tabindex="0">
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="danger" tabindex="0">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="light" tabindex="0">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="medium" tabindex="0">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip color="dark" tabindex="0">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<ion-chip outline tabindex="0">
|
||||
<ion-label>Default</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="primary" tabindex="0">
|
||||
<ion-label>Primary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="secondary" tabindex="0">
|
||||
<ion-label>Secondary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="tertiary" tabindex="0">
|
||||
<ion-label>Tertiary</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="success" tabindex="0">
|
||||
<ion-label>Success</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="warning" tabindex="0">
|
||||
<ion-label>Warning</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="danger" tabindex="0">
|
||||
<ion-label>Danger</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="light" tabindex="0">
|
||||
<ion-label>Light</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="medium" tabindex="0">
|
||||
<ion-label>Medium</ion-label>
|
||||
</ion-chip>
|
||||
<ion-chip outline color="dark" tabindex="0">
|
||||
<ion-label>Dark</ion-label>
|
||||
</ion-chip>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<h3>Custom</h3>
|
||||
|
||||
@@ -232,9 +306,6 @@
|
||||
<ion-chip class="wide" text="wide">
|
||||
<ion-icon name="add"></ion-icon>
|
||||
</ion-chip>
|
||||
<ion-chip class="wide ion-focused" text="wide">
|
||||
<ion-icon name="add"></ion-icon>
|
||||
</ion-chip>
|
||||
</p>
|
||||
|
||||
<!-- Custom Colors -->
|
||||
@@ -245,25 +316,19 @@
|
||||
<ion-chip color="secondary" class="custom">
|
||||
<ion-icon name="add"></ion-icon>
|
||||
</ion-chip>
|
||||
<ion-chip class="custom ion-focused">
|
||||
<ion-icon name="add"></ion-icon>
|
||||
</ion-chip>
|
||||
<ion-chip color="secondary" class="custom ion-focused">
|
||||
<ion-icon name="add"></ion-icon>
|
||||
</ion-chip>
|
||||
</p>
|
||||
</ion-content>
|
||||
</ion-app>
|
||||
|
||||
<script>
|
||||
var buttons = document.querySelectorAll('ion-chip');
|
||||
var chips = document.querySelectorAll('ion-chip');
|
||||
|
||||
for (var i = 0; i < buttons.length; i++) {
|
||||
buttons[i].addEventListener('click', (event) => onClick(event));
|
||||
for (var i = 0; i < chips.length; i++) {
|
||||
chips[i].addEventListener('click', (event) => onClick(event));
|
||||
}
|
||||
|
||||
function onClick(ev) {
|
||||
console.log('clicked the button', ev.target.innerText);
|
||||
console.log('clicked the chip', ev.target.innerText);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -188,11 +188,6 @@ export class Content implements ComponentInterface {
|
||||
this.tabsElement = null;
|
||||
this.tabsLoadCallback = undefined;
|
||||
}
|
||||
|
||||
if (this.resizeTimeout) {
|
||||
clearTimeout(this.resizeTimeout);
|
||||
this.resizeTimeout = null;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -467,7 +462,6 @@ export class Content implements ComponentInterface {
|
||||
role={isMainContent ? 'main' : undefined}
|
||||
class={createColorClasses(this.color, {
|
||||
[mode]: true,
|
||||
'content-fullscreen': this.fullscreen,
|
||||
'content-sizing': hostContext('ion-popover', this.el),
|
||||
overscroll: forceOverscroll,
|
||||
[`content-${rtl}`]: true,
|
||||
|
||||
@@ -13,38 +13,5 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, screenshot, co
|
||||
|
||||
await expect(page).toHaveScreenshot(screenshot(`content-fullscreen`));
|
||||
});
|
||||
|
||||
/**
|
||||
* The content-fullscreen class is added when fullscreen is true. The
|
||||
* fullscreen attribute is not reflected in Angular, Vue, or React, so
|
||||
* the class is needed for users to create custom themes.
|
||||
*/
|
||||
test('should have content-fullscreen class when fullscreen is true', async ({ page }) => {
|
||||
await page.setContent(
|
||||
`
|
||||
<ion-content fullscreen>
|
||||
<p>Hello</p>
|
||||
</ion-content>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const content = page.locator('ion-content');
|
||||
await expect(content).toHaveClass(/content-fullscreen/);
|
||||
});
|
||||
|
||||
test('should not have content-fullscreen class when fullscreen is false', async ({ page }) => {
|
||||
await page.setContent(
|
||||
`
|
||||
<ion-content>
|
||||
<p>Hello</p>
|
||||
</ion-content>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const content = page.locator('ion-content');
|
||||
await expect(content).not.toHaveClass(/content-fullscreen/);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
@@ -57,9 +57,7 @@
|
||||
}
|
||||
|
||||
:host .calendar-action-buttons ion-buttons {
|
||||
align-items: stretch;
|
||||
|
||||
height: 100%;
|
||||
@include padding($datetime-ios-padding * 0.5, 0, 0, 0);
|
||||
}
|
||||
|
||||
:host .calendar-action-buttons ion-buttons ion-button {
|
||||
|
||||
@@ -79,7 +79,6 @@ import { checkForPresentationFormatMismatch, warnIfTimeZoneProvided } from './ut
|
||||
* @slot buttons - The buttons in the datetime.
|
||||
* @slot time-label - The label for the time selector in the datetime.
|
||||
*
|
||||
* @part wheel - The wheel container when using a wheel style layout, or in the month/year picker when using a grid style layout.
|
||||
* @part wheel-item - The individual items when using a wheel style layout, or in the
|
||||
* month/year picker when using a grid style layout.
|
||||
* @part wheel-item active - The currently selected wheel-item.
|
||||
@@ -88,23 +87,14 @@ import { checkForPresentationFormatMismatch, warnIfTimeZoneProvided } from './ut
|
||||
* layout with `presentation="date-time"` or `"time-date"`.
|
||||
* @part time-button active - The time picker button when the picker is open.
|
||||
*
|
||||
* @part calendar-header - The calendar header manages the date navigation controls (month/year picker and previous/next buttons) and the days of the week when using a grid style layout.
|
||||
* @part month-year-button - The button that opens the month/year picker when
|
||||
* using a grid style layout.
|
||||
* @part navigation-button - The buttons used to navigate to the next or previous month when using a grid style layout.
|
||||
* @part previous-button - The button used to navigate to the previous month when using a grid style layout.
|
||||
* @part next-button - The button used to navigate to the next month when using a grid style layout.
|
||||
* @part calendar-days-of-week - The container for the day-of-the-week header (both weekdays and weekends) when using a grid style layout.
|
||||
*
|
||||
* @part calendar-day - The individual buttons that display a day inside of the datetime
|
||||
* calendar.
|
||||
* @part calendar-day active - The currently selected calendar day.
|
||||
* @part calendar-day today - The calendar day that contains the current day.
|
||||
* @part calendar-day disabled - The calendar day that is disabled.
|
||||
*
|
||||
* @part datetime-header - The datetime header contains the content for the `title` slot and the selected date.
|
||||
* @part datetime-title - The element that contains the `title` slot content.
|
||||
* @part datetime-selected-date - The element that contains the selected date.
|
||||
*/
|
||||
@Component({
|
||||
tag: 'ion-datetime',
|
||||
@@ -134,7 +124,6 @@ export class Datetime implements ComponentInterface {
|
||||
private maxParts?: any;
|
||||
private todayParts!: DatetimeParts;
|
||||
private defaultParts!: DatetimeParts;
|
||||
private loadTimeout: ReturnType<typeof setTimeout> | undefined;
|
||||
|
||||
private prevPresentation: string | null = null;
|
||||
|
||||
@@ -1088,9 +1077,6 @@ export class Datetime implements ComponentInterface {
|
||||
this.clearFocusVisible();
|
||||
this.clearFocusVisible = undefined;
|
||||
}
|
||||
if (this.loadTimeout) {
|
||||
clearTimeout(this.loadTimeout);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -1189,7 +1175,7 @@ export class Datetime implements ComponentInterface {
|
||||
*
|
||||
* We schedule this after everything has had a chance to run.
|
||||
*/
|
||||
this.loadTimeout = setTimeout(() => {
|
||||
setTimeout(() => {
|
||||
this.ensureReadyIfVisible();
|
||||
}, 100);
|
||||
|
||||
@@ -1738,7 +1724,6 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
return (
|
||||
<ion-picker-column
|
||||
part={WHEEL_PART}
|
||||
aria-label="Select a date"
|
||||
class="date-column"
|
||||
color={this.color}
|
||||
@@ -1859,7 +1844,6 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
return (
|
||||
<ion-picker-column
|
||||
part={WHEEL_PART}
|
||||
aria-label="Select a day"
|
||||
class="day-column"
|
||||
color={this.color}
|
||||
@@ -1904,7 +1888,6 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
return (
|
||||
<ion-picker-column
|
||||
part={WHEEL_PART}
|
||||
aria-label="Select a month"
|
||||
class="month-column"
|
||||
color={this.color}
|
||||
@@ -1948,7 +1931,6 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
return (
|
||||
<ion-picker-column
|
||||
part={WHEEL_PART}
|
||||
aria-label="Select a year"
|
||||
class="year-column"
|
||||
color={this.color}
|
||||
@@ -2023,7 +2005,6 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
return (
|
||||
<ion-picker-column
|
||||
part={WHEEL_PART}
|
||||
aria-label="Select an hour"
|
||||
color={this.color}
|
||||
disabled={disabled}
|
||||
@@ -2064,7 +2045,6 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
return (
|
||||
<ion-picker-column
|
||||
part={WHEEL_PART}
|
||||
aria-label="Select a minute"
|
||||
color={this.color}
|
||||
disabled={disabled}
|
||||
@@ -2108,7 +2088,6 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
return (
|
||||
<ion-picker-column
|
||||
part={WHEEL_PART}
|
||||
aria-label="Select a day period"
|
||||
style={isDayPeriodRTL ? { order: '-1' } : {}}
|
||||
color={this.color}
|
||||
@@ -2179,7 +2158,7 @@ export class Datetime implements ComponentInterface {
|
||||
const hostDir = this.el.getAttribute('dir') || undefined;
|
||||
|
||||
return (
|
||||
<div class="calendar-header" part="calendar-header">
|
||||
<div class="calendar-header">
|
||||
<div class="calendar-action-buttons">
|
||||
<div class="calendar-month-year">
|
||||
<button
|
||||
@@ -2208,12 +2187,7 @@ export class Datetime implements ComponentInterface {
|
||||
|
||||
<div class="calendar-next-prev">
|
||||
<ion-buttons>
|
||||
<ion-button
|
||||
aria-label="Previous month"
|
||||
disabled={prevMonthDisabled}
|
||||
onClick={() => this.prevMonth()}
|
||||
part="navigation-button previous-button"
|
||||
>
|
||||
<ion-button aria-label="Previous month" disabled={prevMonthDisabled} onClick={() => this.prevMonth()}>
|
||||
<ion-icon
|
||||
dir={hostDir}
|
||||
aria-hidden="true"
|
||||
@@ -2223,12 +2197,7 @@ export class Datetime implements ComponentInterface {
|
||||
flipRtl
|
||||
></ion-icon>
|
||||
</ion-button>
|
||||
<ion-button
|
||||
aria-label="Next month"
|
||||
disabled={nextMonthDisabled}
|
||||
onClick={() => this.nextMonth()}
|
||||
part="navigation-button next-button"
|
||||
>
|
||||
<ion-button aria-label="Next month" disabled={nextMonthDisabled} onClick={() => this.nextMonth()}>
|
||||
<ion-icon
|
||||
dir={hostDir}
|
||||
aria-hidden="true"
|
||||
@@ -2241,7 +2210,7 @@ export class Datetime implements ComponentInterface {
|
||||
</ion-buttons>
|
||||
</div>
|
||||
</div>
|
||||
<div class="calendar-days-of-week" aria-hidden="true" part="calendar-days-of-week">
|
||||
<div class="calendar-days-of-week" aria-hidden="true">
|
||||
{getDaysOfWeek(this.locale, mode, this.firstDayOfWeek % 7).map((d) => {
|
||||
return <div class="day-of-week">{d}</div>;
|
||||
})}
|
||||
@@ -2594,15 +2563,11 @@ export class Datetime implements ComponentInterface {
|
||||
}
|
||||
|
||||
return (
|
||||
<div class="datetime-header" part="datetime-header">
|
||||
<div class="datetime-title" part="datetime-title">
|
||||
<div class="datetime-header">
|
||||
<div class="datetime-title">
|
||||
<slot name="title">Select Date</slot>
|
||||
</div>
|
||||
{showExpandedHeader && (
|
||||
<div class="datetime-selected-date" part="datetime-selected-date">
|
||||
{this.getHeaderSelectedDateText()}
|
||||
</div>
|
||||
)}
|
||||
{showExpandedHeader && <div class="datetime-selected-date">{this.getHeaderSelectedDateText()}</div>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -2751,6 +2716,5 @@ export class Datetime implements ComponentInterface {
|
||||
let datetimeIds = 0;
|
||||
const CANCEL_ROLE = 'datetime-cancel';
|
||||
const CONFIRM_ROLE = 'datetime-confirm';
|
||||
const WHEEL_PART = 'wheel';
|
||||
const WHEEL_ITEM_PART = 'wheel-item';
|
||||
const WHEEL_ITEM_ACTIVE_PART = `active`;
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 45 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 29 KiB After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
@@ -42,324 +42,6 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
|
||||
await expect(datetime).toHaveScreenshot(screenshot(`datetime-custom-calendar-days`));
|
||||
});
|
||||
});
|
||||
|
||||
test.describe(title('CSS shadow parts'), () => {
|
||||
test('should be able to customize wheel part within the wheel style', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/30420',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(wheel) {
|
||||
background-color: red;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime
|
||||
prefer-wheel="true"
|
||||
value="2020-03-14T14:23:00.000Z"
|
||||
></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const pickerColumn = datetime.locator('ion-picker-column').first();
|
||||
|
||||
const backgroundColor = await pickerColumn.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(backgroundColor).toBe('rgb(255, 0, 0)');
|
||||
});
|
||||
|
||||
test('should be able to customize wheel part within the month/year picker', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/30420',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(wheel) {
|
||||
background-color: orange;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime
|
||||
value="2020-03-14T14:23:00.000Z"
|
||||
></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const monthYearButton = datetime.locator('.calendar-month-year-toggle');
|
||||
|
||||
await monthYearButton.click();
|
||||
|
||||
const pickerColumn = datetime.locator('ion-picker-column').first();
|
||||
|
||||
const backgroundColor = await pickerColumn.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(backgroundColor).toBe('rgb(255, 165, 0)');
|
||||
});
|
||||
|
||||
test('should be able to customize wheel part within the time picker', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/30420',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-picker-column {
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime
|
||||
value="2020-03-14T14:23:00.000Z"
|
||||
></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const timeButton = datetime.locator('.time-body');
|
||||
|
||||
await timeButton.click();
|
||||
|
||||
const pickerColumn = page.locator('ion-picker-column').first();
|
||||
|
||||
const backgroundColor = await pickerColumn.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(backgroundColor).toBe('rgb(0, 128, 0)');
|
||||
});
|
||||
|
||||
test('should be able to customize wheel part when focused', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/30420',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(wheel):focus {
|
||||
background-color: blue;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime
|
||||
prefer-wheel="true"
|
||||
value="2020-03-14T14:23:00.000Z"
|
||||
></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const pickerColumn = datetime.locator('ion-picker-column').first();
|
||||
|
||||
await pickerColumn.click({ position: { x: 10, y: 10 } });
|
||||
|
||||
const backgroundColor = await pickerColumn.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(backgroundColor).toBe('rgb(0, 0, 255)');
|
||||
});
|
||||
|
||||
test('should be able to customize datetime header parts', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/30083',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(datetime-header) {
|
||||
background-color: orange;
|
||||
}
|
||||
|
||||
ion-datetime::part(datetime-title) {
|
||||
background-color: pink;
|
||||
}
|
||||
|
||||
ion-datetime::part(datetime-selected-date) {
|
||||
background-color: violet;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime value="2020-03-14T14:23:00.000Z">
|
||||
<span slot="title">Select Date</span>
|
||||
</ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const header = datetime.locator('.datetime-header');
|
||||
const title = datetime.locator('.datetime-title');
|
||||
const selectedDate = datetime.locator('.datetime-selected-date');
|
||||
|
||||
const headerBackgroundColor = await header.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
const titleBackgroundColor = await title.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
const selectedDateBackgroundColor = await selectedDate.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(headerBackgroundColor).toBe('rgb(255, 165, 0)');
|
||||
expect(titleBackgroundColor).toBe('rgb(255, 192, 203)');
|
||||
expect(selectedDateBackgroundColor).toBe('rgb(238, 130, 238)');
|
||||
});
|
||||
|
||||
test('should be able to customize calendar header part', async ({ page }) => {
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(calendar-header) {
|
||||
background-color: orange;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime value="2020-03-14T14:23:00.000Z"></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const header = datetime.locator('.calendar-header');
|
||||
|
||||
const backgroundColor = await header.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(backgroundColor).toBe('rgb(255, 165, 0)');
|
||||
});
|
||||
|
||||
test('should be able to customize month/year picker part', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/26596',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(month-year-button) {
|
||||
background-color: lightblue;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime value="2020-03-14T14:23:00.000Z"></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const monthYearButton = datetime.locator('.calendar-month-year-toggle');
|
||||
|
||||
const backgroundColor = await monthYearButton.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(backgroundColor).toBe('rgb(173, 216, 230)');
|
||||
});
|
||||
|
||||
test('should be able to customize navigation button parts', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/30830',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(navigation-button) {
|
||||
background-color: firebrick;
|
||||
}
|
||||
|
||||
ion-datetime::part(previous-button) {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
ion-datetime::part(next-button) {
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime value="2020-03-14T14:23:00.000Z"></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const prevButton = datetime.locator('.calendar-next-prev ion-button').first();
|
||||
const nextButton = datetime.locator('.calendar-next-prev ion-button').last();
|
||||
|
||||
const prevBackgroundColor = await prevButton.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
const prevColor = await prevButton.evaluate((el) => {
|
||||
return window.getComputedStyle(el).color;
|
||||
});
|
||||
|
||||
const nextBackgroundColor = await nextButton.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
const nextColor = await nextButton.evaluate((el) => {
|
||||
return window.getComputedStyle(el).color;
|
||||
});
|
||||
|
||||
// Verify the navigation-button part applies the styles
|
||||
expect(prevBackgroundColor).toBe('rgb(178, 34, 34)');
|
||||
expect(nextBackgroundColor).toBe('rgb(178, 34, 34)');
|
||||
// Verify the previous-button part applies the styles
|
||||
expect(prevColor).toBe('rgb(0, 0, 255)');
|
||||
// Verify the next-button part applies the styles
|
||||
expect(nextColor).toBe('rgb(0, 128, 0)');
|
||||
});
|
||||
|
||||
test('should be able to customize days of the week part', async ({ page }, testInfo) => {
|
||||
testInfo.annotations.push({
|
||||
type: 'issue',
|
||||
description: 'https://github.com/ionic-team/ionic-framework/issues/30830',
|
||||
});
|
||||
|
||||
await page.setContent(
|
||||
`
|
||||
<style>
|
||||
ion-datetime::part(calendar-days-of-week) {
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
<ion-datetime value="2020-03-14T14:23:00.000Z"></ion-datetime>
|
||||
`,
|
||||
config
|
||||
);
|
||||
|
||||
const datetime = page.locator('ion-datetime');
|
||||
const daysOfWeek = datetime.locator('.calendar-days-of-week');
|
||||
|
||||
const backgroundColor = await daysOfWeek.evaluate((el) => {
|
||||
return window.getComputedStyle(el).backgroundColor;
|
||||
});
|
||||
|
||||
expect(backgroundColor).toBe('rgb(0, 128, 0)');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 34 KiB After Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.8 KiB After Width: | Height: | Size: 6.8 KiB |
@@ -74,13 +74,6 @@
|
||||
color: rgb(128, 30, 171);
|
||||
}
|
||||
|
||||
/* Targets the month/year picker and the wheel style datetime */
|
||||
.custom-grid-wheel::part(wheel):focus,
|
||||
/* Targets the time picker */
|
||||
ion-picker-column:focus {
|
||||
background-color: rgba(138, 238, 69, 0.37);
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Datetime Day Parts
|
||||
* -------------------------------------------
|
||||
@@ -134,46 +127,6 @@
|
||||
background-color: rgb(154 209 98 / 0.2);
|
||||
color: #9ad162;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom Datetime Header Parts
|
||||
* -------------------------------------------
|
||||
*/
|
||||
|
||||
#custom-grid::part(calendar-header),
|
||||
#custom-title::part(datetime-header) {
|
||||
background-color: orange;
|
||||
}
|
||||
|
||||
#custom-grid::part(month-year-button) {
|
||||
background-color: lightblue;
|
||||
color: rgb(128, 30, 171);
|
||||
}
|
||||
|
||||
#custom-grid::part(navigation-button) {
|
||||
background-color: firebrick;
|
||||
}
|
||||
|
||||
#custom-grid::part(previous-button) {
|
||||
color: white;
|
||||
}
|
||||
|
||||
#custom-grid::part(next-button) {
|
||||
color: black;
|
||||
}
|
||||
|
||||
#custom-grid::part(calendar-days-of-week) {
|
||||
background-color: #9ad162;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#custom-title::part(datetime-title) {
|
||||
background-color: pink;
|
||||
}
|
||||
|
||||
#custom-title::part(datetime-selected-date) {
|
||||
background-color: violet;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
@@ -203,11 +156,6 @@
|
||||
<h2>Grid Style</h2>
|
||||
<ion-datetime id="custom-calendar-days" value="2023-06-15" presentation="date"></ion-datetime>
|
||||
</div>
|
||||
<div class="grid-item">
|
||||
<ion-datetime id="custom-title" presentation="date">
|
||||
<span slot="title">Select Date</span>
|
||||
</ion-datetime>
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
</ion-app>
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user