Skip to content

Commit

Permalink
wip shorthand collection keys
Browse files Browse the repository at this point in the history
  • Loading branch information
levithomason committed Oct 27, 2016
1 parent bc3b314 commit 5282261
Show file tree
Hide file tree
Showing 3 changed files with 40 additions and 10 deletions.
Original file line number Diff line number Diff line change
@@ -1,6 +1,13 @@
import React from 'react'
import { Table } from 'semantic-ui-react'

const tableData = [
{ name: undefined, status: undefined, notes: undefined },
{ name: 'Jimmy', status: 'Requires Action', notes: undefined },
{ name: 'Jamie', status: undefined, notes: 'Hostile' },
{ name: 'Jill', status: undefined, notes: undefined },
]

const headerRow = [
'Name',
'Status',
Expand All @@ -20,16 +27,14 @@ const renderBodyRow = ({ name, status, notes }) => ({
],
})

const tableData = [
{ name: undefined, status: undefined, notes: undefined },
{ name: 'Jimmy', status: 'Requires Action', notes: undefined },
{ name: 'Jamie', status: undefined, notes: 'Hostile' },
{ name: 'Jill', status: undefined, notes: undefined },
]

const TableWarningShorthand = () => {
return (
<Table celled headerRow={headerRow} renderBodyRow={renderBodyRow} tableData={tableData} />
<Table
celled
headerRow={headerRow}
// renderBodyRow={renderBodyRow}
tableData={tableData}
/>
)
}

Expand Down
26 changes: 24 additions & 2 deletions src/lib/factories.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,18 @@ import _ from 'lodash'
import cx from 'classnames'
import React, { cloneElement, isValidElement } from 'react'

// Simplified and faster version of:
// http://stackoverflow.com/questions/7616461/generate-a-hash-from-string-in-javascript-jquery
const hashCode = function hashCode(str) {
const { length } = str
if (!str || length === 0) return 0
let hash = 0
for (let i = 0; i < length; i++) {
hash = hash * 31 + str.charCodeAt(i) | 0
}
return hash
}

/**
* Merges props and classNames.
*
Expand All @@ -16,8 +28,14 @@ const mergePropsAndClassName = (defaultProps, props) => {
newProps.className = cx(defaultProps.className, props.className) // eslint-disable-line react/prop-types
}

if (!newProps.key && childKey) {
newProps.key = _.isFunction(childKey) ? childKey(newProps) : childKey
if (!newProps.key) {
if (childKey) {
newProps.key = _.isFunction(childKey) ? childKey(newProps) : childKey
} else {
const stringified = _.map(newProps, (val, key) => `${key}:${val}`).join('')
console.log(stringified)
newProps.key = hashCode(stringified)
}
}

return newProps
Expand Down Expand Up @@ -57,6 +75,10 @@ export function createShorthand(Component, mapValueToProps, val, defaultProps =
defaultProps = _.isFunction(defaultProps) ? defaultProps(usersProps) : defaultProps
const props = mergePropsAndClassName(defaultProps, usersProps)

if (Component._meta.name === 'TableCell') {
console.log(props)
}

// Clone ReactElements
if (type === 'element') {
return cloneElement(val, props)
Expand Down
3 changes: 3 additions & 0 deletions test/specs/docs/examples-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@ describe.only('examples', () => {
console.error.restore()
})
exampleContext.keys().forEach(path => {
if (!path.includes('TableWarningShorthand')) {
return
}
it(`renders without errors: ${path}`, () => {
mount(createElement(exampleContext(path).default))

Expand Down

0 comments on commit 5282261

Please sign in to comment.