Abstract base class for spell checker editor implementations. Provides basic functionality such as word lookup and caching.

Once initialized with a document, the activity monitor can be queried for the current idle time.

Advanced tooltip widget with cursor tracking abilities. Works like a regular tooltip but can track the cursor position and direction to determine if the tooltip should be dismissed or remain open.

Zippy widget. Expandable/collapsible container, clicking the header toggles the visibility of the content.

An implementation of a menu that can attach itself to DOM element that are annotated appropriately. The following attributes are used by the AttachableMenu menu-item - Should be set on DOM elements that function as items in the menu that can be selected. classNameSelected - A class that will be added to the element's class names when the item is selected via keyboard or mouse.

Base class for the hierarchy of RoundedPanel classes. Do not instantiate directly. Instead, call goog.ui.RoundedPanel.create(). The HTML structure for the RoundedPanel is:

- div (Contains the background and content. Class name: goog-roundedpanel)
- div (Contains the background/rounded corners. Class name:
goog-roundedpanel-bg)
- div (Contains the content. Class name: goog-roundedpanel-content)

Default implementation of BidiInput.

The Bubble provides a general purpose bubble implementation that can be anchored to a particular element and displayed for a period of time.

A button control, rendered as a native browser button by default.

Default renderer for goog.ui.Buttons. Extends the superclass with the following button-specific API methods:

• getValue - returns the button element's value
• setValue - updates the button element to reflect its new value
• getTooltip - returns the button element's tooltip text
• setTooltip - updates the button element's tooltip text
• setCollapsed - removes one or both of the button element's borders

For alternate renderers, see goog.ui.NativeButtonRenderer, goog.ui.CustomButtonRenderer, and goog.ui.FlatButtonRenderer.

CharCounter widget. Counts the number of characters in a input field or a text box and displays the number of additional characters that may be entered before the maximum length is reached.

Character Picker Class. This widget can be used to pick any Unicode character by traversing a category-subcategory structure or by inputing its hex value. See charpicker.html demo for example usage.

Class representing a checkbox menu item. This is just a convenience class that extends goog.ui.MenuItem by making it checkable.

3-state checkbox widget. Fires CHECK or UNCHECK events before toggled and CHANGE event after toggled by user. The checkbox can also be enabled/disabled and get focused and highlighted.

Default renderer for goog.ui.Checkboxs. Extends the superclass to support checkbox states:

A color button control. Identical to goog.ui.Button, except it defaults its renderer to goog.ui.ColorButtonRenderer. This button displays a particular color and is clickable. It is primarily useful with goog.ui.ColorSplitBehavior to cache the last selected color.

Renderer for goog.ui.ColorButtons. Uses goog.ui.ColorMenuButtons but disables the dropdown.

A color menu button control. Extends goog.ui.MenuButton by adding an API for getting and setting the currently selected color from a menu of color palettes.

Renderer for goog.ui.ColorMenuButtons.

A color palette is a grid of color swatches that the user can highlight or select via the keyboard or the mouse. The selection state of the palette is controlled by a selection model. When the user makes a selection, the component fires an ACTION event. Event listeners may retrieve the selected color using the #getSelectedColor method.

Create a new, empty color picker.

Constructs a ColorSplitBehavior for combining a color button and a menu. To use this, provide a goog.ui.ColorButton which will be attached with a goog.ui.ColorMenuButton (with no caption). Whenever a color is selected from the ColorMenuButton, it will be placed in the ColorButton and the user can apply it over and over (by clicking the ColorButton). Primary use case - setting the color of text/background in a text editor.

A ComboBox control.

Class for combo box items.

Default implementation of UI component.

Base class for containers. Extends goog.ui.Component by adding the following:

• a goog.events.KeyHandler, to simplify keyboard handling,
• a pluggable renderer framework, to simplify the creation of containers without the need to subclass this class,
• methods to manage child controls hosted in the container,
• default mouse and keyboard event handling methods.

Default renderer for goog.ui.Container. Can be used as-is, but subclasses of Container will probably want to use renderers specifically tailored for them by extending this class.

Plug-on scrolling behavior for a container. Use this to style containers, such as pop-up menus, to be scrolling, and automatically keep the highlighted element visible. To use this, first style your container with the desired overflow properties and height to achieve vertical scrolling. Also, the scrolling div should have no vertical padding, for two reasons: it is difficult to compensate for, and is generally not what you want due to the strange way CSS handles padding on the scrolling dimension. The container must already be rendered before this may be constructed.

Base class for UI controls. Extends goog.ui.Component by adding the following:

