Product Variant Select Component (ProductVariantSelect/ProductVariantSelect.tsx)

simpos · apps/simpos/src/apps/pos/components/ProductVariantSelect/ProductVariantSelect.tsx · typescript · MIT
ui, pos, fw:react, tag:selection

Displays available product variants for selection in a POS interface.

// Source: https://github.com/hieuhani/simpos | License: MIT
// Provided via justclaw.it.com; keep this notice with the code.
import React from 'react';
import { Stack } from '@chakra-ui/react';
import { ProductVariant } from '../../../../services/db';
import { ProductVariantLine } from './ProductVariantLine';

export interface ProductVariantSelectProps {
  variants: ProductVariant[];
  onSelectVariant: (variant: ProductVariant) => void;
}

export const ProductVariantSelect: React.FunctionComponent<ProductVariantSelectProps> = ({
  variants,
  onSelectVariant,
}) => {
  return (
    <Stack spacing={2} mb={4}>
      {variants.map((variant) => (
        <ProductVariantLine
          key={variant.id}
          onSelect={() => onSelectVariant(variant)}
          variant={variant}
        />
  

... (truncated -- full source via MCP)

See the full source, get the GitHub permalink, and search for more like it.

Get a free API key