@formicoidea/labre-core 0.23.0

package/src/_pkgs/affine-components/icons/file-icons.ts

@@ -0,0 +1,105 @@
+import {
+  FileIconAepIcon,
+  FileIconAiIcon,
+  FileIconAviIcon,
+  FileIconCssIcon,
+  FileIconCsvIcon,
+  FileIconDmgIcon,
+  FileIconDocIcon,
+  FileIconDocxIcon,
+  FileIconEpsIcon,
+  FileIconExeIcon,
+  FileIconFigIcon,
+  FileIconGifIcon,
+  FileIconHtmlIcon,
+  FileIconImgIcon,
+  FileIconInddIcon,
+  FileIconJavaIcon,
+  FileIconJpegIcon,
+  FileIconJpgIcon,
+  FileIconJsIcon,
+  FileIconJsonIcon,
+  FileIconMdIcon,
+  FileIconMkvIcon,
+  FileIconMp3Icon,
+  FileIconMp4Icon,
+  FileIconMpegIcon,
+  FileIconNoneIcon,
+  FileIconPdfIcon,
+  FileIconPngIcon,
+  FileIconPptIcon,
+  FileIconPptxIcon,
+  FileIconPsdIcon,
+  FileIconRarIcon,
+  FileIconRssIcon,
+  FileIconSqlIcon,
+  FileIconSvgIcon,
+  FileIconTiffIcon,
+  FileIconTxtIcon,
+  FileIconWavIcon,
+  FileIconWebpIcon,
+  FileIconXlsIcon,
+  FileIconXlsxIcon,
+  FileIconXmlIcon,
+  FileIconZipIcon,
+} from '@blocksuite/icons/lit';
+
+// TODO(@fundon): should be an extension, users can customize.
+const iconMap = new Map([
+  ['img', FileIconImgIcon],
+  ['jpg', FileIconJpgIcon],
+  ['jpeg', FileIconJpegIcon],
+  ['png', FileIconPngIcon],
+  ['webp', FileIconWebpIcon],
+  ['tiff', FileIconTiffIcon],
+  ['gif', FileIconGifIcon],
+  ['svg', FileIconSvgIcon],
+  ['eps', FileIconEpsIcon],
+  ['pdf', FileIconPdfIcon],
+  ['doc', FileIconDocIcon],
+  ['docx', FileIconDocxIcon],
+  ['txt', FileIconTxtIcon],
+  ['csv', FileIconCsvIcon],
+  ['xls', FileIconXlsIcon],
+  ['xlsx', FileIconXlsxIcon],
+  ['ppt', FileIconPptIcon],
+  ['pptx', FileIconPptxIcon],
+  ['fig', FileIconFigIcon],
+  ['ai', FileIconAiIcon],
+  ['psd', FileIconPsdIcon],
+  ['indd', FileIconInddIcon],
+  ['aep', FileIconAepIcon],
+  ['mp3', FileIconMp3Icon],
+  ['wav', FileIconWavIcon],
+  ['mp4', FileIconMp4Icon],
+  ['mpeg', FileIconMpegIcon],
+  ['avi', FileIconAviIcon],
+  ['mkv', FileIconMkvIcon],
+  ['html', FileIconHtmlIcon],
+  ['css', FileIconCssIcon],
+  ['rss', FileIconRssIcon],
+  ['md', FileIconMdIcon],
+  ['sql', FileIconSqlIcon],
+  ['js', FileIconJsIcon],
+  ['json', FileIconJsonIcon],
+  ['java', FileIconJavaIcon],
+  ['xml', FileIconXmlIcon],
+  ['exe', FileIconExeIcon],
+  ['dmg', FileIconDmgIcon],
+  ['zip', FileIconZipIcon],
+  ['rar', FileIconRarIcon],
+  ['none', FileIconNoneIcon],
+]);
+
+// It's `40 x 40` by default.
+export function getAttachmentFileIcon(
+  filetype: string,
+  options: Parameters<typeof FileIconNoneIcon>[0] = {
+    width: '2.5em',
+    height: '2.5em',
+    style: 'font-size: 16px',
+  }
+) {
+  const Icon = iconMap.get(filetype) ?? FileIconNoneIcon;
+  return Icon(options);
+}

