| import React, { | |
| cloneElement, | |
| useState, | |
| useEffect, | |
| useRef, | |
| HTMLAttributes, | |
| ReactElement | |
| } from "react"; | |
| //////////////////////////////////////////////////////////////////////////////// |
Minimal D3D11 reference implementation: An uncluttered Direct3D 11 setup + basic rendering primer and API familiarizer. Complete, runnable Windows application contained in a single function and laid out in a linear, step-by-step fashion that should be easy to follow from the code alone. ~200 LOC. No modern C++ / OOP or (other) obscuring cruft. View on YouTube
| /* eslint-disable jsx-a11y/accessible-emoji */ | |
| import React, { Suspense, useState } from "react"; | |
| import { unstable_scheduleCallback } from "scheduler"; | |
| import { unstable_createResource as createResource } from "react-cache"; | |
| import { | |
| Combobox, | |
| ComboboxInput, | |
| ComboboxList, | |
| ComboboxOption, | |
| ComboboxOptionText |
| import * as React from 'react'; | |
| import { theme } from './theme'; | |
| import { ThemeProvider, createGlobalStyle } from './styled-components'; | |
| const GlobalStyle = createGlobalStyle` | |
| body { | |
| font-family: Times New Roman; | |
| } | |
| `; |
| [Settings] | |
| ID = "Your_Site_ID" | |
| # Settings in the [build] context are global and are applied to all contexts unless otherwise overridden by more specific contexts. | |
| [build] | |
| # This is the directory to change to before starting a build. | |
| base = "project/" | |
| # NOTE: This is where we will look for package.json/.nvmrc/etc, not root. | |
| # This is the directory that you are publishing from (relative to root of your repo) |
| /** | |
| * In our app, we have a few middleware that generate a string of HTML. | |
| * On occassion it's fine to just use dangerouslySetInnerHTML directly for | |
| * those, but that requires that you have a host node for the innerHTML. | |
| * | |
| * In certain scenarios (like tags in <head />), there's HTML that we need | |
| * to insert directly where it is. This component enables that because | |
| * we replace <raw-text> and </raw-text> with empty strings. Effectively | |
| * making whatever's between <raw-text> and </raw-text> inlined in place. | |
| * |
| module.exports = { | |
| module: { | |
| rules: [ | |
| { | |
| test: /\.js$/, | |
| exclude: /node_modules/, | |
| use: { | |
| loader: "babel-loader" | |
| } | |
| } |
| import React, { Component } from 'react'; | |
| import findByType from './findByType'; | |
| import css from './somestyle.css'; | |
| // We instantiate the Title sub-component | |
| const Title = () => null; | |
| class Article extends Component { | |
| // This is the function that will take care of rendering our Title sub-component | |
| renderTitle() { | |
| const { children } = this.props; | |
| // First we try to find the Title sub-component among the children of Article |
| import React from 'react'; | |
| const findByType = (children, component) => { | |
| const result = []; | |
| /* This is the array of result since Article can have multiple times the same sub-component */ | |
| const type = [component.displayName] || [component.name]; | |
| /* We can store the actual name of the component through the displayName or name property of our sub-component */ | |
| React.Children.forEach(children, child => { | |
| const childType = | |
| child && child.type && (child.type.displayName || child.type.name); | |
| if (type.includes(childType)) { |
| AccessModifierOffset: 2 | |
| AlignAfterOpenBracket: true | |
| AlignConsecutiveAssignments: true | |
| AlignConsecutiveDeclarations: true | |
| AlignEscapedNewlines: Right | |
| AlignOperands: true | |
| AlignTrailingComments: true | |
| AllowAllParametersOfDeclarationOnNextLine: true | |
| AllowShortBlocksOnASingleLine: false | |
| AllowShortCaseLabelsOnASingleLine: true |