Skip to content

All: Document classes option #262

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Apr 20, 2015
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 21 additions & 3 deletions entries/accordion.xml
Original file line number Diff line number Diff line change
Expand Up @@ -39,8 +39,13 @@
<li>
<code>ui-accordion</code>: The outer container of the accordion.
<ul>
<li><code>ui-accordion-header</code>: The headers of the accordion. The headers will additionally have a <code>ui-accordion-icons</code> class if they contain <a href="#option-icons"><code>icons</code></a>.</li>
<li><code>ui-accordion-content</code>: The content panels of the accordion.</li>
<li>
<code>ui-accordion-header</code>: The headers of the accordion. The active header will additionally have a <code>ui-accordion-content-active</code> class, the inactive headers will have a <code>ui-accordion-header-collapsed</code> class. The headers will also have a <code>ui-accordion-icons</code> class if they contain <a href="#option-icons"><code>icons</code></a>.
<ul>
<li><code>ui-accordion-header-icon</code>: Icon elements within each accordion header.</li>
</ul>
</li>
<li><code>ui-accordion-content</code>: The content panels of the accordion. The active content panel will additionally have a <code>ui-accordion-content-active</code> class.</li>
</ul>
</li>
</ul>
Expand Down Expand Up @@ -86,6 +91,15 @@
</desc>
</type>
</option>
<option name="classes" type="Object">
<default>{
"ui-accordion-header": "ui-corner-top",
"ui-accordion-header-collapsed": "ui-corner-all",
"ui-accordion-content": "ui-corner-bottom"
}</default>
<xi:include href="../includes/classes-option-desc.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/classes-option-example.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
</option>
<option name="collapsible" type="Boolean" default="false" example-value="true">
<desc>Whether all the sections can be closed at once. Allows collapsing the active section.</desc>
</option>
Expand All @@ -108,7 +122,11 @@
</ul>
</desc>
</option>
<option name="icons" type="Object" default='{ "header": "ui-icon-triangle-1-e", "activeHeader": "ui-icon-triangle-1-s" }' example-value='{ "header": "ui-icon-plus", "activeHeader": "ui-icon-minus" }'>
<option name="icons" type="Object" example-value='{ "header": "ui-icon-plus", "activeHeader": "ui-icon-minus" }'>
<default>{
"header": "ui-icon-triangle-1-e",
"activeHeader": "ui-icon-triangle-1-s"
}</default>
<desc>
<p>Icons to use for headers, matching <a href="/theming/icons/">an icon provided by the jQuery UI CSS Framework</a>. Set to <code>false</code> to have no icons displayed.</p>
<ul>
Expand Down
6 changes: 5 additions & 1 deletion entries/autocomplete.xml
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@

<ul>
<li><code>ui-autocomplete</code>: The <a href="/menu/#theming">menu</a> used to display matches to the user.</li>
<li><code>ui-autocomplete-input</code>: The input element that the Autocomplete widget was instantiated with.</li>
<li><code>ui-autocomplete-input</code>: The input element that the autocomplete widget was instantiated with. While requesting data to display to the user, the <code>ui-autocomplete-loading</code> class is also added to this element.</li>
</ul>

<h3>Dependencies</h3>
Expand All @@ -55,6 +55,10 @@
<option name="autoFocus" type="Boolean" default="false" example-value="true">
<desc>If set to <code>true</code> the first item will automatically be focused when the menu is shown.</desc>
</option>
<option name="classes" type="Object" default="{}">
<xi:include href="../includes/classes-option-desc.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/classes-option-example.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
</option>
<option name="delay" type="Integer" default="300" example-value="500">
<desc>The delay in milliseconds between when a keystroke occurs and when a search is performed. A zero-delay makes sense for local data (more responsive), but can produce a lot of load for remote data, while being less responsive.</desc>
</option>
Expand Down
7 changes: 7 additions & 0 deletions entries/button.xml
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,13 @@
<note id="functional-css"/>
<added>1.8</added>
<options>
<option name="classes" type="Object">
<default>{
"ui-button": "ui-corner-all",
}</default>
<xi:include href="../includes/classes-option-desc.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/classes-option-example.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
</option>
<xi:include href="../includes/widget-option-disabled.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<option name="icons" default="{ primary: null, secondary: null }" example-value='{ primary: "ui-icon-gear", secondary: "ui-icon-triangle-1-s" }'>
<desc>
Expand Down
12 changes: 10 additions & 2 deletions entries/dialog.xml
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@