package/src/_pkgs/affine-components/icons/import-export.ts

@@ -0,0 +1,110 @@
+import { html } from 'lit';
+
+export const CloseIcon = html`
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M5.46967 5.46967C5.76256 5.17678 6.23744 5.17678 6.53033 5.46967L12 10.9393L17.4697 5.46967C17.7626 5.17678 18.2374 5.17678 18.5303 5.46967C18.8232 5.76256 18.8232 6.23744 18.5303 6.53033L13.0607 12L18.5303 17.4697C18.8232 17.7626 18.8232 18.2374 18.5303 18.5303C18.2374 18.8232 17.7626 18.8232 17.4697 18.5303L12 13.0607L6.53033 18.5303C6.23744 18.8232 5.76256 18.8232 5.46967 18.5303C5.17678 18.2374 5.17678 17.7626 5.46967 17.4697L10.9393 12L5.46967 6.53033C5.17678 6.23744 5.17678 5.76256 5.46967 5.46967Z"
+      fill="currentColor"
+    />
+  </svg>
+`;
+
+export const ExportToMarkdownIcon = html`<svg
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M8 2.25C6.48122 2.25 5.25 3.48122 5.25 5V8C5.25 8.41421 5.58579 8.75 6 8.75C6.41421 8.75 6.75 8.41421 6.75 8V5C6.75 4.30964 7.30964 3.75 8 3.75H13H15.5218C15.9076 3.75 16.2717 3.92809 16.5085 4.23257L18.9867 7.41879C19.1573 7.63821 19.25 7.90825 19.25 8.18622V12V18C19.25 18.6904 18.6904 19.25 18 19.25H8C7.30964 19.25 6.75 18.6904 6.75 18V16.5C6.75 16.0858 6.41421 15.75 6 15.75C5.58579 15.75 5.25 16.0858 5.25 16.5V18C5.25 19.5188 6.48122 20.75 8 20.75H18C19.5188 20.75 20.75 19.5188 20.75 18V12V8.18622C20.75 7.57468 20.5462 6.98059 20.1707 6.49788L17.6926 3.31166C17.1715 2.6418 16.3705 2.25 15.5218 2.25H13H8ZM2.76855 13.8408C2.76855 14.1765 2.94849 14.3672 3.26538 14.3672C3.58228 14.3672 3.76221 14.1765 3.76221 13.8408V12.0549H3.78369L4.55444 13.9966C4.62964 14.1899 4.76123 14.2812 4.96533 14.2812C5.16675 14.2812 5.29028 14.1926 5.36816 13.9966L6.13892 12.0549H6.1604V13.8408C6.1604 14.1765 6.34033 14.3672 6.65723 14.3672C6.97412 14.3672 7.15405 14.1765 7.15405 13.8408V11.1042C7.15405 10.6262 6.89087 10.3577 6.41553 10.3577C6.01538 10.3577 5.80322 10.5161 5.64209 10.9377L4.97339 12.686H4.9519L4.28052 10.9377C4.11938 10.5161 3.90723 10.3577 3.50708 10.3577C3.03174 10.3577 2.76855 10.6262 2.76855 11.1042V13.8408ZM7.69385 13.7039C7.69385 14.0852 7.90063 14.3 8.26318 14.3H9.35083C10.5244 14.3 11.2173 13.575 11.2173 12.3342C11.2173 11.0935 10.5271 10.4248 9.35083 10.4248H8.26318C7.90063 10.4248 7.69385 10.6396 7.69385 11.021V13.7039ZM9.1897 13.395H8.83252V11.3298H9.1897C9.73486 11.3298 10.0571 11.6816 10.0571 12.3342C10.0571 13.0486 9.75903 13.395 9.1897 13.395Z"
+    fill="currentColor"
+  />
+</svg> `;
+
+export const ExportToHTMLIcon = html`<svg
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M8 2.25C6.48122 2.25 5.25 3.48122 5.25 5V8C5.25 8.41421 5.58579 8.75 6 8.75C6.41421 8.75 6.75 8.41421 6.75 8V5C6.75 4.30964 7.30964 3.75 8 3.75H15.5218C15.9076 3.75 16.2717 3.92809 16.5085 4.23257L18.9867 7.41879C19.1573 7.63821 19.25 7.90825 19.25 8.18622V18C19.25 18.6904 18.6904 19.25 18 19.25H8C7.30964 19.25 6.75 18.6904 6.75 18V16.5C6.75 16.0858 6.41421 15.75 6 15.75C5.58579 15.75 5.25 16.0858 5.25 16.5V18C5.25 19.5188 6.48122 20.75 8 20.75H18C19.5188 20.75 20.75 19.5188 20.75 18V8.18622C20.75 7.57468 20.5462 6.98059 20.1707 6.49788L17.6926 3.31166C17.1715 2.6418 16.3705 2.25 15.5218 2.25H8ZM2.76855 13.771C2.76855 14.1523 2.97534 14.3672 3.33789 14.3672C3.70044 14.3672 3.90723 14.1523 3.90723 13.771V12.8015H5.27148V13.771C5.27148 14.1523 5.47827 14.3672 5.84082 14.3672C6.20337 14.3672 6.41016 14.1523 6.41016 13.771V10.9539C6.41016 10.5725 6.20337 10.3577 5.84082 10.3577C5.47827 10.3577 5.27148 10.5725 5.27148 10.9539V11.8965H3.90723V10.9539C3.90723 10.5725 3.70044 10.3577 3.33789 10.3577C2.97534 10.3577 2.76855 10.5725 2.76855 10.9539V13.771ZM7.82007 13.771C7.82007 14.1523 8.02686 14.3672 8.3894 14.3672C8.75195 14.3672 8.95874 14.1523 8.95874 13.771V11.3325H9.53076C9.83154 11.3325 10.033 11.1687 10.033 10.8787C10.033 10.5886 9.83691 10.4248 9.53076 10.4248H7.24805C6.94189 10.4248 6.74585 10.5886 6.74585 10.8787C6.74585 11.1687 6.94727 11.3325 7.24805 11.3325H7.82007V13.771ZM10.8655 14.3672C10.5486 14.3672 10.3687 14.1765 10.3687 13.8408V11.1042C10.3687 10.6262 10.6318 10.3577 11.1072 10.3577C11.5073 10.3577 11.7195 10.5161 11.8806 10.9377L12.552 12.686H12.5735L13.2422 10.9377C13.4033 10.5161 13.6155 10.3577 14.0156 10.3577C14.491 10.3577 14.7542 10.6262 14.7542 11.1042V13.8408C14.7542 14.1765 14.5742 14.3672 14.2573 14.3672C13.9404 14.3672 13.7605 14.1765 13.7605 13.8408V12.0549H13.739L12.9683 13.9966C12.8904 14.1926 12.7668 14.2812 12.5654 14.2812C12.3613 14.2812 12.2297 14.1899 12.1545 13.9966L11.3838 12.0549H11.3623V13.8408C11.3623 14.1765 11.1824 14.3672 10.8655 14.3672ZM15.2939 13.7039C15.2939 14.0852 15.5007 14.3 15.8633 14.3H17.5042C17.8103 14.3 18.0063 14.1362 18.0063 13.8462C18.0063 13.5562 17.8049 13.3923 17.5042 13.3923H16.4326V10.9539C16.4326 10.5725 16.2258 10.3577 15.8633 10.3577C15.5007 10.3577 15.2939 10.5725 15.2939 10.9539V13.7039Z"
+    fill="currentColor"
+  />
+</svg> `;
+
+export const NotionIcon = html`
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M6.26795 6.19873C6.83575 6.65959 7.04771 6.62458 8.11333 6.55361L18.1589 5.9508C18.3728 5.9508 18.1949 5.7369 18.1239 5.70189L16.4555 4.49627C16.1356 4.24834 15.7097 3.96346 14.894 4.03444L5.16636 4.7442C4.81245 4.7792 4.74147 4.95713 4.88245 5.09908L6.26795 6.19873ZM6.87076 8.53997V19.1086C6.87076 19.6774 7.15466 19.8893 7.79442 19.8543L18.8336 19.2156C19.4724 19.1806 19.5434 18.7897 19.5434 18.3288V7.83021C19.5434 7.36935 19.3664 7.12044 18.9756 7.15642L7.43857 7.83021C7.01271 7.86521 6.87076 8.07814 6.87076 8.53997ZM17.77 9.1068C17.84 9.42571 17.77 9.74559 17.4491 9.78156L16.9173 9.88754V17.6901C16.4555 17.939 16.0296 18.0809 15.6747 18.0809C15.1069 18.0809 14.965 17.903 14.5391 17.3712L11.0593 11.9089V17.1942L12.1609 17.4421C12.1609 17.4421 12.1609 18.0809 11.2723 18.0809L8.82309 18.2229C8.75211 18.0809 8.82309 17.727 9.07199 17.6551L9.71078 17.4781V10.4904L8.82309 10.4194C8.75211 10.0995 8.93004 9.63864 9.42687 9.60267L12.054 9.42668L15.6747 14.9589V10.0655L14.7511 9.95949C14.6811 9.56864 14.965 9.2857 15.3198 9.24973L17.77 9.1068ZM4.34964 3.78651L14.4672 3.04175C15.7087 2.9348 16.0286 3.00674 16.8103 3.57358L20.0393 5.84385C20.5721 6.23373 20.75 6.33971 20.75 6.76556V19.2156C20.75 19.9963 20.4661 20.4572 19.4724 20.5281L7.72247 21.2379C6.97673 21.2729 6.62185 21.1669 6.231 20.6701L3.85281 17.5841C3.42695 17.0163 3.25 16.5914 3.25 16.0936V5.02811C3.25 4.38932 3.53293 3.85749 4.34964 3.78651Z"
+      fill="currentColor"
+    />
+  </svg>
+`;
+
+export const NewIcon = html`<svg
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M7.43531 5.11765C7.43531 3.53389 8.7192 2.25 10.303 2.25C11.1416 2.25 11.8962 2.61004 12.4206 3.18398C12.945 2.61004 13.6996 2.25 14.5382 2.25C16.122 2.25 17.4059 3.53389 17.4059 5.11765C17.4059 5.61288 17.2804 6.07879 17.0594 6.48529H19.8912C20.8577 6.48529 21.6412 7.2688 21.6412 8.23529V10.4706C21.6412 11.1916 21.2051 11.8108 20.5824 12.0788V19C20.5824 20.5188 19.3511 21.75 17.8324 21.75H7.00884C5.49006 21.75 4.25884 20.5188 4.25884 19V12.0788C3.63606 11.8108 3.20001 11.1916 3.20001 10.4706V8.2353C3.20001 7.2688 3.98351 6.48529 4.95001 6.48529H7.78183C7.56084 6.07879 7.43531 5.61288 7.43531 5.11765ZM10.303 6.48529H11.6706V5.11765C11.6706 4.36232 11.0583 3.75 10.303 3.75C9.54762 3.75 8.93531 4.36232 8.93531 5.11765C8.93531 5.87298 9.54762 6.48529 10.303 6.48529ZM13.1706 5.11765V6.48529H14.5382C15.2936 6.48529 15.9059 5.87298 15.9059 5.11765C15.9059 4.36232 15.2936 3.75 14.5382 3.75C13.7829 3.75 13.1706 4.36232 13.1706 5.11765ZM4.95001 7.98529C4.81194 7.98529 4.70001 8.09722 4.70001 8.2353V10.4706C4.70001 10.6087 4.81194 10.7206 4.95001 10.7206H19.8912C20.0293 10.7206 20.1412 10.6087 20.1412 10.4706V8.23529C20.1412 8.09722 20.0293 7.98529 19.8912 7.98529H4.95001ZM5.75884 12.2206V19C5.75884 19.6904 6.31848 20.25 7.00884 20.25H11.6706V12.2206H5.75884ZM13.1706 12.2206V20.25H17.8324C18.5227 20.25 19.0824 19.6904 19.0824 19V12.2206H13.1706Z"
+    fill="currentColor"
+  />
+</svg>`;
+
+export const HelpIcon = html`<svg
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M3.75 12C3.75 7.44365 7.44365 3.75 12 3.75C16.5563 3.75 20.25 7.44365 20.25 12C20.25 16.5563 16.5563 20.25 12 20.25C7.44365 20.25 3.75 16.5563 3.75 12ZM12 2.25C6.61522 2.25 2.25 6.61522 2.25 12C2.25 17.3848 6.61522 21.75 12 21.75C17.3848 21.75 21.75 17.3848 21.75 12C21.75 6.61522 17.3848 2.25 12 2.25ZM12.2385 10.9834C11.3157 11.708 10.9944 12.166 10.9944 12.9727C10.9944 13.4102 11.2678 13.7383 11.7668 13.7383C12.2454 13.7383 12.4231 13.4648 12.594 13.0615C12.7512 12.4873 12.9768 12.248 13.6399 11.7422C14.5149 11.0928 15.0959 10.5117 15.0959 9.45215C15.0959 7.92773 13.845 6.99121 12.0471 6.99121C11.0764 6.99121 10.3313 7.24414 9.83228 7.66797C9.42212 8.03027 9.15552 8.50879 9.15552 8.95996C9.15552 9.33594 9.39478 9.64355 9.82544 9.64355C10.1125 9.64355 10.2766 9.51367 10.4885 9.2334C10.8167 8.67285 11.2678 8.41992 11.9241 8.41992C12.676 8.41992 13.2708 8.86426 13.2708 9.53418C13.2708 10.1357 12.9016 10.4639 12.2385 10.9834ZM11.7668 14.709C11.1995 14.709 10.7346 15.1055 10.7346 15.6729C10.7346 16.2402 11.1995 16.6367 11.7668 16.6367C12.3342 16.6367 12.8059 16.2402 12.8059 15.6729C12.8059 15.1055 12.3342 14.709 11.7668 14.709Z"
+    fill="currentColor"
+  />
+</svg> `;
+
+export const ImportIcon = html`
+  <svg
+    width="20"
+    height="20"
+    viewBox="0 0 24 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M12 3.25C12.4142 3.25 12.75 3.58579 12.75 4L12.75 14.1893L15.4697 11.4697C15.7626 11.1768 16.2374 11.1768 16.5303 11.4697C16.8232 11.7626 16.8232 12.2374 16.5303 12.5303L12.5303 16.5303C12.2374 16.8232 11.7626 16.8232 11.4697 16.5303L7.46967 12.5303C7.17678 12.2374 7.17678 11.7626 7.46967 11.4697C7.76256 11.1768 8.23744 11.1768 8.53033 11.4697L11.25 14.1893L11.25 4C11.25 3.58579 11.5858 3.25 12 3.25ZM4 15.25C4.41421 15.25 4.75 15.5858 4.75 16V17C4.75 18.2426 5.75736 19.25 7 19.25H17C18.2426 19.25 19.25 18.2426 19.25 17V16C19.25 15.5858 19.5858 15.25 20 15.25C20.4142 15.25 20.75 15.5858 20.75 16V17C20.75 19.0711 19.0711 20.75 17 20.75H7C4.92893 20.75 3.25 19.0711 3.25 17V16C3.25 15.5858 3.58579 15.25 4 15.25Z"
+      fill="currentColor"
+    />
+  </svg>
+`;