• a goog.events.KeyHandler, to simplify keyboard handling,
• a pluggable renderer framework, to simplify the creation of simple controls without the need to subclass this class,
• the notion of component content, like a text caption or DOM structure displayed in the component (e.g. a button label),
• getter and setter for component content, as well as a getter and setter specifically for caption text (for convenience),
• support for hiding/showing the component,
• fine-grained control over supported states and state transition events, and
• default mouse and keyboard event handling.

This class has sufficient built-in functionality for most simple UI controls. All controls dispatch SHOW, HIDE, ENTER, LEAVE, and ACTION events on show, hide, mouseover, mouseout, and user action, respectively. Additional states are also supported. See closure/demos/control.html for example usage.

Default renderer for goog.ui.Controls. Can be used as-is, but subclasses of Control will probably want to use renderers specifically tailored for them by extending this class. Controls that use renderers delegate one or more of the following API methods to the renderer:

• createDom - renders the DOM for the component
• canDecorate - determines whether an element can be decorated by the component
• decorate - decorates an existing element with the component
• setState - updates the appearance of the component based on its state
• getContent - returns the component's content
• setContent - sets the component's content

Controls are stateful; renderers, on the other hand, should be stateless and reusable.

Displays and edits the value of a cookie.

Custom renderer for goog.ui.Buttons. Css3 buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements.

Custom renderer for goog.ui.MenuButtons. Css3 buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements.

RoundedPanel class specifically for browsers that support CSS attributes for elements with rounded borders (ex. Safari 3.0+, Firefox 3.0+). Do not instantiate directly. Instead, call goog.ui.RoundedPanel.create().

A custom button control. Identical to goog.ui.Button, except it defaults its renderer to goog.ui.CustomButtonRenderer. One could just as easily pass goog.ui.CustomButtonRenderer.getInstance() to the goog.ui.Button constructor and get the same result. Provided for convenience.

Custom renderer for goog.ui.Buttons. Custom buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements.

A custom color palette is a grid of color swatches and a button that allows the user to add additional colors to the palette

DatePicker widget. Allows a single date to be selected from a calendar like view.

Object representing a date picker event.

Class for showing simple dialog boxes. The Html structure of the dialog box is:

Element         Function                Class-name, modal-dialog = default
----------------------------------------------------------------------------
- iframe         Iframe mask              modal-dialog-bg
- div            Background mask          modal-dialog-bg
- div            Dialog area              modal-dialog
- div        Title bar                modal-dialog-title
- span                             modal-dialog-title-text
- text  Title text               N/A
- span                             modal-dialog-title-close
- ??    Close box                N/A
- div        Content area             modal-dialog-content
- ??      User specified content   N/A
- div        Button area              modal-dialog-buttons
- button                           N/A
- button
- ...

A dimension picker allows the user to visually select a row and column count using their mouse and keyboard. The currently selected dimension is controlled by an ACTION event. Event listeners may retrieve the selected item using the #getValue method.

Default renderer for goog.ui.DimensionPickers. Renders the palette as two divs, one with the un-highlighted background, and one with the highlighted background.

Creates a new drag and drop detector.

Builds a DrilldownRow component, which can overlay a tree structure onto sections of an HTML table.

Class representing a filter observing menu item.

Default renderer for goog.ui.FilterObservingMenuItems. Each item has the following structure:

Filtered menu class.

Flat renderer for goog.ui.Buttons. Flat buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements.

Flat Menu Button renderer. Creates a simpler version of goog.ui.MenuButton that doesn't look like a button and doesn't have rounded corners. Uses just a

Creates a formpost object.

A UI component that displays a gauge. A gauge displayes a current value within a round axis that represents a given range. The gauge is built from an external border, and internal border inside it, ticks and labels inside the internal border, and a needle that points to the current value.

Information on how to decorate a range in the gauge. This is an internal-only class.

A class for the default color theme for a Gauge. Users can extend this class to provide a custom color theme, and apply the custom color theme by calling goog.ui.Gauge#setTheme.

RoundedPanel class that uses goog.graphics to create the rounded corners. Do not instantiate directly. Instead, call goog.ui.RoundedPanel.create().

Create a hover card object. Hover cards extend tooltips in that they don't have to be manually attached to each element that can cause them to display. Instead, you can create a function that gets called when the mouse goes over any element on your page, and returns whether or not the hovercard should be shown for that element. Alternatively, you can define a map of tag names to the attribute name each tag should have for that tag to trigger the hover card. See example below. Hovercards can also be triggered manually by calling triggerForElement, shown without a delay by calling showForElement, or triggered over other elements by calling attach. For the latter two cases, the application is responsible for calling detach when finished. HoverCard objects fire a TRIGGER event when the mouse moves over an element that can trigger a hovercard, and BEFORE_SHOW when the hovercard is about to be shown. Clients can respond to these events and can prevent the hovercard from being triggered or shown.

