InkWell

A rectangular area of a Material that responds to touch.

Usage

Tap Me

<template>
  <Container :width="100" :height="100" color="#e0e0e0">
    <InkWell @tap="onTap">
      <Center>
        <Text>Tap Me</Text>
      </Center>
    </InkWell>
  </Container>
</template>

<script setup lang="ts">
import { Container, InkWell, Center, Text } from "fluekit";

const onTap = () => {
  console.log("InkWell tapped");
};
</script>

API

Props

Name	Type	Default	Description
splashColor	string	'rgba(0, 0, 0, 0.1)'	The splash color of the ink response.
highlightColor	string	-	The highlight color of the ink response when pressed.
borderRadius	string	-	The clipping radius of the splash (CSS border-radius).
disabled	boolean	false	Whether the ink well is disabled.

Events

Name	Description
tap	Triggered when the ink well is tapped.