Skip to content

Commit 6fe5aa2

Browse files
danharrindanharrin
authored
Merge pull request #15507 from thethunderturner/feature/nouislider
Feature: Slider
2 parents 8d383e7 + c3180dc commit 6fe5aa2

File tree

86 files changed

+2515
-608
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

86 files changed

+2515
-608
lines changed

‎bin/build.js

+1
Original file line numberDiff line numberDiff line change
@@ -115,6 +115,7 @@ const formComponents = [
115115
'markdown-editor',
116116
'rich-editor',
117117
'select',
118+
'slider',
118119
'tags-input',
119120
'textarea',
120121
]

‎docs-assets/app/app/Livewire/Forms/FieldsDemo.php

+285
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@
1818
use Filament\Forms\Components\Repeater;
1919
use Filament\Forms\Components\RichEditor;
2020
use Filament\Forms\Components\Select;
21+
use Filament\Forms\Components\Slider;
22+
use Filament\Forms\Components\Slider\Enums\PipsMode;
2123
use Filament\Forms\Components\TagsInput;
2224
use Filament\Forms\Components\Textarea;
2325
use Filament\Forms\Components\TextInput;
@@ -34,6 +36,7 @@
3436
use Filament\Schemas\Schema;
3537
use Filament\Support\Enums\FontWeight;
3638
use Filament\Support\Icons\Heroicon;
39+
use Filament\Support\RawJs;
3740
use Illuminate\Support\HtmlString;
3841
use Livewire\Component;
3942

