import { ChipTokens } from '../../Theme/components/ChipTokens'
import { rv } from '../../../rv'

export const chip: ChipTokens = {
    containerColor: 'transparent',
    containerElevation: (ds) => ds.sys.elevation.level0,
    containerOutlineColor: (ds) => ds.sys.color.outlineVariant,
    containerOutlineWidth: 1,
    containerShape: (ds) => ds.sys.shape.small,
    containerPaddingVertical: rv(4),
    containerPaddingHorizontal: rv(12),
    containerGap: rv(6),
    labelTypeScale: (ds) => ds.sys.typeScale.labelMedium,
    labelColor: (ds) => ds.sys.color.onSurfaceVariant,
    iconSize: rv(16),
    iconColor: (ds) => ds.sys.color.onSurfaceVariant,
    selectedContainerColor: (ds) => ds.sys.color.primaryContainer,
    selectedContainerOutlineColor: (ds) => ds.sys.color.primary,
    selectedContainerOutlineWidth: 1,
    selectedLabelColor: (ds) => ds.sys.color.onPrimaryContainer,
    selectedIconColor: (ds) => ds.sys.color.onPrimaryContainer,
    disabledContainerColor: (ds) => ds.sys.color.onSurface,
    disabledContainerOpacity: (ds) => ds.sys.state.disabledContainerOpacity,
    disabledContainerOutlineColor: (ds) => ds.sys.color.onSurface,
    disabledContainerOutlineOpacity: (ds) => ds.sys.state.disabledContainerOpacity,
    disabledLabelColor: (ds) => ds.sys.color.onSurface,
    disabledLabelOpacity: (ds) => ds.sys.state.disabledOnContainerOpacity,
    disabledIconColor: (ds) => ds.sys.color.onSurface,
    disabledIconOpacity: (ds) => ds.sys.state.disabledOnContainerOpacity,
    pressedStateLayerColor: (ds) => ds.sys.color.onSurfaceVariant,
    pressedStateLayerOpacity: (ds) => ds.sys.state.pressedStateLayerOpacity,
    pressedLabelColor: (ds) => ds.sys.color.onSurfaceVariant,
    pressedIconColor: (ds) => ds.sys.color.onSurfaceVariant,
    pressedSelectedStateLayerColor: (ds) => ds.sys.color.onPrimaryContainer,
    pressedSelectedStateLayerOpacity: (ds) => ds.sys.state.pressedStateLayerOpacity,
    pressedSelectedLabelColor: (ds) => ds.sys.color.onPrimaryContainer,
    pressedSelectedIconColor: (ds) => ds.sys.color.onPrimaryContainer,
}