Komponen / Kolaborasi & domain
ProductMark
Logo produk Divistant (Divistant, BizOps, IntegraCI) untuk header sidebar dan brand AppHeader. SVG inline yang warnanya mengikuti palet merek produk (token brand/200, 400, 600).
Import
tsx
import { ProductMark } from '@divistant/circca-react';Props
Juga menerima atribut <span>. Tanpa showName dirender role="img" dengan aria-label nama produk.
| Prop | Tipe | Default | Keterangan |
|---|---|---|---|
| product | 'divistant' | 'bizops' | 'integraci' | 'bizops' | Produk — menentukan palet merek (data-brand) dan nama bawaan. |
| size | 20 | 24 | 32 | 48 | 20 | Ukuran tanda (properti Figma "Size"). Header sidebar memakai 24. |
| name | string | — | Nama yang ditampilkan/diumumkan. Bawaan dari product ("BizOps"). |
| showName | boolean | false | Tampilkan nama (Heading/Small) dan baris org (Footnote/Default muted) di sebelah tanda; tanda menjadi dekoratif. |
| org | string | false | 'by Divistant' | Baris kedua saat showName. Bawaan "by Divistant" untuk BizOps & IntegraCI, kosong untuk Divistant. |
| decorative | boolean | false | Tanda tanpa nama aksesibel — bila nama produk sudah tertulis di dekatnya. |
| className | string | — | Kelas tambahan. |
Sumber
Kode komponen ada di packages/react/src/components/product-mark. Gaya hanya memakai kelas token Circca HIG — tidak ada warna, spasi, atau radius mentah.