package/src/_pkgs/affine-components/icons/index.ts

@@ -0,0 +1,10 @@
+export * from './ai.js';
+export * from './file-icons.js';
+export * from './file-icons-rc';
+export * from './import-export.js';
+export * from './list.js';
+export * from './loading.js';
+export * from './misc.js';
+export * from './tags.js';
+export * from './text.js';
+export * from './utils.js';

package/src/_pkgs/affine-components/icons/list.ts

@@ -0,0 +1,39 @@
+export const playCheckAnimation = async (
+  refElement: Element,
+  { left = 0, size = 20 }: { left?: number; size?: number } = {}
+) => {
+  const sparkingEl = document.createElement('div');
+  sparkingEl.classList.add('affine-check-animation');
+  if (size < 20) {
+    console.warn('If the size is less than 20, the animation may be abnormal.');
+  }
+  sparkingEl.style.cssText = `
+    position: absolute;
+    width: ${size}px;
+    height: ${size}px;
+    border-radius: 50%;
+  `;
+  sparkingEl.style.left = `${left}px`;
+  refElement.append(sparkingEl);
+
+  await sparkingEl.animate(
+    [
+      {
+        boxShadow:
+          '0 -18px 0 -8px #1e96eb, 16px -8px 0 -8px #1e96eb, 16px 8px 0 -8px #1e96eb, 0 18px 0 -8px #1e96eb, -16px 8px 0 -8px #1e96eb, -16px -8px 0 -8px #1e96eb',
+      },
+    ],
+    { duration: 240, easing: 'ease', fill: 'forwards' }
+  ).finished;
+  await sparkingEl.animate(
+    [
+      {
+        boxShadow:
+          '0 -36px 0 -10px transparent, 32px -16px 0 -10px transparent, 32px 16px 0 -10px transparent, 0 36px 0 -10px transparent, -32px 16px 0 -10px transparent, -32px -16px 0 -10px transparent',
+      },
+    ],
+    { duration: 360, easing: 'ease', fill: 'forwards' }
+  ).finished;
+
+  sparkingEl.remove();
+};

