youngkingdom/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-05-06 02:18:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(web): new lint setup (#30020)

Browse Source 
Co-authored-by: yyh <yuanyouhuilyz@gmail.com>
This commit is contained in:
Stephen Zhou
2025-12-23 16:58:55 +08:00
committed by GitHub
parent 9701a2994b
commit f2842da397
3356 changed files with 85046 additions and 81278 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
web/app/components/base/chip/index.stories.tsx
View File

@ -1,6 +1,7 @@
import type { Meta, StoryObj } from '@storybook/nextjs'
import type { Item } from '.'
import { useState } from 'react'
import Chip, { type Item } from '.'
import Chip from '.'
const ITEMS: Item[] = [
{ value: 'all', name: 'All items' },
@ -23,9 +24,9 @@ const meta = {
args: {
items: ITEMS,
value: 'all',
// eslint-disable-next-line no-empty-function
onSelect: () => {},
// eslint-disable-next-line no-empty-function
onClear: () => {},
},
} satisfies Meta<typeof Chip>
@ -45,7 +46,9 @@ const ChipDemo = (props: React.ComponentProps<typeof Chip>) => {
onClear={() => setSelection('all')}
/>
<div className="rounded-lg border border-divider-subtle bg-components-panel-bg p-3 text-xs text-text-secondary">
Current value: <span className="font-mono text-text-primary">{selection}</span>
Current value:
{' '}
<span className="font-mono text-text-primary">{selection}</span>
</div>
</div>
)
@ -75,9 +78,9 @@ const [selection, setSelection] = useState('all')
export const WithoutLeftIcon: Story = {
args: {
showLeftIcon: false,
// eslint-disable-next-line no-empty-function
onSelect: () => {},
// eslint-disable-next-line no-empty-function
onClear: () => {},
},
render: args => (

42
web/app/components/base/chip/index.tsx
View File

@ -1,12 +1,12 @@
import type { FC } from 'react'
import { useMemo, useState } from 'react'
import { RiArrowDownSLine, RiCheckLine, RiCloseCircleFill, RiFilter3Line } from '@remixicon/react'
import { cn } from '@/utils/classnames'
import { useMemo, useState } from 'react'
import {
PortalToFollowElem,
PortalToFollowElemContent,
PortalToFollowElemTrigger,
} from '@/app/components/base/portal-to-follow-elem'
import { cn } from '@/utils/classnames'
export type Item = {
value: number | string
@ -43,13 +43,13 @@ const Chip: FC<Props> = ({
<PortalToFollowElem
open={open}
onOpenChange={setOpen}
placement='bottom-start'
placement="bottom-start"
offset={4}
>
<div className='relative'>
<div className="relative">
<PortalToFollowElemTrigger
onClick={() => setOpen(v => !v)}
className='block'
className="block"
>
<div className={cn(
'flex min-h-8 cursor-pointer items-center rounded-lg border-[0.5px] border-transparent bg-components-input-bg-normal px-2 py-1 hover:bg-state-base-hover-alt',
@ -57,44 +57,48 @@ const Chip: FC<Props> = ({
!open && !!value && '!border-components-button-secondary-border !bg-components-button-secondary-bg shadow-xs hover:border-components-button-secondary-border-hover hover:!bg-components-button-secondary-bg-hover',
open && !!value && '!border-components-button-secondary-border-hover !bg-components-button-secondary-bg-hover shadow-xs hover:border-components-button-secondary-border-hover hover:!bg-components-button-secondary-bg-hover',
className,
)}>
)}
>
{showLeftIcon && (
<div className='p-0.5'>
<div className="p-0.5">
{leftIcon || (
<RiFilter3Line className={cn('h-4 w-4 text-text-tertiary', !!value && 'text-text-secondary')} />
)}
</div>
)}
<div className='flex grow items-center gap-0.5 first-line:p-1'>
<div className="flex grow items-center gap-0.5 first-line:p-1">
<div className={cn('system-sm-regular text-text-tertiary', !!value && 'text-text-secondary')}>
{triggerContent}
</div>
</div>
{!value && <RiArrowDownSLine className='h-4 w-4 text-text-tertiary' />}
{!value && <RiArrowDownSLine className="h-4 w-4 text-text-tertiary" />}
{!!value && (
<div className='group/clear cursor-pointer p-[1px]' onClick={(e) => {
e.stopPropagation()
onClear()
}}>
<RiCloseCircleFill className='h-3.5 w-3.5 text-text-quaternary group-hover/clear:text-text-tertiary' />
<div
className="group/clear cursor-pointer p-[1px]"
onClick={(e) => {
e.stopPropagation()
onClear()
}}
>
<RiCloseCircleFill className="h-3.5 w-3.5 text-text-quaternary group-hover/clear:text-text-tertiary" />
</div>
)}
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent className='z-[1002]'>
<PortalToFollowElemContent className="z-[1002]">
<div className={cn('relative w-[240px] rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-bg-blur shadow-lg', panelClassName)}>
<div className='max-h-72 overflow-auto p-1'>
<div className="max-h-72 overflow-auto p-1">
{items.map(item => (
<div
key={item.value}
className='flex cursor-pointer items-center gap-2 rounded-lg px-2 py-[6px] pl-3 hover:bg-state-base-hover'
className="flex cursor-pointer items-center gap-2 rounded-lg px-2 py-[6px] pl-3 hover:bg-state-base-hover"
onClick={() => {
onSelect(item)
setOpen(false)
}}
>
<div title={item.name} className='system-sm-medium grow truncate text-text-secondary'>{item.name}</div>
{value === item.value && <RiCheckLine className='h-4 w-4 shrink-0 text-util-colors-blue-light-blue-light-600' />}
<div title={item.name} className="system-sm-medium grow truncate text-text-secondary">{item.name}</div>
{value === item.value && <RiCheckLine className="h-4 w-4 shrink-0 text-util-colors-blue-light-blue-light-600" />}
</div>
))}
</div>