@@ -1568,6 +1571,288 @@ public function form(Schema $form): Schema
15681571
->icon(Heroicon::Clipboard),
15691572
),
15701573
]),
1574+
Group::make()
1575+
->id('slider')
1576+
->extraAttributes([
1577+
'class' => 'p-16 max-w-xl',
1578+
])
1579+
->schema([
1580+
Slider::make('slider')
1581+
->label('Slider')
1582+
->default(50),
1583+
]),
1584+
Group::make()
1585+
->id('sliderRange')
1586+
->extraAttributes([
1587+
'class' => 'p-16 max-w-xl',
1588+
])
1589+
->schema([
1590+
Slider::make('sliderRange')
1591+
->label('Slider')
1592+
->range(minValue: 40, maxValue: 80)
1593+
->default(50),
1594+
]),
1595+
Group::make()
1596+
->id('sliderMultiple')
1597+
->extraAttributes([
1598+
'class' => 'p-16 max-w-xl',
1599+
])
1600+
->schema([
1601+
Slider::make('sliderMultiple')
1602+
->label('Slider')
1603+
->default([20, 70]),
1604+
]),
1605+
Group::make()
1606+
->id('sliderVertical')
1607+
->extraAttributes([
1608+
'class' => 'p-16 max-w-xl',
1609+
])
1610+
->schema([
1611+
Slider::make('sliderVertical')
1612+
->label('Slider')
1613+
->vertical()
1614+
->default(50),
1615+
]),
1616+
Group::make()
1617+
->id('sliderTooltips')
1618+
->extraAttributes([
1619+
'class' => 'p-16 max-w-xl',
1620+
])
1621+
->schema([
1622+
Slider::make('sliderTooltips')
1623+
->label('Slider')
1624+
->tooltips()
1625+
->default(50),
1626+
]),
1627+
Group::make()
1628+
->id('sliderTooltipsMultiple')
1629+
->extraAttributes([
1630+
'class' => 'p-16 max-w-xl',
1631+
])
1632+
->schema([
1633+
Slider::make('sliderTooltipsMultiple')
1634+
->label('Slider')
1635+
->tooltips([true, false])
1636+
->default([20, 70]),
1637+
]),
1638+
Group::make()
1639+
->id('sliderTooltipsVertical')
1640+
->extraAttributes([
1641+
'class' => 'p-16 max-w-xl',
1642+
])
1643+
->schema([
1644+
Slider::make('sliderTooltipsVertical')
1645+
->label('Slider')
1646+
->tooltips()
1647+
->vertical()
1648+
->default(50),
1649+
]),
1650+
Group::make()
1651+
->id('sliderTooltipsFormatting')
1652+
->extraAttributes([
1653+
'class' => 'p-16 max-w-xl',
1654+
])
1655+
->schema([
1656+
Slider::make('sliderTooltipsFormatting')
1657+
->label('Slider')
1658+
->tooltips(RawJs::make('`$${$value.toFixed(2)}`'))
1659+
->default(64.99),
1660+
]),
1661+
Group::make()
1662+
->id('sliderFill')
1663+
->extraAttributes([
1664+
'class' => 'p-16 max-w-xl',
1665+
])
1666+
->schema([
1667+
Slider::make('sliderFill')
1668+
->label('Slider')
1669+
->fillTrack()
1670+
->default(50),
1671+
]),
1672+
Group::make()
1673+
->id('sliderFillMultiple')
1674+
->extraAttributes([
1675+
'class' => 'p-16 max-w-xl',
1676+
])
1677+
->schema([
1678+
Slider::make('sliderFillMultiple')
1679+
->label('Slider')
1680+
->fillTrack([false, true, false])
1681+
->default([20, 70]),
1682+
]),
1683+
Group::make()
1684+
->id('sliderFillVertical')
1685+
->extraAttributes([
1686+
'class' => 'p-16 max-w-xl',
1687+
])
1688+
->schema([
1689+
Slider::make('sliderFillVertical')
1690+
->label('Slider')
1691+
->fillTrack()
1692+
->vertical()
1693+
->default(50),
1694+
]),
1695+
Group::make()
1696+
->id('sliderPips')
1697+
->extraAttributes([
1698+
'class' => 'p-16 max-w-xl',
1699+
])
1700+
->schema([
1701+
Slider::make('sliderPips')
1702+
->label('Slider')
1703+
->pips()
1704+
->default(50),
1705+
]),
1706+
Group::make()
1707+
->id('sliderPipsMultiple')
1708+
->extraAttributes([
1709+
'class' => 'p-16 max-w-xl',
1710+
])
1711+
->schema([
1712+
Slider::make('sliderPipsMultiple')
1713+
->label('Slider')
1714+
->pips()
1715+
->default([20, 70]),
1716+
]),
1717+
Group::make()
1718+
->id('sliderPipsVertical')
1719+
->extraAttributes([
1720+
'class' => 'p-16 max-w-xl',
1721+
])
1722+
->schema([
1723+
Slider::make('sliderPipsVertical')
1724+
->label('Slider')
1725+
->pips()
1726+
->vertical()
1727+
->default(50),
1728+
]),
1729+
Group::make()
1730+
->id('sliderPipsDensity')
1731+
->extraAttributes([
1732+
'class' => 'p-16 max-w-xl',
1733+
])
1734+
->schema([
1735+
Slider::make('sliderPipsDensity')
1736+
->label('Slider')
1737+
->pips(density: 5)
1738+
->default(50),
1739+
]),
1740+
Group::make()
1741+
->id('sliderPipsFormatting')
1742+
->extraAttributes([
1743+
'class' => 'p-16 max-w-xl',
1744+
])
1745+
->schema([
1746+
Slider::make('sliderPipsFormatting')
1747+
->label('Slider')
1748+
->pips()
1749+
->pipsFormatter(RawJs::make('`$${$value.toFixed(2)}`'))
1750+
->default(50),
1751+
]),
1752+
Group::make()
1753+
->id('sliderPipsSteps')
1754+
->extraAttributes([
1755+
'class' => 'p-16 max-w-xl',
1756+
])
1757+
->schema([
1758+
Slider::make('sliderPipsSteps')
1759+
->label('Slider')
1760+
->step(10)
1761+
->pips(PipsMode::Steps)
1762+
->default(50),
1763+
]),
1764+
Group::make()
1765+
->id('sliderPipsStepsDensity')
1766+
->extraAttributes([
1767+
'class' => 'p-16 max-w-xl',
1768+
])
1769+
->schema([
1770+
Slider::make('sliderPipsStepsDensity')
1771+
->label('Slider')
1772+
->step(10)
1773+
->pips(PipsMode::Steps, density: 5)
1774+
->default(50),
1775+
]),
1776+
Group::make()
1777+
->id('sliderPipsPositions')
1778+
->extraAttributes([
1779+
'class' => 'p-16 max-w-xl',
1780+
])
1781+
->schema([
1782+
Slider::make('sliderPipsPositions')
1783+
->label('Slider')
1784+
->pips(PipsMode::Positions)
1785+
->pipsValues([0, 25, 50, 75, 100])
1786+
->default(50),
1787+
]),
1788+
Group::make()
1789+
->id('sliderPipsCount')
1790+
->extraAttributes([
1791+
'class' => 'p-16 max-w-xl',
1792+
])
1793+
->schema([
1794+
Slider::make('sliderPipsCount')
1795+
->label('Slider')
1796+
->pips(PipsMode::Count)
1797+
->pipsValues(5)
1798+
->default(50),
1799+
]),
1800+
Group::make()
1801+
->id('sliderPipsValues')
1802+
->extraAttributes([
1803+
'class' => 'p-16 max-w-xl',
1804+
])
1805+
->schema([
1806+
Slider::make('sliderPipsValues')
1807+
->label('Slider')
1808+
->pips(PipsMode::Values)
1809+
->pipsValues([5, 15, 25, 35, 45, 55, 65, 75, 85, 95])
1810+
->default(50),
1811+
]),
1812+
Group::make()
1813+
->id('sliderPipsValuesDensity')
1814+
->extraAttributes([
1815+
'class' => 'p-16 max-w-xl',
1816+
])
1817+
->schema([
1818+
Slider::make('sliderPipsValuesDensity')
1819+
->label('Slider')
1820+
->pips(PipsMode::Values, density: 5)
1821+
->pipsValues([5, 15, 25, 35, 45, 55, 65, 75, 85, 95])
1822+
->default(50),
1823+
]),
1824+
Group::make()
1825+
->id('sliderPipsFilter')
1826+
->extraAttributes([
1827+
'class' => 'p-16 max-w-xl',
1828+
])
1829+
->schema([
1830+
Slider::make('sliderPipsFilter')
1831+
->label('Slider')
1832+
->pips(density: 5)
1833+
->pipsFilter(RawJs::make(<<<'JS'
1834+
($value % 50) === 0
1835+
? 1
1836+
: ($value % 10) === 0
1837+
? 2
1838+
: ($value % 25) === 0
1839+
? 0
1840+
: -1
1841+
JS))
1842+
->default(50),
1843+
]),
1844+
Group::make()
1845+
->id('sliderNonLinear')
1846+
->extraAttributes([
1847+
'class' => 'p-16 max-w-xl',
1848+
])
1849+
->schema([
1850+
Slider::make('sliderNonLinear')
1851+
->label('Slider')
1852+
->nonLinearPoints(['20%' => 50, '50%' => 75])
1853+
->pips()
1854+
->default(50),
1855+
]),
15711856
]);
15721857
}
15731858

0 commit comments

Comments
 (0)