portfolio-positions

Example

<cr-component id="component" name="portfolio-positions"></cr-component>

<script>
  const component = document.getElementById("#component");
  component.init({
    positions: [
      {
        amount: 22350,
        symbolId: 27321,
        isin: "LU0113258742",
        name: "SISF EURO Corporate Bond C Acc",
        ocr: 0.006337,
        weight: 0.044700000000000004,
      },
      {
        amount: 22050,
        symbolId: 54621,
        isin: "LU0170293806",
        name: "Candriam Bonds Global High Yield I Acc",
        ocr: 0.0067,
        weight: 0.0441,
      },
      {
        amount: 15000,
        symbolId: 72281,
        isin: "LU0346389348",
        name: "FF - Global Technology Fund Y Acc",
        ocr: 0.010400000000000001,
        weight: 0.03,
      },
      {
        amount: 40750,
        symbolId: 79365,
        isin: "LU0383004313",
        name: "Jpmorgan Funds - Emerging Markets Equity Fund I Acc",
        ocr: 0.010110000000000001,
        weight: 0.0815,
      },
      {
        amount: 15000,
        symbolId: 89801,
        isin: "BE0948500344",
        name: "DPAM INVEST B Equities World Sustainable F Acc",
        ocr: 0.0088,
        weight: 0.03,
      },
      {
        amount: 39550,
        symbolId: 113243,
        isin: "LU0792910647",
        name: "Robeco Property Equities F Acc",
        ocr: 0.0090312,
        weight: 0.0791,
      },
      {
        amount: 15000,
        symbolId: 117705,
        isin: "LU0973648859",
        name: "Jpmorgan Investment Funds - US Select Equity Fund I Acc Hedged",
        ocr: 0.006566,
        weight: 0.03,
      },
      {
        amount: 23500,
        symbolId: 117746,
        isin: "LU0408877925",
        name: "Jpmorgan Funds - Euro Government Short Duration Bond Fund I Acc",
        ocr: 0.003276,
        weight: 0.047,
      },
      {
        amount: 15000,
        symbolId: 126159,
        isin: "LU1223083160",
        name: "SISF Global Gold C Acc Hedged",
        ocr: 0.010674,
        weight: 0.03,
      },
      {
        amount: 45350,
        symbolId: 127603,
        isin: "LU1663932132",
        name: "DWS Invest Gold and Precious Metals TF Acc",
        ocr: 0.0088,
        weight: 0.0907,
      },
      {
        amount: 15000,
        symbolId: 128662,
        isin: "LU0987205969",
        name: "Amundi Index MSCI Europe R Acc",
        ocr: 0.0025,
        weight: 0.03,
      },
      {
        amount: 45950.00000000001,
        symbolId: 128669,
        isin: "LU0996179346",
        name: "Amundi Index S&P 500 R Acc",
        ocr: 0.0025,
      },
      {
        amount: 0,
        symbolId: 146057,
        name: "CASH",
        ocr: null,
      },
      {
        amount: 70000,
        symbolId: 172940,
        name: "Rentamarkets Narval FI F Acc",
        ocr: 0.0073,
      },
    ],
  });
</script>

Schema