<ul>
<li>
<code>ui-dialog</code>: The outer container of the dialog.
<code>ui-dialog</code>: The outer container of the dialog. If the <a href="#option-draggable"><code>draggable</code> option</a> is set, the <code>ui-dialog-dragging</code> class is added during a drag. If the <a href="#option-resizable"><code>resizable</code> option</a> is set, the <code>ui-dialog-resizing</code> class is added during a resize. If the <a href="#option-buttons"><code>buttons</code> option</a> is set, the <code>ui-dialog-buttons</code> class is added.
<ul>
<li>
<code>ui-dialog-titlebar</code>: The title bar containing the dialog's title and close button.
Expand Down Expand Up @@ -125,6 +125,14 @@
<desc>Each element of the array must be an object defining the attributes, properties, and event handlers to set on the button. In addition, a key of <code>icons</code> can be used to control <a href="/button/#option-icons">button's <code>icons</code> option</a>, and a key of <code>showText</code> can be used to control <a href="/button/#option-text">button's <code>text</code> option</a>.</desc>
</type>
</option>
<option name="classes" type="Object">
<default>{
"ui-dialog": "ui-corner-all",
"ui-dialog-titlebar": "ui-corner-all",
}</default>
<xi:include href="../includes/classes-option-desc.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/classes-option-example.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
</option>
<option name="closeOnEscape" default="true" example-value="false">
<desc>Specifies whether the dialog should close when it has focus and the user presses the escape (ESC) key.</desc>
<type name="Boolean" />
Expand All @@ -133,7 +141,7 @@
<desc>Specifies the text for the close button. Note that the close text is visibly hidden when using a standard theme.</desc>
<type name="String" />
</option>
<option name="dialogClass" default='""' example-value='"alert"'>
<option name="dialogClass" default='""' example-value='"alert"' deprecated="1.12">
<desc>The specified class name(s) will be added to the dialog, for additional theming.</desc>
<type name="String" />
</option>
Expand Down
11 changes: 11 additions & 0 deletions entries/draggable.xml
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,13 @@
<longdesc>
<p>Make the selected elements draggable by mouse. If you want not just drag, but drag &amp; drop, see the <a href="/droppable/">jQuery UI Droppable plugin</a>, which provides a drop target for draggables.</p>

<xi:include href="../includes/widget-theming.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>

<ul>
<li><code>ui-draggable</code>: The draggable element. When the draggable is disabled, the <code>ui-draggable-disabled</code> class is added. While dragging, the <code>ui-draggable-dragging</code> class is added.</li>
<li><code>ui-draggable-handle</code>: The handle of the draggable, specified using the <a href="#option-handle"><code>handle</code> option</a>. By default, the draggable element itself is also the handle.</li>
</ul>

<h3>Dependencies</h3>
<ul>
<li><a href="/category/ui-core/">UI Core</a></li>
Expand Down Expand Up @@ -41,6 +48,10 @@
<option name="cancel" type="Selector" default='"input,textarea,button,select,option"' example-value='".title"'>
<desc>Prevents dragging from starting on specified elements.</desc>
</option>
<option name="classes" type="Object" default="{}">
<xi:include href="../includes/classes-option-desc.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/classes-option-example.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
</option>
<option name="connectToSortable" type="Selector" default="false" example-value='"#my-sortable"'>
<desc>Allows the draggable to be dropped onto the specified sortables. If this option is used, a draggable can be dropped onto a sortable list and then becomes part of it. Note: The <a href="#option-helper"><code>helper</code></a> option must be set to <code>"clone"</code> in order to work flawlessly. Requires the <a href="/sortable/">jQuery UI Sortable plugin</a> to be included.</desc>
</option>
Expand Down
14 changes: 12 additions & 2 deletions entries/droppable.xml
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,12 @@
<longdesc>
<p>The jQuery UI Droppable plugin makes selected elements droppable (meaning they accept being dropped on by <a href="/draggable/">draggables</a>). You can specify which draggables each will accept.</p>

<xi:include href="../includes/widget-theming.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>

<ul>
<li><code>ui-droppable</code>: The droppable element. When a draggable that can be dropped on this dropppable is activated, the <code>ui-droppable-active</code> class is added. When dragging a draggable over this droppable, the <code>ui-droppable-hover</code> class is added.</li>
</ul>

<h3>Dependencies</h3>
<ul>
<li><a href="/category/ui-core/">UI Core</a></li>
Expand All @@ -23,17 +29,21 @@
<desc>A function that will be called for each draggable on the page (passed as the first argument to the function). The function must return <code>true</code> if the draggable should be accepted.</desc>
</type>
</option>
<option name="activeClass" type="String" default="false" example-value='"ui-state-highlight"'>
<option name="activeClass" type="String" default="false" example-value='"ui-state-highlight"' deprecated="1.12">
<desc>If specified, the class will be added to the droppable while an acceptable draggable is being dragged.</desc>
</option>
<option name="addClasses" type="Boolean" default="true" example-value="false">
<desc>If set to <code>false</code>, will prevent the <code>ui-droppable</code> class from being added. This may be desired as a performance optimization when calling <code>.droppable()</code> init on hundreds of elements.</desc>
</option>
<option name="classes" type="Object" default="{}">
<xi:include href="../includes/classes-option-desc.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/classes-option-example.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
</option>
<xi:include href="../includes/widget-option-disabled.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<option name="greedy" type="Boolean" default="false" example-value="true">
<desc>By default, when an element is dropped on nested droppables, each droppable will receive the element. However, by setting this option to <code>true</code>, any parent droppables will not receive the element. The <code>drop</code> event will still bubble normally, but the <code>event.target</code> can be checked to see which droppable received the draggable element.</desc>
</option>
<option name="hoverClass" type="String" default="false" example-value='"drop-hover"'>
<option name="hoverClass" type="String" default="false" example-value='"drop-hover"' deprecated="1.12">
<desc>If specified, the class will be added to the droppable while an acceptable draggable is being hovered over the droppable.</desc>
</option>
<option name="scope" type="String" default='"default"' example-value='"tasks"'>
Expand Down
Loading