class PagePage extends StatefulWidget {
  PagePage({Key? key}) : super(key: key);

  @override
  State<PagePage> createState() => _PagePageState();
}

class _PagePageState extends State<PagePage> {

  List<String> _values = [];
  
  _onDelete(index) {
    setState(() {
      _values.removeAt(index);
    });
  }

  @override
  Widget build(BuildContext context) {
    return PlatformScaffold(
      appBar: PlatformAppBar(
        title: const Text('Flutter Platform Widgets'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(15.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Center(
              child: TagEditor(
                  length: _values.length,
                  delimiters: [',', ' '],
                  hasAddButton: true,
                  inputDecoration: const InputDecoration(
                    border: InputBorder.none,
                    hintText: 'Hint Text...',
                  ),
                  onTagChanged: (newValue) {
                    setState(() {
                      _values.add(newValue);
                    });
                  },
                  tagBuilder: (context, index) => _Chip(
                    index: index,
                    label: _values[index],
                    onDeleted: _onDelete,
                  ),
                  suggestionBuilder: (context, state, data) => 
                		ListTile(
                    key: ObjectKey(data),
                    title: Text(data.toString()),
                    onTap: () {
                      state.selectSuggestion(data);
                    },
                  ),
                  suggestionsBoxElevation: 10,
                  findSuggestions: (String query) {
                    return [];
                  }
              )
            ),
            ElevatedButton(onPressed: (){
              print(_values.length);
            }, child: Text('print')),
          ],
        ),
      ),
    );
  }
}

class _Chip extends StatelessWidget {
  const _Chip({
    required this.label,
    required this.onDeleted,
    required this.index,
  });

  final String label;
  final ValueChanged<int> onDeleted;
  final int index;

  @override
  Widget build(BuildContext context) {
    return Chip(
      labelPadding: const EdgeInsets.only(left: 8.0),
      label: Text(label),
      deleteIcon: const Icon(
        Icons.close,
        size: 18,
      ),
      onDeleted: () {
        onDeleted(index);
      },
    );
  }
}