javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(item-divider): add interface

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

185
core/src/components/item-divider/item-divider.interfaces.ts Normal file
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;
};
};
};

8
core/src/themes/ionic/default.tokens.ts
View File

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

4
core/src/themes/ionic/shared.tokens.ts
View File

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

8
core/src/themes/md/default.tokens.ts
View File

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

4
core/src/themes/md/shared.tokens.ts
View File

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

3
core/src/themes/themes.interfaces.ts
View File

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