@ainias42/react-bootstrap-mobile 0.1.7

package/src/scss/_mobileMixin.scss

@@ -0,0 +1,35 @@
+@use 'sass:selector';
+
+@mixin design($designName) {
+  @if & {
+    @at-root #{selector.nest('.'+$designName, &)} {
+      @content
+    }
+  } @else {
+    .#{$designName} {
+      @content
+    }
+  }
+}
+
+@mixin subPrefix($className) {
+  .#{$classPrefix+$className} {
+    @content
+  }
+}
+
+@mixin prefix($className, $concatSelectors: false) {
+  @if $concatSelectors == true {
+    &.#{$classPrefix+$className} {
+      @content
+    }
+  } @else if ($concatSelectors != false) {
+    #{$concatSelectors}.#{$classPrefix+$className} {
+      @content
+    }
+  } @else {
+    @include subPrefix($className) {
+      @content
+    }
+  }
+}

package/src/scss/_variables.scss

@@ -0,0 +1,22 @@
+@import 'bootstrap/scss/functions';
+@import 'bootstrap/scss/variables';
+
+$classPrefix: "rbm-";
+
+$material: "material-design";
+$flat: "flat-design";
+
+$android: $material;
+$ios: $flat;
+
+$animationDuration: 0.3s;
+$animationDurationMaterial: $animationDuration;
+$animationDurationFlat: $animationDuration;
+$animationDurationAndroid: $animationDurationMaterial;
+$animationDurationIos: $animationDurationFlat;
+
+$fontSizeBase: 16px;
+
+$boxShadowMaterial: 0 2px 2px 0 rgb(0 0 0 / 14%),
+0 1px 5px 0 rgb(0 0 0 / 12%),
+0 3px 1px -2px rgb(0 0 0 / 20%);

package/src/types/isomorphic-style-loader.d.ts

@@ -0,0 +1,3 @@
+declare module 'isomorphic-style-loader/useStyles';
+declare module 'isomorphic-style-loader/withStyles';
+declare module 'isomorphic-style-loader/StyleContext';

package/src/types/react-table-config.d.ts

@@ -0,0 +1,120 @@
+/* eslint-disable */
+import {
+    UseColumnOrderInstanceProps,
+    UseColumnOrderState,
+    UseExpandedHooks,
+    UseExpandedInstanceProps,
+    UseExpandedOptions,
+    UseExpandedRowProps,
+    UseExpandedState,
+    UseFiltersColumnOptions,
+    UseFiltersColumnProps,
+    UseFiltersInstanceProps,
+    UseFiltersOptions,
+    UseFiltersState,
+    UseGlobalFiltersColumnOptions,
+    UseGlobalFiltersInstanceProps,
+    UseGlobalFiltersOptions,
+    UseGlobalFiltersState,
+    UseGroupByCellProps,
+    UseGroupByColumnOptions,
+    UseGroupByColumnProps,
+    UseGroupByHooks,
+    UseGroupByInstanceProps,
+    UseGroupByOptions,
+    UseGroupByRowProps,
+    UseGroupByState,
+    UsePaginationInstanceProps,
+    UsePaginationOptions,
+    UsePaginationState,
+    UseResizeColumnsColumnOptions,
+    UseResizeColumnsColumnProps,
+    UseResizeColumnsOptions,
+    UseResizeColumnsState,
+    UseRowSelectHooks,
+    UseRowSelectInstanceProps,
+    UseRowSelectOptions,
+    UseRowSelectRowProps,
+    UseRowSelectState,
+    UseRowStateCellProps,
+    UseRowStateInstanceProps,
+    UseRowStateOptions,
+    UseRowStateRowProps,
+    UseRowStateState,
+    UseSortByColumnOptions,
+    UseSortByColumnProps,
+    UseSortByHooks,
+    UseSortByInstanceProps,
+    UseSortByOptions,
+    UseSortByState,
+} from 'react-table';
+
+// https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/react-table
+declare module 'react-table' {
+    // take this file as-is, or comment out the sections that don't apply to your plugin configuration
+
+    export interface TableOptions<D extends object>
+        // UseExpandedOptions<D>,
+        // UseFiltersOptions<D>,
+        // UseGlobalFiltersOptions<D>,
+        // UseGroupByOptions<D>,
+        // UsePaginationOptions<D>,
+        // UseResizeColumnsOptions<D>,
+        // UseRowSelectOptions<D>,
+        // UseRowStateOptions<D>,
+        extends UseSortByOptions<D> {}
+
+    // note that having Record here allows you to add anything to the options, this matches the spirit of the
+    // underlying js library, but might be cleaner if it's replaced by a more specific type that matches your
+    // feature set, this is a safe default.
+
+    export interface Hooks<D extends object>
+        // UseExpandedHooks<D>,
+        // UseGroupByHooks<D>,
+        // UseRowSelectHooks<D>,
+        extends UseSortByHooks<D> {}
+
+    export interface TableInstance<D extends object>
+        // UseColumnOrderInstanceProps<D>,
+        // UseExpandedInstanceProps<D>,
+        // UseFiltersInstanceProps<D>,
+        // UseGlobalFiltersInstanceProps<D>,
+        // UseGroupByInstanceProps<D>,
+        // UsePaginationInstanceProps<D>,
+        // UseRowSelectInstanceProps<D>,
+        // UseRowStateInstanceProps<D>,
+        extends UseSortByInstanceProps<D> {}
+
+    export interface TableState<D extends object>
+        // UseColumnOrderState<D>,
+        // UseExpandedState<D>,
+        // UseFiltersState<D>,
+        // UseGlobalFiltersState<D>,
+        // UseGroupByState<D>,
+        // UsePaginationState<D>,
+        // UseResizeColumnsState<D>,
+        // UseRowSelectState<D>,
+        // UseRowStateState<D>,
+        extends UseSortByState<D> {}
+
+    export interface ColumnInterface<D extends object>
+        // UseFiltersColumnOptions<D>,
+        // UseGlobalFiltersColumnOptions<D>,
+        // UseGroupByColumnOptions<D>,
+        // UseResizeColumnsColumnOptions<D>,
+        extends UseSortByColumnOptions<D> {}
+
+    export interface ColumnInstance<D extends object>
+        // UseFiltersColumnProps<D>,
+        // UseGroupByColumnProps<D>,
+        // UseResizeColumnsColumnProps<D>,
+        extends UseSortByColumnProps<D> {}
+
+    // export interface Cell<D extends object, V = any> extends UseGroupByCellProps<D>, UseRowStateCellProps<D> {}
+    //
+    // export interface Row<D extends object>
+    //     extends UseExpandedRowProps<D>,
+    //         UseGroupByRowProps<D>,
+    //         UseRowSelectRowProps<D>,
+    //         UseRowStateRowProps<D> {}
+}

