Skip to content
This repository has been archived by the owner on Jan 16, 2018. It is now read-only.

Commit

Permalink
Merge 009a98a into 371d3b8
Browse files Browse the repository at this point in the history
  • Loading branch information
carloslancha committed Jan 15, 2018
2 parents 371d3b8 + 009a98a commit 587a356
Show file tree
Hide file tree
Showing 22 changed files with 7,455 additions and 34 deletions.
9 changes: 9 additions & 0 deletions packages/clay-dropdown/src/ClayDropdownBase.js
Original file line number Diff line number Diff line change
Expand Up @@ -208,6 +208,15 @@ ClayDropdownBase.STATE = {
*/
caption: Config.string(),

/**
* Content Renderer name of items.
* @instance
* @memberof ClayDropdownBase
* @type {?string|undefined}
* @default undefined
*/
contentRenderer: Config.string(),

/**
* CSS classes to be applied to the element.
* @instance
Expand Down
71 changes: 37 additions & 34 deletions packages/clay-dropdown/src/ClayDropdownBase.soy
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
{@param label: html|string}
{@param? button: ?}
{@param? caption: string}
{@param? contentRenderer: string}
{@param? elementClasses: string}
{@param? expanded: bool}
{@param? handleButtonClick_: any}
Expand Down Expand Up @@ -48,6 +49,7 @@
{call .sections}
{param button: $button /}
{param caption: $caption /}
{param contentRenderer: $contentRenderer /}
{param expanded: $expanded /}
{param handleButtonClick_: $handleButtonClick_ /}
{param handleItemClick_: $handleItemClick_ /}
Expand All @@ -61,36 +63,6 @@
</div>
{/template}

/**
* Renders a list of items
*/
{template .items}
{@param items: list<?>}
{@param? handleItemClick_: any}
{@param? isInList: bool}
{@param? itemsIconAlignment: string}
{@param? spritemap: string}

{foreach $item in $items}
{delcall ClayDropdownBase.Item variant="$item.type ?: 'item'"}
{param active: $item.active /}
{param checked: $item.checked /}
{param disabled: $item.disabled /}
{param handleItemClick_: $handleItemClick_ /}
{param href: $item.href /}
{param icon: $item.icon /}
{param inputName: $item.inputName /}
{param inputValue: $item.inputValue /}
{param isInList: $isInList /}
{param items: $item.items /}
{param itemsIconAlignment: $itemsIconAlignment /}
{param label: $item.label ?: '' /}
{param separator: $item.separator /}
{param spritemap: $spritemap /}
{/delcall}
{/foreach}
{/template}

/**
* Renders a search input
*/
Expand Down Expand Up @@ -121,6 +93,7 @@
{@param items: list<?>}
{@param? button: ?}
{@param? caption: string}
{@param? contentRenderer: string}
{@param? expanded: bool}
{@param? handleButtonClick_: any}
{@param? handleItemClick_: any}
Expand Down Expand Up @@ -159,13 +132,13 @@
{/if}

{let $itemList kind="html"}
{call .items}
{delcall ClayDropdownBase.Items variant="$contentRenderer"}
{param handleItemClick_: $handleItemClick_ /}
{param isInList: $type == 'list' /}
{param items: $items /}
{param itemsIconAlignment: $itemsIconAlignment /}
{param spritemap: $spritemap /}
{/call}
{/delcall}
{/let}

{if $type == 'list'}
Expand Down Expand Up @@ -422,13 +395,13 @@
{/if}

{if $items}
{call ClayDropdownBase.items}
{delcall ClayDropdownBase.Items}
{param handleItemClick_: $handleItemClick_ /}
{param isInList: $isInList /}
{param items: $items /}
{param itemsIconAlignment: $itemsIconAlignment /}
{param spritemap: $spritemap /}
{/call}
{/delcall}
{/if}

{if $separator}
Expand Down Expand Up @@ -495,3 +468,33 @@
<div class="dropdown-divider"></div>
{/if}
{/deltemplate}

/**
* Renders a list of items
*/
{deltemplate ClayDropdownBase.Items}
{@param items: list<?>}
{@param? handleItemClick_: any}
{@param? isInList: bool}
{@param? itemsIconAlignment: string}
{@param? spritemap: string}

{foreach $item in $items}
{delcall ClayDropdownBase.Item variant="$item.type ?: 'item'"}
{param active: $item.active /}
{param checked: $item.checked /}
{param disabled: $item.disabled /}
{param handleItemClick_: $handleItemClick_ /}
{param href: $item.href /}
{param icon: $item.icon /}
{param inputName: $item.inputName /}
{param inputValue: $item.inputValue /}
{param isInList: $isInList /}
{param items: $item.items /}
{param itemsIconAlignment: $itemsIconAlignment /}
{param label: $item.label ?: '' /}
{param separator: $item.separator /}
{param spritemap: $spritemap /}
{/delcall}
{/foreach}
{/deltemplate}
29 changes: 29 additions & 0 deletions packages/clay-pagination-bar/LICENSE.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
# Software License Agreement (BSD License)

Copyright (c) 2014, Liferay Inc.
All rights reserved.

Redistribution and use of this software in source and binary forms, with or without modification, are
permitted provided that the following conditions are met:

* Redistributions of source code must retain the above
copyright notice, this list of conditions and the
following disclaimer.

* Redistributions in binary form must reproduce the above
copyright notice, this list of conditions and the
following disclaimer in the documentation and/or other
materials provided with the distribution.

* The name of Liferay Inc. may not be used to endorse or promote products
derived from this software without specific prior
written permission of Liferay Inc.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED
WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR
ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR
TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
26 changes: 26 additions & 0 deletions packages/clay-pagination-bar/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
# clay-pagination-bar

Clay PaginationBar Component

## Setup

1. Install NodeJS >= v0.12.0 and NPM >= v3.0.0, if you don't have it yet. You
can find it [here](https://nodejs.org).

2. Install local dependencies:

```
npm install
```

3. Build the code:

```
npm run build
```

4. Open the demo at demos/index.html on your browser.

## Contribute

We'd love to get contributions from you! Please, check our [Contributing Guidelines](CONTRIBUTING.md) to see how you can help us improve.
66 changes: 66 additions & 0 deletions packages/clay-pagination-bar/demos/a11y.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Demo: ClayPaginationBar</title>

<link rel="stylesheet" href="../../../node_modules/clay/build/css/atlas.css">

<style>
body {
background-color: #FFF;
}

.row {
margin-bottom: 20px;
}
</style>

<script src="../build/globals/clay-pagination-bar.js"></script>
</head>
<body class="container">
<div class="row row-spacing">
<h1>ClayPaginationBar</h1>
</div>

<div class="row row-spacing">
<div class="col">
<div id="container1"></div>
</div>
</div>
</div>

<script type="text/javascript">
const spritemap = '../../../node_modules/clay/build/images/icons/icons.svg';

new metal.ClayPaginationBar({
baseHref: '#mySite?curPage=',
currentPage: 2,
entries: [
{
href: '#mySite?entries=5',
label: '5',
},
{
active: true,
href: '#mySite?entries=10',
label: '10',
},
{
href: '#mySite?entries=15',
label: '15',
},
{
href: '#mySite?entries=20',
label: '20',
},
],
selectedEntry: 1,
spritemap: spritemap,
totalEntries: 21,
}, '#container1');

</script>
</body>
</html>
66 changes: 66 additions & 0 deletions packages/clay-pagination-bar/demos/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Demo: ClayPaginationBar</title>

<link rel="stylesheet" href="../../../node_modules/clay/build/css/atlas.css">

<style>
body {
background-color: #FFF;
}

.row {
margin-bottom: 20px;
}
</style>

<script src="../build/globals/clay-pagination-bar.js"></script>
</head>
<body class="container">
<div class="row row-spacing">
<h1>ClayPaginationBar</h1>
</div>

<div class="row row-spacing">
<div class="col">
<div id="container1"></div>
</div>
</div>
</div>

<script type="text/javascript">
const spritemap = '../../../node_modules/clay/build/images/icons/icons.svg';

new metal.ClayPaginationBar({
baseHref: '#mySite?curPage=',
currentPage: 2,
entries: [
{
href: '#mySite?entries=5',
label: '5',
},
{
active: true,
href: '#mySite?entries=10',
label: '10',
},
{
href: '#mySite?entries=15',
label: '15',
},
{
href: '#mySite?entries=20',
label: '20',
},
],
selectedEntry: 1,
spritemap: spritemap,
totalEntries: 21,
}, '#container1');

</script>
</body>
</html>
53 changes: 53 additions & 0 deletions packages/clay-pagination-bar/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
{
"name": "clay-pagination-bar",
"version": "1.0.0-alpha.8",
"description": "Metal ClayPaginationBar component",
"license": "BSD",
"repository": "https://github.com/metal/metal-clay-components/tree/master/packages/clay-pagination-bar",
"engines": {
"node": ">=0.12.0",
"npm": ">=3.0.0"
},
"main": "lib/ClayPaginationBar.js",
"esnext:main": "src/ClayPaginationBar.js",
"jsnext:main": "src/ClayPaginationBar.js",
"files": [
"lib",
"src",
"test"
],
"scripts": {
"build": "npm run soy && webpack",
"compile": "babel -d lib/ src/ -s --ignore src/__tests__",
"prepublish": "npm run soy && npm run compile",
"soy": "metalsoy --soyDeps '../../node_modules/clay-+(button|checkbox|dropdown|icon|link|pagination|radio)/src/**/*.soy'"
},
"keywords": [
"clay",
"metal"
],
"dependencies": {
"clay-dropdown": "^1.0.0-alpha.12",
"clay-pagination": "^1.0.0-alpha.14",
"metal": "^2.14.0",
"metal-component": "^2.14.0",
"metal-soy": "^2.14.0",
"metal-state": "^2.15.0",
"metal-web-component": "^2.14.0"
},
"devDependencies": {
"babel-cli": "^6.24.1",
"babel-core": "^6.25.0",
"babel-loader": "^7.0.0",
"babel-plugin-transform-node-env-inline": "^0.1.1",
"babel-preset-env": "^1.6.0",
"browserslist-config-clay-components": "^1.0.0-alpha.2",
"clay": "^2.0.0-beta.5",
"metal-dom": "^2.13.2",
"metal-tools-soy": "^4.2.1",
"webpack": "^3.0.0"
},
"browserslist": [
"extends browserslist-config-clay-components"
]
}
Loading

0 comments on commit 587a356

Please sign in to comment.