feat(item-divider): remove theme usage

This commit is contained in:
Maria Hutt
2026-03-12 09:31:30 -07:00
parent 38145a3b3e
commit e2cf0e4278
5 changed files with 7 additions and 19 deletions

View File

@@ -1244,7 +1244,6 @@ ion-item-divider,shadow
ion-item-divider,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
ion-item-divider,prop,mode,"ios" | "md",undefined,false,false
ion-item-divider,prop,sticky,boolean,false,false,false
ion-item-divider,prop,theme,"ios" | "md" | "ionic",undefined,false,false
ion-item-divider,css-prop,--background
ion-item-divider,css-prop,--color
ion-item-divider,css-prop,--inner-padding-bottom

View File

@@ -1920,10 +1920,6 @@ export namespace Components {
* @default false
*/
"sticky": boolean;
/**
* The theme determines the visual appearance of the component.
*/
"theme"?: "ios" | "md" | "ionic";
}
interface IonItemGroup {
/**
@@ -7918,10 +7914,6 @@ declare namespace LocalJSX {
* @default false
*/
"sticky"?: boolean;
/**
* The theme determines the visual appearance of the component.
*/
"theme"?: "ios" | "md" | "ionic";
}
interface IonItemGroup {
/**

View File

@@ -2,12 +2,10 @@ import type { ComponentInterface } from '@stencil/core';
import { Component, Element, Host, Prop, h } from '@stencil/core';
import { createColorClasses } from '@utils/theme';
import { getIonTheme } from '../../global/ionic-global';
import type { Color } from '../../interface';
/**
* @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
* @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
*
* @slot - Content is placed between the named slots if provided without a slot.
* @slot start - Content is placed to the left of the divider text in LTR, and to the right in RTL.
@@ -38,13 +36,12 @@ export class ItemDivider implements ComponentInterface {
@Prop() sticky = false;
render() {
const theme = getIonTheme(this);
const { color, sticky } = this;
return (
<Host
class={createColorClasses(this.color, {
[theme]: true,
'item-divider-sticky': this.sticky,
class={createColorClasses(color, {
'item-divider-sticky': sticky,
item: true,
})}
>

View File

@@ -1150,14 +1150,14 @@ export declare interface IonItem extends Components.IonItem {}
@ProxyCmp({
inputs: ['color', 'mode', 'sticky', 'theme']
inputs: ['color', 'mode', 'sticky']
})
@Component({
selector: 'ion-item-divider',
changeDetection: ChangeDetectionStrategy.OnPush,
template: '<ng-content></ng-content>',
// eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
inputs: ['color', 'mode', 'sticky', 'theme'],
inputs: ['color', 'mode', 'sticky'],
})
export class IonItemDivider {
protected el: HTMLIonItemDividerElement;

View File

@@ -1058,14 +1058,14 @@ export declare interface IonItem extends Components.IonItem {}
@ProxyCmp({
defineCustomElementFn: defineIonItemDivider,
inputs: ['color', 'mode', 'sticky', 'theme']
inputs: ['color', 'mode', 'sticky']
})
@Component({
selector: 'ion-item-divider',
changeDetection: ChangeDetectionStrategy.OnPush,
template: '<ng-content></ng-content>',
// eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
inputs: ['color', 'mode', 'sticky', 'theme'],
inputs: ['color', 'mode', 'sticky'],
standalone: true
})
export class IonItemDivider {