package/src/_pkgs/affine-components/icons/loading.ts

@@ -0,0 +1,47 @@
+import { cssVarV2 } from '@toeverything/theme/v2';
+import { html } from 'lit';
+
+export const LoadingIcon = ({
+  size = '1em',
+  progress = 0.2,
+  ringColor = cssVarV2('loading/background'),
+  strokeColor = cssVarV2('loading/foreground'),
+}: {
+  size?: string;
+  progress?: number;
+  ringColor?: string;
+  strokeColor?: string;
+} = {}) =>
+  html`<svg
+    width="${size}"
+    height="${size}"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+  >
+    <style>
+      .spinner {
+        transform-origin: center;
+        animation: spinner_animate 0.75s infinite linear;
+      }
+      @keyframes spinner_animate {
+        100% {
+          transform: rotate(360deg);
+        }
+      }
+    </style>
+    <circle cx="12" cy="12" r="8" stroke="${ringColor}" stroke-width="4" />
+    <circle
+      class="spinner"
+      cx="12"
+      cy="12"
+      r="8"
+      stroke="${strokeColor}"
+      stroke-width="4"
+      stroke-linecap="round"
+      stroke-dasharray="${2 * Math.PI * 8 * progress} ${2 *
+      Math.PI *
+      8 *
+      (1 - progress)}"
+    />
+  </svg>`;

