Skip to content

Instantly share code, notes, and snippets.

View awinogradov's full-sized avatar
🤖

Anton Vinogradov awinogradov

🤖
View GitHub Profile
@awinogradov
awinogradov / slate.tsx
Last active November 28, 2024 17:15
Slate custom
import cn from 'classnames';
import React, { CSSProperties, useCallback, useState } from 'react';
import { createEditor, BaseEditor, Descendant, Editor, Element, CustomTypes } from 'slate';
import { Slate, Editable, withReact, ReactEditor, RenderElementProps, RenderLeafProps } from 'slate-react';
import s from './slate.module.scss';
type CustomElement = { type: 'paragraph'; children: CustomText[] };
type CodeElement = { type: 'code'; children?: CustomText[] };
type Marks = { bold?: boolean; code?: boolean; italic?: boolean };
@awinogradov
awinogradov / useOfflineDetector.ts
Last active December 22, 2023 19:04
Offline detector
import { useCallback, useEffect, useState } from 'react';
interface UseOfflineDetectorProps {
setStatus?: ([global, remote]: [boolean, boolean]) => void;
pollingDelay?: number;
remoteServerUrl?: string;
};
export const useOfflineDetector = ({
setStatus,
@awinogradov
awinogradov / variants.tsx
Last active August 24, 2023 16:35
Autocomplete
<AutoCompleteSingle items={[{ value: 'one' }]} onChange={(value: string) => {}} />
<AutoCompleteMulti items={[]} onChange={(value: string[]) => {}} />
<AutoCompleteMulti items={[]} onChange={(value: string[]) => {}}>
<AutoCompleteInput onChange={(e) => {}} />
<AutoCompleteTitle>Suggestions:</AutoCompleteTitle>
</AutoCompleteMulti>
import React, { useState } from 'react';
import styled, { css } from 'styled-components';
import CodeMirror, { ReactCodeMirrorProps } from '@uiw/react-codemirror';
import { markdown, markdownLanguage } from '@codemirror/lang-markdown';
import { languages } from '@codemirror/language-data';
import { oneDark } from '@codemirror/theme-one-dark';
import { inputBorderColor } from '../../@generated/themes';
interface CodeEditorProps {
@awinogradov
awinogradov / index.js
Last active September 30, 2023 03:14
localStorage via IndexDB polyfill
(() => {
const id = window.location;
const connection = indexedDB.open("canvas"); // one version all the time
connection.onupgradeneeded = () => {
console.log("Creating storage in the IndexDB instance");
const db = connection.result;
@awinogradov
awinogradov / cloudSettings
Last active December 20, 2021 11:54
vscode
{"lastUpload":"2021-12-20T11:54:45.398Z","extensionVersion":"v3.4.3"}
@awinogradov
awinogradov / App-Header.js
Created December 26, 2018 13:17
React & BEM: one more collaboration. [email protected]
import { Elem } from 'bem-react-core';
import { Button } from '../Button';
export class AppHeader extends Elem {
block = 'App';
elem = 'Header';
tag() {
return 'h2';
}
@awinogradov
awinogradov / App-Header.js
Last active December 27, 2018 07:49
React & BEM: one more collaboration. [email protected]
import { decl } from 'bem-react-core';
export default decl({
block: 'App',
elem: 'Header',
attrs: {
role: 'heading'
},
content() {
return 'я заголовок';
src/components
├── ComponentName
│   ├── _modName
│   │   ├── ComponentName_modName.tsx
│   │   ├── ComponentName_modName_modVal.tsx
│   │   └── ComponentName_modName_modVal.css
│   ├── ElementName
│ │ ├── ComponentName-ElementName.tsx
@awinogradov
awinogradov / Ticket-Point.tsx
Created October 11, 2018 11:45
conditional-component
import * as React from 'react';
import { cn } from '@bem-react/classname';
import './Ticket-Point.css';
const cnTicket = cn('Ticket');
export interface ITicketPointProps {
className?: string;
mode: 'origin' | 'destination';