package/src/types/scss-module.d.ts

@@ -0,0 +1,7 @@
+declare module '*.scss' {
+    const classes: Record<string, string>;
+    const css: string;
+    const content: Record<string, string>;
+    export default content;
+    export { classes, css };
+}

package/tsconfig.json

@@ -0,0 +1,57 @@
+{
+  "compilerOptions": {
+    "outDir": "./dist",
+    "module": "esnext",
+    "target": "es2015",
+    "lib": [
+      "es6",
+      "es2016",
+      "es2017",
+      "es2021",
+      "dom"
+    ],
+    "sourceMap": true,
+    "allowJs": true,
+    "jsx": "preserve",
+    "baseUrl": "./src",
+    "moduleResolution": "node",
+    "noImplicitReturns": true,
+    "noImplicitThis": true,
+    "noImplicitAny": true,
+    "resolveJsonModule": true,
+    "strictNullChecks": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "typeRoots": [
+      "node_modules/@types",
+      "types"
+    ],
+    "declaration": true,
+    "noUnusedParameters": true,
+    "suppressImplicitAnyIndexErrors": true,
+    "allowSyntheticDefaultImports": true,
+    "isolatedModules": false,
+    "strict": false
+  },
+  "include": [
+    "src/**/*",
+    "dist/bootstrapReactMobile.ts"
+  ],
+  "exclude": [
+    "dist",
+    "bin",
+    "node_modules",
+    "build",
+    "scripts",
+    "acceptance-tests",
+    "webpack",
+    "jest",
+    "www",
+    "platforms",
+    "plugins",
+    "webpack.config.js"
+  ]
+  //  "types": [
+  //    "typePatches"
+  //  ]
+}

package/webpack.config.js

@@ -0,0 +1,85 @@
+const path = require('path');
+const webpack = require('webpack');
+// const PrettierPlugin = require('prettier-webpack-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
+const getPackageJson = require('./scripts/getPackageJson');
+
+const { version, name, license, repository, author } = getPackageJson(
+    'version',
+    'name',
+    'license',
+    'repository',
+    'author'
+);
+
+const banner = `
+  ${name} v${version}
+  ${repository.url}
+  Copyright (c) ${author.replace(/ *<[^)]*> */g, ' ')} and project contributors.
+  This source code is licensed under the ${license} license found in the
+  LICENSE file in the root directory of this source tree.
+`;
+
+module.exports = (env) => {
+    return {
+        mode: env.production ? 'production' : 'development',
+        // devtool: 'source-map',
+        entry: './bootstrapReactMobile.ts',
+        output: {
+            filename: 'bootstrapReactMobile.js',
+            path: path.resolve(__dirname, 'dist'),
+            library: { type: 'umd' },
+            clean: true,
+            globalObject: 'this',
+        },
+        externals: {
+            react: 'commonjs react',
+            'react-dom': 'commonjs react-dom',
+            'isomorphic-style-loader': 'commonjs2 isomorphic-style-loader',
+            '@fortawesome/react-fontawesome': 'commonjs2 @fortawesome/react-fontawesome',
+            '@fortawesome/fontawesome-svg-core': 'commonjs2 @fortawesome/fontawesome-svg-core',
+            '@fortawesome/free-solid-svg-icons': 'commonjs2 @fortawesome/free-solid-svg-icons',
+            'react-beautiful-dnd': 'commonjs2 react-beautiful-dnd',
+        },
+        optimization: {
+            minimize: false,
+            minimizer: [new TerserPlugin({ extractComments: false })],
+        },
+        module: {
+            rules: [
+                {
+                    test: /\.(ts|tsx)?$/,
+                    exclude: /(node_modules)/,
+                    use: [{ loader: 'babel-loader' }, { loader: 'ts-loader' }],
+                },
+                {
+                    //Compiliert SASS zu CSS und speichert es in Datei
+                    test: /\.scss$/,
+                    use: [
+                        { loader: 'isomorphic-style-loader' },
+                        {
+                            loader: 'css-loader',
+                            options: {
+                                esModule: false,
+                                modules: {
+                                    localIdentName: '[local]__[hash:base64:5]',
+                                },
+                            },
+                        },
+                        { loader: 'sass-loader' },
+                    ],
+                },
+            ],
+        },
+        plugins: [
+            // new PrettierPlugin(),
+            // new MiniCssExtractPlugin({
+            //     filename: 'css/index.css',
+            // }),
+            new webpack.BannerPlugin(banner),
+        ],
+        resolve: {
+            extensions: ['.ts', '.tsx', '.js', '.json'],
+        },
+    };
+};