package/src/_pkgs/affine-components/icons/misc.ts

@@ -0,0 +1,59 @@
+import { html } from 'lit';
+
+export const WarningIcon = html`<svg
+  width="16"
+  height="16"
+  viewBox="0 0 16 16"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M7.99935 3.16663C5.32997 3.16663 3.16602 5.33058 3.16602 7.99996C3.16602 10.6693 5.32997 12.8333 7.99935 12.8333C10.6687 12.8333 12.8327 10.6693 12.8327 7.99996C12.8327 5.33058 10.6687 3.16663 7.99935 3.16663ZM2.16602 7.99996C2.16602 4.7783 4.77769 2.16663 7.99935 2.16663C11.221 2.16663 13.8327 4.7783 13.8327 7.99996C13.8327 11.2216 11.221 13.8333 7.99935 13.8333C4.77769 13.8333 2.16602 11.2216 2.16602 7.99996ZM7.99935 5.12959C8.27549 5.12959 8.49935 5.35345 8.49935 5.62959V7.99996C8.49935 8.2761 8.27549 8.49996 7.99935 8.49996C7.72321 8.49996 7.49935 8.2761 7.49935 7.99996V5.62959C7.49935 5.35345 7.72321 5.12959 7.99935 5.12959ZM7.49935 10.3703C7.49935 10.0942 7.72321 9.87033 7.99935 9.87033H8.00528C8.28142 9.87033 8.50528 10.0942 8.50528 10.3703C8.50528 10.6465 8.28142 10.8703 8.00528 10.8703H7.99935C7.72321 10.8703 7.49935 10.6465 7.49935 10.3703Z"
+    fill="#77757D"
+    fill-opacity="0.6"
+  />
+</svg>`;
+
+export const InsertBelowIcon = html`<svg
+  width="20"
+  height="20"
+  viewBox="0 0 20 20"
+  fill="currentColor"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M3.54102 5.41675C3.54102 5.07157 3.82084 4.79175 4.16602 4.79175H15.8327C16.1779 4.79175 16.4577 5.07157 16.4577 5.41675C16.4577 5.76193 16.1779 6.04175 15.8327 6.04175H4.16602C3.82084 6.04175 3.54102 5.76193 3.54102 5.41675ZM3.54102 8.33341C3.54102 7.98824 3.82084 7.70841 4.16602 7.70841H15.8327C16.1779 7.70841 16.4577 7.98824 16.4577 8.33341C16.4577 8.67859 16.1779 8.95842 15.8327 8.95842H4.16602C3.82084 8.95842 3.54102 8.67859 3.54102 8.33341ZM10.8327 10.6251C10.4875 10.6251 10.2077 10.9049 10.2077 11.2501C10.2077 11.5953 10.4875 11.8751 10.8327 11.8751H15.8327C16.1779 11.8751 16.4577 11.5953 16.4577 11.2501C16.4577 10.9049 16.1779 10.6251 15.8327 10.6251H10.8327ZM10.2077 14.1667C10.2077 13.8216 10.4875 13.5417 10.8327 13.5417H15.8327C16.1779 13.5417 16.4577 13.8216 16.4577 14.1667C16.4577 14.5119 16.1779 14.7917 15.8327 14.7917H10.8327C10.4875 14.7917 10.2077 14.5119 10.2077 14.1667ZM5.20768 10.8334C5.20768 10.4882 4.92786 10.2084 4.58268 10.2084C4.2375 10.2084 3.95768 10.4882 3.95768 10.8334V13.3334C3.95768 13.6786 4.2375 13.9584 4.58268 13.9584H6.87435V14.5834C6.87435 14.8362 7.02663 15.0641 7.26017 15.1608C7.49372 15.2576 7.76254 15.2041 7.94129 15.0254L9.19129 13.7754C9.43537 13.5313 9.43537 13.1356 9.19129 12.8915L7.94129 11.6415C7.76254 11.4627 7.49372 11.4093 7.26017 11.506C7.02663 11.6027 6.87435 11.8306 6.87435 12.0834V12.7084H5.20768V10.8334Z"
+  />
+</svg>`;
+
+export const ResetIcon = html`<svg
+  width="20"
+  height="20"
+  viewBox="0 0 20 20"
+  fill="currentColor"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M2.70898 9.99992C2.70898 5.97284 5.97357 2.70825 10.0007 2.70825C11.8678 2.70825 13.5723 3.41084 14.8619 4.56508L14.8639 4.56687L16.0423 5.63071V3.33325C16.0423 2.98807 16.3221 2.70825 16.6673 2.70825C17.0125 2.70825 17.2923 2.98807 17.2923 3.33325V7.03696C17.2923 7.38213 17.0125 7.66196 16.6673 7.66196H12.9636C12.6184 7.66196 12.3386 7.38213 12.3386 7.03696C12.3386 6.69178 12.6184 6.41196 12.9636 6.41196H15.0423L14.0283 5.4965C14.0279 5.4962 14.0276 5.49591 14.0273 5.49561C12.9581 4.53909 11.5479 3.95825 10.0007 3.95825C6.66393 3.95825 3.95898 6.6632 3.95898 9.99992C3.95898 13.3366 6.66393 16.0416 10.0007 16.0416C12.8751 16.0416 15.2821 14.0335 15.8926 11.3431C15.969 11.0065 16.3038 10.7955 16.6404 10.8719C16.977 10.9483 17.188 11.2831 17.1116 11.6197C16.3748 14.867 13.4716 17.2916 10.0007 17.2916C5.97357 17.2916 2.70898 14.027 2.70898 9.99992Z"
+  />
+</svg>`;
+
+export const ReplaceIcon = html`<svg
+  width="20"
+  height="20"
+  viewBox="0 0 20 20"
+  fill="currentColor"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M14.8132 11.2542C14.6939 11.3852 14.5246 11.4594 14.3474 11.4583C14.1702 11.4572 14.0018 11.381 13.8841 11.2485L12.0322 9.16519C11.8029 8.9072 11.8261 8.51215 12.0841 8.28283C12.3421 8.0535 12.7372 8.07674 12.9665 8.33473L13.7262 9.18942V4.99996C13.7262 4.8849 13.6329 4.79163 13.5179 4.79163H8.33269C7.98751 4.79163 7.70769 4.5118 7.70769 4.16663C7.70769 3.82145 7.98751 3.54163 8.33269 3.54163H13.5179C14.3233 3.54163 14.9762 4.19454 14.9762 4.99996V9.21932L15.7874 8.32903C16.0198 8.07387 16.4151 8.05549 16.6703 8.28796C16.9254 8.52044 16.9438 8.91574 16.7114 9.17089L14.8132 11.2542ZM5.60217 8.7457C5.7215 8.61472 5.89082 8.54055 6.068 8.54164C6.24519 8.54273 6.41358 8.61897 6.5313 8.7514L8.38315 10.8347C8.61247 11.0927 8.58924 11.4878 8.33125 11.7171C8.07326 11.9464 7.67821 11.9232 7.44889 11.6652L6.68917 10.8105V15C6.68917 15.115 6.78244 15.2083 6.8975 15.2083H12.0827C12.4279 15.2083 12.7077 15.4881 12.7077 15.8333C12.7077 16.1785 12.4279 16.4583 12.0827 16.4583H6.8975C6.09208 16.4583 5.43917 15.8054 5.43917 15V10.7806L4.62802 11.6709C4.39554 11.926 4.00024 11.9444 3.74509 11.712C3.48993 11.4795 3.47155 11.0842 3.70402 10.829L5.60217 8.7457Z"
+  />
+</svg>`;

