Skip to content

Commit

Permalink
refactor: types & styles
Browse files Browse the repository at this point in the history
  • Loading branch information
lovrozagar committed Mar 10, 2024
1 parent 29d62fe commit 27eeaa0
Show file tree
Hide file tree
Showing 80 changed files with 7,772 additions and 315 deletions.
13 changes: 13 additions & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
node_modules/
coverage/
scripts/
public/
build/
dist/
temp/
tmp/
*.min.js
*.d.ts
postcss.config.js
tailwind.config.ts
tsconfig.json
125 changes: 125 additions & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,125 @@
{
"env": {
"browser": true,
"node": true
},
"extends": [
"hardcore",
"hardcore/react",
"hardcore/react-performance",
"hardcore/react-testing-library",
"hardcore/jest",
"hardcore/fp"
],
// "overrides": [
// {
// "files": ["*.tsx"],
// "rules": {
// "max-lines": ["error", { "max": 300, "skipBlankLines": false, "skipComments": false }]
// }
// }
// ],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"project": ["tsconfig.json"]
},
"plugins": ["no-relative-import-paths", "@typescript-eslint"],
"rules": {
// "@arthurgeron/react-usememo/require-usememo": "off",
// "@typescript-eslint/consistent-type-definitions": ["error", "type"],
// "complexity": ["error", 15],
// "curly": "off",
// "ext/lines-between-object-properties": "off",
// "func-style": ["error", "declaration", { "allowArrowFunctions": true }],
// "functional/functional-parameters": "off",
// "functional/immutable-data": "off",
// "functional/no-let": "off",
// "functional/no-loop-statements": "off",
// "id-length": ["error", { "exceptions": ["a", "b", "x", "y", "z", "p", "m", "_"] }],
// "import/extensions": "off",
// "import/max-dependencies": "off",
// "import/named": "off",
// "import/no-extraneous-dependencies": "off",
// "import/no-unresolved": "off",
// "import/unambiguous": "off",
// "jsx-a11y/prefer-tag-over-role": "off",
// "jsx-quotes": ["error", "prefer-single"],
// "lines-around-comment": "off",
// "logical-assignment-operators": "off",
// "max-len": "off",
// "max-lines": "off",
// "max-statements": ["error", 20],
// "multiline-comment-style": "off",
// "no-console": ["warn"],
// "no-magic-numbers": ["error"],
// "no-relative-import-paths/no-relative-import-paths": [
// "warn",
// { "allowSameFolder": false, "prefix": "@", "rootDir": "src" }
// ],
// "no-restricted-syntax": [
// "error",
// {
// "message": "Do not use inline exports. Declare before exporting.",
// "selector": "ExportNamedDeclaration[declaration]"
// }
// ],
// "no-shadow": "off",
// "no-undef": "off",
// "no-undef-init": "off",
// "perfectionist/sort-interfaces": "off",
// "perfectionist/sort-jsx-props": "off",
// "perfectionist/sort-object-types": "off",
// "perfectionist/sort-objects": "off",
// "prefer-destructuring": ["error", { "array": false, "object": true }],
// "prefer-named-capture-group": "off",
// "putout/putout": "off",
// "quotes": ["error", "single", { "avoidEscape": true }],
// "react-perf/jsx-no-new-array-as-prop": "off",
// "react-perf/jsx-no-new-function-as-prop": "off",
// "react-perf/jsx-no-new-object-as-prop": "off",
// "react/destructuring-assignment": "off",
// "react/forbid-component-props": "off",
// "react/function-component-definition": "off",
// "react/jsx-no-bind": "off",
// "react/jsx-no-leaked-render": ["error", { "validStrategies": ["ternary", "coerce"] }],
// "react/jsx-props-no-spreading": "off",
// "react/no-array-index-key": "off",
// "react/no-unstable-nested-components": [
// "error",
// {
// "allowAsProps": false,
// "customValidators": []
// }
// ],
// "react/prop-types": "off",
// "regexp/no-unused-capturing-group": "off",
// "regexp/prefer-named-capture-group": "off",
// "regexp/require-unicode-regexp": "off",
// "regexp/require-unicode-sets-regexp": "off",
// "sonar/new-cap": "off",
// "sonar/no-wildcard-import": "off",
// "sonarjs/cognitive-complexity": ["error", 20],
// "sonarjs/elseif-without-else": "off",
// "tailwindcss/no-custom-classname": "off",
// "unicorn/no-null": "off",
// "unicorn/no-unnecessary-polyfills": "off",
// "unicorn/prevent-abbreviations": [
// "error",
// {
// "allowList": {
// "Args": true,
// "Prop": true,
// "Props": true,
// "Ref": true,
// "Refs": true,
// "args": true,
// "prop": true,
// "props": true,
// "ref": true,
// "refs": true
// }
// }
// ],
// "unicorn/switch-case-braces": "off"
}
}
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
node_modules
dist
dist
carousel
6 changes: 6 additions & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
/node_modules/
/dist/
/build/
/artifacts/
/coverage/
.git/
29 changes: 29 additions & 0 deletions .prettierrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
{
"arrowParens": "always",
"bracketSameLine": false,
"bracketSpacing": true,
"embeddedLanguageFormatting": "auto",
"htmlWhitespaceSensitivity": "strict",
"importOrder": ["^@.*\\.css$", "<THIRD_PARTY_MODULES>", "^@"],
"importOrderSeparation": true,
"importOrderSortSpecifiers": true,
"jsonRecursiveSort": true,
"jsxSingleQuote": true,
"overrides": [
{
"files": "*.json",
"options": {
"trailingComma": "none"
}
}
],
"printWidth": 100,
"proseWrap": "always",
"quoteProps": "consistent",
"semi": false,
"singleAttributePerLine": false,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "all",
"useTabs": false
}
53 changes: 53 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
{
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"editor.codeActionsOnSave": {
"source.fixAll": "explicit",
"source.fixAll.eslint": "explicit"
},
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnPaste": false,
"editor.formatOnSave": true,
"eslint.format.enable": true,
"eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact"],
"files.encoding": "utf8",
"files.insertFinalNewline": true,
"files.trimTrailingWhitespace": true,
"javascript.preferences.importModuleSpecifier": "non-relative",
"javascript.updateImportsOnFileMove.enabled": "always",
"prettier.useEditorConfig": true,
"search.exclude": {
"**/package-lock.json": true,
"**/pnpm-lock.yaml": true,
".cache/**": true,
".git/**": true,
"coverage/**": true,
"dist/**": true,
"generated/**": true,
"node_modules/**": true,
"public/**": true
},
"tailwindCSS.experimental.classRegex": [
["cn"],
["className\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
["classNams\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
],
"typescript.preferences.importModuleSpecifier": "non-relative",
"typescript.suggest.autoImports": true,
"typescript.updateImportsOnFileMove.enabled": "always"
}
30 changes: 19 additions & 11 deletions app.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,4 @@
/* eslint-disable max-lines */
'use client'

import React, { useState } from 'react'
import { toast } from 'sonner'

Expand All @@ -25,7 +23,6 @@ import {
DialogHeader,
DialogTitle,
DialogTrigger,
Kbd,
NavigationMenu,
NavigationMenuContent,
NavigationMenuItem,
Expand Down Expand Up @@ -53,7 +50,6 @@ import {
} from '@/components'
import { Field } from '@/components/_shared/components/field/field/field'
import { FieldLabel } from '@/components/_shared/components/field/field-label/field-label'
import { FieldMessage } from '@/components/_shared/components/field/field-message/field-message'
import {
Accordion,
AccordionContent,
Expand Down Expand Up @@ -399,7 +395,7 @@ const App = () => {
<Box className='max-w-[300px]'>
<Command>
<CommandInput />
<CommandEmpty>No results.</CommandEmpty>
{/* <CommandEmpty>No results.</CommandEmpty> */}
<CommandList>
<CommandGroup>
<CommandItem value='command1' className='p-0'>
Expand Down Expand Up @@ -442,7 +438,7 @@ const App = () => {
<Box>
<Combobox>
<ComboboxTrigger placeholder='Select an option' className='w-[200px]' />
<ComboboxContent emptyContent='No results.'>
<ComboboxContent emptyContent=''>
<ComboboxItem value='value 1'>Item 1</ComboboxItem>
<ComboboxItem value='value 2'>Item 2</ComboboxItem>
<ComboboxItem value='value 3'>Item 3</ComboboxItem>
Expand All @@ -452,11 +448,16 @@ const App = () => {
<Box>
<Label htmlFor='select'>Select</Label>
<Select>
<SelectTrigger id='select' placeholder='Select an option' className='w-[200px]' />
<SelectTrigger
variant='outline'
id='select'
placeholder='Select an option'
className='w-[200px] text-mode-accent-foreground'
/>
<SelectContent hasScroll>
<SelectItem value='item 1'>Item 1</SelectItem>
<SelectItem value='item 2'>item 2</SelectItem>
<SelectItem value='item 3'>Item 3</SelectItem>
<SelectItem value='item 13'>Item 3</SelectItem>
<SelectItem value='item 4'>Item 4</SelectItem>
<SelectItem value='item 5'>Item 5</SelectItem>
<SelectItem value='item 6'>item 6</SelectItem>
Expand All @@ -470,20 +471,19 @@ const App = () => {
<SelectItem value='item 14'>Item 15</SelectItem>
<SelectItem value='item 15'>item 16</SelectItem>
<SelectItem value='item 16'>Item 17</SelectItem>
<SelectItem value='item 17'>Item 18</SelectItem>
</SelectContent>
</Select>
</Box>
<Box className='w-fit'>
<Kbd
{/* <Kbd
onKeyCombinationMatch={() => console.log('afe')}
keyCombination={['Control', 'k']}
keyCombinationOptions={{
preventDefault: true,
}}
>
Shift + 3
</Kbd>
</Kbd> */}
</Box>
<Box>
<Label htmlFor='text'>Text input</Label>
Expand All @@ -496,6 +496,7 @@ const App = () => {
<Box>
<Label htmlFor='number'>Number input</Label>
<NumberInput
variant='outline'
id='number'
placeholder='Input number here...'
inputContainerProps={{ className: 'max-w-[200px]' }}
Expand All @@ -504,6 +505,7 @@ const App = () => {
<Box>
<Label htmlFor='number'>Number input</Label>
<TextArea
variant='outline'
id='number'
placeholder='Input number here...'
inputContainerProps={{ className: 'max-w-[200px]' }}
Expand Down Expand Up @@ -634,6 +636,12 @@ const App = () => {
</Field>
</Grid>
<Box>Content shift</Box>
<Collapsible>
<CollapsibleTrigger>Collapse</CollapsibleTrigger>
<CollapsibleContent>
<Box className='pt-1'>Some text about something</Box>
</CollapsibleContent>
</Collapsible>
</div>
)
}
Expand Down
Loading

0 comments on commit 27eeaa0

Please sign in to comment.