simian 0.1.2

A command-line tool for exploring and implementing Machine Learning algorithms in Rust.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135

import { FC, useCallback } from 'react'
import clsx from 'clsx'
import { CornerDownRight } from 'lucide-react'
import { nanoid } from 'nanoid'
import { Text } from 'slate'
import { ReactEditor } from 'slate-react'

const useIsMobile = () => false
import { useEditor } from '@/ui/editor/context'
import { ElementProps } from '@/ui/editor/types'

import { Block } from '../../block'
import { blockApply } from '../../utils'
import { useSubTitle } from '../subtitle/context'

import { useTitle } from './context'
import { useTranslations } from '@/i18n/context'

export const Title: FC<ElementProps<'title'>> = ({
  attributes,
  children,
  element,
}) => {
  const { editor, mode } = useEditor()
  const isMobile = useIsMobile()
  const t = useTranslations()
  const { emptyPlaceholder } = useTitle()
  const { isMounted: isSubTitleMounted } = useSubTitle()

  // Check if the title node is empty
  const isEmpty =
    element.children.length === 1 && (element.children[0] as Text).text === ''
  const shouldShowSubtitleButton =
    mode !== 'read' && !isMobile && editor.hasAddon('subtitle')
  const placeholder =
    typeof emptyPlaceholder === 'function'
      ? emptyPlaceholder(t)
      : emptyPlaceholder

  const actionItems = useCallback(
    () =>
      shouldShowSubtitleButton && !isSubTitleMounted
        ? [
            {
              id: 'add-subtitle',
              icon: <CornerDownRight size={18} />,
              tooltip: {
                content: 'Add Subtitle',
              },
              onClick: () => {
                const currentPath = ReactEditor.findPath(editor, element)

                blockApply({
                  at: currentPath, // After the title.
                  editor,
                  block: {
                    id: nanoid(),
                    type: 'subtitle',
                    children: [{ text: '' }],
                  },
                })
              },
            },
          ]
        : [],
    [editor, element, shouldShowSubtitleButton, isSubTitleMounted],
  )

  // const actions = shouldShowSubtitleButton ? [(
  //   <button className="">
  //     <Plus size={18} />
  //   </button>
  //   <ButtonRaw
  //     contentEditable={false}
  //     tooltip={{
  //       content: "Add Subtitle",
  //       side: "bottom",
  //     }}
  //     className={clsx([
  //       "absolute left-2 top-1.5",
  //       "opacity-0 pointer-events-none",
  //       "rounded-full border",
  //       "flex items-center justify-center size-6 [&_svg]:size-3",
  //       "hover:bg-accent dark:hover:bg-accent/50",
  //       editor.mode === "view" || isSubTitleMounted
  //         ? ""
  //         : "group-hover:opacity-100 group-hover:pointer-events-auto",
  //     ])}
  //     onClick={() => {
  //       const currentPath = ReactEditor.findPath(editor, element);

  //       blockApply({
  //         at: currentPath, // After the title.
  //         editor,
  //         block: { id: nanoid(), type: 'subtitle', children: [{ text: '' }] },
  //       });
  //     }}
  //   >
  //     <CornerDownRight />
  //   </ButtonRaw>
  // )] : [];

  return (
    <Block
      element={element}
      {...attributes}
      className={clsx([
        'relative group gap-2 mb-6',
        //"pl-10 -ml-10",
      ])}
      actionClassName="md:-translate-x-full pr-2 top-1.5"
      actionItems={actionItems}
    >
      <h1
        className={clsx([
          'leading-[1.2] min-w-px',
          'outline-none text-4xl font-extrabold tracking-tight',
          // "mb-15 text-5xl font-extrabold tracking-tight",
          isEmpty ? 'relative' : '',
        ])}
      >
        {placeholder && isEmpty && (
          <span
            contentEditable={false}
            className="absolute pointer-events-none opacity-30 select-none"
          >
            {placeholder}
          </span>
        )}

        {children}
      </h1>
    </Block>
  )
}