package/src/_pkgs/affine-components/icons/tags.ts

@@ -0,0 +1,6 @@
+import { svg } from 'lit';
+
+import { icon } from './utils.js';
+
+const TagsSVG = svg`<path fill-rule="evenodd" clip-rule="evenodd" d="M8.26257 2.48082C7.85697 2.49584 7.54034 2.83683 7.55536 3.24243C7.57038 3.64803 7.91137 3.96466 8.31697 3.94964L12.5926 3.79128C12.9329 3.77867 13.2632 3.90835 13.504 4.14919L19.8106 10.4558C20.0976 10.7428 20.5629 10.7428 20.8499 10.4558C21.1369 10.1688 21.1369 9.70348 20.8499 9.41648L14.5433 3.10987C14.0135 2.58003 13.287 2.29473 12.5382 2.32247L8.26257 2.48082ZM7.72668 6.72224C6.0604 6.78396 4.72384 8.12053 4.66212 9.7868L4.53585 13.1963C4.52324 13.5366 4.65292 13.8669 4.89376 14.1077L10.5116 19.7256C10.99 20.2039 11.7655 20.2039 12.2438 19.7256L17.6655 14.304C18.1438 13.8256 18.1438 13.0501 17.6655 12.5718L12.0476 6.95388C11.8068 6.71304 11.4765 6.58336 11.1362 6.59597L7.72668 6.72224ZM3.19331 9.7324C3.28351 7.29707 5.23695 5.34363 7.67228 5.25343L11.0818 5.12716C11.8305 5.09942 12.5571 5.38472 13.0869 5.91456L18.7048 11.5324C19.7571 12.5848 19.7571 14.2909 18.7048 15.3433L13.2832 20.7649C12.2308 21.8173 10.5246 21.8173 9.47232 20.7649L3.85444 15.147C3.3246 14.6172 3.0393 13.8907 3.06703 13.1419L3.19331 9.7324ZM7.8664 8.75593C8.18961 9.07914 8.18961 9.60317 7.8664 9.92638C7.54319 10.2496 7.01916 10.2496 6.69595 9.92638C6.37274 9.60317 6.37274 9.07914 6.69595 8.75593C7.01916 8.43272 7.54319 8.43272 7.8664 8.75593Z" fill="currentColor"/>`;
+export const TagsIcon = icon(TagsSVG, 16);