{
 "type": "object",
 "properties": {
  "positions": {
   "type": "array",
   "minItems": 0,
   "description": "Portfolio positions",
   "items": {
    "type": "object",
    "required": [
     "amount"
    ],
    "properties": {
     "symbolId": {
      "type": "number"
     },
     "amount": {
      "type": "number"
     },
     "date": {
      "type": "string"
     },
     "color": {
      "type": "string"
     }
    }
   }
  },
  "symbolId": {
   "type": "number"
  },
  "fields": {
   "type": "array",
   "items": {
    "enum": [
     "color",
     "name",
     "isin",
     "category",
     "currency",
     "ocr",
     "assets",
     "manager",
     "mainSector",
     "assetType",
     "riskFamily",
     "return3Y",
     "totalReturnYTD",
     "totalReturn1M",
     "totalReturn1Y",
     "volatility3Y",
     "volatility5Y",
     "drawdown3Y",
     "weight",
     "shares",
     "amount"
    ]
   },
   "description": "The list of columns to display in the table",
   "default": [
    "color",
    "name",
    "isin",
    "category",
    "currency",
    "weight",
    "amount"
   ]
  },
  "allowAdditionalColumns": {
   "type": "boolean",
   "default": true
  },
  "enableOpenAssetInfo": {
   "type": "boolean",
   "default": true,
   "description": "To enable to open a modal with asset-info component"
  },
  "enableDeleteButtons": {
   "type": "boolean",
   "default": false,
   "description": "To enable a button to delete rows from the table"
  },
  "enableFileUploader": {
   "type": "boolean",
   "default": false,
   "description": "To enable a file dropper to the user to upload a .csv file to upload positions"
  },
  "enableButtonReloadFile": {
   "type": "boolean",
   "default": false,
   "description": "To enable a button to reload the table with new data from a different .csv file"
  },
  "head": {
   "type": "number",
   "nullable": true,
   "default": null,
   "description": "Filters the first n positions sorted descending by weight"
  },
  "palette": {
   "type": "array",
   "items": {
    "type": "string"
   },
   "minItems": 1,
   "description": "List of possible colors to use in each item of the table in case you want to generate colors"
  }
 },
 "additionalProperties": true,
 "oneOf": [
  {
   "required": [
    "enableFileUploader"
   ],
   "prohibited": [
    "symbolId"
   ]
  },
  {
   "required": [
    "positions"
   ],
   "prohibited": [
    "enableFileUploader",
    "symbolId"
   ]
  },
  {
   "required": [
    "symbolId"
   ],
   "prohibited": [
    "positions",
    "enableFileUploader"
   ]
  }
 ]
}

Complete Schema

{}

Public functions

• addPosition(newPosition)

  Function to add a new position to the table

  Params

  • {object} newPosition

• deletePosition(id)

  Function delete a position by his index

  Params

  • {number} id

• clearPositions()

  Function delete all positions

Events

• changed

  Fired when the component loads with the positions information filled

  Return

  • {array} positions

Locales

{
 "title": "Portfolio positions",
 "columns": {
  "shares": "Shares",
  "name": "Asset",
  "weight": "Weight",
  "assetType": "Asset type",
  "manager": "Manager",
  "assets": "Assets",
  "currency": "Currency",
  "category": "Category",
  "mainSector": "Main sector",
  "cost": "Costs",
  "amount": "Amount",
  "market": "Market",
  "return": "{{ horizon }} annualized return",
  "totalReturn": "{{ horizon }} total return",
  "volatility": "{{ horizon }} annualized volatility",
  "drawdown": "{{ horizon }} maximum drawdown",
  "riskFamily": "Risk family"
 },
 "horizon": {
  "year": "1-year",
  "years": "{{ years }}-year",
  "month": "1-month",
  "months": "{{ months }}-month",
  "ytd": "YTD"
 },
 "messages": {
  "zeroAssets": "There is no selected assets"
 },
 "%s assets": {
  "one": "Asset",
  "other": "Assets"
 },
 "csvErrors": {
  "amounts": "The amounts column must have numbers and they must be greater than 0",
  "symbolIds": "The symbolId column must have numbers",
  "parse": "Error parsing the file",
  "%s notFound": {
   "one": "The ISIN {{ isins }} has not been found",
   "other": "The ISINs {{ isins }} has not been found"
  },
  "%s duplicatedIds": {
   "one": "The id {{ ids }} has already been uploaded, it has been be overwritten with the information of the last uploaded symbolId.",
   "other": "Ids {{ ids }} have already been uploaded before, they have been overwritten with the information of the last uploaded one."
  },
  "required": "The file must have a symbolId column and a amount column"
 },
 "currency": "Currency",
 "fileUploader": {
  "anotherFile": "Back to upload anohter file",
  "iconText": "Drag or select a CSV file with portfolio positions",
  "description": "The file must have each asset in a row and its data separated by tabulations, the first row must contain the names of the columns and at least one of them must be the symbolIds that allows the asset to be identified",
  "extraDescription": "Files cannot exceed 10MB",
  "reloadText": "Select another file",
  "uploadText": "Select file",
  "duplicatedIsinsTitle": "There are several matches for the following ISINs, select one of them"
 },
 "buttons": {
  "cancel": "Cancel",
  "accept": "Accept"
 }
}