Creates an HSV palette. Allows a user to select the hue, saturation and value/brightness.

Creates an HSVA palette. Allows a user to select the hue, saturation, value/brightness and alpha/opacity.

Creates a new id generator.

Event target that will give notification of state changes between active and idle. This class is designed to require few resources while the user is active.

Controller for an iframe mask. The mask is only valid in the current document, or else the document of the given DOM helper.

Custom renderer for goog.ui.Buttons. Imageless buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements.

Custom renderer for goog.ui.MenuButtons. Imageless buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements.

Input date picker widget.

Generic ui event class for events that take a single item like a menu click event.

Object representing a keyboard shortcut event.

Component for handling keyboard shortcuts. A shortcut is registered and bound to a specific identifier. Once the shortcut is triggered an event is fired with the identifier for the shortcut. This allows keyboard shortcuts to be customized without modifying the code that listens for them. Supports keyboard shortcuts triggered by a single key, a stroke stroke (key plus at least one modifier) and a sequence of keys or strokes.

This creates the label input object.

Link renderer for goog.ui.Buttons. Link buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements.

A basic menu class.

Default renderer for goog.ui.menuBars, based on goog.ui.ContainerRenderer.

The MenuBase class provides an abstract base class for different implementations of menu controls.

A menu button control. Extends goog.ui.Button by composing a button with a dropdown arrow and a popup menu.

Renderer for goog.ui.MenuButtons. This implementation overrides goog.ui.CustomButtonRenderer#createButton to create a separate caption and dropdown element.

Class representing a menu header.

Renderer for menu headers.

Class representing an item in a menu.

Default renderer for goog.ui.MenuItems. Each item has the following structure:

...(menu item contents)...

Default renderer for goog.ui.Menus, based on goog.ui.ContainerRenderer.

Class representing a menu separator. A menu separator extends goog.ui.Separator by always setting its renderer to goog.ui.MenuSeparatorRenderer.

Renderer for menu separators.

A mock implementation of goog.ui.ActivityMonitor for unit testing. Clients of this class should override goog.now to return a synthetic time from the unit test.

Base class for modal popup UI components. This can also be used as a standalone component to render a modal popup with an empty div. WARNING: goog.ui.ModalPopup is only guaranteed to work when it is rendered directly in the 'body' element. The Html structure of the modal popup is:

Element         Function              Class-name, goog-modalpopup = default
----------------------------------------------------------------------------
- iframe         Iframe mask           goog-modalpopup-bg
- div            Background mask       goog-modalpopup-bg
- div            Modal popup area      goog-modalpopup
- span           Tab catcher

Renderer for goog.ui.Buttons. Renders and decorates native HTML button elements. Since native HTML buttons have built-in support for many features, overrides many expensive (and redundant) superclass methods to be no-ops.

An offline install dialog.

Represents a screen on the dialog. You can create new screens and add them to the offline install dialog by calling registerScreenType and setCurrentScreenType.

A offline status card.

An offline status component.

Class representing a menu option. This is just a convenience class that extends goog.ui.MenuItem by making it selectable.

A palette is a grid of DOM nodes that the user can highlight or select via the keyboard or the mouse. The selection state of the palette is controlled an ACTION event. Event listeners may retrieve the selected item using the #getSelectedItem or #getSelectedIndex method. Use this class as the base for components like color palettes or emoticon pickers. Use #setContent to set/change the items in the palette after construction. See palette.html demo for example usage.

Default renderer for goog.ui.Palettes. Renders the palette as an HTML table wrapped in a DIV, with one palette item per cell:

Plain text spell checker implementation.

The Popup class provides functionality for displaying an absolutely positioned element at a particular location in the window. It's designed to be used as the foundation for building controls like a menu or tooltip. The Popup class includes functionality for displaying a Popup near adjacent to an anchor element. This works cross browser and thus does not use IE's createPopup feature which supports extending outside the edge of the brower window.

The PopupBase class provides functionality for showing and hiding a generic container element. It also provides the option for hiding the popup element if the user clicks outside the popup or the popup loses focus.

Popup color picker widget.

Popup date picker widget.

A basic menu class.

This creates a progress bar object.

