feat(item-divider): add interface

This commit is contained in:
Maria Hutt
2026-03-12 13:47:42 -07:00
parent fd9f0b5bd0
commit 77e50df450
6 changed files with 187 additions and 25 deletions

View File

@@ -0,0 +1,185 @@
import type { IonPadding, IonMargin } from '../../themes/themes.interfaces';
export type IonItemDividerRecipe = {
background?: string;
color?: string;
minHeight?: string;
zIndex?: number;
padding?: IonPadding;
inner?: {
padding?: IonPadding;
};
border?: {
bottom?: string;
};
font?: {
size?: string;
weight?: string;
};
leading?: {
anchor?: {
margin?: IonMargin;
};
edge?: {
margin?: IonMargin;
};
};
trailing?: {
edge?: {
margin?: IonMargin;
};
};
label?: {
margin?: IonMargin;
};
icon?: {
font?: {
size?: string;
};
leading?: {
edge?: {
margin?: IonMargin;
};
};
trailing?: {
edge?: {
margin?: IonMargin;
};
};
default?: {
color?: string;
};
semantic?: {
default?: {
color?: string;
};
};
};
note?: {
align?: {
self?: string;
};
font?: {
size?: string;
};
margin?: IonMargin;
padding?: IonPadding;
};
avatar?: {
height?: string;
width?: string;
margin?: IonMargin;
leading?: {
edge?: {
margin?: IonMargin;
};
};
trailing?: {
edge?: {
margin?: IonMargin;
};
};
};
thumbnail?: {
height?: string;
width?: string;
margin?: IonMargin;
leading?: {
edge?: {
margin?: IonMargin;
};
};
trailing?: {
edge?: {
margin?: IonMargin;
};
};
};
header1?: {
margin?: IonMargin;
};
header2?: {
margin?: IonMargin;
trailing?: {
margin?: IonMargin;
};
};
header3?: {
margin?: IonMargin;
trailing?: {
margin?: IonMargin;
};
};
header4?: {
margin?: IonMargin;
trailing?: {
margin?: IonMargin;
};
};
header5?: {
margin?: IonMargin;
trailing?: {
margin?: IonMargin;
};
};
header6?: {
margin?: IonMargin;
trailing?: {
margin?: IonMargin;
};
};
paragraph?: {
color?: string;
overflow?: string;
margin?: IonMargin;
font?: {
size?: string;
};
text?: {
overflow?: string;
};
trailing?: {
margin?: IonMargin;
};
};
};

View File

@@ -403,16 +403,13 @@ export const defaultTheme: DefaultTheme = {
margin: {
top: components.item.media.slot.margin.top,
end: components.item.media.slot.margin.end,
bottom: components.item.media.slot.margin.bottom,
start: components.item.media.slot.margin.start,
},
leading: {
// Targets `ion-avatar[slot="start"]`
edge: {
margin: {
start: components.item.media.start.slot.margin.start,
end: components.item.media.start.slot.margin.end,
},
},
@@ -423,7 +420,6 @@ export const defaultTheme: DefaultTheme = {
edge: {
margin: {
start: components.item.media.end.slot.margin.start,
end: components.item.media.end.slot.margin.end,
},
},
},
@@ -437,16 +433,13 @@ export const defaultTheme: DefaultTheme = {
margin: {
top: components.item.media.slot.margin.top,
end: components.item.media.slot.margin.end,
bottom: components.item.media.slot.margin.bottom,
start: components.item.media.slot.margin.start,
},
leading: {
// Targets `ion-thumbnail[slot="start"]`
edge: {
margin: {
start: components.item.media.start.slot.margin.start,
end: components.item.media.start.slot.margin.end,
},
},
@@ -457,7 +450,6 @@ export const defaultTheme: DefaultTheme = {
edge: {
margin: {
start: components.item.media.end.slot.margin.start,
end: components.item.media.end.slot.margin.end,
},
},
},

View File

@@ -103,9 +103,7 @@ export const components = {
slot: {
margin: {
top: 'var(--ion-spacing-sm)',
end: null,
bottom: 'var(--ion-spacing-sm)',
start: null,
},
},
@@ -113,7 +111,6 @@ export const components = {
slot: {
margin: {
end: 'var(--ion-spacing-lg)',
start: null,
},
},
},
@@ -121,7 +118,6 @@ export const components = {
end: {
slot: {
margin: {
end: null,
start: 'var(--ion-spacing-lg)',
},
},

View File

@@ -536,16 +536,13 @@ export const defaultTheme: DefaultTheme = {
margin: {
top: components.item.media.slot.margin.top,
end: components.item.media.slot.margin.end,
bottom: components.item.media.slot.margin.bottom,
start: components.item.media.slot.margin.start,
},
leading: {
// Targets `ion-avatar[slot="start"]`
edge: {
margin: {
start: components.item.media.start.slot.margin.start,
end: components.item.media.start.slot.margin.end,
},
},
@@ -556,7 +553,6 @@ export const defaultTheme: DefaultTheme = {
edge: {
margin: {
start: components.item.media.end.slot.margin.start,
end: components.item.media.end.slot.margin.end,
},
},
},
@@ -570,16 +566,13 @@ export const defaultTheme: DefaultTheme = {
margin: {
top: components.item.media.slot.margin.top,
end: components.item.media.slot.margin.end,
bottom: components.item.media.slot.margin.bottom,
start: components.item.media.slot.margin.start,
},
leading: {
// Targets `ion-thumbnail[slot="start"]`
edge: {
margin: {
start: components.item.media.start.slot.margin.start,
end: components.item.media.start.slot.margin.end,
},
},
@@ -590,7 +583,6 @@ export const defaultTheme: DefaultTheme = {
edge: {
margin: {
start: components.item.media.end.slot.margin.start,
end: components.item.media.end.slot.margin.end,
},
},
},

View File

@@ -114,9 +114,7 @@ export const components = {
slot: {
margin: {
top: 'var(--ion-spacing-sm)',
end: null,
bottom: 'var(--ion-spacing-sm)',
start: null,
},
},
@@ -124,7 +122,6 @@ export const components = {
slot: {
margin: {
end: 'var(--ion-spacing-lg)',
start: null,
},
},
},
@@ -132,7 +129,6 @@ export const components = {
end: {
slot: {
margin: {
end: null,
start: 'var(--ion-spacing-lg)',
},
},

View File

@@ -1,4 +1,5 @@
import type { IonChipRecipe, IonChipConfig } from '../components/chip/chip.interfaces';
import type { IonItemDividerRecipe } from '../components/item-divider/item-divider.interfaces';
import type { IonicConfig as IonicGlobalConfig } from '../utils/config';
// Platform-specific theme
@@ -282,7 +283,7 @@ export type DefaultTheme = BaseTheme & {
type Components = {
IonChip?: IonChipRecipe;
IonItemDivider?: any;
IonItemDivider?: IonItemDividerRecipe;
IonCard?: any;
IonItem?: any;