How to use the office-ui-fabric-react/lib/DetailsList.DetailsListLayoutMode.justified function in office-ui-fabric-react

To help you get started, we’ve selected a few office-ui-fabric-react examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github microsoft / BotFramework-Composer / Composer / packages / extensions / obiformeditor / src / Form / fields / TableField.tsx View on Github external
onClick: createNewItemAtIndex(typeof index === 'undefined' ? 0 : index + 1),
            })}
          />
        );
      },
    },
  ];

  return (
    
      {items && items.length > 0 && (
        
      )}
      {children && children({ onChange, createNewItemAtIndex })}
    
  );
}
github SharePoint / sp-dev-fx-extensions / samples / react-item-History / src / extensions / itemHistory / ItemHistory.tsx View on Github external
return (
                 { return false; }}
                    layoutMode={DetailsListLayoutMode.justified}
                    skipViewportMeasures={true}

                />
                
                    <button title="Cancel">

                
            );
        }
        catch (e) {
            debugger;
        }

    }
</button>
github OfficeDev / office-ui-fabric-react / packages / office-ui-fabric-react / src / components / DetailsList / examples / DetailsList.Advanced.Example.tsx View on Github external
},
            {
              key: 'layoutMode',
              text: 'Layout mode',
              subMenuProps: {
                items: [
                  {
                    key: DetailsListLayoutMode[DetailsListLayoutMode.fixedColumns],
                    text: 'Fixed columns',
                    canCheck: true,
                    checked: layoutMode === DetailsListLayoutMode.fixedColumns,
                    onClick: this._onLayoutChanged,
                    data: DetailsListLayoutMode.fixedColumns
                  },
                  {
                    key: DetailsListLayoutMode[DetailsListLayoutMode.justified],
                    text: 'Justified columns',
                    canCheck: true,
                    checked: layoutMode === DetailsListLayoutMode.justified,
                    onClick: this._onLayoutChanged,
                    data: DetailsListLayoutMode.justified
                  }
                ]
              }
            },
            {
              key: 'selectionMode',
              text: 'Selection mode',
              subMenuProps: {
                items: [
                  {
                    key: SelectionMode[SelectionMode.none],
github OlivierCC / sp-client-custom-fields / src / PropertyFieldCustomListHost.tsx View on Github external
{strings.CustomListNo}
                      
                    
                 

                {this.props.fields != null ?

                  <div style="{{marginTop:">

                    

                  </div>
                : '' }

          
          : '' }
github OfficeDev / office-ui-fabric-react / packages / office-ui-fabric-react / src / components / DetailsList / examples / DetailsList.Advanced.Example.tsx View on Github external
text: 'Layout mode',
              subMenuProps: {
                items: [
                  {
                    key: DetailsListLayoutMode[DetailsListLayoutMode.fixedColumns],
                    text: 'Fixed columns',
                    canCheck: true,
                    checked: layoutMode === DetailsListLayoutMode.fixedColumns,
                    onClick: this._onLayoutChanged,
                    data: DetailsListLayoutMode.fixedColumns
                  },
                  {
                    key: DetailsListLayoutMode[DetailsListLayoutMode.justified],
                    text: 'Justified columns',
                    canCheck: true,
                    checked: layoutMode === DetailsListLayoutMode.justified,
                    onClick: this._onLayoutChanged,
                    data: DetailsListLayoutMode.justified
                  }
                ]
              }
            },
            {
              key: 'selectionMode',
              text: 'Selection mode',
              subMenuProps: {
                items: [
                  {
                    key: SelectionMode[SelectionMode.none],
                    text: 'None',
                    canCheck: true,
                    checked: selectionMode === SelectionMode.none,
github OfficeDev / office-ui-fabric-react / packages / office-ui-fabric-react / src / components / DetailsList / examples / DetailsList.Advanced.Example.tsx View on Github external
super(props);

    this._getCommandItems = memoizeFunction(this._getCommandItems);

    this._allItems = createListItems(ITEMS_COUNT);
    this._selection = new Selection({
      onSelectionChanged: this._onItemsSelectionChanged
    });
    this._selection.setItems(this._allItems, false);

    this.state = {
      items: this._allItems,
      selectionCount: 0,
      groups: undefined,
      groupItemLimit: DEFAULT_ITEM_LIMIT,
      layoutMode: DetailsListLayoutMode.justified,
      constrainMode: ConstrainMode.horizontalConstrained,
      selectionMode: SelectionMode.multiple,
      canResizeColumns: true,
      checkboxVisibility: CheckboxVisibility.onHover,
      columns: this._buildColumns(this._allItems, true, this._onColumnClick, '', undefined, undefined, this._onColumnContextMenu),
      contextualMenuProps: undefined,
      sortedColumnKey: 'name',
      isSortedDescending: false,
      isLazyLoaded: false,
      isHeaderVisible: true
    };
  }