Creates an object that represents a prompt (used in place of javascript's prompt). The html structure of the prompt is the same as the layout for dialog.js except for the addition of a text box which is placed inside the "Content area" and has the default class-name 'modal-dialog-userInput'

Creates a range model

A UI Control used for rating things, i.e. videos on Google Video.

Rich text spell checker implementation.

Rounded corner tab renderer for goog.ui.Tabs.

Creates a ScrollFloater; see file overview for details.

A selection control. Extends goog.ui.MenuButton by composing a menu with a selection model, and automatically updating the button's caption based on the current selection. Select fires the following events: CHANGE - after selection changes.

A selection menu button control. Extends goog.ui.MenuButton. Menu contains 'select all' and 'select none' MenuItems for selecting all and no items by default. Other MenuItems can be added by user. The checkbox content fires the action events associated with the 'select all' and 'select none' menu items.

Single-selection model. Dispatches a goog.events.EventType.SELECT event when a selection is made.

Class representing a separator. Although it extends goog.ui.Control, the Separator class doesn't allocate any event handlers, nor does it change its appearance on mouseover, etc.

Will construct a chart using Google's chartserver.

This creates a slider object.

This creates a SliderBase object.

Creates a behavior for combining two controls. The behavior is triggered by a given event type which applies the behavior handler. Can be used to also render or decorate the controls. For a usage example see goog.ui.ColorSplitBehavior

A left/right up/down Container SplitPane. Create SplitPane with two goog.ui.Component opjects to split. TODO(user): Support minimum splitpane size. TODO(user): Allow component change/orientation after init. TODO(user): Support hiding either side of handle (plus handle). TODO(user): Look at setBorderBoxSize fixes and revist borderwidth code.

Class representing a submenu that can be added as an item to other menus.

Default renderer for goog.ui.SubMenus. Each item has the following structure:

Tab control, designed to be hosted in a goog.ui.TabBar. The tab's DOM may be different based on the configuration of the containing tab bar, so tabs should only be rendered or decorated as children of a tab bar.

Tab bar UI component. A tab bar contains tabs, rendered above, below, before, or after tab contents. Tabs in tab bars dispatch the following events:

• goog.ui.Component.EventType.ACTION when activated via the keyboard or the mouse,
• goog.ui.Component.EventType.SELECT when selected, and
• goog.ui.Component.EventType.UNSELECT when deselected.

Clients may listen for all of the above events on the tab bar itself, and refer to the event target to identify the tab that dispatched the event. When an unselected tab is clicked for the first time, it dispatches both a SELECT event and an ACTION event; subsequent clicks on an already selected tab only result in ACTION events.

Default renderer for goog.ui.TabBars, based on the TabPane code. The tab bar's DOM structure is determined by its orientation and location relative to tab contents. For example, a horizontal tab bar located above tab contents looks like this:

...(tabs here)...

TabPane widget. All children already inside the tab pane container element will be be converted to tabs. Each tab is represented by a goog.ui.TabPane. TabPage object. Further pages can be constructed either from an existing container or created from scratch.

Object representing a tab pane page changed event.

Default renderer for goog.ui.Tabs, based on the TabPane code.

A table sorter allows for sorting of a table by column. This component can be used to decorate an already existing TABLE element with sorting features. The TABLE should use a THEAD containing TH elements for the table column headers.

A textarea control to handle growing/shrinking with textarea.value.

Renderer for goog.ui.Textareas. Renders and decorates native HTML textarea elements. Since native HTML textareas have built-in support for many features, overrides many expensive (and redundant) superclass methods to be no-ops.

A toggle button, with checkbox-like semantics. Rendered using goog.ui.CustomButtonRenderer by default, though any goog.ui.ButtonRenderer would work.

A toolbar class, implemented as a goog.ui.Container that defaults to having a horizontal orientation and goog.ui.ToolbarRenderer as its renderer.

A button control for a toolbar.

Toolbar-specific renderer for goog.ui.Buttons, based on goog.ui.CustomButtonRenderer.

A color menu button control for a toolbar.

Toolbar-style renderer for goog.ui.ColorMenuButtons.

A menu button control for a toolbar.

Toolbar-specific renderer for goog.ui.MenuButtons, based on goog.ui.MenuButtonRenderer.

Default renderer for goog.ui.Toolbars, based on goog.ui.ContainerRenderer.

A select control for a toolbar.

A separator control for a toolbar.

Renderer for toolbar separators.

A toggle button control for a toolbar.

Tooltip widget. Can be attached to one or more elements and is shown, with a slight delay, when the the cursor is over the element or the element gains focus.

Class representing a three state checkbox menu item.

Default renderer for goog.ui.TriStateMenuItemRenderers. Each item has the following structure:

This creates a TwoThumbSlider object.

Zippy widget. Expandable/collapsible container, clicking the header toggles the visibility of the content.

Object representing a zippy toggle event.