feat(LFO): dev LFO component

ROADMAP.md

@@ -18,6 +18,7 @@
 ### Visualization Components
 
 - [x] **Axis**: component is a component used to display axes in a chart.
+- [x] **LFO**: Show LFO(Low Frequency Oscillator) waveform.
 - [x] **Light**: Show the status of audio effects.
 - [x] **Oscilloscope**: Visualizes audio waveforms in real-time, showing changes in signal amplitude and frequency over time.
 - [x] **Spectrogram**: Display audio Spectrogram.

docs/.island/config.ts

@@ -141,6 +141,10 @@ function getSidebar(lang: 'zh' | 'en'): DefaultTheme.Sidebar {
       {
         text: getText('可视组件', 'Visualization'),
         items: [
+          {
+            text: getText('LFO 低频振荡器', 'LFO'),
+            link: getLink('/component/LFO'),
+          },
           {
             text: getText('Light 指示灯', 'Light'),
             link: getLink('/component/light'),

docs/.island/dist/assets/Button.6c5b2bf4.js → docs/.island/dist/assets/Button.ed4115fb.js

@@ -1,4 +1,4 @@
-import{U as n,f as s,_ as d,v as i,y as l,b as r,A as u,c as e}from"./index.e7f83a34.js";import{jsx as t,jsxs as c,Fragment as p}from"react/jsx-runtime";const b=()=>t(n,{code:"<Button> Button </Button>",scope:{Button:s}}),h=()=>t(n,{code:"<Button toggled> Toggled </Button>",scope:{Button:s}}),m=()=>t(n,{code:"<Button disabled> Disabled </Button>",scope:{Button:s}}),f=()=>t(n,{code:`<div className="flex gap-4 items-center">
+import{U as n,p as s,x as d,C as i,T as l,S as r,A as u,c as e}from"./index.83878d6a.js";import{jsx as t,jsxs as c,Fragment as p}from"react/jsx-runtime";const h=()=>t(n,{code:"<Button> Button </Button>",scope:{Button:s}}),b=()=>t(n,{code:"<Button toggled> Toggled </Button>",scope:{Button:s}}),m=()=>t(n,{code:"<Button disabled> Disabled </Button>",scope:{Button:s}}),f=()=>t(n,{code:`<div className="flex gap-4 items-center">
   <Button size="sm">
     Small
   </Button>  
@@ -37,4 +37,4 @@ import{U as n,f as s,_ as d,v as i,y as l,b as r,A as u,c as e}from"./index.e7f8
   <Button value={4}>
     Triangle
   </Button>
-</Button.Group>`,scope:{Button:s,SineIcon:d,SawtoothIcon:i,SquareIcon:l,TriangleIcon:r}}),T=()=>t(u,{data:[{attribute:"value",description:c(p,{children:["The bound value (only effective in ",t(e,{children:"`Group`"}),")."]}),type:t(e,{children:"any"}),default:"-"},{attribute:"disabled",description:"Indicates whether the button is disabled",type:t(e,{children:"boolean"}),default:t(e,{children:"false"})},{attribute:"size",description:"Button size",type:t(e,{children:"'sm' | 'md' | 'lg'"}),default:t(e,{children:"'md'"})},{attribute:"radius",description:"Button border radius",type:t(e,{children:"'none' | 'sm' | 'md' | 'lg' | 'full'"}),default:t(e,{children:"'md'"})},{attribute:"toggled",description:"Indicates whether the button is toggled",type:t(e,{children:"boolean"}),default:t(e,{children:"false"})},{attribute:"onToggleChange",description:"Callback function when the toggle state changes",type:t(e,{children:"(toggled: boolean) => void"}),default:"-"}]}),w=()=>t(u,{data:[{attribute:"value",description:"The value associated with the button group. If the value is an array, the button group will be treated as a multi-select group. Otherwise, it will be treated as a single-select group.",type:t(e,{children:"any"}),default:"-"},{attribute:"disabled",description:"Indicates whether buttons in the button group are disabled",type:t(e,{children:"boolean"}),default:t(e,{children:"false"})},{attribute:"size",description:"Button size",type:t(e,{children:"'sm' | 'md' | 'lg'"}),default:t(e,{children:"'md'"})},{attribute:"radius",description:"Button border radius",type:t(e,{children:"'none' | 'sm' | 'md' | 'lg' | 'full'"}),default:t(e,{children:"'md'"})},{attribute:"classNames",description:"Allows setting custom class names for buttons and toggle states",type:t(e,{children:"{ button?: string }"}),default:"-"},{attribute:"styles",description:"Allows setting custom styles for buttons and toggle states",type:t(e,{children:"{ button?: React.CSSProperties }"}),default:"-"},{attribute:"onChange",description:"Callback function when options change",type:t(e,{children:"(values: any) => void"}),default:"-"}]});export{T as B,b as D,v as G,y as R,f as S,h as T,m as a,w as b};
+</Button.Group>`,scope:{Button:s,SineIcon:d,SawtoothIcon:i,SquareIcon:l,TriangleIcon:r}}),T=()=>t(u,{data:[{attribute:"value",description:c(p,{children:["The bound value (only effective in ",t(e,{children:"`Group`"}),")."]}),type:t(e,{children:"any"}),default:"-"},{attribute:"disabled",description:"Indicates whether the button is disabled",type:t(e,{children:"boolean"}),default:t(e,{children:"false"})},{attribute:"size",description:"Button size",type:t(e,{children:"'sm' | 'md' | 'lg'"}),default:t(e,{children:"'md'"})},{attribute:"radius",description:"Button border radius",type:t(e,{children:"'none' | 'sm' | 'md' | 'lg' | 'full'"}),default:t(e,{children:"'md'"})},{attribute:"toggled",description:"Indicates whether the button is toggled",type:t(e,{children:"boolean"}),default:t(e,{children:"false"})},{attribute:"onToggleChange",description:"Callback function when the toggle state changes",type:t(e,{children:"(toggled: boolean) => void"}),default:"-"}]}),S=()=>t(u,{data:[{attribute:"value",description:"The value associated with the button group. If the value is an array, the button group will be treated as a multi-select group. Otherwise, it will be treated as a single-select group.",type:t(e,{children:"any"}),default:"-"},{attribute:"disabled",description:"Indicates whether buttons in the button group are disabled",type:t(e,{children:"boolean"}),default:t(e,{children:"false"})},{attribute:"size",description:"Button size",type:t(e,{children:"'sm' | 'md' | 'lg'"}),default:t(e,{children:"'md'"})},{attribute:"radius",description:"Button border radius",type:t(e,{children:"'none' | 'sm' | 'md' | 'lg' | 'full'"}),default:t(e,{children:"'md'"})},{attribute:"classNames",description:"Allows setting custom class names for buttons and toggle states",type:t(e,{children:"{ button?: string }"}),default:"-"},{attribute:"styles",description:"Allows setting custom styles for buttons and toggle states",type:t(e,{children:"{ button?: React.CSSProperties }"}),default:"-"},{attribute:"onChange",description:"Callback function when options change",type:t(e,{children:"(values: any) => void"}),default:"-"}]});export{T as B,h as D,v as G,y as R,f as S,b as T,m as a,S as b};